Ed Tittel

Lists are powerful tools for grouping similar elements, and lists give visitors to your site an easy way to zoom in on groups of information. Just about anything fits in a list, from sets of instructions to collections of links. Definition lists group terms and definitions into a single list and require three elements to complete the list: : Holds the list definitions (dl = definition list) : Defines a term in the list (dt = definition term) : Defines a definition for a term (dd = definition list definition) You can have as many terms (defined by ) in a list () as you need.

Two big categories of strategies have been employed over the years to support web design for mobile devices: graceful degradation and progressive enhancement. Much of the web is currently nearly unusable on mobile devices because it was designed for desktop browsers and doesn't adapt well to small screens. Mobile web users are often forced to zoom, scroll, pinch, squint, and make their fingers as small as possible to use the majority of websites designed more than a couple years ago.

Hypertext Markup Language (HTML) and the Cascading Style Sheet (CSS) language are the lifeblood of web pages. Even experienced web designers and authors need help sometimes. This Cheat Sheet provides a quick color code guide, a table of HTML5 elements, and a table of CSS properties.Named colors and hex values in HTMLThe following table contains a list of named colors you can use in HTML and CSS code to create a more colorful website.

All web developers have essential sites they refer to over and over. Some resources are so good and so important that they make pretty much everyone's list, no matter what your skill level or how many years (or days?) of experience you may have. The following sites are some of the best of the best resources for any budding or experienced HTML5 developer.

Beyond their mandatory division into head and body sections, text in the body of an HTML document may be organized in any number of ways. Credit: ©iStockphoto.com/Chimpinski Document heads Inside the section, you may (and probably should) define all kinds of labels and information, including a title. Such definitions help you describe the document that follows, including the character sets it uses, metadata for search engines and page descriptions, and instructions to the web server that delivers your page, default style sheets, page refresh behavior, and lots more.

When an image is ready for the web, you need to use the correct HTML5 markup to add it to your page, but you also need to know where to store your image. You can store images for your website in several places. Image storage works best if it uses relative URLs stored somewhere on the website with your other HTML files.

Simply stated, there are two primary media elements for HTML5, both of which are absurdly easy to use. The video element is named , and the audio element is named . Unlike audio, which doesn’t actually require much (or any) space on the screen, video requires an onscreen frame, as well as more sophisticated and more numerous controls.

Web-page designers use images to deliver important information, direct site navigation, and contribute to overall look and feel on a web page. However, you have to use images properly, or you risk reducing their effectiveness. Use the height and width attributes with the element to let the browser know just how tall and wide an image is (the default unit is pixels, or px):

The HTML5 element lets you display a meter bar for various counters that you might manage over time to show readings for various metrics. The element includes these numerical attributes, whose values may be integers (that is, whole numbers) or decimal numbers: value: The current measured value for your meter high: States a value considered to be high for readings on this meter low: States a value considered to be low for readings on this meter max: Sets the upper bound for readings on this meter and its display min: Sets the lower bound for readings on this meter and its display optimum: States a value considered to be optimal for readings on this meter Here’s a fully tricked-out markup example, shown in the figure displayed in Chrome: Center-seeking meter The figure shows the meter in the context of a complete HTML file, with some use of CSS to set off the meter display.