HTML Guidelines

From Fishcakes Wiki

Jump to: navigation, search
Edit Menu

Image:Icon_Html_40px.png HTML Guidelines

This page contains HTML Guidelines for accomplishing specific tasks, including validation.


Contents

Best Designed Websites

Websites with excellent design or layout.

Document Type

In most cases start HTML document with:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">

It's recommended to use:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">

But, I've found it just won't validate with any special characters in it. Need to do more research to figure out exactly which document type to use with each CMS.

Base Href

This tag helps reduce the repetitive use of the site url in an html document. Once you declare a base href all relative links in the document will start with the base url.

<html>
   <head>
      <title>My Document</title>
      <base href="http://www.mysite.com/" />
   </head>
   <body>
 
      All relative links will then have the base url added on:
         <a href="thispage.html">This is my link</a>
      becomes:
         <a href="http://www.mysite.com/thispage.html">This is my link</a>
 
      All file references will do likewise:
         <img scr="prettypic.jpg">
      becomes:
         <img scr="http://www.mysite.com/prettypic.jpg">
 
   </body>
</html>

Favicon

All Browsers now support display of a Favicon. See Wikipedia: Favicon for guidelines.

A great site with links to favicon generators, css generators & validators, ascii generators, color generators, flash generators, form generators, graphics & image generators, htaccess generators, metatag generators, password generators, pdf generators, php & MySQL generators, popup generators, robots.txt generators, rss generators, sitemap generators, text generators, tooltip generators, xml generators and more.

Javascript Open Window and Close Window

Robots.txt

The robots.txt determines how your site will be indexed by search engines.

Validation

Always check your code is standards compliant:


Image:Icon Resources 20px.png CSS and HTML Resources

Image:Icon_Css_Html_20px.png General Resources

  • local.google.com — Google Supported Browsers, if they support them, so should you.
  • opensourcetemplates.org — Open Source Templates for free css and xhtml open source template design. Not much on offer yet.
  • oswd.org — Open Source Web Designs download and share free web design templates.

Image:Icon_Css_20px.png CSS Resources

Image:Icon_Html_20px.png HTML Resources

  • validator.w3.org — w3 XHTML validator.
  • w3.org w3's Accessibility Guidelines.
  • chami.com — animated favicon generator.
  • favicon.co.uk — favicon generator.
  • iconlet.com — simple search engine for free icons and images. Exceedingly useful!
  • webmonkey.com — WebMonkey Developer's Guide. Exhaustive reference guide for HTML, CSS, Javascript, etc.
  • webmonkey.com — WebMonkey HTML Special Characters reference.
  • Keywords — generate up to 100 related keywords with estimate of daily search volume.

Image:Icon Resources 20px.png Scripting Resources

Image:Icon Resources 20px.png Templates

Image:Icon_Css_File_20px.png Fishcakes Wiki Reference Files

These are examples from other sites but archived here as things on the web have a tendency to disappear.


Personal tools