+++ WEB DESIGN UPDATE. - Volume 4, Issue 49, May 25, 2006. An email newsletter to distribute news and information about web design and development. ++ISSUE 49 CONTENTS. SECTION ONE: New references. What's new at the Web Design Reference site? http://www.d.umn.edu/goto/webdesign/ New links in these categories: 01: ACCESSIBILITY. 02: CASCADING STYLE SHEETS. 03: COLOR. 04: EVALUATION & TESTING. 05: EVENTS. 06: JAVASCRIPT. 07: MISCELLANEOUS. 08: NAVIGATION. 09: PHP. 10: STANDARDS, GUIDELINES & PATTERNS. 11: TOOLS. 12: USABILITY. SECTION TWO: 13: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. To Hell With WCAG 2 By Joe Clark. "...WCAG 2 is not too broken to fix, but we have no reason to think the WCAG Working Group will actually fix it. The Working Group is too compromised by corporate interests, too wedded to the conclusions we see in the current 'draft,' too broken in general. What you see in WCAG 2 now is pretty much what you're gonna get-permanently. As such, WCAG 2 will be unusable by real-world developers, especially standards-compliant developers. It is too vague and counterfactual to be a reliable basis for government regulation. It leaves too many loopholes for developers on the hunt for them. WCAG 2 is a failure, and not even a noble one at that..." http://alistapart.com/articles/tohellwithwcag2 WCAG 2.0 - A Failure In The Making? By Mel Pedley. "I currently have no idea who this document was written for. Perhaps it was written to satisfy stakeholders within the Working Group as it certainly doesn't seem to be useful to those of us who are actually out there developing sites...In it's present state, WCAG 2.0 is likely to do more damage than good." http://www.blackwidows.org.uk/wpress/?p=58 Let the Buyer be Aware: The Importance of Procurement in Accessibility Policy By Cyndi Rowland. "Creating a web accessibility policy has become a common approach taken by education institutions and others (e.g., local, state, and federal government agencies, and businesses). Adding procurement systems into a policy is an important consideration for any organization..." http://ncdae.org/policy/procurement.cfm Accessible Layouts By Alastair Campbell. "...The best options for accessibility are still either a liquid layout...or an 'elastic' layout, which flexes up to a point, but then stops. If you want a black and white rule, then use relative units..." http://alastairc.ac/2006/05/accessible-layouts/ Usable and Accessible Form Validation and Error Recovery By Jared Smith. "Form validation is the process of testing to ensure that end users enter necessary and properly formatted information into web forms. Error recovery is the process of guiding the user through fixing missing or improper information as detected by the form validation. There are several methods of performing form validation and error recovery. These methods can typically be categorized as being, server-side - the form information is submitted and analyzed by the web server through some scripting language (such as PHP, JSP, Perl, etc.) with necessary feedback messages being written to a new, dynamically generated web page, or client-side - form validation and error recovery mechanisms are performed within the browser using a client scripting language (such as JavaScript or VBScript). There are advantages to each method..." http://webaim.org/techniques/formvalidation/ Showing Good Form: Beyond the Basics of Accessible Web Forms By Catherine M. Brys and Wim Vanderbauwhede. "...To create accessible forms, we need to use labels, legends and
tags appropriately. These elements allow screen readers to interpret the relationship between a form element and the corresponding textual information. Simple forms consisting of only input fields and text areas can be laid out using a data table. When using sets of radio buttons or checkboxes, however, the legend and the options should not be separated by putting them in different table cells. Questionnaires often require nesting of form elements - this is for example the case when a question is depending on the answer to another question. These form elements must then be nested correctly in order for the questionnaire to be accessible." http://www.accessiblecontent.com/online/v2n1/index.php?view=forms1 Accessible Web Forms: Beyond the Basics - Part 2 By Catherine M. Brys and Wim Vanderbauwhede. "...Looking beyond simple web forms, the challenge in making form accessible is not so much in combining the accessible code for the different form building blocks but in presenting the information in the way which makes most sense to users and prevents misinterpretation. Web developers should think about the needs of the different accessibility user groups when designing forms. If possible, testing the initial design with users is recommended to discover potential problems. The techniques presented in this article give web developers a good starting point in designing accessible web forms." http://www.accessiblecontent.com/online/v2n1/index.php?view=forms2 +02: CASCADING STYLE SHEETS. Liquid Image By Michel Fortin. "Look at the main page of this web site, you will find a photo of me. This image seems pretty normal at first glance, but it has one special feature: if you resize your browser window you can see the photograph's dimensions adapts to the new column width. Let me explain how this has been done. We call 'liquid' a web site design that adapts itself to the browser window's size. The image is liquid because its size changes too when the containing column size changes. This is how we do it..." http://www.michelf.com/weblog/2005/liquid-image/ Experiments with Wide Images By Richard Rutter. "Probably the biggest problem with liquid layouts is how to contain and display fixed width elements such as images and flash movies. Inherently with a liquid layout one never knows how wide a container will be. This can lead to situations where an image is wider than its container and breaks the layout. These are attempts to show wide images in a variable width column, using CSS techniques to shrink or crop the image." http://www.clagnut.com/sandbox/imagetest/ Conditional Comments in CSS By Alastair Campbell. "With the advent of Internet Explorer 7 (IE 7), there is now little choice but to create separate style sheets for different browsers, at least for a moderately complex visual design or layout. This post explores the need for change, and where this approach could go." http://alastairc.ac/2006/05/conditional-comments-in-css/ Using the Universal Selector By Andrea Arbogast. "The CSS universal selector, denoted by the asterisk (*), selects any element in the document. Using it in combination with other CSS selectors can lead to some powerful results. I have listed two of my favorite techniques here..." http://bitesizestandards.com/bites/using-the-universal-selector +03: COLOR. Colour with Contrast By Ann McMeekin. "Want to make sure your site is readable by the widest possible audience without being 'boring' and 'ugly' but aren't sure how? A selection of tools are now available to help you choose colours or check the colours you've been given to provide adequate contrast. Using these at the very earliest stages of the design process could save you potential headaches later." http://bitesizestandards.com/bites/colour-with-contrast Shades of Accessibility By Etre. "Here's a quick example of how to make colour-coded information accessible to colour-blind users..." http://www.etre.com/blog/2006/05/shades_of_accessibility/ +04: EVALUATION & TESTING. Chinese Banks Homepage Usability By Ming Zhao. "This study assesses the usability of homepages of three leading Chinese retail banks from a user's perspective..." http://www.apogeehk.com/research_chinese_banks.html +05: EVENTS. An Event Apart Chicago June 2, 2006. Chicago, Illinois U.S.A. http://www.aneventapart.com/news/2006/03/an_event_apart_chicago.php New York PHP Conference and Expo 2006 June 14-16, 2006. New York, New York U.S.A. http://www.nyphpcon.com/ AusWeb 05 July 1-5, 2006. Sunshine Coast, Australia http://ausweb.scu.edu.au/ O'Reilly Open Source Convention 2006 July 24-28, 2006. Portland, Oregon http://conferences.oreillynet.com/os2006/ +06: JAVASCRIPT. Adobe's Spry Framework for AJAX By Drew McLellan. "Adobe Labs have introduced a preview of their new Spry Framework for AJAX, which aims to demystify AJAX for a non-technical audience. Adobe are attempting to enable anyone with basic HTML, CSS and JavaScript skills to be able to harness the power of AJAX within their pages. Sadly, at this initial stage it seems that the goal of easy-of-use has been held higher than even the most basic principals of valid markup and accessibility best practice. Opting to make implementation as simple as possible, Spry uses custom attributes and old-school obtrusive JavaScript techniques, welding the behaviour layer firmly to the content..." http://www.webstandards.org/2006/05/12/adobes-spry-framework-for-ajax/ Community Creators, Secure Your Code! Part II By Niklas Bivald. "In part two of his two-part series on protecting your community site from malicious cross-site scripting attacks, Niklas Bivald rolls up his trousers and wades into the JavaScript." http://www.alistapart.com/articles/secureyourcode2 +07: MISCELLANEOUS. Web Inventor Warns of 'Dark' Net By Jonathan Fildes. "The web should remain neutral and resist attempts to fragment it into different services, web inventor Sir Tim Berners-Lee has said. Recent attempts in the US to try to charge for different levels of online access web were not 'part of the internet model,' he said in Edinburgh. He warned that if the US decided to go ahead with a two-tier internet, the network would enter 'a dark period'." http://news.bbc.co.uk/1/hi/technology/5009250.stm +08: NAVIGATION. The 30 Second 'Search Engine Optimization' Check By Drew Yates. "Search engine traffic is vital to any web-based marketing. But are you concerned that your business's web site is not optimized for the best search rankings? Try this quick exercise..." http://www.fizbang.com/9-18-05.php Increase Site Traffic with Search Engine Optimization By Tony Patton. "Search engine optimization (SEO) has ballooned over the past few years into a quasi-science for increasing a site's visibility. Surprisingly, the techniques utilized in SEO are basic and often utilized Web standards." http://builder.com.com/5100-6371_14-6074912.html +09: PHP. Locking Down Your PHP Applications By Thomas Myer. "You know security is important, but the tendency is to put off adding security until the last minute. It's impossible to secure a Web application completely -- so why bother, right? Wrong. You can take some easy steps to make your PHP Web application orders of magnitude more secure." http://tinyurl.com/njct3 Managing Sessions and State with PHP By Brian Fioca. "HTTP is stateless. If you've ever written a web application where user data matters, you know that managing that data can be troublesome. There are two kinds of data, though: page and session data. Understanding the differences can help you develop better and more easily." http://www.onlamp.com/pub/a/php/2006/05/18/managing-sessions-and-state.html Simple Optimization for PHP and MySQL "Here is a list of a few very simple tips for optimizing your php/mysql applications. Keep these in mind while developing..." http://www.dublish.com/articles/10.html +10: STANDARDS, GUIDELINES & PATTERNS. World Grows Small: Open Standards for the Global Web By Molly E. Holzschlag. "Molly Holzschlag explains how the practices you already use to create standards-based, accessible websites can serve you in the growing field of internationalization." http://www.alistapart.com/articles/worldgrowssmall Design Patterns: Part 1 By Luke Wroblewski. "What do we mean by 'design patterns'?" http://www.lukew.com/ff/entry.asp?348 Design Patterns: Part 2 By Luke Wroblewski. "Bill and Martijn both did a great job articulating the differences between general design patterns (principles) and prescriptive design solutions (guidelines). So I won't chime in with yet another set of definitions. Besides, what's interesting to me is the context and implications of the origins and usage of both types of patterns..." http://www.lukew.com/ff/entry.asp?349 +11: TOOLS. View Source Chart (Firefox Extension) By Jennifer Madden. This Extension "Creates a colorful chart of a web pages rendered source code and displays source in its altered state after the DOM has been manipulated by JavaScript." http://jennifermadden.com/scripts/ViewRenderedSource.html Safari Tidy plugin By Kasper Nauwelaerts. "The Safari Tidy plugin is a small plugin that lets you validate the webpages you browse for (x)html compliance. The actual validation is done by Tidy. This plugin was modeled after a similar plugin for Firefox..." http://zappatic.net/safaritidy/ +12: USABILITY. Usability Book of Knowledge By Usability Professionals Association. "The Usability Body of Knowledge (BoK) project is dedicated to creating a living reference that represents the collective knowledge of the usability profession. Preliminary work has started, but there is more to do. This website introduces the subject areas that will eventually be included in the Usability Body of Knowledge and a preview of what is to come." http://www.usabilitybok.org/ The Page Title and Description: Write them Well By Nick Usborne. "It is tempting sometimes to pay a great deal of attention to the sales text or content on a web page, and then just scribble off the page title and description. Or maybe you don't write them at all. Maybe someone in IT adds the title and page description for you. Big mistake. Every page title and description on your site in enormously important, from the point of view of both the search engines and your readers." http://www.excessvoice.com/article100.htm Choose Customer Words, Not Organization Words By Gerry McGovern. "...Never, ever start a sentence or heading on your website with the name of your organization. Kill all redundant phrases such as "are pleased to announce". Cut the self-congratulatory waffle. You're not a monarchy and the Web is certainly not the nirvana for vanity publishers. Lead with the need. Get to the point...Stop. Think. Who are you publishing for and where will they read this? Use their language, their words, understand their context. Otherwise, you may end up publishing for yourself. And nobody reads you." http://www.gerrymcgovern.com/nt/2006/nt-2006-05-22-customer-words.htm More On Salary By Gender By Paul Sherman. "The data suggest that yes, Virginia, there is a gender differential in our field. The silver lining (if it can be called that) is that the disparity seems to be less than the average (as measured in the US by the Census Bureau and the BLS), and less than the disparity in other professional occupations." http://www.usabilityblog.com/blog/archives/2006/05/more_on_salary.php [Section one ends.] ++ SECTION TWO: +13: What Can You Find at the Web Design Reference Site? Accessibility Information. http://www.d.umn.edu/goto/accessibility Association Information. http://www.d.umn.edu/goto/associations Book Listings. http://www.d.umn.edu/goto/books Cascading Style Sheets Information. http://www.d.umn.edu/goto/css Color Information. http://www.d.umn.edu/goto/color Dreamweaver Information. http://www.d.umn.edu/goto/dreamweaver Evaluation & Testing Information. http://www.d.umn.edu/goto/testing Event Information. http://www.d.umn.edu/goto/events Flash Information. http://www.d.umn.edu/goto/flash Information Architecture Information. http://www.d.umn.edu/goto/architecture JavaScript Information. http://www.d.umn.edu/goto/javascript Miscellaneous Web Information. http://www.d.umn.edu/goto/misc Navigation Information. http://www.d.umn.edu/goto/navigation PHP Information. http://www.d.umn.edu/goto/php Sites & Blogs Listing. http://www.d.umn.edu/goto/sites Standards, Guidelines & Pattern Information. http://www.d.umn.edu/goto/standards Tool Information. http://www.d.umn.edu/goto/tools Typography Information. http://www.d.umn.edu/goto/type Usability Information. http://www.d.umn.edu/goto/usability XML Information. http://www.d.umn.edu/goto/xml [Section two ends.] ++END NOTES. + SUBSCRIPTION INFO. WEB DESIGN UPDATE is available by subscription. For information on how to subscribe and unsubscribe please visit: http://www.d.umn.edu/goto/webdevlist The Web Design Reference Site also has a RSS 2.0 feed for site updates. + TEXT EMAIL NEWSLETTER (TEN). As a navigation aid for screen readers we do our best to conform to the accessible Text Email Newsletter (TEN) guidelines. Please let me know if there is anything else we can do to make navigation easier. For TEN guideline information please visit: http://www.headstar.com/ten + SIGN OFF. Until next time, Laura L. Carlson Information Technology Systems and Services University of Minnesota Duluth Duluth, MN U.S.A. 55812-3009 mailto:lcarlson@d.umn.edu [Issue ends.]