+++ WEB DESIGN UPDATE.
- Volume 5, Issue 23, November 28, 2006.

An email newsletter to distribute news and information about web design and development.

++ISSUE 23 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: TYPOGRAPHY.
13: USABILITY.
14: XML.

SECTION TWO:
15: What Can You Find at the Web Design Reference Site?

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Designing Forms for Keyboard Access
By Sarah Horton.
"Forms are what make web communication a dialogue rather than a monologue. Through forms, we converse-we pose questions, make requests, tell about ourselves. To engage in a web-based conversation, we must be able to fill out and submit forms. Otherwise, we're back to a monologue, and what fun is that?..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=243&rl=1

Implicit and Explicit Form Label Test
By Trevor Morris.
"Does simply having the for attribute constitute explicit association? Or does nesting an input within a label mean an implicit association?"
http://www.trovster.com/form-label.php

Designing Data Tables
By Sarah Horton.
"In this article, I take a fresh look at table design, covering both the challenges of working within the constraints of the screen and the markup that can be used to help provide table structure."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=295&rl=1

Designing Accessible Audio
By Sarah Horton.
"...Accessible audio is a perfect illustration of the broad benefits of universal design because access to equivalent text is helpful for everyone. A text transcript can be read and indexed by software, making audio- and video-based content easier to find. Users who have technical issues with Web-based media (slow Internet access, software incompatibilities, and so on) can access the information via the text transcript. Also, a text transcript is an effective way to convey information, and may be more efficient than audio alone, since reading is faster than listening-meaning that people reading a transcript may understand the information better and faster. So how do you go about putting into text the information contained in an audio recording? Keep reading to find out, and to learn what to do with a transcript once you have one..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=254&rl=1

Designing Accessible Text-Part 1: Structure
By Sarah Horton.
"Done right, web text has layers of meaning that are not visible on the page. With its roots in text encoding and Standard Generalized Markup Language (SGML), Hypertext Markup Language (HTML) offers designers a basic toolset of structural tags for use in categorizing document elements. We use these tags to assign significance to particular words and phrases, including headings, lists, and tables. Web pages with this functional layer are more than screen deep-they can be read and interpreted by users who never see the rendered screen. For example, we commonly differentiate page and section headings by using spacing and typographic emphasis (such as variations in weight, size, color, and typeface)-but this essential information is accessible only to users viewing the page. When headings are differentiated in the page code using heading tags, non-visual users can also gain access to the information hierarchy of the page..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=260&rl=1

Designing Pages for Linear Access
By Sarah Horton.
"...When we talk about web design, we tend to focus on how aspects of the surface layer affect usability-color, type, layout. In this article, I look below the surface at how attention to source code design-specifically, document order-can improve linear access to web pages..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=288&rl=1

WCAG 2 Activity on Cognitive Disability
By Joe Clark.
"This page will act as a repository of documents on the WCAG Working Group's activities concerning cognitive disability (dyslexia and the like) under WCAG 2."
http://joeclark.org/access/webaccess/WCAG/cognitive/

How-Tos and Demos
By University of Texas.
"Learn to build accessible forms, images, multimedia, data tables and more. See (and hear) examples and look at the code."
http://www.utexas.edu/research/accessibility/resource/

Access 2.0 Blog
By Paul Crichton.
"We'll be assessing the latest developments in and outside of the BBC, raving about the good, railing against the bad and reviling the fugly along the way. But en route, we'll be looking at real disabled people, how they use the net, how they want to use the net, and throwing in things that fascinate and interest us in terms of blue skies accessible tech thinking for the digital future."
http://www.bbc.co.uk/blogs/access20/

What's New in JAWS 8.0
By Steve Faulkner.
"JAWS 8 is on its way, which is a good reason to take a look at its new features..."
http://ability.aol.com/ability/index.php?ID=168&catID=7

User-Center, Standards-Driven Web Accessibility
By Jared Smith.
Jared's Refresh06 conference slides for his presentation are available in Acrobat and HTML formats.
http://webaim.org/presentations/refresh06


+02: CASCADING STYLE SHEETS.

10 Steps to CSS Success: Browser, User, Author
By Molly Holzschlag.
"CSS is a technical language. But, it's meant to address many aspects of presentation. In other words, it's a technology for designers-and therein lies the challenge with those who set out to learn it..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=242&rl=1

Like Mother Like Child: A Look at Inheritance in CSS
By Molly Holzschlag.
"That we inherit certain features from our parents is a given. I look very much like my father did, and my coloring is more like his was as well. From my mother, I got a head of wild curly hair and my physical stature. Think for a moment what obvious features you've inherited from your parents-even your grandparents! If you have children, consider which features they've inherited, too. If there are any grandparent Web developers out there, well what a fantastic opportunity to see the power of inheritance in your family tree!..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=247&rl=1

Using Specificity to Resolve Conflicts
By Molly Holzschlag.
"There have been countless times prior to learning about specificity that I found myself shaking my fist at myself, Web browsers, and at CSS itself. There I'd be, trying to figure out why a style rule that I'd checked and checked again wasn't being applied properly..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=252&rl=1

Box Model Mastery
By Molly Holzschlag.
"Box Model Mastery takes a look at how to understand the box model, which is the browser's model as to how it generates boxes for elements. With CSS, you can then control those boxes by modifying their margins, borders and padding to obtain space and style as well as move the boxes around the page..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=263&rl=1

Breaking Out of the Box: Using Abstract Thought to Inspire Progressive Web Design
By Molly Holzschlag.
"The Web standards movement of the past seven years has done a great deal to promote best practices in how we approach our site designs. However, the emphasis on code has been extreme: We've had to learn complex aspects of markup and CSS and while this knowledge has been critical, it's outside the interest area and even comfort zone of many designers, who want to focus on what they do best: convey information visually..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=268&rl=1

Transcendent CSS: Creating the Aesthetic Web
By Molly Holzschlag.
"For those folks working with Web standards, particularly CSS, the road's been a bit of a difficult one. We've faced a lot of challenges and continue to face them. But there's hope on the horizon, lots of hope. This hope has emerged from the hard work of many people who are attempting to transcend the technical problems and create great Web sites. Our joint goal is to create sites that are structurally sound, accessible, usable, and designed with aesthetic appeal for multiple platform use including screen, print, and wherever possible, mobile devices."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=276&rl=1

Wake Up and Smell the IE7!
By Simon Griffin.
"In the second part of his series, Simon Griffin delves into the specifics of what IE7 means for your page content and styling."
http://www.thinkvitamin.com/features/design/wake-up-and-smell-the-ie7/

CSS Rounded Corners 'Roundup'
By Christian Watson.
"This collection of techniques to create boxes with rounded corners using CSS has become quite popular. The problem now is there are so many choices it's hard to know which one to choose."
http://www.smileycat.com/miaow/archives/000303.html

Building Your First CSS Site
By Michael Koch.
"Get pointers on how to move from building table-based websites to building CSS sites..."
http://www.adobe.com/devnet/dreamweaver/articles/first_css.html

Comparison of CSS Layout Engines
By Wikipedia.
"The following tables compare CSS compatibility and support for a number of layout engines. Please see the individual products' articles for further information. This article is not all-inclusive or necessarily up-to-date. Unless otherwise specified in footnotes, comparisons are based on the stable versions without any add-ons, extensions or external programs."
http://en.wikipedia.org/wiki/Comparison_of_layout_engines_%28CSS%29

How to Structure Large CSS Files
By Emil Stenstrom.
"Many methods exist to structure your CSS. This article tries to describe the method I use. I call it the 'Tree method', since it structures the CSS like...that's right, a tree structure. I want to stress that it isn't my invention; I just describe and give reasons for its rules..."
http://friendlybit.com/css/how-to-structure-large-css-files/

Inline Image Quotes
By Natalie Downe.
"I have been meaning to write about this technique for some time now. The aim is a block quote...with speech marks at the front and termination of the text but without the nastiness of inline images..."
http://notes.natbat.net/2006/11/21/inineimagequotes/


+03: COLOR.

Designing Accessible Text-Part 3: Color
By Sarah Horton.
"Color is a powerful design tool, and one of the easiest ways to jazz up a Web site. Color adds visual interest, draws the eye, and communicates information to the user. On the Web, color is free, with thousands of colors available at the flick of a hex code. So color is great! But like all good things, color must be applied with caution. Designers often over- or misapply color to the point of reducing the usability of their designs..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=277&rl=1

Easy Color Picking on the Mac
By Kevin Hale.
http://particletree.com/notebook/easy-color-picking-on-the-mac/


+04: EVALUATION & TESTING.

Eye-Tracking Studies at Google
By William Slawski.
"Even on a simple level, shouldn't the way someone looks at search results pages be different if the type of search was for different purposes? Say, for instance, a navigational search as opposed to an informational one, or a transactional one?"
http://www.seobythesea.com/?p=365


+05: EVENTS.

Section 508 Monthly Lunch and Learn Sessions
Also participation through a teleconference hook-up.
Washington, D.C.  U.S.A.
http://www.access-board.gov/sec508/training.htm

Accessible On-Line Services, A Benefit For All
January 29, 2007.
Paris, France
http://www.braillenet.org/colloques/services/index-en.htm

Engineering Interactive Systems 2007
March 22-24, 2007.
Salamanca, Spain
http://www.se-hci.org/ehci-hcse-dsvis07/call-for-contribution.html

International Conference on Information and Communication Technology and Accessibility
April 12-14, 2007.
Hammamet, Tunisia
http://www.esstt.rnu.tn/utic/tica2007/


+06: JAVASCRIPT.

Video: Douglas Crockford: 'Advanced JavaScript'.
"...Those who enjoyed Douglas's deep-dive into the DOM may be interested also in his 'Advanced JavaScript' presentation, now publicly available on Yahoo..."
http://yuiblog.com/blog/2006/11/27/video-crockford-advjs/

The Re-emergence of JavaScript
By Faruk Ates.
"It's been almost 10 years since the days of "DHTML madness," a time when the term DHTML-dynamic HTML, referring to JavaScript-was used by every marketeer jumping in on the booming Internet industry. DHTML was going to "push the Web forward" and as such, every company that claimed to use it was likely to receive good amounts of venture capital. Then the big Internet boom went bust. Over the years that followed, JavaScript earned itself a terrible reputation. This lousy rep was due in large part to the countless "plug-and-play" scripts that brought interaction to Web sites..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=275&rl=1

Names and IDs
By Jeremy Keith.
"With Internet Explorer 7 out the door with greatly improved CSS support, the IE development team can now turn their attention towards improving the browser's JavaScript..."
http://domscripting.com/blog/display/90

Important Facts About JavaScript and Related Technologies
By Christian Wenz.
"This chapter presents not only the most important facts (and phrases) regarding JavaScript, but also related technologies, especially XML handling with JavaScript."
http://www.informit.com/articles/article.asp?p=669066&rl=1

AJAX Tips and Tricks
By Kris Hadlock.
"If you're developing in AJAX, author Kris Hadlock has a few tricks you can use to avoid common issues and speed up your AJAX development time. This article shows you how to prevent cached AJAX requests, debug AJAX code with FireBug, and create a database connection."
http://www.informit.com/articles/article.asp?p=669599&rl=1


+07: MISCELLANEOUS.

Interview with Patrick H. Lauke
By Dennis Lembree.
"This is the transcript of my interview for Web Axe - Practical Web Design Accessibility Tips, conducted by Dennis Lembree."
http://www.splintered.co.uk/documents/presentations/webaxe_29.10.2006/


+08: NAVIGATION.

Designing Navigation with Lists
By Sarah Horton.
"On the surface, navigation appears to have been overlooked by the originators of the web. There is no NAV tag to mark a navigation block and no LINK tag to identify individual links. But let's take a step back and think more broadly about navigation. What is navigation if not a list of links? And don't we have tags for marking up lists? Of course we do-our friends, UL and LI..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=234&rl=1

Avoiding the 5 Most Common SEO Mistakes
By Johnathon Smith.
"Are your SEO efforts hampered by any of the 5 most common SEO mistakes? They're not difficult to rectify ... once you know what they are! Johnathon explains them clearly, and shows you how to correct them, in this hands-on tutorial."
http://www.sitepoint.com/article/most-common-seo-mistakes


+09: PHP.

Adding Functionality: Scripted CSS
By Dave Shea.
"CSS was originally designed as a styling language, with an emphasis on keeping the syntax simple and as non-programmatic as possible. Doing it this way encouraged adoption by designers who didn't get programming, while limiting those of us who want to take it further. Luckily, we can mix and match server-side scripting with CSS for powerful results. While this article will use PHP for the examples, I'll try and explain the basic concepts in a general enough fashion that you can adapt the principles for ASP, Cold Fusion, or any other server-side language..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=265&rl=1

Database-Enabled Ajax with PHP
By Kris Hadlock.
"Ajax has taken the Web to a new level by offering an intuitive interactive model that rivals the desktop. To compete with desktop applications, you'll learn how to create database-enabled Ajax requests using PHP and MySQL."
http://www.webreference.com/programming/javascript/kh/index.html

Securing PHP Include Files
By Mike Cherim.
" One of the great things about the PHP server-side scripting language is the ability to 'include' files. Using includes you can share files across several pages. For example, if you're not using a functions library to handle global page sections, you can create a file called header.php, put some variable hooks in it to handle a dynamic title, keyword set, and description, then use this one file for all your web pages. This can save a tremendous amount of initial work when creating a site, plus it can greatly reduce maintenance down the road if you want to make changes. But the web being what it is, it is possible to access some includes directly and thus you may want to secure them..."
http://green-beast.com/blog/?p=144

Debugging and Performance
By George Schlossnagl.
"Debugging is an important part of coding. One way to make the debugging process easier is to write quality code to begin with. This article, the first of two parts, will point out some of the most common coding errors, and help you identify problems in your code. It is excerpted from chapter 12 of Zend PHP Certification, written by George Schlossnagle et al."
http://www.devshed.com/c/a/PHP/Debugging-and-Performance/


+10: STANDARDS, GUIDELINES, MICROFORMATS, PATTERNS.

Jeffrey Zeldman On Why To Incorporate Web Standards
By Jeffrey Zeldman.
"Web standards hold the key to accessible, cost-effective web design and development, but you wouldn't know it from surveying most big commercial sites. In this chapter, CSS guru Jeffrey Zeldman explores some of the reasons web standards have not yet been incorporated into the normative practice of all design shops and in-house web divisions, and are not yet obligatory components of every site plan or request for proposal. If you need help selling standards to your colleagues, this chapter is for you."
http://www.informit.com/articles/article.asp?p=608636&rl=1

The Road to the Semantic Web
By Alex Iskold.
"John Markoff's recent article in NY Times has generated an interesting discussion about Web 3.0 being the long-promised Semantic Web. For instance, a short post on Fred Wilson's blog had a lot of lengthy comments attempting to define Web 1.0, Web 2.0 and Web 3.0. Some people think that the Semantic Web is about AI, some claim that it is more about semantics, while others say that it is about data annotation. All agree however, that we will all be wonderfully more productive and simply happier when it arrives. Lets take a look at the ingredients, definitions and approaches to the Semantic Web so that we can recognize it when it is finally here."
http://www.readwriteweb.com/archives/semantic_web_road.php

The Business Benefits of Microformats
By Simon Collison.
"...I have only recently realized that Microformats are something that Mr. Client (or Mrs. Client) not only understands, but also loves, needs, wants and will tell his/her associates about. This is a cast-iron business benefit and a serious commodity..."
http://tinyurl.com/ylgf5e

Microformats: Tomorrow's Web Today
By Molly E. Holzschlag.
"Despite the buzz about Web 2.0 and next-generation web applications, Informit readers will find it interesting that the original second generation vision for the Web has very little to do with the current perspectives and positions on Web 2.0. The Semantic Web is the term used to describe Tim Berners-Lee and the World Wide Web Consortium's work in encouraging the Web to its next level..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=271&rl=1

Microformats: Understanding Elemental Microformats
By Molly E. Holzschlag.
"Remember playing with blocks as a kid? One of the pleasures of my childhood was competing with my brothers to see who could build the biggest, tallest, coolest structure using blocks. In later years, the game Jenga, with which many readers will be familiar, took the place of building blocks, but still with the same essential concept in mind..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=293&rl=1


+11: TOOLS.

Textile
By Alex Shiels.
"Textile takes plain text with *simple* markup and produces valid XHTML."
http://textile.thresholdstate.com/

Daily Color Scheme
By Walter Tamboer.
"Daily Color Scheme.com is all about color. Every day color. We serve a new colorscheme every day of the year, to keep the designers head fueled with inspirational and usable color schemes."
http://beta.dailycolorscheme.com/

Hex Color Picker
By wafflesoftware.
"Lets you get and edit hexadecimal HTML color codes in the standard Mac OS X color panel."
http://wafflesoftware.net/hexpicker/


+12: TYPOGRAPHY.

Designing Accessible Text-Part 2: Text Size
By Sarah Horton.
"Designing web text is fundamentally different from designing text in print. With printed documents, words are set in ink, meaning that designers must choose a text size that's readable by most readers. People who cannot read text as printed use reading aids such as glasses or document enlargers, or alternate versions such as audio or large-print formats. In print, designers are responsible for setting text size, whereas on the Web, designing text is a collaboration between designer and user..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=269&rl=1

Designing Accessible Text-Part 4: Typeface
By Sarah Horton.
"Of the attributes that influence the accessibility of Web text, typeface plays the smallest role-not quite a member of the chorus, but certainly a bit part. While color and size determine the possibility of reading, typeface influences the quality of the reading experience. For instance, some typefaces are more difficult to read than others, and a fantasy font like Impact or Desdemona is likely to lose its charm when used to set large blocks of text. While we might not enjoy reading under such conditions, it's unlikely that we would be unable to read due to such an unwise choice of typeface. Nevertheless, quality of experience does figure in to universal usability. Read on to explore the fine art of choosing typefaces in the constrained environment of the Web, and to learn best practices for coding typefaces that can be easily modified by users."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=280&rl=1


+13: USABILITY.

Choices = Headaches
By Joel Spolsky.
"Every time you want to leave your computer, you have to choose between nine, count them, nine options: two icons and seven menu items. The two icons, I think, are shortcuts to menu items. I'm guessing the lock icon does the same thing as the lock menu item, but I'm not sure which menu item the on/off icon corresponds to."
http://www.joelonsoftware.com/items/2006/11/21.html

Windows Vista Off Button Usability Issues
By Jesper Ronn-Jensen.
"Below is my argument that some user interface widgets are introduced only because of buggy software. First let's have a look at Windows Vista. Joel Spolsky is picking on the 24 people that designed the Off button in Windows Vista: Choices = Headaches."
http://tinyurl.com/vngp9

Paradox of Choice - Barry Schwartz Video
By Jesper Ronn-Jensen.
"The most influential talk I have heard this year is Barry Schwartz on the paradox of choice. I cannot recommend this talk enough, so I was thrilled to see that Barry did a similar talk that's available on Google Video..."
http://tinyurl.com/wus4a

Designing Usable Forms
By Sarah Horton.
"A whole book could be written on form design. This article touches on only two of the many form usability issues-namely, those associated with element labeling and menus. More form usability information can be found in a related Web Design Reference Guide article on designing forms for keyboard access..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=284&rl=1

Designing Flexible Layouts
By Sarah Horton.
"Flexibility is one of the more vexing aspects of designing for the web. The hours we spend tweaking colors and fonts-only to have users come along and apply their own settings to our pages. Humph! And when we see our designs compromised-for example, by large text or a narrow browser window-all we can do is mutter, "Well, it looks great on my computer." Now, we could avoid unpleasant surprises by creating sites that are image based. Images are largely impervious to user modification, and many sites, including those of Apple and J.Crew, rely on images almost exclusively. This approach provides a measure of design integrity, but at significant cost. Users who can't access images, or who must make modifications in order to access content, cannot use these sites. And when push comes to shove, a compromised but usable design is better than an unusable one..."
http://www.informit.com/guides/content.asp?g=webdesign&seqNum=248&rl=1

Resolution vs. Browser Size vs. Fixed or Adaptive width
By Roger Johansson.
"...By all means if you want to make your design look its best at a certain width, optimize it for that width. But in most cases there is little reason to lock down the design to a pixel width..."
http://tinyurl.com/ydg4w6

Fixed and Fluid, myth and meme
By Mike Davies.
"Are there any accessibility-based reasons for choosing a variable-width layout over a fixed-width layout?..."
http://www.isolani.co.uk/blog/web/FixedAndFluidMythAndMeme


+14: XML.

The Feedback on HTML
By Anne Van Kesteren.
"WHATWG 2.0: blog, Wiki and IRC!"
http://annevankesteren.nl/2006/11/feedback-on-html


[Section one ends.]


++ SECTION TWO:

+15: 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.]