Tutorials - HTML - Your First Webpage

Welcome to the Openzu guide to HTML and beginner web design and development. In this tutorial you'll learn how websites are constructed and displayed through your web browser, and how to save files so that you can make webpages yourself. Unfortunately, we can't teach you the basics of using a computer, so before you start with these tutorials make sure you know how to:

Have access to a web browser (Microsoft Internet Explorer, Mozilla Firefox, Apple Safari, Google Chrome) and know how to open a file within it (usually File -> Open File)
Know how to use Notepad or another plaintext editor, and know how to save files
Know how to copy and paste text from a website correctly (very important to ensure everything works!)

If you don't know how to do the above things, you might be able to ask a friend who does to give you a quick tutorial (it should take less than an hour) or there may be some classes at your local college you can enroll for.

What is HTML?

HTML stands for HyperText Markup Language, and is a set of markup "tags" which are used to describe the layout which should be applied to the content between them. Conceptually this is simply, but these tags can be layered and have descriptive attributes added to them to create the complex websites you see today. Rome wasn't built in a day, and neither were these webpages. Here is an example of a very basic webpage.

Your First Webpage

<html>
	<head>
	</head>
	<body>
		<h2>Hello World!</h2>
	</body>
</html>

To test this code, copy and paste it into Notepad (or the plaintext editor you are using). Click "File" in the top left of the window, and choose "Save As...". Navigate to a location you can remember, and in the "Save as Type" drop down box select "All Files". Now give the file the name "index.html" and it "Save". To view your webpage, you need to open the "index.html" file you just saved in a web browser. Open up the web browser you use and click "File" in the top left, then "Open File..". Navigate to where the file is stored, and select it and click "Open". You've now viewed your first webpage!

The Next Steps

After making your first webpage, you might be tempted to jump in at the deep end with complicated Cascading Style Sheets (CSS), a client-side scripting language like JavaScript or a server-side scripting language like PHP, JSP or ASP, but you can't build a webpage without first understanding the basics of HTML. Check out of further tutorials on HTML, and then dive into the more complicated technologies when you have fully understood how HTML works.

Page Responses

Currently there have been no responses to this page...

Post Response

If you have anything to contribute to this tutorial, found a bug, or know a better way of achieving the same goal, please leave your response below.