This article shows you how to create a simple web page, based on textual content, using a Windows computer and the "Notepad" program. To create the code for your web page, you will use the HTML language.
Steps
Part 1 of 4: Creating an HTML Document
Step 1. Access the "Start" menu by clicking the icon
It features the Windows logo and is located in the lower left corner of the desktop. Alternatively, press the ⊞ Win key on your keyboard.
Step 2. Search for the Windows "Notepad" program
Type notepad keywords into the "Start" menu. You will see a list of results appear at the top of the menu.
Step 3. Select the Notepad option
It features a blue notebook icon. The graphical interface of the "Notepad" program will be displayed.
Step 4. Access the File menu
It is located in the upper left corner of the program window. A list of options will be displayed.
Step 5. Choose the item Save as…
It is one of the items listed in the menu that appeared. The "Save As" system window will appear.
Step 6. Access the "Save As" drop-down menu
It is located at the bottom of the dialog box and should contain the text string "Text Documents (*.txt)". A list of options will be displayed.
Step 7. Choose the All files item
It is one of the options listed in the menu. This way you will have the option to save the new text document as an HTML file.
Step 8. Select the destination folder
Click the name of the folder where you want the HTML file to be stored using the left sidebar of the "Save As" window.
For example if you want to save it directly to your computer desktop, you will need to select the folder Desktop visible inside the left sidebar of the save window.
Step 9. Name the new document and add the ".html" extension
Click the "File Name" text field and type the name you want followed by the.html extension.
For example if you want to use the name "test", you will have to type test.html in the "File name" field
Step 10. Press the Save button
This way the new text document will become an HTML file. Now you can move on to creating the basic structure of your web page.
If by mistake you closed the "Notepad" program window or you need to go back to working on your HTML file at a later time, you simply need to select the relative icon with the right mouse button and choose the option Edit from the context menu that will appear.
Part 2 of 4: Setting up the Basic Structure of the Web Page
Step 1. Add tags that identify the type of language you will use to create the web page
The first piece of code that you will have to insert in the document serves to indicate to internet browsers that you will use the HTML language to define the web page. Insert the following code into your document using the "Notepad" editor:
Step 2. Add the "head" tags
They are used to define the section of the document in which you will subsequently define the title of your web page. For now, just insert the tag right after the "" tag, hit the Enter key twice to leave some blank space, and then type the closing tag.
Step 3. Enter the title of the web page
This information must be placed inside the HTML "" tags that must be placed inside the "head" section defined in the previous step. This is the text that will be displayed on the title bar of the internet browser or within the tab of the tab where the page is displayed. To give your website the title "My first website" you will need to use this code:
My first website
Step 4. Create the "body" section of the page
All the HTML code with which you will structure and format the contents of your website must be inserted inside the "body" and "/ body" tags that must be placed under the "" tag.
Step 5. Insert the closing tags of the HTML document
The last tag you will need to insert in your file is the closing tag of the "". This way the browser will know that the web page is complete. Enter the tag below the "" tag.
Step 6. Examine the code of the HTML document you have created so far
At this point, the visible content inside the "Notepad" program window should look like this:
My first website
Step 7. Save the HTML file
Press the key combination Ctrl + S. At this point the structure of your website is ready and you can start adding the other graphics, such as paragraphs and titles.
Part 3 of 4: Adding Content
Step 1. Know that all the contents and the code needed to structure and format them must be inserted within the section defined by the "body" tag
All the elements that characterize your web page (paragraphs, titles, etc.) must be inserted in the HTML document after the "" tag and before the "" tag.
Step 2. Add the main title of the web page you are creating
Type the code inside the "body" section, then enter the title you want inside the "" tags. For example, if you are creating a welcome web page, which will have to welcome all users who will visit your site, add the title "Welcome" using the following code:
Welcome
To create titles that are smaller and smaller than the main one, you can use the tags "" to ""
Step 3. Add a paragraph
To define this section of text you must use the tags "". All the content that will define the paragraph in question must be inserted within these two tags. The HTML code for your paragraph should look like this:
This is my first website. Thanks for visiting!
Step 4. Insert a break line after the paragraph
If you need to highlight the paragraph by isolating it from the rest of the text or its title, use the tag
. You have to insert it before or after the paragraph tags, for example to insert a blank line immediately after the paragraph you will have to use the following code:
This is my first website. Thanks for visiting!
I love french fries.
-
To insert an additional blank line after the first add a second tag"
immediately after the first. This will leave a space between the first paragraph and the second.
Step 5. Format the text
You can change the style of each single word of the text (bold, italic, underline, superscript or subscript) that makes up a paragraph or another section of the page:
Bold text Italic text Underlined text Text formatted as superscript Text formatted as a subscript
Step 6. Check the general appearance of your web page
Even though the content of your web page may be different, the structure of the HTML document you are creating should look like this:
My first website Welcome
This is my website. I hope you like it!
Here is some text in bold
This instead is italicized text.
Part 4 of 4: Viewing a Web Page
Step 1. Save the changes you made to the HTML document that defines your website
Press the key combination Ctrl + S. This way you can be sure that the most up-to-date version of your web page is present in the HTML file.
Step 2. Select the HTML document icon with the right mouse button
The context menu will be displayed.
Step 3. Choose the Open With option
It is one of the items listed in the context menu that appeared. A small submenu will appear next to the first one.
Step 4. Select the internet browser you normally use
All internet browsers are capable of reading, interpreting and displaying the content of an HTML document, so choose the one you prefer from the list of those available. The HTML file will be opened within the chosen program.
Step 5. Check the appearance of your web page
If you are satisfied with the page structure and the text formatting, you can close the "Notepad" program window.
