Posts in category: "html"

Using aria-live

Many web pages today have their content dynamically changed using Javascript. An example of this is the search page on this blog. When the page is initially loaded, the only content in the <main> section of the page is a search form. But, when you type in a...

What is the Shadow DOM?

A couple of weeks ago, I wrote an article on what exactly the DOM is. To recap, the Document Object Model is a representation of an HTML document. It is used by browsers to determine what to render on the page, and by Javascript programs to modify the content, structure,...

How and when to use the tabindex attribute

tabindex is a global attribute that can be applied to most HTML elements with content. It controls two things: If an element is focusable, either by an input method such as the keyboard, or programatically such as with the focus() method; and At what point an element becomes focusable when...

What, exactly, is the DOM?

The Document Object Model, or the “DOM”, is an interface to web pages. It is essentially an API to the page, allowing programs to read and manipulate the page’s content, structure, and styles. Let’s break this down. How is a web page built? How a browser goes from...

Why and how to use WebP images today

WebP is an image format developed by Google in 2010. It was created to be an alternative to formats like PNG and JPG, producing much smaller file sizes while maintaining similar image qualities. Why use WebP? WebP is an incredibly useful format because it offers both performance and features. Unlike...