Wednesday, April 28, 2010

Parts of a Web Page

Web pages are like any other document and are made up of five essential parts: images, headlines, body content, navigation, and credits. Most Web pages contain at least three of these elements and many contain all five.

Images

Images are a visual element of almost every Web page. They draw the eye and help direct readers to specific parts of the page. In fact, most high quality Web pages have several high quality images to both decorate and inform the page.
  • Adding Images to Your Site
  • Tips for Using Web Images
  • Optimizing Images
  • How to Find Photos for Web Pages
  • Taking Great Pictures for Web Sites
  • More Help with Graphics and Images for the Web

Headlines

After images, headlines or titles are the next most prominent element on most Web pages. Most Web designers use some form of typography to create headlines that are larger and more prominent than the surrounding text. Plus, good SEO requires that you use the HTML headline tags

through

to represent the headlines in the HTML as well as visually.
  • Web Typography
  • Learn How to Make Fancy Headings with CSS
  • Making Things Stand Out - Emphasis in Web Design
  • CSS Image Replacement - Replace Headlines with Images Using CSS
  • Why Do Search Engines Like H1 Tags

Body Content

Body content is the text that makes up the majority of your Web page. Content is why people come to your Web page and the layout of that content can help them read it more effectively. Using items like paragraphs and page widths can make a Web page easier to read, while elements like lists and links make the text easier to skim.

Navigation

Most Web pages are not stand-alone pages, they are part of a larger structure - the website. So navigation plays a crucial role for most Web pages to keep customers on the site and reading other pages. But Web pages can also have internal navigation, especially long pages with lots of content. Navigation helps your readers stay oriented and make it possible for them to find their way around the page and the site as a whole.
  • Designing Effective Web Navigation
  • Organization of Directories and 404 Page Content Will Help Navigation
  • Navigating Web Sites
  • Link Rot: Are You a Culprit?

Credits

Credits on a Web page are the informational elements of a page that aren't content or navigation, but provide details about the page. They include things like: the publication date, copyright information, privacy policy links, and other information about the designers, writers, or owners of the Web page. Most Web pages include this information at the bottom, but you can also include it in a sidebar, or even at the top if it fits with your design.
  • Copyright on the Web
  • Are Web Designs and HTML protected by copyright?
  • Privacy Policies and P3P
  • Why Put Contact Information on Your Site
  • Legal Pages for Websites
Help with Web Page Layout
  • Prioritize Your Content and Put Important Stuff First
  • How Long Should Your Web Page Be
  • Web Grids - Columnar Layout in Web Grids
Writing Great Web Content
  • Adding Images to Your Site
  • Optimizing Images
  • How to Find Images for Web Pages
Images on Web Pages
  • What is Web Content?
  • 10 Tips for Web Writing
  • Writing Web Pages that Meet Your Customers\' Goals

Why Validate Your HTML

I will be the first one to let you in on a secret: building Web pages isn't hard. With the software that is available now, you can write your Web page and have it up and viewable in half an hour. And with these tools, why would you need to run an HTML validator on your HTML to find errors? Well, you don't have to, but if you want your pages to stay viewable through future versions of HTML, or you want newer browsers to be able to display it correctly, then writing valid HTML is the place to start.
There are several specific reasons for writing valid HTML, and using an HTML validator to insure that what you write is valid:
  • Future compatibility
    As browsers evolve, they come closer and closer to supporting the standard HTML as written by the W3C. Even if they don't fully support the most recent version of HTML, the browser builders go in and make sure that they are compliant with older versions of the standard.

    If you are writing non-standard HTML, there is a chance that as browsers evolve, they will no longer support your Web pages. A good example of this is a trick that some Web developers used with an older version of Netscape. If you included multiple body tags with different colors, Netscape would load them all in in succession creating a fade-in or flicker effect as the page loaded. This trick no longer works, as it relied on an incompatibility of the browser.

  • Current browser viewing
    Unless you know for a fact that your entire audience is using a specific browser, you are setting your site up to annoy some of your readers if you make it inaccessible to them through invalid or non-standard HTML. Many HTML validators will check your HTML for browser specific entities and alert you to their use.