1 COMMENT
Design & UX
Ada Ivanoff, Mar 30

6 Free Web-Based SVG Editors Compared

SVG is more important to web design than ever before. Today we no longer need to leave our web browsers to create it. Ada looks at the options.
4 COMMENTs
Web
Maria Antonietta Perna, Mar 27

Is Using SVG Images Good for Your Website's Performance?

Maria Antonietta Perna shows why SVG images can be great for website performance, provided you follow a few simple steps when you design and export them
Web
Maria Antonietta Perna, Mar 24

Cut the File Size with These Three HTML Minification Tools

Maria Antonietta Perna introduces three HTML minification tools to automate optimization of your markup for a faster website and better user experience.
15 COMMENTs
HTML & CSS
Gajendar Singh, Mar 21

How You Can Use HTML5 Custom Data Attributes and Why

Gajendar Singh walks you through HTML5 custom data attributes, why they're useful, how to style them with CSS and manipulate them with JavaScript and jQuery
HTML & CSS
Alexis Goldstein, Mar 17

HTML5 Video and Audio: The Markup

In this excerpt from our book, HTML5 & CSS3 for the Real World, 2nd Edition, we take you through adding Video and Audio in HTML5.
HTML & CSS
Alexis Goldstein, Mar 15

HTML5 Forms: Input Types (Part 2)

We delve deeper into various Input Types for HTML% Forms. This is an excerpt from our book, HTML5 & CSS3 for the Real World, 2nd Edition.
1 COMMENT
HTML & CSS
Alexis Goldstein, Mar 08

HTML5 Forms: Input Types (Part 1)

Learn about the different input types in HTML5 Forms, in this exclusive excerpt published from our book, HTML5 & CSS3 for the Real World, 2nd Edition.
HTML & CSS
Alexis Goldstein, Feb 23

HTML5 Forms: New Controls

There are five new form elements in the HTML5 forms specification: datalist, output, keygen, progress, and meter
1 COMMENT
HTML & CSS
Alexis Goldstein, Feb 21

Open Your Data Up to Bots Using Microdata

Microdata is another technology that’s rapidly gaining adoption and support, but, unlike WAI-ARIA, it’s technically part of HTML5. Although still early in development, it’s worth mentioning the Microdata specification here, because the technology provides a peek into what may be the future of document readability and semantics.

In the spec, Microdata is defined as a mechanism that “allows machine-readable data to be embedded in HTML documents in an easy-to-write manner, with an unambiguous parsing model.”

With Microdata, page authors can add specific labels to HTML elements, annotating them so that they can be read by machines or bots. This is done by means of a customized vocabulary. For example, you might want a script or other third-party service to be able to access your pages and interact with specific elements on the page in a certain manner. With Microdata, you can extend existing semantic elements (such as article and figure) to allow those services to have specialized access to the annotated content.

This can appear confusing, so let’s think about a real-world example. Let’s say your site includes reviews of movies. You might have each review in an article element, with a number of stars or a percentage score for your review. But when a machine comes along, such as Google’s search spider, it has no way of knowing which part of your content is the actual review—all it sees is a bunch of text on the page.

Why would a machine want to know what you thought of a movie? It’s worth considering that Google has started displaying richer information in its search results pages, in order to provide searchers with more than just textual matches for their queries. It does this by reading the review information encoded into those sites’ pages using Microdata or other similar technologies. An example of movie review information is shown below.

HTML & CSS
Louis Lazaris, Feb 17

Validating HTML5 Documents

Let’s expand upon the concepts of validations a little more so that you can better understand how validating pages has changed
3 COMMENTs
HTML & CSS
Estelle Weyl, Feb 14

HTML5 Forms: Dependable Tools in Our Toolbox

HTML5 web forms have introduced new form elements, input types, attributes, native validation, and other form features.
Design & UX
Alex Walker, Feb 08

Catching Frontend UI Design Tricks with SnappySnippet

Often the key to understanding complex things is to understand their simpler parts first. SnappySnippet is a tool that can help you with that.
HTML & CSS
Louis Lazaris, Feb 07

More HTML5 Semantics: New Elements and Features

In this section, let's touch on lesser-known elements, attributes, and features that have been added to the HTML5 spec
1 COMMENT
HTML & CSS
Louis Lazaris, Feb 01

More HTML5 Semantics: Changes to Existing Features

While new elements and APIs have been the primary focus of HTML5, this latest iteration of web markup has also brought with it changes to existing elements.
HTML & CSS
Louis Lazaris, Jan 31

20+ Docs and Guides for Front-end Developers (No. 11)

Louis Lazaris is here with installment number 11 of his series on fantastic learning resources, docs and guides for front-end developers 
1 COMMENT
HTML & CSS
Louis Lazaris, Jan 26

More HTML5 Semantics: Content Types & New Elements

In this chapter, we’ll discuss even more new elements, along with changes to content types, available in HTML5
HTML & CSS
Louis Lazaris, Jan 18

Defining the Sample Site's Page Structure

We’ve covered the basics of page structure and the elements in HTML5 that will assist in this area, it’s time to start building the page
4 COMMENTs
HTML & CSS
Louis Lazaris, Jan 13

HTML5 Page Structure Basics

HTML & CSS
Louis Lazaris, Jan 10

An HTML5 FAQ

2 COMMENTs
HTML & CSS
Louis Lazaris, Jan 06

Introducing the HTML5 Herald Sample Site

The following is an extract from our book, HTML5 & CSS3 for the Real World, 2nd Edition, written by Alexis Goldstein, Louis Lazaris, and Estelle Weyl.
Design & UX
Louis Lazaris, Dec 21

HTML5 & CSS3 for the Real World

11 COMMENTs
HTML & CSS
Louis Lazaris, Dec 20

Front-end Tools: My Favorite Finds of 2016

Here is a look at Louis Lazaris' favorite front-end tools of 2016!
4 COMMENTs
HTML & CSS
Louis Lazaris, Dec 15

Introducing HTML5

26 COMMENTs
HTML & CSS
Pavels Jelisejevs, Nov 30

What's New in HTML 5.1

Pavels Jelisejevs takes a look at the W3C recommendation for HTML 5.1, looking at its major new features with some markup samples.