CodeUp

HTML

The language for building web pages

• Learn HTML

• Video Tutorial

CSS

The language for styling web pages

• Learn CSS

• Video Tutorial

Example of Coded Games

Learn from example games

• Basic Game

• Advanced Game

HTML for Absolute Beginners

While many guides on the internet attempt to teach HTML using a lot of mind-boggling theory, this tutorial will instead focus on giving you the practical skills to build your first site.The aim is to show you ‘how’ to create your first web page without spending the entire tutorial focusing too much on the “why.”By the end of this tutorial, you will have the know-how to create a basic website and we hope that this will inspire you to delve further into the world of HTML using our follow-on guides.

What is HTML?

Okay, so this is the only bit of mandatory theory. In order to begin to write HTML, it helps if you know what you are writing.HTML is the language in which most websites are written. HTML is used to create pages and make them functional.The code used to make them visually appealing is known as CSS and we shall focus on this in a later tutorial. For now, we will focus on teaching you how to build rather than design.

What are Tags and Attributes?

Tags and attributes are the basis of HTML.They work together but perform different functions – it is worth investing 2 minutes in differentiating the two.

What are HTML Tags?

Tags are used to mark up the start of an HTML element and they are usually enclosed in angle brackets. An example of a tag is: <h1>.Most tags must be opened <h1> and closed </h1> in order to function.

What are HTML Attributes?

Attributes contain additional pieces of information. Attributes take the form of an opening tag and additional info is placed inside.An example of an attribute is:<img src="mydog.jpg" alt="A photo of my dog.">In this instance, the image source (src) and the alt text (alt) are attributes of the <img> tag.

Golden Rules To Remember

1. The vast majority of tags must be opened (<tag>) and closed (</tag>) with the element information such as a title or text resting between the tags.2. When using multiple tags, the tags must be closed in the order in which they were opened. For example:<strong><em>This is really important!</em></strong>

HTML Editors

Now that we’ve gotten the basic theory out of the way. It’s time to learn how to build our first website.First off, we must ensure that we have the right tools. Most important, we need an HTML editor.There are many choices on the market. Here are a handful of the most popular:

Sublime Text 3

However, for this tutorial, we will use the Sublime Text 3 as it is free and also offers cross-platform support for Windows, Mac, and Linux users.

Pros

Cons

• Download Sublime Text 3

Notepad++

Another common choice for HTML and other language coders is Notepad ++. It is a tiny program to download and perform the functions you need for writing clean code.

Pros

Cons

• Download Notepad++