How to Design a Website From Templates in Microsoft Frontpage
I want to teach with this article practical ways you can design your website from pre-designed templates using Microsoft Frontpage.
STEPS
1. You are going to launch the template of your choice from your template folder. I believe you should have your pre-designed templates already in a folder on your computer. There are many free website templates now on the internet. Search or "free website templates on the search engines. You are only required to click on it.
2. Yo should now click on it.
3. This is a very important stage. Usually, there are always 3 folders in any template folder. You are going to click on the saved html file with the internet explorer logo. This is the copy web page that you are going to edit to build your own web pages. The image folder contains the images that you may need to use for your web pages. The owners or the producers of this template included these images for your use but the images may not be relevant for your website. So it is not compulsory for you to use them. I don't always use the third folder and most templates don't even contain this third folder.
4. You can now click on the saved html folder to launch your template.
5. You are now going to look for the "Edit With Microsoft Front Page" button on the title bar and click on it.
6. When you do this, your template is launched straightaway in Microsoft FrontPage environment if you have Microsoft FrontPage installed on your computer.
7. You can begin to edit the web page to suit your own purpose. Editing this page only requires you to simply delete the original wordings and replace with your very own letterings. You can give it a trial and see how easy it is. You don't even need to format anything. You may however do some little formatting to suit your own purpose.
8. You can also either insert one of the images in the image folder I mentioned earlier on if it agrees with the purpose of your web page or you can make use of your very own saved image.
9. You are now going to save your web page. Go to "Edit" and then "Save As".
10. The "Save As" dialog box appears and you are to save in the folder of your choice, preferably a special folder you must have created on your desktop earlier on. Name the file "index.html"- this is actually the name you must give to the first page of any website you are designing. It is the Home Page, the page visitors to your website see first when they type your web URL into the browser. You may or may not include the.html extension since you already have "Web Pages" displayed in the "Save as type" box. You are also expected to change the title of your web page by clicking "Change title..." tab. The page title is the message visitors to your site see in the browser window when they browse through your site. When you must have done all of these, you can then click "Save"
11. It is also very important for me to teach you the functions of these three buttons that are located at the bottom of the Microsoft Front Page" page - "Normal", "Html", "and Preview". All this while. You have been working in the "Normal" environment. When you click the "Html" button and what you have displayed is html - hypertext markup language that are been written automatically for you as you work in the "Normal" environment. The "Preview" environment when clicked upon allows you to see how your web page will look like when you upload it to the server.
12. Let me tell you how you can create a new page. You can click on "File", then "New". A new page is launched immediately you do this. You must however name all the other pages of your website like "About Us", "Services", and "Contact Us" and also include some other common information for all the pages on the first page or index page before you create other pages.
13. You can move from one page to the other by just clicking on it. Now if you want the common contents of "index page" to appear on the second page. You can do this by simply going back to the index page and then click on the "html" tab I mentioned earlier on at the bottom of the page. Copy all the codes (press Ctrl A and then Ctrl C) and then switch over to the second page, click the "html" tab, then paste directly into it. You can then click on the "Normal" tab to see what the second page has turned into. You have all the contents of the first page on the second page. You can then edit this page to suit the purpose of the page. You can do these for as many pages you want to create.
14. I want to assume you have created all the pages you needed for your website and you now need to link the pages i.e. you want your visitors to be able to click on "About Us" tab on the home page and go immediately to the "About Us" page. This is a very important activity when you design a website and you just must get it right. This is however the simple process - Go to the home page and highlight "Home" and then you either click on the "insert hyperlink" button on the title bar or you press "Ctrl K" or you go to "insert", then "insert hyperlink". This brings up the "insert hyperlink" dialog box.
15. In this box: In the "Text to Display Box", the text "Home" is already displayed. You can then click on the "index.html (open)" and then click okay. NB: You are clicking on this because you are actually linking "Home" on your home page to your home page in your website. Don't loose sight of the fact that you must be in the right folder or (the folder where you saved your file) as you carry out the linking process. Now we are now going to look at the second thing you have to do as you hyperlink your web pages. Click Okay when you are through with this box.
16. You can now go back to the home page or first page and carry out the same process for the "About Us" tab i.e. you should highlight "About Us", click "insert hyperlink" button and then click on "about us (open)" file and then click okay. You have just linked the "About Us" tab on your homepage to the about us file.
17. You will repeat this process for all the tabs on your first page and then go to the second page (About Us) and carry out the same process. This same process should be carried out for all the other pages you must have created. You only have to do this for the common information or pages on all your pages. NB: You should remember to save your file (Ctrl S) after hyper linking any page. You can also make it a point of duty to test your work by previewing in browser.
STEPS
1. You are going to launch the template of your choice from your template folder. I believe you should have your pre-designed templates already in a folder on your computer. There are many free website templates now on the internet. Search or "free website templates on the search engines. You are only required to click on it.
2. Yo should now click on it.
3. This is a very important stage. Usually, there are always 3 folders in any template folder. You are going to click on the saved html file with the internet explorer logo. This is the copy web page that you are going to edit to build your own web pages. The image folder contains the images that you may need to use for your web pages. The owners or the producers of this template included these images for your use but the images may not be relevant for your website. So it is not compulsory for you to use them. I don't always use the third folder and most templates don't even contain this third folder.
4. You can now click on the saved html folder to launch your template.
5. You are now going to look for the "Edit With Microsoft Front Page" button on the title bar and click on it.
6. When you do this, your template is launched straightaway in Microsoft FrontPage environment if you have Microsoft FrontPage installed on your computer.
7. You can begin to edit the web page to suit your own purpose. Editing this page only requires you to simply delete the original wordings and replace with your very own letterings. You can give it a trial and see how easy it is. You don't even need to format anything. You may however do some little formatting to suit your own purpose.
8. You can also either insert one of the images in the image folder I mentioned earlier on if it agrees with the purpose of your web page or you can make use of your very own saved image.
9. You are now going to save your web page. Go to "Edit" and then "Save As".
10. The "Save As" dialog box appears and you are to save in the folder of your choice, preferably a special folder you must have created on your desktop earlier on. Name the file "index.html"- this is actually the name you must give to the first page of any website you are designing. It is the Home Page, the page visitors to your website see first when they type your web URL into the browser. You may or may not include the.html extension since you already have "Web Pages" displayed in the "Save as type" box. You are also expected to change the title of your web page by clicking "Change title..." tab. The page title is the message visitors to your site see in the browser window when they browse through your site. When you must have done all of these, you can then click "Save"
11. It is also very important for me to teach you the functions of these three buttons that are located at the bottom of the Microsoft Front Page" page - "Normal", "Html", "and Preview". All this while. You have been working in the "Normal" environment. When you click the "Html" button and what you have displayed is html - hypertext markup language that are been written automatically for you as you work in the "Normal" environment. The "Preview" environment when clicked upon allows you to see how your web page will look like when you upload it to the server.
12. Let me tell you how you can create a new page. You can click on "File", then "New". A new page is launched immediately you do this. You must however name all the other pages of your website like "About Us", "Services", and "Contact Us" and also include some other common information for all the pages on the first page or index page before you create other pages.
13. You can move from one page to the other by just clicking on it. Now if you want the common contents of "index page" to appear on the second page. You can do this by simply going back to the index page and then click on the "html" tab I mentioned earlier on at the bottom of the page. Copy all the codes (press Ctrl A and then Ctrl C) and then switch over to the second page, click the "html" tab, then paste directly into it. You can then click on the "Normal" tab to see what the second page has turned into. You have all the contents of the first page on the second page. You can then edit this page to suit the purpose of the page. You can do these for as many pages you want to create.
14. I want to assume you have created all the pages you needed for your website and you now need to link the pages i.e. you want your visitors to be able to click on "About Us" tab on the home page and go immediately to the "About Us" page. This is a very important activity when you design a website and you just must get it right. This is however the simple process - Go to the home page and highlight "Home" and then you either click on the "insert hyperlink" button on the title bar or you press "Ctrl K" or you go to "insert", then "insert hyperlink". This brings up the "insert hyperlink" dialog box.
15. In this box: In the "Text to Display Box", the text "Home" is already displayed. You can then click on the "index.html (open)" and then click okay. NB: You are clicking on this because you are actually linking "Home" on your home page to your home page in your website. Don't loose sight of the fact that you must be in the right folder or (the folder where you saved your file) as you carry out the linking process. Now we are now going to look at the second thing you have to do as you hyperlink your web pages. Click Okay when you are through with this box.
16. You can now go back to the home page or first page and carry out the same process for the "About Us" tab i.e. you should highlight "About Us", click "insert hyperlink" button and then click on "about us (open)" file and then click okay. You have just linked the "About Us" tab on your homepage to the about us file.
17. You will repeat this process for all the tabs on your first page and then go to the second page (About Us) and carry out the same process. This same process should be carried out for all the other pages you must have created. You only have to do this for the common information or pages on all your pages. NB: You should remember to save your file (Ctrl S) after hyper linking any page. You can also make it a point of duty to test your work by previewing in browser.