Facebook Twitter Subscribe to our mailing list Subscribe to our RSS feed
Net In Design

HTML, CSS, Web Design, Photoshop Articles and Tutorials

HTML Introduction

What is HTML?

HTML stands for HyperText Markup Language, and is a computer language which is used to build web pages. A markup language differs from a programming or scripting language in that it is simply a set of tags which specify certain formatting properties.

To learn HTML here at Net In Design, you won’t need to buy any special software, you won’t need a special HTML editor since HTML documents are just plain text files (although I highly recommend downloading something with syntax highlighting such as Notepad++), and you won’t even need a web server or web host. HTML documents simply run off of any web browser (such as Internet Explorer, Firefox, Opera, Safari, or Chrome), all of which are free to download.

An HTML document is just a plain old regular text file which ends in the file extension .html or .htm. If you create an HTML document with a text editor (even something as simple as notepad will do – just don’t use a full word processor like Word, as it inserts special formatting which will break your HTML code), and rename the .txt file extension to .html, you can view that file in your web browser, or even upload it online to a web host and anyone in the world will be able to see it, just like any other regular HTML document.

Many web designers use what are called WYSIWYG (what you see is what you get) editors like Adobe’s Dreamweaver, but virtually all designers and developers at least use a text editor with syntax highlighting, so even though you can create HTML documents with notepad, you should consider downloading something like Notepadd++ (which is free), or use TextMate if you’re using a Mac.

An HTML document is declared by “wrapping” the contents of our page in an <html> tag, and “wrapping” the contents of the page in a <body> tag. The default set up for every web page/HTML document is like this:

1
2
3
4
5
6
7
<html>
<body>
 
<b>A whole line of bold text!</b>
 
</body>
</html>

You will typically see all HTML documents set up in a very similar manner, with the opening <html> tag, then the opening <body> tag on a new line, then a line break (extra space makes your HTML code easier to read and work with), then the displayed contents of the page, and finally the closing <body> and <html> tags. Notice the order of the opening and closing <html> and <body> tags: certain tags must be closed before others are opened, and you’ll also want to close tags in reverse order that you opened them in relation to other tags, as is the case with <html> and <body>. There are many times however where you’ll want to “nest” HTML elements inside other HTML tags or elements (as we did above with the <b> element inside the <html> and <body> elements). You’ll learn about elements in the next tutorial.

HTML tags aren’t case sensitive, so you can use an upper case <B>, but it’s a good habit to stick with all lowercase for a number of reasons outside the scope of this introduction.

Summary:

  • An HTML document is simply a text file with an .htm or .html file extension.
  • All HTML documents begin with the <html> tag and end with the </html> tag.
  • Most HTML elements consist of an opening (or start) tag, contents in the middle, and a closing (or end) tag.
  • Empty HTML elements have no content in the middle, and are closed within the start tag itself (self-closing).
  • Most HTML tags have attributes which you can use to extend their functionality.

Next, we’ll look at HTML elements »

Copyright © 2010 Net In Design • Sitemap • Valid HTML5 and CSS