Now, as you get ready to change both the HTML file as well as the CSS file, we want you to use appropriate html tags when creating your website.
For example, as you scan the design, ask yourself questions such as:
which elements here should be in heading 1, heading 2, heading 3, etc?
which element should be in a list (ul or ol), p tag, or other common html tags?
for any lines that are shown, could that simply be done using a border? For example, maybe for the menu items, you could simply put a border on the right for each menu item in the list, etc?
for any backgrounds where the color transitions from one color to next, instead of using an image, which could be done but which feels more like a hack, could I use CSS to create the background transition effect?
thinking about the big picture, what are the big boxes I should lay out first before I focus on the smaller picture? what could I do to use some intuitive HTML tags such as header, footer, nav, etc, to lay out my html in the most intuitive way?
As you write the html code, remember that html should have 'information' about the site and not anything about how these elements should look. Therefore, avoid naming any thing and giving it a class or a division such as 'top-nav' or 'left-navigation' or 'top-banner', etc. Instead, come up with generic class names such as 'banner', 'advertisement', etc.
Also, simpler your html and css, better it is. Remember to:
use as little html tags as possible. Just like coding, shorter and more concise your code is, better it is.
use as little classes as possible. Having too many classes can be confusing and make your code hard to read.
give clear names for your ids and classes. Avoid giving it a generic name such as 'x', 'y' or 'z'. Instead, give it a clear name that's easily identifiable.
group CSS syntaxes that affect the element or its nearby element close together. Many developer often also indent their CSS code (like shown in some of the earlier examples) to make it easier to see the style heirarchy.
Scanning for appropriate HTML tags
Now, as you get ready to change both the HTML file as well as the CSS file, we want you to use appropriate html tags when creating your website.
For example, as you scan the design, ask yourself questions such as:
As you write the html code, remember that html should have 'information' about the site and not anything about how these elements should look. Therefore, avoid naming any thing and giving it a class or a division such as 'top-nav' or 'left-navigation' or 'top-banner', etc. Instead, come up with generic class names such as 'banner', 'advertisement', etc.
Also, simpler your html and css, better it is. Remember to: