Create a Simple Webpage Using Notepad
Webpages. We use them every day. But how hard is it to make a webpage? In this article, you will find out how to create a simple HTML webpage using Notepad.
Steps
Webpage Help
Doc:Simple Webpage,Webpage with HTML,HTML Cheat Sheet
Creating Your Own Webpage
- Open Notepad. Notepad is automatically installed on all Windows computers. You can find it in the Start Menu. Once you are in Notepad, click "File" and then click "Save As" in the dropdown menu. Choose "All Files" in the file type menu. Save your file as an HTML file. Usually, the main page of a website is known as "index.html" in order to be able to access everything on the website from that single page.
- HTML (Hypertext Markup Language) uses tags. Tags are basically some text inside of Template:Code.
You will use a variety of tags to create your webpage. There are also "end tags" which end a line of code. An example is of an end tag is:Template:Code.
These end things like a bold font or a paragraph. - The first tag of a webpage is usually: Template:Code.
You can put this at the top of your Notepad file. - The next tag is Template:Code.
The next tag, Template:Code, tells the browser what to put at the top of the window, and the optional meta tags, tells search engines like Google what the site is about. - On the next line after your head tag, put a title: Template:Code
- Now end your head by typing Template:Code
- Next in our website comes the Template:Code tag. Please note that not all colors are supported on all browsers. (for instance, dark grey probably wouldn't be supported on most browsers)
- Between the two body tags goes the content of your webpage, what the user sees. Let's start with a header. A header a a section of large text, and is specified in HTML with Template:Code through Template:Code, with Template:Code being the largest. So at the top of your webpage, after the body tag, might be something like Template:Code Make sure you remember the end tag, or your whole webpage will be in giant!
- Another tag that can go in the webpage body is the Template:Code tag, or paragraph tag. So after your header, you might have Template:Code. I'm learning how to make a website! wikiHow rules!</p> If you want a new line in your site, use the Template:Code tag, or break tag.
- You probably don't want a webpage that's all plain text. So let's put in some formatting. Template:Code for bold text, Template:Code for italics, and Template:Code for underlining. Remember your end tags!
- What really makes a website interesting is pictures. Even with formatting, who wants to look at endless words? Use the Template:Code tag to do this. But, like the body tag, it needs some extra information. An img tag might look like this: Template:Code.
The src (source) is what the picture is called. The width and height are the width and height of the picture in pixels. - Almost done! You want your visitors to be able to see more than just one page. To create links, use: Template:Code.
The text in between the tags is what the user clicks on to get to the next page, and the href part is where their click takes them. Using a tags you can let your users move effortlessly around your website. - To finish up, you need to end your body with Template:Code, and entire webpage with Template:Code
- Save your work, making sure to save the file with '.html' at the end. Open the .html file in your favourite web browser to see how it looks. Congratulations! You just made a webpage.
- If you want to put your website on the web, see How to Publish a Website on Your Own Domain
Tips
- You can find more tags by searching on the web. There are many good sites to help people learn to make websites. W3Schools is very good.
- Remember your end tags.
- Always make sure you type <!DOCTYPE html> on the very first line, before your first <HTML> tag. It tells your browser that your webpage is in HTML5.
- You may change the font by typing <font face="N"></font> on before <html> and after </html>. N is replaced with a font face, e.g. "Verdana".
- If you would like to use angle brackets on your website, use < and > An and sign is &
- According to HTML Tutorials always name your Web folders and files using all lowercase and without any spaces or punctuation. While Windows allows you to use spaces, many Web hosting providers do not, and you'll save yourself some time and trouble if you name your files and folders well from the beginning.
