SENS Web Style Guide

Resources & Links

This is a list of links to helpful resources for developing web sites according to current web standards--the guidelines established by the World Wide Web Consortium (W3C) for text markup and page layout, and to a lesser extent, for creation of graphics and scripts.

General Web Design

  • Web Design References, from the University of Minnesota, Duluth. An excellent, comprehensive guide to good web design.

Tools

There are many excellent (and not-so-excellent) tools for web production available, both commercially and free. This is a short list, but expect to see many more free and inexpensive tools added soon.

Suites

Both of these are available with educational discounts from UBMicro.

  • Macromedia Studio MX/MX 2004 - includes Dreamweaver, Fireworks, Flash, and Freehand. Highly recommended.
  • Adobe Creative Suite Premium - includes Photoshop CS, Illustrator CS, InDesign CS, GoLive CS, Acrobat 6.0 Pro, and Version Cue. While Photoshop is the standard for graphic editing, GoLive includes some features that are not supported on the SENS servers.

HTML editing software

  • Macromedia Dreamweaver - a popular WYSIWYG editor (check UBMicro for current educational pricing)
  • Mozilla Composer - a free WYSIWYG editor from Mozilla
  • EvrSoft FirstPage, http://www.evrsoft.com/ - a sophisticated, full-featured free text editor
  • Microsoft FrontPage 2003 - a WYSIWYG editor (free to UB students, faculty, and staff through the Microsoft Campus Agreement)
    PLEASE NOTE: older versions of FrontPage do not necessarily create web pages that meet the SENS Web Guidelines. If you are going to use FrontPage, please use FrontPage 2003.

Graphics editing software

  • Adobe Photoshop - software for editing existing images (available at UBMicro)
  • Adobe Photoshop Elements - kind of like Photoshop Light. Shallow learning curve but excellent results. Highly recommended for those who don't need all the features of Photoshop.
  • Adobe Illustrator - a vector-based drawing program that lets you create new images using lines and shapes
  • Macromedia Fireworks - software for editing existing images, optimized for web use
  • Macromedia Freehand - vector-based drawing software
  • The GIMP - an open-source Linux application similar to Photoshop Elements

Browsers

It's always a good idea to test your web sites on a variety of operating systems and browsers.

Web Standards

  • The Importance of Web Standards, from SitePoint
    A very readable article that goes into a fair amount of detail about the specifications that make up the standards.
  • Real World Style: a Three-Legged Stool, from Real World Style
    A brief and clear article that explains three major components of the standards: XHTML, CSS, and accessibility.
  • Why Web Standards Matter, by Carrie Bickner in Library Journal.
    A thorough coverage of web standards, written with library web sites in mind but applicable to any kind of site.
  • Web Standards FAQ, from the Web Standards Project (WaSP)
    Everything you ever wanted to know about web standards, and then some.

HTML (HyperText Markup Language)/XHTML (eXtensible HyperText Markup Language)

  • Basic Tags for a Web Site, from About.com
    The bare minimum that you need for your site to display at all, in any browser. A good place to start.
  • XHTML overview at the W3C
    Still probably the best description of XHTML, from the folks who should know it the best.
  • XHTML Guidelines, from the NYPL Style Guide
    Some very good, no-nonsense guidelines for using XHTML.

CSS (Cascading Style Sheets)

  • What is CSS? from Create Web Magic
    One of the best, simplest explanations of CSS I've seen. Even New Media majors should be able to understand this.
  • So You Want Cascading Style Sheets, Huh? from HTML Goodies
    Another good overview from one of the pioneers of web tutorials, Joe Burns.

Accessibility

  • Building Accessible Web Sites, by Joe Clark
    Joe Clark, probably the top authority on web accessibility, has a wealth of information about accessibility, including the entire text of his well-reviewed book (click on "Read Online")
  • Accessify
    Another treasure trove of accessibility information.
  • Web Content Accessibility Guidelines
    The guidelines you must follow if you're developing a site for a New York State institution (such as the University at Buffalo, for example).
  • Section 508
    The complete text of Section 508, including links to other relevant laws.
  • A Primer for Accessible Web Pages, from O'Reilly
    A good explanation of why Section 508 exists, and how the things you do to your web sites make them compliant (or not).

Usability

  • Usability.gov, from the National Cancer Institute
    The most comprehensive site I've found for issues of usability and accessibility.
  • Useit.com
    Many years of usability articles from usability guru Jakob Nielsen.

Tutorials and Online Learning

  • W3Schools
    Excellent free tutorials on nearly everything related to the World Wide Web.
  • Westciv
    More excellent tutorials for standards-compliant development, some free, some not.
  • Dive Into Accessibility, from Mark Pilgrim
    More a book than a tutorial, but can be read either way.
  • HTMLSource
    Great tutorials on topics not found elsewhere.
  • CSS 101
    The basics of CSS from Create Web Magic, who brought us the overview linked to above.
  • CSS From the Ground Up
    A step-by-step guide to getting started with CSS.

Code Reference

The W3C Recommendations

  • How to Read the W3C Spec, from A List Apart
    Good advice from A List Apart, probably the best source of articles about standards-compliant web design.
  • HTML 4.01
    The official recommendation for the latest version of HTML from the W3C.
  • XHTML 1.0
    The official recommendation for XHTML from the W3C.
  • CSS 1
    The official recommendation from the W3C for CSS Level 1. While CSS 2 is actually the current recommendation, CSS 1 is a good safe alternative that's supported by most browsers--even Netscape 4.xx, to some extent.
  • CSS 2
    The official recommendation from the W3C.

HTML/XHTML

  • XHTML 1.0 Reference, from W3Schools
    A very good reference. You can click on the name of the tags for more information.
  • HTML Cheat Sheet, from Webmonkey
    A good explanation of the most commonly used HTML tags.

CSS

  • The Westciv Browser Support Charts
    A comparison of which CSS properties and attributes are supported by which browsers. Invaluable for developing web sites that are cross-browser compatible.
  • CSS Properties, from the Web Developers Group
    One of the oldest and still one of the best references for CSS properties.

Writing for the Web

  • Be Succinct!
    A nice short article by Jakob Nielsen on keeping your web copy readable.
  • Writing for the Web
    An excellent guide by Jakob Nielsen, from Sun Microsystems
  • Web Teaching: Writing for the Web
    Specifically for college-level educators, this guide from Dartmouth offers some great advice on transferring your course content to the web.

Copyright & Plagiarism

Validation Tools

  • Bobby, the accessibility validator
    Tells you what parts of your site might not be accessible. Bobby is kind of like a spellchecker--okay, but not as reliable as an actual human. However, many people find it useful.
  • The W3C Markup Validator
    The W3C validator tests your documents and makes certain that your code meets the standards you've said you're using. A great tool.
  • The W3C CSS Validation Service
    Still a little buggy, and I've seen some horrible CSS that technically validates, but it can be useful for catching errors.

Showcase Sites

  • CSS/Edge
    Nifty CSS tricks from Eric Meyer, who literally wrote the book on CSS. Some of these were "edgier" before the latest browsers caught up with the current CSS recommendation, but they're still impressive.
  • CSS Zen Garden
    Sheer inspiration. CSS Zen Garden is one HTML page with many, many different style sheets designed by professional graphic designers. The HTML never changes; only the CSS.
  • New York Public Library
    There's a perception that only geeky tech-heads want to--or can--develop standards-compliant sites. The NYPL web site is usable, interesting, and standards-compliant, and it's maintained by a bunch of librarians of varying levels of technological expertise.
 

This page, resources.php, last modified: August 26, 2008