*Docentdotinfo
How to Make a Website, by Mike Baird
There are many ways to create content and publish online. Below I present one recipe for success.
Update May-June 2008. You might want to forget all about FrontPage and Dreamweaver, and domain names and hosts, and complex web control panel and administration skills - and just head over to Google's free "Google Sites" resource and create in minutes, at no cost, what you really need. Or, at least do this as a first "learning" step. For an example, See my trivial example of a "Google Sites" web called "photomorrobay" which so far just includes some "tip of the day" and "photo of the day" gadgets. See http://sites.google.com/site/photomorrobay/. Make your own site(s) on any subject(s) at http://sites.google.com/ - no cost, courtesy Google. Sign in with your free Google ID - if you don't have one, get it free when asked. Tutorial at http://www.google.com/sites/help/intl/en/video/sites_overview_video.html
Update May 2008. Support for editing sites live using FrontPage has pretty much evaporated. The simple alternative is to edit your sites offline in FrontPage and publish them using FrontPage's built-in FTP option. Unfortunately, FrontPage is not up to handling large sites (like morro-bay.com ~200MB) in this manner. If you choose to publish using FrontPage FTP protocol, and especially if you are hosting multiple domains on one account, be sure you create unique FTP users for each directory associated with each site, otherwise it is too easy to overwrite the wrong content. I am now using Macromedia Dreamweaver 2004 which I had purchased a while back (since replaced with Adobe Dreamweaver CS3, after Adobe acquired Macromedia). You can edit simple sites live using Dreamweaver, or edit remotely on your PC and easily publish changed pages only to the server. It is best to edit locally to retain powerful site management capabilities (such as renaming a folder changes all links to that folder), then push only changed files to the remote web. Microsoft's Expression Web replacement for FrontPage, is, in my opinion, a complete disaster in terms of maturity and usability.
Acquire the
Microsoft FrontPage 2003 editing tool (about $170) and install it on a
Windows XP computer.
Use FrontPage's built-in Help system to answer most questions you may have.
Be sure to update Microsoft
Windows and
update
Microsoft Office.
Acquire a domain name (e.g., morro-bay.com) from an accredited domain name registrar and sign-up for a "FrontPage extension supported" web-hosting service. These actions can be done at the same or different vendors, but it may be more convenient for you to simply use the same vendor for both services. Recommended for both low-cost domain name registration, and for proven low-cost reliable web hosting, are 1and1.com (especially if you want to host multiple domains under one low-cost account) and Godaddy.com. If you have choice of choosing a Linux-based versus Windows-based server, and you don't know why you would use one technology over the other, choose the Linux-based system. Monthly fees are typically between $4 and $20 per month. The more you pay the more storage space, bandwidth, and features you get. You can always start out with the least expensive package and upgrade later. Domain names typically cost between $7 and $12 per year. You might want to pre-pay for your domain name for several years in advance so you will not have to worry about your domain name expiring sometime in the future by mistake. Yahoo also offers reasonable domain name service and web hosting services. Read and follow these domain name naming guidelines.
Follow the instructions at your web hosting service for the next specific steps to take.
More information on alternative domain name registrars and web site hosting vendors is listed at morro-bay.com's "unrelated" page. You can find first-level help regarding PCs and the Internet at morro-bay.com's PC Help page.
Best Success! Publish or Die! Mike Baird mike [at} mikebaird d o t com
Random Design Hints are added here as I think about them... mostly pasted from e-mailed answers to questions I've received.
- "Borrow" a small simple site you like, replace all
the text and images with your own material, and use that as a
template to get started.
You can, in your browser, simply right-button-click, and select "view-source" to see the code on any web page. Most (but not all) web sites edited in FrontPage are so indicated by a line of code near the top that says:
<meta name="GENERATOR" content="Microsoft FrontPage 6.0">
If you like what you see, using FrontPage itself, you can easily "File - Import...," pretty much in its entirety, (depending on the underlying technology) any "html-based" web site on the Internet... a userID and password are not required. Of course you should honor copyrights and not steal entire designs... use this technique to learn how other good sites are implemented in FrontPage. [I just tried the "Import" on the non-FrontPage web site http://picasaweb.google.com as an experiment.. worked well] - In a FrontPage web site, every main page
(whether inside a folder or at the
root level), should ideally be named index.htm. Folder names should
be descriptive... e.g. use
..../new-arrivals/index.htm not .../new-arrivals.htm as this
makes it easier for your users to just type or link to
http://mbfol.org/new-arrivals/
and get to your page.
(given just a folder path, a browser like Internet Explorer or Firefox will look on your web server for a "default" page named index.htm, index.html, default.htm, default.html, index.asp, etc...} - Minimize the number of files at the root level of your web. This will make it much easier in the future. Make folders for all categories, and drive all of your content down into a relevant folder. The only files at the root level should be your start/home page index.htm file, and perhaps a few others that will come up as needed. So, you would have things like http://mbfol.org/aboutus/ or http://mbfol.org/about-us/ to hold an index.htm page at that level describing the organization
- All file and folder names should be all lower case and not have spaces or weird special characters other than dashes... remember that the underscore character is not a visible character if the string is displayed underlined indicating it is a hyperlink... so, use a file/folder name like "new-arrivals" and not "New Arrivals"
- All fonts should be the most simple
Arial/san-serif for easiest reading - if you use a fancy font, it might
not display that way on other's PCs and Macs
(later you will learn how to use a "style sheets" to specify fonts for your entire page/site... in this way, your entire site can be changed by changing referred-to style sheet(s)) - All hyperlinks leading outside your domain should "open into a new window" so you don't lose visitors to your site.
- Getting links to your site from key related sites, like http://www.slolibrary.org/friends.htm , is critical to success.
- Don't use spaces for layout - use tables instead. Font size will vary on user's PCs, and so if you want columns of items to appear, then you need to use a table for layout. Use variable-sized table cells, so people with wider screens can make full use of their available real estate. I.e., sites designed for 800 pixels wide may look well-balanced, but often waste space.
- Think about navigation links... you may not even need them.. they are hard to do right and even harder to maintain if there are structural changes... often the best method is to have links on your main page open content to a secondary new page that people can just close when they are done reading, or open to a secondary page with a simple "back to home" link on the bottom.
- Create hierarchy by using folders, and folders inside of folders, and then when you drag files and folders around, FrontPage will maintain all associated links. For example, you can have a top-level folder called "events" and inside that, one called "2006" and inside that, one called "august" etc... that way, the path to an index.htm file with content is self-describing... viz., http://mbfol.org/events/2006/august/index.htm which is the same as http://mbfol.org/events/2006/august/ Likewise, always put images and photos in a folder so-named and logically placed in the hierarchy... viz., use http://mbfol.org/images/logos/ to store all your organization's logos that will be used throughout the site... but use something like http://mbfol.org/events/2006/august/book-sale/images/tom-wins-contest/tom-smith-holds-citation.jpg to save that delightful memory.
- Never expose your e-mail address on a web page.
Spam robots will harvest them (trust me here), and soon the addresses will
be contaminated with 1000's of unwanted spam messages daily. You
can mask an address by using forms like...
contact at mbfol.org
contact at mbfol dot org
contact@[remove]mbfol.org
For some purposes (mostly useful for filling out forms online when you must provide a valid e-mail address), you can use consider using "temporary addresses" like expires-6-22-06@mbfol.org and then plan on abandoning that address in 2007. Most web hosts will allow you to create and use at no additional cost, hundreds or even thousands of e-mail addresses based on your domain name.
Do not construct an underlying "mailto:" hyperlink unless you similarly modify it to mask the e-mail address. - If you want different people to be able to edit different sections of your web site, you can create sub-webs with different user IDs and passwords for each sub-web and user of that sub-web, and prescribe the rights you want to delegate. Be conservative initially in doing this, as you will lose control over style and conventions whilst you are making fundamental decisions yourself about how you want the site to look and function. Also, complex linking between sub-webs must be done in absolute versus relative links, and changing back and forth form being a sub-web to being just a folder, and then back to being a sub-web, can mess up some links.
- I recommend that you edit the site "live" from the web host server, and publish backup copies to your "remote" hard drive - rather than modify a stored copy on your "local" hard drive, and then publish it to the web host server. This guarantees that you and your co-authors are working on the latest published version. Also, some FrontPage components, like counters and navigation schemes, do not preserve well on file-based hard drive systems (as they are not supported by FrontPage Server Extensions). When you "publish" a backup copy to your "remote" hard drive, periodically publish it to a new folder with an appropriate name, so you capture a series of backup snapshots to which you could later revert or refer.
- (Advanced) Use of "styles" allows one to make one change on a style sheet, and thus change every page in your web that refers to that sheet - like to change fonts from serif to sans-serif - something I learned too late to use in most of my sites.
- Learn to use "includes" .. this is a great way
to include things like copyright notices on every page.. so if you change
the master included page, every page that has that page included will be
updated. I use that at
http://stealthispicture.com/ for the copyrights on each page bottom.
Insert => Web Component => Included Content - If you want to hide the site before it is ready to go live, you have two choices... (1) you can work on a local hard drive version and publish it later (although others won't be able to review and approve your work remotely, and you will not see things like counters work), or (2) you can password protect the site by going to: Tools => Server => Administration Home and Permissions. Personally, I prefer to let the world see my mistakes in progress and edit all of my sites alive... most people won't even know.
UPDATE 6-7-06:
Microsoft® Expression®
Web Designer to replace FrontPage --
The future of FrontPage
--
Read about the next generation of Microsoft application
building and Web authoring tools... Here is something I just
learned by trial-and-error, and it was not clearly described by
Microsoft -- most hobby users of the new Expression product will
actually still be required to use FrontPage extensions on the server in
order to publish using Expression.
Microsoft announces
http://www.microsoft.com/products/expression/en/ the new replacement (2nd
half 2006) for FrontPage 2003 (FrontPage will not be further developed) --
Microsoft® Expression® Web Designer gives you all the tools you'll need to
produce high-quality, standards-based Web sites the way you want them. Take
advantage of the best of dynamic Web site design, enabling you to design,
develop, and maintain exceptional standards-based Web sites.--
mike [at} mikebaird d o t com