Introduction: How to Create a Website With HTML

The following instructions provide step-by-step instructions to create a simple website with HTML. You will learn to upload a title, header, and paragraph to Google Chrome. Formatting code for clarity by pressing “enter” is also introduced in this instruction set. This instruction set is meant for beginners with no coding experience, and should take about five minutes to create.

Supplies

-Windows PC

-Notepad Application

Step 1: Open Notepad

Open Notepad app on laptop

-Click on the Windows icon

-Type and select “Notepad”


Step 2: Add DOCTYPE Element

Type & Enter <!DOCTYPE html>

NOTE: This specifies to the browser what version of HTML you are using. This version is HTML5.


Step 3: Add HTML Element

Type & Enter <html>

NOTE: Text in between <> brackets is called an “element.”


Step 4: Add Header Element

Type & Enter <head>

Step 5: Add Title Element

Type & Enter<title>Test Title</title>

NOTE: “/” closes the element


Step 6: Close Header Element

Type & Enter </head>

Step 7: Add Body Element

Type & Enter <body>

NOTE: All content in the <body> element is displayed on the webpage.


Step 8: Add H1 Header Element

Type & Enter <h1>Test Header</h1>

Step 9: Add Paragraph Element

Type & Enter <p>This is a paragraph</p>

Step 10: Close Body Element

Type & Enter </body>

Step 11: Begin Save

Click File. This opens a dropdown menu. Click “Save As”

Step 12: Name File

Name the file “webpage.html”

Step 13: Change File Type

Click the drop-down menu on “Save as type” Change “save as type” to “all files”

Step 14: Finish Save

Click Save, then exit Notepad

Step 15: Right-click on Document

Open the File Explorer “Downloads,” then right-click on the HTML document.

NOTE: Most computers automatically save documents to “Downloads”


NOTE: Most computers save documents to “Downloads”

Step 16: Open Document

Right-click on the “webpage” document. Select “Open With -> Google Chrome”

Step 17: View Webpage

Congratulations! Your webpage is displayed. If content is missing, double-check for typos. Typos are the most common error in coding. Secondly, ensure the content is saved as .html, not the default .txt. With this basic knowledge, you now have the foundation to learn new HTML elements such as images and links. Enjoy learning more HTML!