HTML Introduction

 in HTML  tagged html / website / introduction / HTML by
This entry is part 1 of 3 in the series HTML

HTML

HTML is a markup language for describing web documents (web pages). The three main technologies for creating wev pages are HTML, CSS and JavaScript. If you are new to creating web pages, the first thing to learn is HTML. You don’t need to know all of and you don’t need to memorize much either. There is only a handful of tags you need to know. Cascading Style Sheets (CSS) would be the next thing you will want to learn. JavaScript comes third.

  • HTML stands for Hyper Text Markup Language
  • A markup language is a set of markup tags
  • HTML documents are described by HTML tags
  • Each HTML tag describes different document content

Below is an example of the HTML a very simple and small web page.

<!DOCTYPE html>
<html>
    <head>
        <title>My Page title</title>
    </head>
    <body>
        <h1>Welcome</h1>
        <p>Hello and welcome to my web page.</p>
    </body>
</html>

welcomehtml

  • The DOCTYPE declaration defines the document type to be HTML
  • The text between <html> and </html> describes an HTML document
  • The text between <head> and </head> provides information about the document
  • The text between <title> and </title> provides a title for the document
  • The text between <body> and </body> describes the visible page content
  • The text between <h1> and </h1> describes a heading
  • The text between <p> and </p> describes a paragraph

HTML5 Example

<!DOCTYPE html>
<html>
   <head>
   <meta charset="UTF-8">
   <title>Page Title</title>
   </head>
   <body>
      <h1>This is a Heading</h1>
      <p>This is a paragraph.</p>
   </body>
</html>

HTML Tags

HTML tags are element names surrounded by angle brackets. HTML elements are the building blocks of HTML pages. An HTML element usually consists of a start tag and end tag, with the content inserted in between. The HTML element is everything from the start tag to the end tag. Browsers do not display the HTML tags, but use them to render the content of the page. 

<tagname>content</tagname>
  • HTML tags normally come in pairs like <p> and </p>
  • The first tag in a pair is the start tag, the second tag is the end tag
  • he start tag is also called the opening tag, and the end tag the closing tag.
  • The end tag is written like the start tag, but with a slash before the tag name

HTML Files

You can create a web page file using a simple text editor. Create a file named index.html, index.htm or index.html and copy in the above code for the simple web page at the top of this page. Actually, it doesn’t have to be called index. Try a different name. You can use Notepad in Windows to create this file. Save the file on your computer and open it with a browser. You can right-click the file and select Open With and click your favourite web browser. Instead of having the browser go out to the Internet and locate and download this file, you are simply asking the browser to open this file from your local machine. It works! Below is a screenshot of what it will look like in your browser.

Empty HTML Elements

  • HTML elements with no content are called empty elements.
  • <br> is an empty element without a closing tag (the <br> tag defines a line break).
  • Empty elements can be “closed” in the opening tag like this: <br />.
  • HTML5 does not require empty elements to be closed. But if you want stricter validation, or you need to make your document readable by XML parsers, you should close all HTML elements.

The next blog post s called HTML Introduction Part 2.

For more information you could have a look at one of my favorite websites w3schools.com. the upper left corner of the screen click on the HTML link.

Series NavigationHTML Introduction Part 2 >>