Create a Basic HTML Page with Notepad in Windows 8

Edited by Grimm, Amanda, Eng, faisalshakeel

You're watching VisiHow. In this tutorial, we are going to show you how to create the most basic HTML page you can create simply using the Notepad application on your Windows 8 computer.



Steps

  1. 1
    Mouse down to the taskbar. This is the bar that runs along the bottom of the screen.
    Advertisement
    Was this step helpful? Yes | No| I need help
  2. 2
    Scroll left to the Windows button and left-click it once. Alternatively, press the Windows keyboard key. This will open the Start menu.
    Advertisement
    Was this step helpful? Yes | No| I need help
  3. 3
    Click on the downward-pointing arrow in the bottom left. This will take us to the Apps menu. Let's search for Notepad.
    Was this step helpful? Yes | No| I need help
  4. 4
    Click in the search bar in the top right-hand corner. Its background will turn white to indicate that it is active.
    Was this step helpful? Yes | No| I need help
  5. 5
    Type in "notepad". As we type, the search will automatically begin narrowing our options down, until we are left only with Notepad.
    Was this step helpful? Yes | No| I need help
  6. 6
    Click "Notepad". Its icon is a blue notepad. This will launch the Notepad application. Now let's type in some very, very basic HTML tags.
    Was this step helpful? Yes | No| I need help
  7. 7
    Type "<html>". This tells the browser that this is an HTML page.
    Was this step helpful? Yes | No| I need help
  8. 8
    Hit the "Enter" or "Return" keyboard key one time. This starts us on a new line, line 2.
    Was this step helpful? Yes | No| I need help
  9. 9
    Type "<body>". This tells the browser that this is the body of our web page.
    Was this step helpful? Yes | No| I need help
  10. 10
    Hit "Enter" or "Return" again. We are now on line 3.
    Was this step helpful? Yes | No| I need help
  11. 11
    Type in some text. We will type, "VisiHow is Awesome!". This is the text on our web page.
    Was this step helpful? Yes | No| I need help
  12. 12
    Hit "Enter" or "Return" again to get to line 4.
    Was this step helpful? Yes | No| I need help
  13. 13
    Type "</body>". This is known as a closing tag. This closes the body section. Now we repeat this for the HTML tag. Note that we are closing our tags in reverse order to how we opened them. Another way to think of this is that the tags bracket our content symmetrically.
    Was this step helpful? Yes | No| I need help
  14. 14
    Hit the "Enter" or "Return" key to get to line 5.
    Was this step helpful? Yes | No| I need help
  15. 15
    Type "</html>". This closes the HTML document. This is not properly formed code. We do have a tutorial explaining how to format code properly, or at least to our own standards, so that our websites are easy to read and legible to other people. But for now, we're just focused on creating a very basic web page.
    Was this step helpful? Yes | No| I need help
  16. 16
    Mouse up to "File". It is in the top left of the window. Left-click it once.
    Was this step helpful? Yes | No| I need help
  17. 17
    Scroll down to "Save As..." and click it.
    Was this step helpful? Yes | No| I need help
  18. 18
    Find the "Save as type" field. It is under the "File name" field, where ".txt" is lit up.
    Was this step helpful? Yes | No| I need help
  19. 19
    Click the downward-pointing arrow on the far right side of this field to open a dropdown menu.
    Was this step helpful? Yes | No| I need help
  20. 20
    Click "All Files".
    Was this step helpful? Yes | No| I need help
  21. 21
    Click on the "File name" field to get a cursor.
    Was this step helpful? Yes | No| I need help
  22. 22
    Type a file name. We will type "visihtml".
    Was this step helpful? Yes | No| I need help
  23. 23
    Type in the file extension. We will add a period or dot character and then type in either "htm" or "html". The full file name will read, "visihtml.html". As this is a basic tutorial, we are going to go ahead and leave it as "html" to make it easy to remember what this is.
    Was this step helpful? Yes | No| I need help
  24. 24
    Click "Save". In our demonstration, this will be saved to the desktop, as indicated near the top of the window.
    Was this step helpful? Yes | No| I need help
  25. 25
    Close the window by clicking the "x" in the top right-hand corner of Notepad.
    Was this step helpful? Yes | No| I need help
  26. 26
    Double-click the file from the desktop.
    Was this step helpful? Yes | No| I need help
  27. 27
    Decide how to open the file. We will be asked, "How do you want to open this type of file (.html)?". Let's choose Firefox for this tutorial, as it's one of the more picky browsers about code being formatted properly. Click the browser of choice.
    Was this step helpful? Yes | No| I need help
  28. 28
    View the web page. The page we created is an actual web page that we just launched in the Firefox browser. Ours says, "VisiHow is Awesome!". Close the Firefox window when ready using the red "x" in the top right-hand corner.
    Was this step helpful? Yes | No| I need help
  29. 29
    View the file icon. In our demonstration, it now has a Firefox icon, indicating that it is a web page.
    Was this step helpful? Yes | No| I need help
  30. 30
    This concludes our tutorial on creating your first, and most basic, web page in Windows 8 with Notepad. For additional tips on creating a web page or if you have any questions, comments, or suggestions for us, comment in the section below or visit more of our tutorials. Thank you very much for choosing VisiHow, and we look forward to seeing you and your content. Have a great day.
    Was this step helpful? Yes | No| I need help

Video: Create a Basic HTML Page with Notepad in Windows 8

Questions and Answers

How can I create a table in html with my desired font face and size?

How can I create a table in html with my desired font face and size. like if I want to set the font size 4 and face courier new how will I do it. Here it is not shown how to create tables and I want it. I have tried: I have tried basic sentences and different styles of fonts. I think it was caused by: I do not know what caused this if I know I wouldn't have asked you

VisiHow QnA. This section is not written yet. Want to join in? Click EDIT to write this answer.

If you have problems with any of the steps in this article, please ask a question for more help, or post in the comments section below.

Comments

User Reviews

There is no user reviews.

Article Info

Categories : Software | Windows

Recent edits by: Eng, Amanda, Grimm

Share this Article:

Thanks to all authors for creating a page that has been read 3,109 times.

Did this article help you?
 
x

Thank Our Volunteer Authors.

Would you like to give back to the community by fixing a spelling mistake? Yes | No