Flag of the United Kingdom
Andreas Rejbrands webbplats

Web standards

During my recreational hours this summer, I studied web standards. First I read (very carefully) the specifications for HTML+, HTML 2.0, HTML 3.0, HTML 3.2, HTML 4.01, XHTML 1.0, XHTML 2.0, and HTML 5.1. I also read (very carefully) about HTML Microdata, Using WAI-ARIA in HTML, and Polyglot Markup: HTML-Compatible XHTML Documents.

Then I turned to CSS, and read the Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification along with Selectors Level 3 and some smaller documents: CSS Backgrounds and Borders Module Level 3, CSS Conditional Rules Module Level 3, CSS Image Values and Replaced Content Module Level 3, CSS Marquee Module Level 3, CSS Multi-column Layout Module, CSS Speech Module, CSS Values and Units Module Level 3, CSS Flexible Box Layout Module, CSS Text Decoration Module Level 3, CSS Animations, CSS Fonts Module Level 3, CSS Counter Styles Level 3, CSS Text Module Level 3, CSS Transforms, CSS Transitions, CSS Custom Properties for Cascading Variables Module Level 1, and possibly a few others that I don't remember right now.

I also reread the Scalable Vector Graphics (SVG) 1.1 (Second Edition) specification.

Since I am also interested in general XML, I continued by reading Extensible Markup Language (XML) 1.0 (Fifth Edition) and Namespaces in XML 1.0 (Third Edition) carefully, along with XML Schema Part 0: Primer Second Edition. Then I read XML Path Language (XPath) Version 1.0, XSL Transformations (XSLT) Version 1.0, and Associating Style Sheets with XML documents 1.0 (Second Edition). Finally, I read XML Linking Language (XLink) Version 1.1, XPointer Framework, XPointer element() Scheme, XPointer xmlns() Scheme, XPointer xpointer() Scheme, and XML Base (Second Edition).

To try some of my new knowledge in practice, I wrote a primitive desktop calculator that woks in any modern browser (IE10, Chrome, Firefox, Safari, Opera, ...).

Generally, I love HTML5, CSS, SVG, and XML. Regarding HTML5, I am particularly fond of the new semantic elements (<header>, <footer>, <nav>, <main>, <article>, <section>, <aside>, and <figure>), the clarified semantics of old elements (such as <em>, <strong>, <i>, <b>, <cite>, and <dl>), the new <audio> and <video> elements, microdata, and the new form capabilities, just to mention a few of my personal favourites.

I am very fascinated by the power of XML, and – in particular – the power of XSL(T).

I have used my new knowledge to improve my own websites; now, almost all of my web pages are conforming XHTML 1.0 documents (and any exception is well-motivated and will vanish as soon as I upgrade to the HTML5 doctype). I have also redesigned the pages to be more semantic, and to separate content and style perfectly, where possible (and most often it is possible). In addition, I have added quite a lot of visual improvements using CSS, particularly using :before and :after, which will be visible in any modern browser, even including IE8+. When it comes to text-level semantics, I strictly follow the new HTML5 rules:

In addition, I try to use the description list (<dl>) every time I need to mark up any kind of name–value pairs (in a broad sense), including definition lists, metadata name–value pairs, and FAQs. However, for practical purposes, it would be good if the <di> tag from XHTML 2 was reinstalled (see my comment at html5doctor.com).

I would also like to replace <div id="header"> with <header>, and similarly for the other new semantic div-like elements. I believe this will fail in Internet Explorer 5.0 (even with the JavaScript trick), a browser that today is perfectly able to render my sites in a primitive but readable fashion. Hence, by using the new HTML5 semantic elements, I will raise the Internet Explorer minimum support level from 5.0 to 5.5, which I guess is acceptable, since Internet Explorer 5.5 can also be installed on Windows 95, an operating system I want to support. I would also like to replace the current navbar by a completely semantic one that perfectly separates content and style. I could do it like this, but this again would make the page harder to render for old IEs.

While improving my websites, I carefully monitor the rendering in old browsers. I have virtual machines running Windows 95, Windows XP, Windows Vista, and Windows 7, and the following versions of Internet Explorer:

In a few days, I will publish a small article giving all the details of the rendering of my sites in old versions of Internet Explorer.

Visa alla tidigare notiser.

Visa enbart de senaste notiserna.