An Extreme Tutorial on Creating a Website in Microsoft FrontPage
Discussion
If you have never created a website before, then I suggest you read this article carefully in its entirety before you begin. For information on developing websites, see the World Wide Web Consortium, also known as the W3C.
This article assumes you have a little bit of knowledge about either Microsoft FrontPage or Microsoft Word, since they have similar formatting tools.
There are several steps toward creating a website. They are:
- Choosing a domain name.
- Purchasing a domain name, which requires that you have (or create) an account with a domain registrar.
- Purchasing web hosting, which requires that you have (or create) an account with a web hosting company. Some domain registrars also offer web hosting, and vice-versa.
- Designing and developing your website, and uploading it to the hosted server.
- Maintaining your website.
- Setting up email accounts.
Choose a Domain Name
Long domain names can be difficult to remember. I like to avoid names that contain hyphens, especially if a website already exists that has the same name without the hyphen. It's nice if you're creating a company website and haven't decided on a company name yet so that you can have your domain name be the same as the company name. I almost always choose .COM as my domain name extension because this is the one most people remember. Domain names are not case-sensitive. However, it's nice to print your domain name on business cards, stationary, and websites using upper and lower case so that it is easier to read--making it easier to remember, as shown:
To check the availability of a domain name, go to the next step, Purchasing a Domain Name, and search for desired names at the domain registrar of your choice.
If you cannot have your desired domain name, consider some tips:
- Spell the name phonetically or with some other trick: www.DoughMain.com
- Use "My" in front of the name: www.MyDomain.com
- Use "Online" as a trailer: www.DomainOnline.com
- Use "Live" as a trailer: www.DomainLive.com
Once you choose a name, ask friends and family what they think. You could end up with a domain name that has a connotation for others that you didn't notice, such as www.TinkBomb.com.
Purchase a Domain Name
To search for domain registrars, just click here. I use www.DynoNames.com. Purchase a name for your website if you don't already have one. Do NOT buy the other services that they provide; you shouldn't need them. You should only pay $10 or less PER YEAR for a domain name registration. You only need to register a domain name for one year at a time, but if you plan to be in business for a while, you may want to register it for a longer term to get a discount on the registration fees. Unless you don't want people to know who owns your website, do NOT pay for private registration.
Purchase Web Hosting
Web hosting is nothing more than you buying space on a server (a computer) that is connected to the internet.
PHP or ASP?
Hosting comes in several forms. One is Unix/PHP. PHP is an open-source programming language that runs on a Unix server. ASP runs on Windows server. Most of the free website softwares available, such as blogs and bulletin boards, are provided for Unix/PHP environments. This is what I recommend.
Many web hosts are so busy trying to sell you other services, that it becomes annoying. www.GoDaddy.com is one of them. I have a reseller account from www.SurfSpeedy.com so that I don't have to deal with a hosting service, and can quickly set up my own hosting any time I like. This costs me about $25 per month for 6 GB (gigabytes) of server space.
The website you are viewing currently uses 520 MB (megabytes) of server space. That's a lot. Most small business websites need 25 MB of space or less. If you get lots of emails or emails with large attachments, you'll need more space. If you're unsure, I would buy small. You can always purchase more space.
Decent web hosting generally costs about $7 per month. Be careful you don't pay a lot!
Your web hosting MUST provide for FrontPage extensions. Be certain that they do before you buy. Most hosting services DO provide this service free of charge.
Choose a Design
FrontPage is an "HTML editor". There are many others available--including free ones, but I prefer FrontPage. "HTML" is an acronym for hypertext markup language. It is the standard website language. HTML code simply changes formatting of the visible text and graphics.
Not all HTML can be done through the FrontPage editor. For instance, the code for the Google ads and for the counters use javascript, which could not be placed through design view of FrontPage. This will be explained later.
Drop-down menus and other fancy website additions are created using javascript. Several of these tools can be found here.
Because so many people are creating their own websites, I don't recommend using one of FrontPage's built-in templates. You can purchase FrontPage templates at websites such as www.classythemes.com. I've purchased many from them and have been very happy with them. There are many websites that claim to have free FrontPage templates, but they could easily install other unwanted programs on your PC.
If creating your own design, for best results, choose 3 colors from which to begin: a background color, a primary color, and a secondary color. Black is also almost always used for text. In its original design, this article's webpage uses a deep red, a blue-gray, and black on a white background. For a softer look, use some form of gray as one of your colors.
Once you have chosen your colors, find out their HTML color codes values and jot them down and keep them in a safe place. This site provides a method to quickly test your text and background (BGColor) color choices, and provides the HTML color codes.
I personally hate colored-background web pages unless the color is slightly off-white. Black and other dark backgrounds and textures almost always make text very difficult to read.
Saw a website that you love? Most site designs can be "stolen". Go to the site and hit File-->Edit in FrontPage. Save the file to your hard drive. Please keep in mind that web design is copyrighted, and you should change it a great deal so that you don't infringe upon that designer's copyright.
Graphics
This is probably one of the hardest parts of creating a website. It's not legal to go around copying graphics from most other websites. You can buy a subscription to www.clipart.com or purchase other clipart, but check the terms and conditions before you buy/subscribe to be sure you're permitted to use the graphics freely. If you need really nice graphics, consider having a graphic artist design them. www.RentACoder.com is one place where you can purchase such services without spending too much money. When buying graphics, commit to buying only one graphic in the beginning, and pay only $25 or so for it. Ask for samples from the coders who bid. This will help you better find a coder whose designs you like.
Styles and CSS
On this site, I used a Cascading Style Sheet (CSS). It's easier that way, and takes up less space on the server. A style is a specific format that is used over and over again, such as the headings throughout this article. CSS stores the styles in a file. This site uses style.css as its file name, and it's stored here. If you hit View-->Source (from Internet Explorer) on any of the pages on this website, you'll see this line in the HTML code, which tells my pages to load the style.css file for displaying these pages to you:
<LINK rel="stylesheet" type="text/css" href="http://www.officearticles.com/style.css">
Sites like this provide free assistance with CSS files. You don't have to use CSS or even styles in your web site, so if it's too difficult, just skip it and manually format everything.
Begin to Create
What FrontPage basically does, by default, is allow you to create your website on your hard drive, and then upload it to the server. Many people choose to directly edit their website on the server, but I don't think that's a good idea. If I mess up a page here on my hard drive, I can always go get the page in its original form off of the server, and then just start over.
Create Web
This seems to be the part that many people skip because they're unaware of it. In FrontPage, hit File-->New-->Page or Web. Then choose Empty Web. Watch for the location in which it's being saved. You can save it anywhere you like, but be sure to give it a name. On my PC, this website is named, simply, OA. FrontPage creates a web folder (slightly different than a regular Windows Explorer folder, though only because it has a different icon).
Click the New Page icon to create a new, blank web page, or choose your template.
Themes and Templates
If you chose a template, your web is virtually designed for you, and all you need to do is place text, apply the styles to the text, and place graphics.
If you have or purchased a theme, you may need to apply it. Hit Format-->Theme and choose your theme.
Using Tables
I personally create most of my web page layouts using tables, though Office Articles does not use tables. Many people run into trouble using tables because they set table and cell widths by pixels. If you use percentages to set these measures, you'll be much happier. For instance, a table could be centered and set to 80% to allow a nice white margin on the left and right of the page. Or have a two-column table with the menu in the left-hand column and the text in the right. Set the left-hand column 15% of the table's width and set the right at 85% of the table's width. Please realize that a table may be 75% in width (of the viewer's screen resolution), and the cells within should total 100%. Cell percentages are "of table width" while table percentages are "of page width", which is set by the resolution of the viewer's PC settings.
Background
If you have not chosen a theme, you may need to apply a background color. I recommend white or very light off-whites for professional webs. Right-click anywhere on the page and hit Page Properties. Choose the Background tab and change the background color.