Create an HTML Web page Template in Notepad
- Create a Folder for Your Webpage Files
- Copy HTML Template - Code
- Paste HTML Template Code Into Notepad
- Save Web page Template File to Folder
HTML Template in Notepad - This is the file where all your code is placed...the browser ( Internet Explorer, Mozilla, Safari, Opera etc..) interprets the HTML code and displays it in whichever browser you open. All you need for this step is "notepad". Notepad is the most basic text editor available, it's free and works fine for our simple application here.
You are going to create your web pages initially without using a web server. as long as you have a "web browser" like Internet Explorer , Mozilla, Safari, Opera etc.. installed on your computer all files can be stored and then displayed to the browser locally from your "C:\ drive".
The content you write will look exactly the same displayed locally to your browser or on the internet.
Of course later you will learn how to transfer your files ie.. upload to a web server on the internet. So, hang in there ...one step at a time.
Step 1. Create Web Folder
First we'll create a folder to place all our files in.
Follow this to create your folder.
- Click the "Start" button on your PC or laptop then follow this path:
- > My Computer
- > Double Click on your "C:\" drive
- > Right mouse click "new" > "folder"
- > A new folder will appear - name this folder "my_web"
Step 2. Copy HTML Template Code
Next - highlight all the code in the form below - right click the mouse and click "copy"
Step 3. Open Notepad and Paste Code
Now we'll open notepad and paste our HTML code...
- Click the "Start" button on your PC or laptop then follow this path:
- > All Programs
- > Accessories
- > Notepad
Paste the copied code above into your Notepad file. Paste is "Ctrl V " right mouse click "paste"
Step 4. Save File to Folder
Lastly, save this file in your C:\ drive in the "my_web" folder you just created like so: save as - template.html
Summary
These 4 steps, followed correctly, will create a template that you can "reuse" when creating each page for your website. This is the "canvas" on which all the text, images, and navigation will be placed.
Don't worry that you may not understand the HTML code you just pasted. Do you know exactly how your ignition system in your car works? Probably not but you undertand HOW to make it work...that's what were doing here.
Remember, we are creating a "simple" website here at first - a Home page and About us page. The reason is a website with 10 - 50 or even 1000 pages will require a bit more "technology" than we initially will be learning at first. But, please! DO NOT worry about that NOW! Focus on setting up your template. So our first effort will be to create a home page and an "about us" page...nothing fancy - just something to get the mechanics of linking between
NEXT: Adding content