November 2007 Newsletter
**** The 4specs Perspective
Remember IBM Mag-Card typewriters in 1972? That was truly the days of cut and paste – cut the last paper version with a scissors and paste to a new page, hand write in new text. The typing pool would then type the next version. Today everyone except an older CEO is expected to type his own emails, letters, spreadsheets and presentations.
Many companies use PageMaker or Quark to develop and maintain the original artwork for their brochures and printed literature. In the same way web design is starting to move from outside specialists and the IT department to the marketing staff.
On your next major web site update, make internal updating a top priority. When interviewing web designers, ask how they plan to set up your new web site so you can do your own maintenance and development. Show them some of the 4specs recommendations and see what they think.
https://www.4specs.com/s2a/news/0709_seo.html
(Note that these recommendations are targeted to the $2-25 million a year firm that will not have the resources or complexity that a much larger company will have. My general recommendations apply to larger companies – but the implementation would be different, depending on your resources.)
We recommend that your new site be developed in Dreamweaver, using straight HTML for the majority of the site, turning to a content management system only if you have hundreds or thousands of products that need to be displayed and maintained. Most construction product sites I see are under 150 pages and are easily handled in Dreamweaver. 4specs is over 1,000 pages and is completely developed and maintained in DreamWeaver using most of the recommendations.
As a very long footnote to this newsletter I have specific recommendations that you can use to guide your development, once you decided to go this way. These footnotes are a good starting spot for discussions with your web designer.
--------------------------------------
Colin Gilboy
Publisher - 4specs
Contact us
Recommendations:
1. I recommend Dreamweaver be used as the site manager and design tool. Adobe GoLive apparently has no future development plans after Adobe purchased Macromedia's Dreamweaver.
Dreamweaver is more costly than other options - $399, but you need a web site manager, not a simple HTML editor. CoffeeCup may be a fine HTML editor, but cannot manage moving images and pages as DreamWeaver can.
Microsoft's Expressions Web is another option to consider - $299. 4specs was maintained in EW's predecessor, FrontPage, for many years until FrontPage started to lock up for no apparent reason. I liked FrontPage as it is somewhat simpler to learn than DreamWeaver and has an on-the-fly spell checker lacking in DreamWeaver. While EW has some advantages, the program is missing a few key tools and has a tendency to lock you into Microsoft servers and programs that I see as undesirable, hence the Dreamweaver recommendation.
2. Templates – Develop your site with a home page and one or more templates to standardize the page design and maintenance. A template contains editable areas for each page and uneditable areas that form the standard header, footer and navigation areas of a page. When the master template is edited, every page using the template is updated and ready for uploading.
Tip – The page title will be in an editable area. Manually add a unique description meta-tag in the editable area on each page so you can have a custom title and description for each page. For search engine optimization reasons, do not use a common page description across the entire site within the template.
Note – 4specs was developed using library asset includes for the headers, footers and other standard areas. This is a somewhat different approach than Templates that provides somewhat more flexible customization than the template method. Either way works well. This was the easiest solution when I moved from FrontPage to Dreamweaver in 2002.
3. Pick a DOCTYPE and have the pages validate to W3C HTML Standards. Validating means more consistent visual rendering among different browsers and ensures the code will work into the future - InternetExplorer, Firefox, Safari and Opera. I generally recommend HTML 4.01 Transitional. There are few benefits of the Strict DOCTYPE. 4specs uses XHTML 1.0 Transitional, and that track appears to be dead. HTML 5 is under design but is perhaps 5-8 years out before wide spread adoption by the browsers. (Note 4specs was reedited to HTML 4.01 in early 2008 and then to HTML5 in 2013)
4. Use Firefox with the HTML Validator plug in to check that each page validates - free. When I started to clean up 4specs I found that 4specs had fairly simple types of validation problems that were easy to change on each page. However, it is easier to get it right the first time.
https://addons.mozilla.org/en-US/firefox/addon/html-validator/
5. Chose a better FTP program to upload your changed files. While DreamWeaver has a built in FTP program to upload changed pages, it is slow and requires a complete download of the directory of server files each time you update. [2/09 - changed the recommendation] Site Publisher tracks what is on the server and quickly uploads only the changed pages - I use it all the time. $50 for a single copy.
[2013 - 4specs now uses Web Site Publisher]
6. Photoshop Expressions - $99 – will easily manage the images for a web site. Photoshop CS is only required if you do heavy image manipulation for printed materials. I generally save the images for the web as JPG Medium and the images are small and fast to load yet still attractive.
7. Ensure sure your web server sends the appropriate headers including the If-Modified-Since HTTP header and 404 headers for missing pages. This and other Google recommendations can be found here:
https://support.google.com/webmasters/
8. Add a sitemap to help the search engine robots. Add the sitemap to your robots.txt file to alert Yahoo and MSN. Use the sitemap to restrict the robots from areas you do not want indexed that are publically available.
https://www.4specs.com/s2a/news/0602_sitemaps.html
9. Check your internal and external links. I use Xenu every month to check all the links on 4specs - free. I can check 14,000 links in about 2 hours and get them corrected. Great way to be sure your web site does not have any internal problems and the external links work.
http://home.snafu.de/tilman/xenulink.html
9. No session ids in the URL, no cookies from your site unless you really need them. Some think that cookies provide better tracking information. In my opinion the information is not critical. Let Google set the cookie and do the tracking. Unless you have a shopping cart, you do not need your own cookies.
10. Set up Google Analytics in the template at the bottom of the pages in the Template - free. Also run a server based analysis program (I use Analog - free - [website no longer available]) to look for missing pages and images (which Google Analytics cannot track) and to verify that the search engine robots are visiting your site. Google cannot track this information.
https://www.4specs.com/s2a/news/0706_google_analytics.html
11. CSS is a great way to set up navigation rather than linked images. I recently changed the 4specs navigation headers from tables to CSS and simplified the code. Here is some CSS ideas you can adopt for navigation. I used them as a starting place to develop new headers for 4specs in late 2007.
[website no longer available]
--------------------------------------
Colin Gilboy
Publisher - 4specs
Contact us