Cyber-Sierra Workshop 2002: Web Site Power

     

Check Your Work

Index |  Basics |  Prepare |  Web 101 |  Anatomy |  Check It >  Resolution |  View Differences | 

 

You've created a page or a whole new web site. Are you ready for the world? Not quite. You need to check your work prior to telling the whole world about it. In fact, you'll find it will save you bundles of time if you establish several check points as you go along, starting with your very first page.

Take your master template and upload it to a test folder on your server (remember it's filename/location).

Check your work.
  • Check how the page looks on several different monitors and laptops.
    Ask friends or coworkers what they think of the page colors. Is the background too intrusive? Is the text easy to read? Do matching colors actually match? How fast does the page load?
     
  • Check how the page looks in several different types of screen resolutions.
    Many people still have smaller monitors and some use web TV. Is your layout still viewable in these different format? You can do check this offline with Browser Sizer. Some screen captured examples illustrate how resolution might impact your layout.
     
  • Check how the page looks in several different types of browsers.
    Some screen captured examples illustrate the viewing differences.
     
  • Validate the HTML code.
    If you are using a WYSIWYG editor, you'll still need to do this step. Buggy code makes pages misbehave in browsers. Validation may be done within some editors (and it's a feature to look for in software). You can use a stand alone program like CSE HTML Validator if you know basic HTML or you can do it online at Net Mechanic. Correcting code errors on the template will save hours of grief trying to locate and repair a site wide mistake.
     
  • Check the page for accessibility compliance at BOBBY.Bobby-check your site for accessibility.
    Again, you may need to know some HTML to correct problems. One solution for meeting 508 compliance is to simply utilize an existing approved web page, changing backgrounds, colors, type sizes or styles, using your own images, etc. as your template. Ask your federal partners (providing their sites are 508 compliant) if you can use one of their pages as a template for your site. Always check borrowed templates prior to making a whole bunch of them.
     
  • Once you are satisfied with the design, use the template to build your pages.
    Check each page for proper code again before uploading it to the server.
     
  • Check navigation.
    If you are using reletive addresses for your site matrix you can check the navigation offline as you go along. If you are using absolute page addresses, you'll have to check the page navigation after uploading to the server.
     
  • Upload to the server.
    After you've uploaded the site, check any links you have that lead to offsite locations.
     
  • Register the site with the major search engines.
    Don't hide your light - get listed by the search engines and include your web site address in all print communications.
     
  • Keep a copy of the entire web site.
    Make sure you have at least one complete offline copy of the web site, just exactly as you have it on the server. If your hosting service dissappears you want to be able to put your site back up immediately.
     
  • Start implementing your update plan timeline.
    Yes, you just finished the site. So when is it due for it's first update and who is responsible for that work?
     
  • Is the site still UP?
    If you are using a hosting service, check daily to see if the site is actually up and running. Don't rely on the host service claim to be "up" 99.9% of the time. Their server may be on and your site may still be down. This isn't something you can reliably check by simply going to the page because of the browser cache. You can do a search for "web site monitoring free" or "website monitoring free" and find free tools and services to help with this all-too-common problem of 'now you see it, now you don't.'
     

Work Tools

  • Browser Sizer
    This nifty free program is very small in size but packs a powerful way to view your site in several different resolutions and two browser formats. It's a great way to check layouts for templates.
     
  • Site Viewer
    View your own site as your visitors do. Check out how your site looks works in a variety of browsers levels. Simply enter your URL.
     
  • Engine Viewer
    See what the search engine sees. Simply enter your URL.
     
  • Delorie HTML Authoring Services
    Delorie Software provides a number of free services to the web community to assist web authors who wish to make their information available to the largest audience. These tools provide alternate ways of viewing your pages, so that you can ensure that your content is received properly by all viewers. Check what the search engines see, backwards compatibility, linx view and more.
     
  • CSE HTML Validator
    Once you've created a web page you should validate the code (i.e. check it for code errors). I use the pro version. I really, really dislike broken code. A brand new lite version is now available. CSE HTML Validator Lite is free and designed for the casual HTML author who doesn't need the full power of CSE Pro, so give it a try. Learn why you should validate your code.
     
  • Dr HTML
    Doctor HTML is a Web page analysis tool which retrieves an HTML page and reports on any problems that it finds. The primary focus of this tool is to provide a clear, easy-to-use report of information that is relevant for improving your Web page. Reports are extensive and very helpful, but do require a basic understanding of HTML.
     
  • W3C CSS Validation Service
    If you are working with CSS (cascading style sheets) here's a way to validate them.
     
  • Net Mechanic
    If you don't like to validate your page offline, you can do it one page at a time online for free. It does help to know some HTML to fix any problems discovered. You can also check page load times and more.
     
  • Validating Access
    A multi-page resource suite that outlines different approaches for evaluating Web sites for accessibility.
     
  • Software Tools for Access
    Tools to help you check if your page is accessible to people with disabilities.
     
  • InternetSeer
    InternetSeer remotely monitors your Web site to insure that customers and visitors have access to your site 24 hours a day, 7 days a week. If InternetSeer is unable to reach your site, they will send you an email message alerting you that your site is offline. You can register to check one url regularly for free.
     
  • Submit-Away
    You can use the free resources here to submit your site to a variety of search engines and topical directories.
     

Color and Graphics:

Colors do not appear the same on every screen. This can become a problem if you are designing on a laptop and your visitors are using regular computer monitors. It's also a problem if you are trying to match an image color to a background. It at all possible, design within the "safe" 216 browser-safe colors.

Graphics can really slow down page loads. Keep in mind that most people do not have fast connections. Try to keep your key page load times down to about 10 seconds on a 26.6 modem speed. If the page takes more than 30 seconds to load chances are your visitor has already moved on (unless they really, really need that information).

  • Colors Article
    All You Need To Know About Web Safe Colors - The Web Developer's Journal
     
  • Boogie Jack's Color Chart
    The 216 browser-safe colors chart and the hexadecimal code for each color is shown below. Try not to use them all on the same page.
     
  • Colors for Webmasters
    Colors4webmasters allows you to play with and try out different colorcombinationwith a few mouseclicks.
     
  • Graphics Crunchers
    Are your pictures too large slowing the page loads? Compress them online for free.
     
  • Gif Works Online
    It's an online GIF image editor. This unique tool is completely on-line -- nothing to download or install. Better yet, it's ABSOLUTELY FREE -- no prepaid tokens or subscriptions.
     
Index |  Basics |  Prepare |  Web 101 |  Anatomy |  Check It | 

 

 

WORKSHOPS: E-Mail and Outreach |  Web 101 |  Building Accessible Webs |  Web Security | 

Workshops Location: http://www.cyber-sierra.com/workshops/
2002 copyright © Cyber-Sierra.Com, on-line since 1997