Raving Genius

Web Development

• General Steps To Follow
  1. Structure content in a way that makes sense. Properly nest tags in a hierarchy. Use generic identifiers (useful for section containers) and classes to aid in styling later. Markup should be semantic (more and more and more). This is more important than many web developers realize.
     • Never assign a specific id to more than one element on each page.
     • Classes can be reused as often as needed. Separate multiple classes with a space.
  2. Once the structure is defined, start styling. Stylesheets should be in external files so they can be shared (even on a single-page site). Browsers cache stylesheets so they only need to be downloaded once. Make it look good in FireFox first. These will be global styles that all browsers will use.
  3. If needed particular styles may be overridden with conditional comments in Internet Explorer. This will be important (unfortunately) for professional sites.
• Reference
  • W3Schools
  • HTML Dog
  • CSS Tricks
    • Article
  • QuirksMode: Check this site for help with cross-browser compatibilty issues.
    • Conditional Comments: The most elegant tool for the Internet Explorer problem.
  • 456 Berea Street
  • A List Apart: Usually has articles exploring a specific aspect of XHTML/CSS
  • Six Revisions: A nice blog regularly showcasing websites, designs and related items.
    • Article
• Tools
  • FireFox: You really should be using the most standards-compliant browser possible.
    • Aardvark: Very nice for a quick inspection.
    • Firebug: Awesome, awesome, awesome! Get it and watch this nice introduction. Then use it to inspect this page.
  • Google Chrome: If you are running Windows, this one is also an excellent choice, though it lacks some of the developer extentions that FireFox has.
  • Color Matching Utility
• Validation
  1. W3 Consortium (X)HTML Validator: Always validate every page. This is a major step towards rendering content the same across diverse browsers. Plus you need to care about accessibility. Not everyone uses a browser.
  2. W3 Consortium CSS Validator: You should validate your CSS after you validate (and pass) your HTML.

Google and I (Thomas Ingram to those who know me) are your friends.