HTML is an incredibly powerful markup language that you can use to put together your very own websites. Although other scripting and design languages can certainly add additional functionality and aesthetically pleasing elements to your web pages, any Web Designer should still take the time to learn this all important language. Without it you will always struggle to grasp exactly how your web pages fit together.

So without much further ado, let’s start this lesson introducing you to the basics of creating a HTML document. When you have finished reading you will have the knowledge that you need to create a simple web page, and to view it in your preferred browser.

Step 1 – Open a Text Editor

You can use any text editor to create HTML documents, for example Notepad if you are running on a Windows PC. Such a simple editor is all that you need to create your very first HTML document.

Step 2 – Create Your HTML Code

Before we start putting finger to keyboard, we need an understanding of how the HTML language operates. For your web browser to understand your instructions you need to incorporate a range of HTML tags within your document. These tags can be found within angled brackets, usually come in pairs and are used for every instruction.

Here are some important tags that you will need for this, your first HTML document:

  • <html> and </html> tags should always be inserted as the first and last elements of any HTML document; they inform the web browser that what comes in between the two is the web page itself.
  • <body> and </body> tags should wrap around everything that is to be displayed visibly on the webpage, aside from that information that falls within the page’s header.
  • <p> and </p> tags are used to inform a web browser that the plain text between the tags is to be displayed as a paragraph.

So let’s put it all together:

<html>

<body>

<p>Welcome to my website!</p>

</body>

</html>

Step 3 – Save Your Document

Most text editors will encourage you to save your document as a .txt file, but in this case we want to alter that extension to .html. The homepage of any website is conventionally titled index.html so save your document with this name now.

Step 3 – Open Your First Web Page

All that remains is to admire the very first web page that you, a new web designer, have created. Just go to the location where you saved the index.html file and double click to open it. The page will appear in your default website browser and should simply show the text ‘Welcome to my website!’

There’s a lot more to learn about the various tags and formatting options to be found within HTML, but even creating this very first document has set you on your way to becoming a fully fledged Web Designer.

If you enjoyed reading the above, you may like to read more articles like this in our Articles For Web Designers category.