Learning Computer Language: HTML Resource

HTML orHyperText Markup Language, is a language that is used to create Web pages. HTML is by far the most popular language to create a Web page and is used on nearly all Web pages on the Internet.

HTML is a markup language, meaning that it contains instructions embedded within tags to instruct the browser on how to display things. HTML tags generally come in pairs, with a start tag coming before the text content of the tag and then an end tag coming after. End tags start with a slash to denote them as being end tags.

An example of this would be this is small text . This code, referred to as an element, instructs the browser to make the text “this is small text” smaller than the rest of the text.

The Structure of an HTML Page

All HTML pages should start with a startingand end with an ending. After the, there should be atag. HTML head tags contain information that the page is going to need in order to display correctly. Examples of things included in a head tag include JavaScript files, CSS files,tags, <meta> tags, <script> tags, and many others. After you close the head tag with a </head>, there should be an opening <body> tag that will contain all of your page’s content.

On larger websites, there can be thousands of lines of code all contained within a body tag. Anything that is visible to the user is going to be contained within the body. At the end of the body, there’ll be a closing </body> and then the closing </html> that completes a Web page.

When writing HTML, it is very important that you ensure that you are opening and closing tags in the correct order. Doing things in the wrong order can have many unintended consequences, as Web browsers might not know what to do when they see malformed HTML.

Global Structure of an HTML Document

Learn Basic HTML

Structure of an HTML Document

Cascading Style Sheets

There are only around 150 HTML tags to choose from, so you may be asking yourself how Web pages can appear so different from one another with such a small set of tags to work with. Much of the magic of Web design comes from the use of Cascading Style Sheets, known as CSS.

CSS adds another couple hundred properties that allow you to customize HTML elements to do specific things. For example, if we added a color style to the previous example, <small style=”color:#FF0000;”>this is small text </small>, it would make the text appear red. Colors in HTML are generally written as hexadecimal codes, ranging from #000000 (black) to #FFFFFF (white).

CSS also gives you the ability to assign identifiers to elements called classes. Classes can have styles assigned to them within CSS files that you import in the header of your HTML page. By using classes, you are able to give websites a consistent look and feel as well as making it easier to make changes site-wide with a small amount of effort.

CSS Basics

Understanding IDs and Classes

30 CSS Selectors You Must Memorize


Learning HTML Quickly

Learning HTML can be a daunting task when you first look at the list of possible HTML tags and CSS styles. Jumping right in and trying to design a website from scratch can be a very difficult task.

In order to get started, it is often easier to work off of some other established code. The easiest way is to use a CMS (content management system). The most popular CMS is WordPress, a free and open-source tool that is mainly used as a blogging platform but can be adapted to work with many website structures.

WordPress comes with a large number of themes that you can use to get your website jump-started quickly. Another way to get moving more quickly is to use a front-end framework such as Bootstrap.

Front-end frameworks are a little more advanced than WordPress themes, but if you have some basic CSS knowledge, frameworks are a great way to start a website off with a consistent look and feel.

WordPress.com: Free Blog Platform

WordPress.org: Software for Site Developmen

Installing WordPress Guide

University of Wisconsin Milwaukee WordPress Guide


Using Bootstrap: Website Frameworks and Templates

Bootstrap 3 Tutorial

Five Reasons to Use Bootstrap

Comparison of Front-End Frameworks

10 New Front-End Web Frameworks Worth Considering

Front-End JavaScript Frameworks

Getting Your Site Live

Two of the most important steps to getting a site live are buying a domain name and purchasing hosting. Buying a domain is a fairly simple process that starts with an organization called a registrar.

Domain costs are dependent on what top-level domain (.com, .org, .info, etc) you want. A .com address typically will cost around $5 for the first year and around $10 for subsequent years. The domain name market is a market saturated with deals and coupons, so keep an eye out and you can save a significant amount of money.

What Is a Domain?

New Top-Level Domains