I have therefore written some essays on various aspects of how web pages ought to be put together. The main theme is writing pages that can be viewed in a wide variety of situations – ideally by everyone who uses the Web – without sacrificing the presentational aspects and without needing a disproportionate amount of effort.
NOTE: most of the details on these pages are now no longer relevant, but the general principles are still valid.
|The Essence of the Web||Do web-designers actually understand what the Web is for? In many cases there seems reason to doubt it.|
|Flexible Design||Writing pages that look good at all sizes, instead of just one.|
|A four-level model for web pages||A conceptual model to help you put complex pages together in a well-structured manner.|
|Website Checklist||A list of things to check out before opening your site to the public.|
|Wrong size Fonts||Why my font-size is better than your font-size.|
|The ALT attribute in HTML||Use and abuse of alternative text for images.|
|Why you should avoid Verdana||The Verdana font is much used on the Web - but it really shouldn't be.|
Layouts which attempt to address various commonly-asked questions, especially with respect to CSS.
|Rescaleable canvas||A flexible HTML5 canvas that adjusts itself to the window size.|
|CSS Buttons||Producing a nice flexible easy-to-maintain button-bar using only CSS – no images required.|
|Image Resizing||An experiment with using different image sizes to give good support to readers with very different window sizes.|
|Zebra Tables||A frequently-asked question: how do I get tables with stripes in alternating colours? Well, here is the answer, with Quagga tables as a bonus.|
|CSS Superscript spacing||Achieving attractive line spacing when using superscripts and subscripts.|
|Multi-column layout 1
Multi-column layout 2
|A couple of example CSS layouts with one fixed-width and two variable-width columns, which I knocked up in response to someone claiming that it was impossible.|
|CSS column height example||An example CSS layout, addressing one of the commonest CSS questions: how to get a vertical menu bar to extend to the same height as the content of the page.|
|CSS matching stripes example||Closely related to the previous one: an example of how to get matching stripes either side of the content.|
|Geometric figures in CSS||A bit of fun, drawing triangles in CSS.|
|What every browser user should know|| This page is mainly aimed at readers rather than authors (although as you’ll see, it’s sort of aimed at authors as well).
It is often thought – rightly or wrongly – that most surfers are very ill-informed about using their browsers. This page aims to rectify the situation.
|Sound markup – a concrete example of benefits||A data-point in the case for structuring web pages properly: the redesign of a commercial site.|
|A use for favicons||These frivolous little images can actually be useful!|
|Proper Quotation Marks||A couple of scripts to help you get proper typographical quotation marks and dashes into your HTML, with minimal effort.|
|The CSS ex unit||Is the CSS ex unit completely useless? It certainly seems that way.|
|The Netscape 4 conundrum||How much longer should web authors support this browser? (The answer to this is now probably “not any longer”, but I wrote this when the subject was still very much relevant, and left it here in case anyone was still interested.)|