HTML Basics

HTML Basics

In this course, I will teach you how to design web pages. I am assuming that you have a little experience of this topic. Here you will learn HTML/CSS/HTML5. HTML5 is the new version of the language. Every page is made of HTML, you will also learn about CSS (Cascading Style Sheets) and will be able to improve the look of your web pages by adding CSS to enhance them

To start writing web pages, we’ll use a simple text editor. That way, you’ll be able to focus on the code. If you use Windows, then Notepad is an excellent text editor to use. To launch it, click on your Start menu in the bottom left of your screen. Click on All Programs, then Accessories. From the Accessories folder, select Notepad:

HTML-basics
HTML-basics

Another good piece of software is the free Notepad++.

HTML and HTML5

Files on your computer come with extensions. These extensions are very crucial to computers. They are used to identify the type of file it is. For example .docx extension is for Word files and .xlsx is for Excel files. In the same way, web pages have their own file extensions. Web pages come with the extension .htm or .html. A browser can recognize either extension. When you open up a web page with your browser, Internet Explorer, for example, the browser software checks the file extension. If it sees the .htm or .html extension it knows it’s a web page and then tries to open it. Most web pages on the internet are written in the code called HTML. HTML stands for HyperText Markup Language and is fairly easy to get the hang of. That’s because HTML is not a programming language: it is a language designed to improve the presentation of text. For example, in Microsoft Word, if you want a nice big heading, you can select a font size from a menu. HTML has an easy way to change the size of the text of headings, too, which you’ll see in a moment. But that’s basically all you are doing with HTML – presenting text and images on a page. The way you do this is with things called TAGS

What is HTML 5?

HTML comes in different versions. When people talk about HTML 5 they are talking about the updates to the markup language. These updates were agreed (mostly) by a whole host of different parties, all members of an organization called W3C. W3C was founded in 1994 by Tim Berners-Lee, who also created the first version of HTML and invented the World Wide Web. They now oversee the defining of new Web technologies. Companies who make browser like Microsoft (Internet Explorer), Mozilla (FireFox), and Apple (Safari) can then decide which of the new Web technologies they wish to implement

Most of the big names in browser technology decided to implement quite a lot of the new suggested updates (specifications) put forward by the W3C. These specifications are commonly known as HTML 5. In practice, this means implementing features like HTML Video and audio directly into the browser, as opposed to needing a 3rd party plugin like Adobe’s Flash. Another exciting update is something called the Canvas tag. This allows you to create quite sophisticated animations and graphics using Javascript, again without needing a 3rd-party plugin. There are a whole lot of new HTML tags that takes browser technology forward into the 21st century. Throughout this course, we’ll introduce you to the essential HTML 5 tags that you need to create a modern web page

Tags

HTML is written in something called tags. Tags come in pairs, an opening one, and a closing one. The first pair of tags we’ll write are the HTML tags themselves. You put one HTML tag at the top, and one at the bottom:

<HTML>
</HTML>

This tells a browser that the code is HyperText Markup Language. Two things to notice here. One that the word HTML is surrounded by angle brackets (the Less Than and Greater Than keys on your keyboard); and two that the second Tag has a forward slash before the HTML.All your tags must be surrounded by the angle brackets < >. This tells the browser that there is some HTML code that needs executing and that it is not to be shown on the web page. Miss an angle bracket out and it can mess up your web page. The next pair of tags are the HEAD tags: They go between the two HTML ones:

<HTML>
<HEAD>
</HEAD>
</HTML>