+++ WEB DESIGN UPDATE. - Volume 6, Issue 20, November 9, 2007. An email newsletter to distribute news and information about web design and development. ++ISSUE 20 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: EVALUATION & TESTING. 04: JAVASCRIPT 05: MISCELLANEOUS. 06: NAVIGATION. 07: PHP. 08: STANDARDS, GUIDELINES & PATTERNS. 09: TOOLS. 10: USABILITY. SECTION TWO: 11: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Web Accessibility for Section 508 By Jim Thatcher. "Web Accessibility for Section 508 Tutorial, originally written in 2001 for the Information Technology Technical Assistance and Training Center (ITTATC) has now been completely revised." http://www.jimthatcher.com/webcourse1.htm Does Accessibility Cost More? By Mike Cherim. "What is the most accurate answer to this seemingly age-old question? Speaking for myself, I'd say it does cost more to create an accessible site. Cheaper alternatives exist on the world 'wild' web, but not on my menu - I only make accessible sites and won't entertain opportunities to make them otherwise. But my labors will cost the client more money than what they might spend on some low-end assembly-line site hammered out by a developer that doesn't care. And I feel absolutely justified in doing so. After all, creating a through-and-through quality, top-of-the-line accessible site does take time, extra attention to detail, and a sound knowledge of the requirements. This knowledge has value, quality takes time, and time is money..." http://accessites.org/site/2007/11/does-accessibility-cost-more/ UK Government Accessibility Consultation By Bruce Lawson. "The UK government has issued a consultation document on Delivering Inclusive Websites..." http://tinyurl.com/2y2yy2 +02: CASCADING STYLE SHEETS. CSS Attribute Selector Bug in Safari By Christopher Schmitt. "...The short version of the results is that Safari is wrong and the other major browsers that support attribute selectors appear to be getting it right. (Yes, that includes IE7)..." http://tinyurl.com/28g4ay PVII CSS Q.Tabs By Al Sparber. "Have you ever wanted to make simple and accessible navigation bars that were pure text but displayed as scalable graphical tabs with hover effects that behaved like image rollovers? We did too. So we wrote this tutorial..." http://www.projectseven.com/tutorials/css/qtabs/index.htm When the Legend Won't Wrap - One Solution By Stephanie Sullivan. "The answer lies in placing a span element directly inside the label element - Text within it..." http://www.communitymx.com/blog/index.cfm?newsid=882 Using Multiple Classes Within Selectors By Russ Weakley. "While styling the menu, I came across an interesting problem. The Content management system was writing two classes into the same element, and there were times when I needed to use both of these classes for styling..." http://www.maxdesign.com.au/2007/11/05/multiple-classes/ +03: EVALUATION & TESTING. Web Metrics: Don't be a Slave to the Next HIT By Gerry McGovern. "Early website management was obsessed with volume. Today, an increasing number of page impressions can mean a website is failing rather than succeeding." http://www.gerrymcgovern.com/nt/2007/nt-2007-11-05-web-metrics.htm Ask 37signals: Personas? By Jason Fried. "I've never been a big believer in personas. They're artificial, abstract, and fictitious. I don't think you can build a great product for a person that doesn't exist. And I definitely don't think you can build a great product based on a composite sketch of 10 different people all rolled into one (or two or three). Personas don't talk back. Personas can't answer questions. Personas don't have opinions. Personas can't tell you when something just doesn't feel right. Personas can't tell you when a sentence doesn't make sense. Personas don't get frustrated. Personas aren't pressed for time. Personas aren't moody. Personas can't click things. Personas can't make mistakes. Personas can't make value judgements. Personas don't use products. Personas aren't real." http://www.37signals.com/svn/posts/690-ask-37signals-personas +04: JAVASCRIPT. ARIA: Accessible Rich Internet Applications By Mozilla. "Firefox's implementation of Accessibility Rich Internet Applications (ARIA) allows desktop-style widgets such as tree views, menu bars and spreadsheets which are accessible both with the keyboard and assistive technologies such as screen readers, screen magnifiers and alternative input devices. It also helps provide accessibility solutions for AJAX-style live updates to regions on a page. ARIA, formerly known as DHTML accessibility, is a standard being developed at W3C - World Wide Web Consortium. All documents are available on the Protocols and Formats Working Group public page. This includes the ARIA roadmap, the ARIA roles spec and the states module..." http://developer.mozilla.org/en/docs/Accessible_DHTML ARIA: Accessible Rich Internet Applications/Relationship to HTML FAQ By Mozilla. "...ARIA enhances the use of JavaScript, which is already available. New, interesting widgets can be developed today using HTML 4.01 and JavaScript -- and ARIA can already be used to describe accessibility for those widgets. Eventually HTML 5 will build in many of the most common use cases for ARIA -- such as progress meters, directly into easy-to-use elements. HTML 5 will ultimately make common things much easier to do. However, the need for ARIA goes beyond the time that HTML 5 becomes a reality for authors. ARIA will be necessary for at least as long as authors want to develop their own widgets, until there is a ubiquitous cross-browser way to develop widgets (such as XBL)..." http://tinyurl.com/35s9mj ARIA Test Pages By Illinois Center for Information Technology Accessibility. "The Roadmap for Accessible Rich Internet Applications (WAI-ARIA Roadmap) addresses the accessibility of dynamic Web content for people with disabilities. The roadmap outlines the technologies to map controls, AJAX live regions, and events to accessibility APIs, including custom controls used for Rich Internet Applications. The roadmap also outlines new navigation techniques to mark common Web structures as menus, primary content, secondary content, banner information and other types of Web structures. These new technologies can be used to improve the accessibility and usability of Web resources by people with disabilities, without extensive modification to existing libraries of Web resources." http://test.cita.uiuc.edu/aria/ +05: MISCELLANEOUS. Deadline First, Plan Second By Meri Williams. "...Deadline First, Plan Second describes the all-too-common phenomenon of project deadlines being set before any of the planning and estimating has been done..." http://blog.geekmanager.co.uk/2007/10/30/deadline-first-plan-second/ Blasting the Myth of the Fold Podcast with Milissa Tarquini By Jeff Parks. "They talk about how this long held rule in web design is being de-bunked by web analytics and user testing, as well as how this will impact design and development processes based on screen resolution and browser compatibility." http://www.boxesandarrows.com/view/blasting-the-myth-of16 +06: NAVIGATION. Don't Click Here: The Art of Hyperlinking By Jeff Atwood. "I've often thought there is a subtle art to the humble hyperlink, that stalwart building block of hypertext, the stuff that Ted Nelson's Xanadu dream was made of..." http://www.codinghorror.com/blog/archives/000985.html +07: PHP. PHP Statements and Beginning Loops By James Payne. "We discussed statements briefly in our last article and even got a sneak peek of an IF-statement. Sure I mean, the image was blurry, and the moment it saw us it ran off into the forest. But we saw it. Honest. So in this article, we're going to take a much closer look at PHP statements and even start learning about loops..." http://www.devshed.com/c/a/PHP/PHP-Statements-and-Beginning-Loops/ Suture CSS or JavaScript Files to Reduce HTTP Requests By Andrew B. King. "...This article shows how to 'suture' or merge CSS or JavaScript files together at the server to avoid costly HTTP requests, while still maintaining separation of logically discrete styles or behavior. Suturing can be done automatically with PHP or JSP code at the server, or by merging files manually by developers to minimize HTTP requests to avoid the slight overhead of auto-suturing." http://www.websiteoptimization.com/speed/tweak/suture/ Graceful E-Mail Obfuscation By Roel Van Gils. "Hide e-mail addresses from spam bots while revealing them to readers as real, clickable links. This transparent and fully automated solution guarantees that all addresses on your site will be safe-even the ones that show up in blog comments!..." http://www.alistapart.com/articles/gracefulemailobfuscation +08: STANDARDS, GUIDELINES & PATTERNS. Designing With Web Standards Group Facebook Group By Jeffery Zeldman. "I am curious whether the new group will become a passive affinity group or something more. By passive affinity group, I mean the kind of group people join to show they belong - and then don't do much, if anything, once they've joined. For instance, hundreds of thousands of people joined a Facebook group in support of the monks' protest in Burma. Everyone who joined supports free speech and democracy, but only a tiny handful of group members create content or begin initiatives. For the few who are active, membership in the Burmese monk support group is an act of political and spiritual engagement. But for most members, it's passive. This is true of all social groups (online and off) and nearly all human activities..." http://www.zeldman.com/2007/11/02/dwws-facebook-group/ POSH - Plain Old Semantic HTML By Roger Johansson. "For years I've been advocating the use of valid, semantic, accessible, well-structured HTML. It's a bit of a mouthful to say, but thanks to an acronym being coined on the Microformats IRC channel almost seven months ago, I can now start advocating the use of POSH instead..." http://tinyurl.com/24jl6l How to Use POSH By Virginia DeBolt. "POSH is Plain Old Semantic HTML. There's a movement afoot to bring everyone who creates Web pages into agreement to use POSH for Web page production. POSH is the building block of valid, semantic, accessible and interoperable websites..." http://www.ehow.com/how_2112770_use-posh.html The W3C process may be slow, but browser vendors are slower By Roger Johansson. "Every once in a while when someone gets frustrated by the lack of browser support for standards such as HTML and CSS (mostly CSS), the W3C is yelled at for being too slow. I think it's a little unfair..." http://tinyurl.com/2eybo5 +09: TOOLS. CSS 3 Quick Reference Panel By Rijk van Geijtenbeek. Rijk van Geijtenbeek has announced a CSS3 Quick reference in the form of a browser sidebar. http://people.opera.com/rijk/panels/ +10: USABILITY. High-Cost Usability Sometimes Makes Sense By Jakob Nielsen. "Computing the net present value (NPV) lets you estimate the most profitable level of usability investment. For big projects, expensive usability can pay off." http://www.useit.com/alertbox/expensive-usability.html Greatest Copy Shot Ever Written By Nick Padmore. "Got Milk?', 'Don't leave home without it', 'Good to the last drop.' You know these taglines and the products associated with them. So what makes a great copy shot? Is there a formula? And can understanding advertising help us write better web copy?" http://www.alistapart.com/articles/greatestcopyshot 'Prettiness' is Relative By Joe Dolson. "Something which comes up over and over in my work is the tendency of clients to request design changes which I don't particularly care for. This isn't to say that they're ugly, per se - after all, the fact that I don't like them isn't actually equal to 'ugly.'..." http://www.joedolson.com/articles/2007/11/prettiness-is-relative/ The Five Competencies of User Experience Design By Steve Psomas. "Throughout my career as a user experience designer, I have continually asked myself three questions..." http://www.uxmatters.com/MT/archives/000230.php [Section one ends.] ++ SECTION TWO: +11: 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.]