Getting Started with HTML

Before learning the ins and outs of HTML, consider how everyday documents are formatted. You can think of a recent blog post or newspaper article you've read.

Think of how the structure of the writing was presented — there was probably one large heading at the top followed by some smaller, more detailed text. Every few paragraphs, there may have been a smaller heading to signify an important shift in topic. Depending on the format, the article may have been accented by images and media.

Squint at this image to visualize the affect of visual hierarchy:

Imagine now that you were going to type this up in your favorite word processor, Microsoft Word for example. As you get to various new headings and topics, you would probably click some button to make the font bold and increase the font size in a select dropdown. This type of workflow works great when you're a human with hands and eyes and/or ingenuity.

The goal of HTML/CSS is to inform a web browser how to format the data it receives without it having to click around on an interface.

For the most part, you tell the browser what goes on the screen (heading, paragraph, image, etc) with HTML, and you tell it how it should look with CSS. Although, there are some cases where the two share duties.

Let's check out what goes on the screen.