This is an opportunity to display some 'attitude'. I believe that web pages should be written to conform to the HTML standards. I also believe that most pages should be designed to let readers get the information they want quickly and easily. This page is relatively plain, not just because I don't want to waste time on the cute tricks I am quite able to use, but also because those tricks have no place on a page of this nature. There are plenty of sites that offer advice on style for web pages, but one of the best places to start is the World Wide Web Consortium (W3C). Anyone writing serious pages (rather than writing for fun as I am now) should study and follow the advice there, especially things like the accessibilty guidelines. They also have a validator that you can use to make sure that your HTML is not broken syntactically. If you want a laugh, look at "web pages that suck" which collects examples of pages illustrating poor design choices. Many of the pages listed there show that the authors are skilled in the technology, but have little idea how to apply that skill to good effect.
I created these pages using XML and XSLT, Eclipse as the editor and Ant do the build. The ones served as HTML were processed by Saxon 8, an XSLT 2 processor. The ones served as XML are linked to an XSLT transform that your browser applies to the XML. The navigation menu is generated by the XSLT based on an XML description. The same input XML is used for both versions, only the XSLT differs. Applying a transform to the XML makes it possible to generate a different style and despite the relatively similar appearance at the moment, both the page structure and the CSS are different. The tricky bit here is arranging that the XSLT can detect the style that has been requested.
This page creation system is quite easy if you already know how to use all those tools, but I would not suggest it as a good way for a beginner to start. I used NetBeans as the editor for a while, but did not like the 'upgraded' version so switched to using Eclipse.
One problem with the XML and client side XSLT approach is that you can't use the usual validators to check arbitrary XML. Here is a little test to see if the validators will validate XHTML, but since it is XML have browsers process it through client side XSLT.
A previous version of these pages was created with HTML-Kit. I like it because it has tidy, the HTML cleanup tool integrated with it.
Here are some sites I have found useful for information about HTML:
W3C HTML page, the home of the HTML specifications.
Web Design Group have a definition that is sometimes easier to follow.
HTML Code Tutorial includes information about various non-standard elements, but does not always point out which elements are deprecated in newer versions of HTML.
I also like style sheets - this page uses a style sheet to control the colours and the layout, including the menu with its "pop-up" effect (if your browser supports it). Here are some sites with useful CSS resources:
W3C CSS page, the home of the CSS specifications.
BlueRobot.com: home of the Layout Reservoir
glish.com: CSS Layout Techniques: for Fun and Profit
A List Apart: practical CSS tips, tricks & techniques.
css/edge: a playground and a proving ground for CSS. This is where I got the ideas and techniques for the popups on the menu.
Other useful resources about the web:
Alan Flavell had a site with many excellent and well researched resources - Things to do with the WWW but it was shut down after Alan died on 30th November 2006. We have lost someone who knew what he was talking about, a quality that is unfortunately all too rare, and he will be missed.
There is some hope that the web pages on which he published so much valuable information will be made available again soon.
Activating the Right Layout Mode Using the Doctype Declaration by Henri Sivonen - a very useful guide to how browsers respond to different Doctype declarations. Thre is also some excellent advice about just doing it right for new pages.
Doctype switching and standards compliance: An overview by Matthias Gutfeldt has not been updated as recently as Henri Sivonen's page (previous item) but contains more links to other resources.
A place I find useful for questions, answers and general discussion about web authoring is the newsgroup uk.net.web.authoring. There are quite a few other newsgroups on the topic, but I find them a bit too busy and noisy for my taste.
From time to time I may add some experiments and examples here.
Some experiments with character and entity references.
Here is a page with 3 variable width columns generated by CSS using floated divs.
And here is a page with fixed width left and right columns.
Here is a page with tests of CSS 3 and maybe other Firefox 3.5 features.
Web browsers do not always do what you expect. Here are some exercises for your browser to illustrate the point.
Does an internal link that is a bare fragment identifier make the page reload? It is not supposed to. This is the target of the internal link on this page.
Here are two copies of the same page, served as a plain text page and an HTML page, but does your browser respect the distinction?