In this project you will create a web page yourself. Relax. You will work up to it and you will have directions each step of the way.
These lessons will not get into how you acquire web space or a domain name or how to publish your work to a web site. If you are taking a course, your instructor may want you to 'publish' your work to a network location for her to view.
You must have some kind of browser so you can see what you created. If you are serious about producing web sites, you will probably want to install all of the most popular browsers to see if your documents work well in all of them. Many advanced techniques for HTML work only in certain browsers.
There is no one answer to that question. Best for what purpose? Best for what kind of user? When are you asking? No browser is perfect for everyone!
The first table below shows how many different browsers accessed jegsworks.com in November 2003. There are a lot of "browsers" in the list that are actually automatic services like InternetSeer or web authoring programs like FrontPage and Cold Fusion. Spiders from search services (like Google and AltaVista) are not counted in this list. IE dominated at my site in 2003 but by 2014, IE's percentage had dropped drastically. The statistics come from analyzing log files from my web site. Chrome does not show up at all. I know that the web site was viewed with Chrome because I used it myself! Looking at the log files directly I found that Chrome was being counted as Safari by the analysis software! So the Safari numbers include visits from Safari browsers and Google Chrome browsers. Who knew?? Another example of software that fell behind the real world.
Stats for jegsworks.com |
||||||||||||||||||||||||||||||||||||||||
Nov. 2003 |
Sept. 2016 |
|||||||||||||||||||||||||||||||||||||||
![]() |
|
Statistics for other sites:
NetMarketShare.com
Analytics for USA goverment web sites
A search with Google using the
keywords "browser statistics" will provide you with a list of sites that
provide the statistics for their own site as well as some pages that report
stats for multiple sites.
Read these statistics carefully. Many statistics about the web are based on numbers reported only from people who downloaded a particular toolbar or who use a particular service. No one can truly report numbers for the Internet as a whole.
You have many choices of software to use to create and edit HTML pages. They fall into some general categories:
The lessons will assume you are using Notepad but there are MANY other free text editors that you could
use. EditPad
Pro 7, for example, can be 'installed' directly to your Class flash drive
so that you can access to it on any computer that your Class flash drive is
plugged into. Plus, there is a button to view the current document in a
browser. Sweet features. I use this editor for most of my own plain text work.
Be aware that free web space sites usually require you to use one of their templates and to do all of your editing online through their site. You may have very limited ability to add your own HTML or CSS coding.
Basic Text Editor: Notepad
A basic text editor like Notepad works just fine for HTML coding. You do not have to have fancy or expensive software to write HTML documents, though such can make your work easier in many ways. Many professional web authors still use Notepad or some other basic text tool for most of their work and use advanced tools only for complex tasks.
Advantage:
Disadvantage:
Advanced Text Editor: EditPad Pro 7
There are many free and commercial text editors that add helpful features to the basic ones of Notepad, like:
The illustration shows EditPad
Pro 7 which is intended for programmers as well as HTML writers. Notice the color coding that makes
the tags much easier to find. This program also has very good, searchable
Help files.
There are many different editors of this type that help programmers write and edit programming code in various programming languages.
Advantage:
Disadvantage:
HTML Text Editor: Coffee Cup
Text-based
HTML editing programs, like Coffee Cup Free HTML Editor, pictured at right, have
features that Notepad and advanced text editor do not. Such a program can color-code the tags and
automatically indent and space lines to make the code easier to read. A
preview or browse feature displays the page that you are working on in your
browser before you actually save any changes. Buttons and assistants
can create the HTML code for you and show you all the attributes for each
tag and the choices for the values of each attribute.
Such features let you concentrate on what you want to say, instead of having to think about the proper code and its spelling and punctuation.
Advantage:
Disadvantage:
A WYSIWYG editor, like Adobe Dreamweaver, pictured at the right, goes even further. It lets you type and format directly on the page, like in a word processor. The editor manages the code out of your sight.
You can still dig down to the actual HTML code to fix problems or to use new methods and scripts that the editor cannot handle.
The WYSIWYG lie:
No program can show you what your page
will look like under all circumstances. Many factors affect the
appearance of a page. (Next lesson has a table of factors)
The WYSIWYG part is at least partly a lie! It's
more like What You See Is What You MIGHT Get.
Advantage:
Disadvantage:
Word Processors:
While you can use a word processor to write HTML documents,
it is not the best choice. You must be sure to save as an HTML document. Browsers do not understand the hidden code in normal word processing
documents. Saving as HTML will remove the word processing marks. However,
the only formatting that will be saved is what can be duplicated with HTML
tags. The results are not always what you expect. You will especially have
difficulties in using a word processor to edit an existing HTML
document. Very odd things can occur without warning as you edit and save and
edit and save again.
MS Word: Microsoft promotes using Word 2000 and later versions to write web pages. Word adds a LOT of code to a page that you save as HTML so that you can go back and forth with your editing between Word doc format and HTML format. They call this round tripping. This extra code makes it very hard to edit the HTML in a different HTML editor. It also makes your pages much bigger, by thousands of lines, which means that they take longer to download. (That's a bad thing!)
For people to be able to see your web pages over the Internet, you must store them on a web server that is connected to the Internet. Your disk space on such a server is called your web space. The URL, or address, used to access the web space is your domain name, like microsoft.com or jegsworks.com.
Domain name for ISP account: The URL
to your space will probably include your ISP's name and your login name,
like:
http://www.yourispname.com/~yourloginname
or
http://users.yourispname.com/yourloginname
This is fine for personal web pages but is not very impressive for your business site.
Free web space: A free account with a web hosting service will usually require that ads show on your pages but you do not get any money from these ads. These free services usually do not allow commercial/business sites. They want you to upgrade to a paid account. On the other hand, Google Sites offer free web space, including for commercial/business use. Of course there is a premium account at Google that offers more tools and is not free!
Free hosting accounts do not usually have tech support available by phone. Free web hosting servers also tend to be slow since they crowd a lot of sites onto each of their web servers. You get what you pay for in this case.
New web authors may like using the page-creation features, where you just choose from a list of options to create web pages. No HTML software required. Not much control either. But, you probably cannot move those pages to a new hosting service later. They depend on templates and tools on the web server that are not available on another company's web server.
Domain name for free web space: For a free site
your URL will still be fairly long and not personalized much, like:
http://members.tripod.com/your_member_name/
https://sites.google.com/site/Lastname-Firstname/
http://your_member_name.tripod.com
http://www.angelfire.com/directory/membername
http://hometown.aol.com/yourmembername
Remember: Server stability, the right features, and good technical support are more important than having the lowest cost!
Resellers: Some
"web hosting services" are actually reselling services from another
company. They don't have any equipment of their own. That means they
cannot fix things themselves. It's an extra layer in the way of getting things done.
Domain name for hosted space: To use web space at a paid hosting service, you need your own domain name. There is a yearly fee to register a domain name. $35 per year is the maximum. You should be able to get a price break if you pay for several years in advance or register several names.
When you contract for your web space, you can probably arrange for the
domain name at the same time, or you can register the name you want
directly from one of the companies in charge of domain names, like Network Solutions or Register.com
.
InterNIC has a list of all the official registration
services
.
Pick a name that is easy for your site visitors to figure out and
remember. Unfortunately, most of the really easy names are already taken.
You do not have to stick to a .com extension for your domain name. Perhaps .net
or .org or .info or some another extension would be more appropriate. There are over a 100 new extensions becoming available, starting in 2014. No
one company handles all of the different extensions.
You can use up to 63 characters in the main part of the name (67 including all the extensions). Don't use that many! Keep it as short as possible.
If the name you really, really want is already registered, you might be
able to buy it from the current owner. Some people buy up domain names
just to resell! Check out eBay or
other auction sites and
search for "domain name". You might get your name cheap, or you might have
to pay a hefty fee.
You can look up who owns a domain name with Who Is at Network Solutions
. The results page
will show a name, address, and phone number for the current owner. It
never hurts to ask, especially if the domain is not active yet.
Recommendation: Register your domain name yourself, directly with Network Solutions. It is easy to do
online with a credit card. It is not the cheapest way but there are
serious advantages to doing it yourself.
Advantages:
Who
owns the name? If your hosting service
or web designer registers the domain name for you, you may have to have
their cooperation to move to a new hosting service or new designer! They
may register it under their own name instead of yours! Do you
see a problem here???
Did
the bill get paid? It is easy to get
confused over the billing for your domain name and web hosting service.
These are likely to be billed separately and they may renew at different
times. To make things more confusing, you will get lots of offers by email
and snail mail that look like bills but which are sneaky offers from other companies that are trying to trick you into changing to their
service. Don't forget which company you dealt with the first time. You
don't want to switch by accident!
Once you have written your web pages, you need a way to transfer them to the web server. This is called uploading or putting (files in general), or publishing (web pages and associated files in particular).
To upload you may need to know:
There are three choices of how you can create and upload. You may not be able to use all three for your particular web hosting service.
a. Online Page Wizard or Site Template:
Web hosting services usually have web pages that lead you through the steps to create your own pages by making choices from lists of layouts, colors, and themes. Your work is not on your own computer at all so, actually, there is no uploading to do. On the other hand, you do not have a local copy of your work either! Pages created this way cannot be moved to another web server.
b. Web page upload dialog:
The hosting service may have a dialog
that lets you browse your own computer to pick files to upload. Some
allow only 1 file at a time but others let you pick more. Usually you
must pick each file separately. Very tedious!
The example at the right is from Momentum, an online course management program that I used while teaching at Roane State Community College. Each HTML page and each graphic file used on the page must be selected separately but will then be uploaded all at once. The illustration shows the files needed to show the first page in my Working with the Web. The only images on that page are 9 small icons. But I still had to choose them one at a time!
FTP program:
from File Transfer Protocol.
Many FTP programs have a free version or a trial version. FileZilla, Ws_FTP
, and CuteFTP
are some popular
FTP programs. You usually
see a list of files on your own computer in one pane and the list of files
on the web server in another pane. Drag and drop to copy from one to the
other. That part is easy!
Current versions of Windows can usually handle uploading with FTP directly from Explorer. A free FTP program can still be a better choice since it shows both locations in a single window and has other features that can be very helpful, like remembering the location and log in information.
HTML editor:
Many HTML editing programs contain an internal FTP program. Others automatically use whatever FTP software is installed on your computer. The internal FTP program is usually not as flexible or as fast as a separate FTP program.
FrontPage Extensions:
[Now considered obsolete. Your web server may not support FrontPage Extensions.]
Microsoft FrontPage
and its successor Microsoft Expression Web do more than just copy your files when publishing. If your web
server has FrontPage extensions installed, these programs create special files
to manage things about your web. Very useful! But... that makes it risky to publish
to a FrontPage web using an FTP program. Choose a method and stick to it!
Check list for web site hosting:
Decide what features you need now and might need later. Find out how easy it is to expand later.