Create a Basic HTML Page with Notepad in Windows 8

Edited by Grimm, Amanda, Eng

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.

Create your first webpage with Notepad on Windows 8.mp4-canvas223 853333.jpg

Ad

Steps

  1. 1
    Mouse down to the taskbar
    .
    This is the bar that runs along the bottom of the screen.
    Create your first webpage with Notepad on Windows 8.mp4-canvas18 205555.jpg
    Advertisement
    Was this step helpful? Yes | No
  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.
    Create your first webpage with Notepad on Windows 8.mp4-canvas20 450543.jpg
    Advertisement
    Was this step helpful? Yes | No
  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.
    Create your first webpage with Notepad on Windows 8.mp4-canvas36 111449.jpg
    Was this step helpful? Yes | No
  4. 4
    Click in the search bar in the top right-hand corner
    .
    Its background will turn white to indicate that it is active.
    Create your first webpage with Notepad on Windows 8.mp4-canvas48 768359.jpg
    Was this step helpful? Yes | No
  5. 5
    Type in "notepad"
    .
    As we type, the search will automatically begin narrowing our options down, until we are left only with Notepad.
    Create your first webpage with Notepad on Windows 8.mp4-canvas53 496332.jpg
    Was this step helpful? Yes | No
  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.
    Create your first webpage with Notepad on Windows 8.mp4-canvas55 305323.jpg
    Was this step helpful? Yes | No
  7. 7
    Type "<html>"
    .
    This tells the browser that this is an HTML page.
    Create your first webpage with Notepad on Windows 8.mp4-canvas75 468202.jpg
    Was this step helpful? Yes | No
  8. 8
    Hit the "Enter" or "Return" keyboard key one time
    .
    This starts us on a new line, line 2.
    Create your first webpage with Notepad on Windows 8.mp4-canvas80 71617.jpg
    Was this step helpful? Yes | No
  9. 9
    Type "<body>"
    .
    This tells the browser that this is the body of our web page.
    Create your first webpage with Notepad on Windows 8.mp4-canvas85 188145.jpg
    Was this step helpful? Yes | No
  10. 10
    Hit "Enter" or "Return" again
    .
    We are now on line 3.
    Create your first webpage with Notepad on Windows 8.mp4-canvas92 549101.jpg
    Was this step helpful? Yes | No
  11. 11
    Type in some text
    .
    We will type, "VisiHow is Awesome!". This is the text on our web page.
    Create your first webpage with Notepad on Windows 8.mp4-canvas97 078058.jpg
    Was this step helpful? Yes | No
  12. 12
    Hit "Enter" or "Return" again to get to line 4
    .
    Create your first webpage with Notepad on Windows 8.mp4-canvas100 515072.jpg
    Was this step helpful? Yes | No
  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.
    Create your first webpage with Notepad on Windows 8.mp4-canvas108 202991.jpg
    Was this step helpful? Yes | No
  14. 14
    Hit the "Enter" or "Return" key to get to line 5
    .
    Create your first webpage with Notepad on Windows 8.mp4-canvas110 086295.jpg
    Was this step helpful? Yes | No
  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.
    Create your first webpage with Notepad on Windows 8.mp4-canvas114 141957.jpg
    Was this step helpful? Yes | No
  16. 16
    Mouse up to "File"
    .
    It is in the top left of the window. Left-click it once.
    Create your first webpage with Notepad on Windows 8.mp4-canvas133 369823.jpg
    Was this step helpful? Yes | No
  17. 17
    Scroll down to "Save As..." and click it
    .
    Create your first webpage with Notepad on Windows 8.mp4-canvas141 083791.jpg
    Was this step helpful? Yes | No
  18. 18
    Find the "Save as type" field
    .
    It is under the "File name" field, where ".txt" is lit up.
    Create your first webpage with Notepad on Windows 8.mp4-canvas154 643696.jpg
    Was this step helpful? Yes | No
  19. 19
    Click the downward-pointing arrow on the far right side of this field to open a dropdown menu
    .
    Create your first webpage with Notepad on Windows 8.mp4-canvas155 717669.jpg
    Was this step helpful? Yes | No
  20. 20
    Click "All Files"
    .
    Create your first webpage with Notepad on Windows 8.mp4-canvas158 170659.jpg
    Was this step helpful? Yes | No
  21. 21
    Click on the "File name" field to get a cursor
    .
    Create your first webpage with Notepad on Windows 8.mp4-canvas162 353633.jpg
    Was this step helpful? Yes | No
  22. 22
    Type a file name
    .
    We will type "visihtml".
    Create your first webpage with Notepad on Windows 8.mp4-canvas171 617573.jpg
    Was this step helpful? Yes | No
  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.
    Create your first webpage with Notepad on Windows 8.mp4-canvas176 754563.jpg
    Was this step helpful? Yes | No
  24. 24
    Click "Save"
    .
    In our demonstration, this will be saved to the desktop, as indicated near the top of the window.
    Create your first webpage with Notepad on Windows 8.mp4-canvas185 421491.jpg
    Was this step helpful? Yes | No
  25. 25
    Close the window by clicking the "x" in the top right-hand corner of Notepad
    .
    Create your first webpage with Notepad on Windows 8.mp4-canvas193 495465.jpg
    Was this step helpful? Yes | No
  26. 26
    Double-click the file from the desktop
    .
    Create your first webpage with Notepad on Windows 8.mp4-canvas197 71244.jpg
    Was this step helpful? Yes | No
  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.
    Create your first webpage with Notepad on Windows 8.mp4-canvas204 647381.jpg
    Was this step helpful? Yes | No
  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.
    Create your first webpage with Notepad on Windows 8.mp4-canvas214 235343.jpg
    Was this step helpful? Yes | No
  29. 29
    View the file icon
    .
    In our demonstration, it now has a Firefox icon, indicating that it is a web page.
    Create your first webpage with Notepad on Windows 8.mp4-canvas229 647232.jpg
    Was this step helpful? Yes | No
  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
    Advertisement

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

If you have problems with any of the steps in this article, please post in the comments section below.

Comments

VisiHow welcomes all comments. If you do not want to be anonymous, register or log in. It is free.

Article Info

Categories : Software | Windows

Recent edits by: Amanda, Grimm

Share this Article:

Thanks to all authors for creating a page that has been read 2,399 times.