Week ocho!! By this time we were moving closer and closer to our mid –semesters ad finals!! Week 8 is somewhat of a continuation from week seven as tables were touched on in this lecture.
In order to work with tables, you need to start thinking in grids. Tables, just like spreadsheets, are made up of rows and columns. A table can be created in the XHTML/HTML by using the table element. Inside the table element the table is written out row by row. A row is contained inside a tr element which stands for table row. And each cell is then written inside the row element using a td element which stands for table data. After getting an idea as to how to create and insert a table in the HTML, we then went on to the table elements and attributes. The table element is the containing element for all tables. It can carry the following attributes:
1.All of the universal attributes
2. Basic event attributes for scripting.
The Align Attribute - Although it is deprecated, the align attribute is still frequently used with tables. When used with the table element, it indicates whether the table should be aligned to the left (the default), right, or center of the page.
The bgcolor Attribute- The bgcolor attributes sets the background color for the table. The value of this attribute should be either a hex code or color name, as we learnt in week 5.
The Border Attribute -If you use the border attribute, a border will be created around both the table and each individual cell. The value for this attribute is the width you want the outside border of the table to be in pixels. If you give this attribute a value of 0, or if you do not use this attribute, then you should not get any borders.
The Cellpadding Attribute-The cellpadding attribute is used to create a gap between the edges of a cell and its contents. The value for this attribute can either be the amount of space or padding you want inside each wall of the cell in pixels or a percentage value as a percentage of the width of the table.
Week 8 went on to speak about other attributes such as dir, width, cellspacing, frame, rules, summary, char, charoff, valign attributes etc…most if not all of these attributes are deprecated.
Monday, May 9, 2011
Week 7 Design Issues
Week 7!! At this point I was excited about this course, learning new tricks and appreciating the importance of youtube tutorials and PRACTICE!! Week 7 looks at design issues that affect specific parts of pages such as text, menus, tables, and forms. In week 7 I learnt how to make my page look even more awesome and available to potential viewers.
Text
You should always give your text space to breath-A page that is too cramped is not only hard to read, it also looks less attractive, whereas a page with space between navigation, text, images, and other items on the page will be easier to read and more attractive. This space between the elements of a page is what designers refer to as whitespace. There are two key terms which help to create whitespace on your page: padding and margins. Funny enough prior to reading week 7 notes when I first heard of “whitespace” I cam to the conclusion that it was white in color however this was not so. Whitespace need not be white; it just refers to the space between elements of a page such as writing, images, form controls, table borders, and links.-It is usually the same color as the background of the page.
How you align your text determines how readable it is. Most commonly, text is left-aligned. However, you can also center text, have it right-aligned or justified, or it can be put out of line by other elements on the page. In general a paragraph of text will be much easier to read if it is left-aligned although many individuals think it looks better centered it will be harder to read. Centered text is best left for headings and sometimes short paragraphs. Most people find it hard to read long lines of text on a computer screen. As the lines of text become wider it becomes harder for the user to follow onto the correct line—and this problem is exacerbated when users are scanning a page rather than carefully reading it. Therefore it can help to limit the width of your columns of text. You can control the width of text using the width attribute on a table or table cell or you can use the CSS width property on any block level element—the
Text
You should always give your text space to breath-A page that is too cramped is not only hard to read, it also looks less attractive, whereas a page with space between navigation, text, images, and other items on the page will be easier to read and more attractive. This space between the elements of a page is what designers refer to as whitespace. There are two key terms which help to create whitespace on your page: padding and margins. Funny enough prior to reading week 7 notes when I first heard of “whitespace” I cam to the conclusion that it was white in color however this was not so. Whitespace need not be white; it just refers to the space between elements of a page such as writing, images, form controls, table borders, and links.-It is usually the same color as the background of the page.
How you align your text determines how readable it is. Most commonly, text is left-aligned. However, you can also center text, have it right-aligned or justified, or it can be put out of line by other elements on the page. In general a paragraph of text will be much easier to read if it is left-aligned although many individuals think it looks better centered it will be harder to read. Centered text is best left for headings and sometimes short paragraphs. Most people find it hard to read long lines of text on a computer screen. As the lines of text become wider it becomes harder for the user to follow onto the correct line—and this problem is exacerbated when users are scanning a page rather than carefully reading it. Therefore it can help to limit the width of your columns of text. You can control the width of text using the width attribute on a table or table cell or you can use the CSS width property on any block level element—the
element. Another factor is the use of background images- photos tend to make poor choices of background images because they have varying contrasts across the picture, which makes the text harder to read. If you must use an image for a background it should be low in contrast—for example a texture rather than a photo. It should be noted that background images should be small files; otherwise they will take longer to load and also set a background color similar to the main color of the photo in case the background color shows while the page loads. Fonts, Fonts, Fonts!!! Choosing the right font for your website is never the easiest task but is very important!! When choosing which fonts (or typefaces) to use on a page, you should make sure that users will have some of the fonts you expect them to have; if users don’t have your desired font installed on their computers then the typed content of your website will not be displayed. There are fonts you can bet your life on that the potential viewer will have namely- Arial, Verdana, Courier or Courier New, and Times or Times New Roman apart from that it is best you double check.Lastly, as stated at the beginning of my blog, we touched on menus. We basically ran through the importance of the menu being quick and easy to read, achieve what visitors want t read, MUST be clearly separated from the content so as to allow users to effectively navigate the site.
Week 6 Page Layout
Week 6 basically addressed Designing and Constructing Layouts for Web pages. There are some important factors that you should consider regarding the appearance of a page. Personality and taste are key factors into deciding how attractive and colorful one would like his or her website.
We also learnt the aims of the site, the size of your page, what should appear on the page, and where each item should go on that page-and how to utilize codes to carry out these actions.
Week 6 was broken down into 4 sections so as to make it easier to comprehend:
1. Understanding the aims of the site correctly.2. Looking at a page as a whole and addressing the question of how big you should make the page.3. Knowing the elements that make up each page such as logos, headings, links, and possibly Ads.
4. Positioning the various elements within the page.Now, one should be able to understand his or her site in terms of the aim and the type of audience he or she would like to attract. Theses factors are vital so as to implement proper information on your site based on what your aim is and what audience you are appealing to. After deciding you sites aim, you can then move on to the content of your site, in other words you need to put yourself in the position of each of your potential visitors and think about what they might want to know. It is best to first list every possibility and then trim it back to the most effective and efficient ones. When generating the potential content of your site you should treat it like a brainstorming session as Mr. Shepherd would say “don’t holdback”!
It is also important to note that your site must address the needs of your visitors and what they will expect from the site, not just what you want your visitors to see. I found that looking on other sites gave me a better understanding as to what it accepted in the contemporary market and also what clients are looking for from a website. Additionally, the proper lacing of elements such as headings, logos, ads and so on must also be taken into consideration-these elements will reflect the aims of the site.
Lastly, after deciding what should go on which page, one can now look on designing the pages themselves. The page size of the site is very important as not using a proper dimension will result in you rebuilding the entire site which would be tragic. Another useful tip with web design and any design for that matter is to sketch your layout.
We also learnt the aims of the site, the size of your page, what should appear on the page, and where each item should go on that page-and how to utilize codes to carry out these actions.
Week 6 was broken down into 4 sections so as to make it easier to comprehend:
1. Understanding the aims of the site correctly.2. Looking at a page as a whole and addressing the question of how big you should make the page.3. Knowing the elements that make up each page such as logos, headings, links, and possibly Ads.
4. Positioning the various elements within the page.Now, one should be able to understand his or her site in terms of the aim and the type of audience he or she would like to attract. Theses factors are vital so as to implement proper information on your site based on what your aim is and what audience you are appealing to. After deciding you sites aim, you can then move on to the content of your site, in other words you need to put yourself in the position of each of your potential visitors and think about what they might want to know. It is best to first list every possibility and then trim it back to the most effective and efficient ones. When generating the potential content of your site you should treat it like a brainstorming session as Mr. Shepherd would say “don’t holdback”!
It is also important to note that your site must address the needs of your visitors and what they will expect from the site, not just what you want your visitors to see. I found that looking on other sites gave me a better understanding as to what it accepted in the contemporary market and also what clients are looking for from a website. Additionally, the proper lacing of elements such as headings, logos, ads and so on must also be taken into consideration-these elements will reflect the aims of the site.
Lastly, after deciding what should go on which page, one can now look on designing the pages themselves. The page size of the site is very important as not using a proper dimension will result in you rebuilding the entire site which would be tragic. Another useful tip with web design and any design for that matter is to sketch your layout.
Subscribe to:
Posts (Atom)