(X)Html & Css

When I first started learning HTML, I wanted to know everything. And as quickly as possible. The trouble is, if you start at the beginning you get to spend about a week learning the 50 million different things that can be done with text, but jump straight to the middle and you miss out on little gems of information that will save you hours of frustration later. It seems only logical then, to start a section on HTML and CSS with a list of basic, but incredibly useful information about them.

• HTML is a simple language consisting of tags, such as <font>, <img> and <br>.
  
  
• Most tags have a beginning and an end bit to define where the formatting starts and ends, for example <b>bold text</b>. The end tag is always the start tag with a / in it.
  
  
• There are a very few exceptions to this rule. The ones you're likely to come across early on are <img>, <br> (break) and <hr> (horizontal rule). <input>, <meta> and <link> tags also don't have end tags.
  
  
• Some tags have attributes, that define how they should alter their content. The font tag has a number of attributes, for example color: <font color="deeppink">deeppink text</font>.
  
  
• XHTML is a version of HTML with a stricter syntax. CSS is used to replace a lot of older HTML tags and attributes, and all tags need to be ended. Tags that don't normally have an end tag will be ended with a slash inside the start tag, for instance <br> becomes <br />.
  
  
• CSS is short for (cascading) style sheets. Unlike HTML or XHTML, you would not use CSS to write an entire page, but you can use it to change colors, fonts, backgrounds, borders etc on existing pages. You can include a style sheet directly in a HTML / XHTML document by placing it between <style> tags, or write it on a separate page and include it using the <link> tag.
  
  

• If you intend to write full web pages (as apposed to just decorating your VF or Myspace) you need to know about Doctypes. These are tags you include at the very top of your page to tell the browser what type of content to expect. See the [ W3C ] for more information.
  
  
• Many people write and check web pages only in the browser they themselves use, and never realise that it is untidy, or worse completely unreadable in others. Even the best designers make mistakes, and it's a good idea to check your web page works in at least the most popular browsers, such as [ Internet Explorer ], [ Firefox ], [ Netscape ] and [ Opera ].
  
  
• Different users also have different screen resolutions. Your page should be able to shrink down to fit an 800 x 600px screen without your users having to scroll sideways. Equally, remember small set-size designs can look very lost on high screen resolutions.
  
  

• If you want to see how a particular page is coded, you can go to View->Page Source at the top of your browser window to see the source code.
  
  
• Html thinks it is American. Therefore words like color, and behavior must be spelled without the U when using them as attributes, or they won't work!
  
  
• A style sheet is worth a thousand tags. Sometimes literally. Getting the hang of CSS early on will save you a lot of repetitive writing stuff out later on.
  
  
• Large images and too many interactive elements like music and flash make for slow load times, especially for people on dial up, and also eat your bandwidth which may be a problem if you're on a free host. Use them in moderation, and preload images if you can.