Articles on accessibility, HTML and CSS for designers and developers.
A simple, styled checkbox
A simple method for styling checkboxes without resorting to non-native solutions.
Chat GPT's accessible dropdown
How good is Chat GPT's accessible dropdown suggestion?
Methods of applying accessible descriptions to elements
This article explores a range of different methods that can be used to generate an accessible descriptions for elements.
Methods of applying accessible names to elements
This article explores a range of different methods that can be used to generate an accessible names for elements.
All 22 input types
Can you list all of the 22 different input types without having to resort to using Google?
The shape-shifting "a" element
A look at the strange and wonderful <a> element and which elements are allowed as child or descendant elements.
The <label> element
Let's take a deep dive into the <label> element, including which elements need labelling, explicit vs implicit labelling and more.
Concatenated accessible names
Did you know that the <button> element's content, and the content of its decendants may be concatenated to create an accessible name.
The hidden and aria-hidden attributes
Do you know the difference between the hidden and aria-hidden attributes?
Three quick tips for accessibility and HTML5
A look at HTML through the lense of the <section> element, summary attribute and <a> element.
Ideal line length in ems
What is the optimal line length for your body copy? How many characters should be presented per line?
A simple (and very rough) responsive table solution
Is there a simple method for creating responsive tables, without the need to radicially alter the table content or layout?
Using the required attribute with the select element
Did you know there are some specific rules around how the required attribute can be applied with the select element?
Anonymous boxes
What are anonymous boxes in HTML? And what's the difference between anonymous block boxes and anonymous inline boxes?
<iframe> scrollbars and borders in HTML5
Are you aware that a range of key attributes have now been deprecated from use within the <iframe>?
CSS font stacks
Font stacks are about creating a relevant and comprehensive list of fall-back fonts - based on aspect ratio, platforms, operating systems.
Sign in, register, join?
Which of the following phrases is better for users? Join, sign in or register?
Aligning inline images with the vertical-align property
Let's look at all the ways that images can be vertically aligned within paragraphs.
Checked inputs and attribute minimization
Are you aware that in XHTML, you cannot use attribute minimization? Let's look at the issue!
Anatomy of a comment
What are all the components for a comment? Author, date, avatar, permalink? There's so much more!
"Dumbing down" vs "Writing more intelligently"
Have you ever heard someone say that they need to dumb down their content? We need to change the way we think!
Styling abbreviations
Have you ever wanted to learn how to markup and style abbreviations via the <abbr> element? This article is for you!
Let go and allow users to control their own experience
Slides from my presentation at Webstock on Friday 26 May 2006. Explore how we can let go and allow users to take control!
About structural labels
Structural labels are descriptive headings used to indicate the main components of a web page. They are designed to improve accessibility.
Simple, accessible external links
Did you know that we should always clearly identify the target of each link - especially when they are links to exnternal sites!
Page source order and accessibility
Slides from a presentation by Roger Hudson and Russ Weakley at OZeWAI 2005.
A quick and dirty introduction to accessibility
Accessibility is about building web experiences that can be navigated, read and understood by everyone, regardless of disability, location, experience or technology.
Web standards checklist
An incredibly detailed web standards checklist for designers, developers and testers.
The benefits of Web Standards to your visitors, your clients and you!
Lets explore the benefits of web standards - including valid, sematic and accessible markup, as well as who benefits most from these practices.
Definition lists - misused or misunderstood?
Everything you ever wanted to know about marking up or styling the definition list, including markup and a wide range of styling options.
Liquid layouts the easy way
This article explains one method of achieving a successful liquid layout as well as providing basic definitions of liquid, fixed-width and em-driven layouts.
CSS centering - fun for all!
How do you center a containing block on a page using CSS? Let's look at main methods for liquid and fixed width layouts.
CSS layouts
A range of different layouts including one, two and three column, fixed width and liquid layouts.
Ideal line length for content
Is there an ideal line length for content? We need to understand how the human eye works in order to get to the bottom of this question!
Styling the <hr> element
A quick look at two methods for stying the horizontal rule element!