+++ WEB DESIGN UPDATE. - Volume 7, Issue 23, December 4, 2008. 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: DREAMWEAVER. 04: EVALUATION & TESTING. 05: EVENTS. 06: INFORMATION ARCHITECTURE. 07: JAVASCRIPT. 08: MISCELLANEOUS. 09: NAVIGATION. 10: PHP. 11: STANDARDS, GUIDELINES & PATTERNS. 12: USABILITY. SECTION TWO: 13: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Pretending To Be The Blind Guy/Does It Work? By Niels Matthijs. "...Of course you can buy or download your own screen reader, close your eyes for 5 hours straight and try to empathize with the people you're going through all this trouble for, but that still won't lead you to all the right answers..." http://www.onderhond.com/blog/work/pretending-to-be-the-blind-guy BS 8878: draft British accessibility standard for public comment By Bruce Lawson. "The British Standards Institution is inviting all interested parties, and in particular marketing professionals and disabled web users, to review and comment on the draft of a new standard on accessible web content. DPC BS 8878 Web accessibility - Building accessible experiences for disabled people - Code of Practice is applicable to all public and private organizations wishing to offer accessible, usable web content to their customers..." http://tinyurl.com/65zxax Making Video and Audio Usable For The Deaf By Joseph C. Dolson. "Using video and audio in a website increases the probability of an accessibility problem. Where text can be readily translated into a wide variety of alternative mediums for the disabled, the complex nature of video and audio make this kind of machine-generated comprehension nearly impossible. Add to that the fact that reading a transcript hardly conveys an experience equivalent to the excitement of an expertly-produced audio file, and it's clear that marketers have a serious challenge when targeting the disabled using video and audio." http://tinyurl.com/5fsq45 Web Accessibility and the Law - India By Ajay Kolhatkar. "I would really like to thank Vijay Krishnamani for his comment on the previous post. Essentially, because it helped me dedicate this post only for the law in India..." http://tinyurl.com/5l2r97 Making Google Maps More Accessible By Roger Johansson. "It has become very popular to use the Google Maps API to add maps to websites. While the maps work fine for most users, unfortunately Google Maps does not by default work without JavaScript - when there is no JavaScript support, you don't get a map..." http://tinyurl.com/5s5roe Adding a Map to Your Web Site By Mike Cherim. "Local brick-n-mortar businesses, those who rely on walk-in, on-location commerce, will often have a web site to promote their business. It's a good idea. The cost of having a web site is next to nothing, maintenance is easy if the site was built with updating in mind, and it can be a great service to existing and potential customers, depending on how it's used. One such service would be helping the potential client find the business's physical location. This can be easily facilitated by adding a location map to the site. How one should do this is the subject of this article." http://green-beast.com/blog/?p=324 Web Accessibility Principles By WebAIM. "This resource is designed to be printed as a one page PDF file. An HTML version is also available below..." http://webaim.org/resources/quickref/ Testing Web Content for Accessibility By WebAIM. http://webaim.org/resources/evalquickref/ +02: CASCADING STYLE SHEETS. HTML/CSS Crash Primer By Tom Muck. "This article is intended as a re-introduction to HTML and CSS, and something I have used in the past to give to any new employees who may have had HTML experience, but exhibited some bad habits in actual coding. You may think HTML is simple and you may think you know all you need to know, but HTML is misused daily. Following are some basics to help correct some of the common problems." http://www.communitymx.com/content/article.cfm?cid=695E2 Scalable Content Box Using Only One Background Image By Dmitry Fadeyev. "A colleague of mine was recently trying to cut down on image usage when working on a web design project. He asked me whether it was possible to use one image for a vertically scalable content box that had both, a unique heading background, a border along the sides and a rounded off border in the footer..." http://tinyurl.com/5qr4jm User Styling By Jon Hicks. "During the recent US elections, Twitter decided to add an 'election bar' as part of their site design. You could close it if it annoyed you, but the action wasn't persistent and the bar would always come back like a bad penny. The solution to common browsing problems like this is CSS. 'User styling' (or the creepy 'skinning') is the creation of CSS rules to customize and personalize a particular domain. Aside from hiding adverts and other annoyances, there are many reasons for taking the time and effort to do it..." http://24ways.org/2008/user-styling Everything you Know is Wrong! By Jeffrey Way. "This tutorial will show you how you'll be building your layouts in the future. Actually, you should be using these methods right now! Rather than relying on floats and absolute positioning to build our layouts, we'll instead focus on utilizing css tables...This tutorial will show you how you'll be building your layouts in the future. Actually, you should be using these methods right now! Rather than relying on floats and absolute positioning to build our layouts, we'll instead focus on utilizing css tables..." http://nettuts.com/videos/screencasts/everything-you-know-is-wrong/ Building Floating Lists With CSS By: Alejandro Gervasio. "In this four-part series of articles I'm going to show you how to build several floating HTML lists by means of a few basic CSS styles, and basic markup. In this manner you can implement this useful approach within your existing or future web sites..." http://tinyurl.com/64g2rg CSS Angles: Just the Edge Your Web Page Needs! By Tim Wright. "With the influx of JavaScript libraries like jQuery and Prototype, a lot of the more basic elements of front-end development have fallen through the cracks. Gone are the days when we would sit down for a couple of hours to find a creative way to solve a CSS problem; now we immediately turn to JavaScript. Not to say that it's a bad thing-it is what it is in the current state of web development. But sometimes we have to look back on those old techniques to find a new way of achieving a solution..." http://www.sitepoint.com/article/css-angles-the-edge-you-need/ CSS Boundaries/Stopping the Cascade By Niels Matthijs. As css developers, we all love the cascade. It brings us many great opportunities and saves us heaps of time. But below that shiny surface of the cascade is a darker streak, popping up at the most annoying of times. Sometimes the cascade tires me, sometimes I just want to build a wall and tell the cascade to go and bug someone else. Sadly I cannot do that, and a while ago I wondered why it was I couldn't do just that. http://www.onderhond.com/blog/work/css-boundaries-stopping-the-cascade +03: DREAMWEAVER. Dreamweaver CS4: A Powerful Tool for an Imperfect World By Kevin Yank. "With the just-released Dreamweaver CS4, Adobe has conceded that web design has moved on. No longer are designers content to limit themselves to what can be built with WYSIWYG tools; instead, Dreamweaver CS4 shifts focus to providing powerful tools for code-savvy front-end designers like you and me! With the WebKit rendering engine at its core, Dreamweaver CS4 embraces best practice in every aspect of client-side design. If only it went as far on the server side..." http://tinyurl.com/5vln8f +04: EVALUATION & TESTING. Heuristic Evaluation Quality Score (HEQS): Defining Heuristic Expertise By Shazeeye Kirmani. "This paper identifies the factors affecting heuristic expertise and defines levels of expertise permissible to conduct an evaluation. It aims to standardize skills or define heuristic expertise worldwide and also suggests ways to improve issue categorization..." http://www.upassoc.org/upa_publications/jus/2008november/kirmani1.html Stop Calling it Usability Testing By Patrick Kennedy. "...usability testing' often gets misconstrued by technical types, project managers and business analysts. It gets turned into a stale, rigid, bureaucratic affair. The old 'unit, integration, system' mantra. It's done as a matter of course, at the end of the gantt chart, to tick a box. That's pointless..." http://www.gurtle.com/ppov/2008/12/01/stop-calling-it-usability-testing/ 5 Ways to Get Usability Testing on the Cheap By Josh Catone. "Usability testing is a good idea for any new web site. Increasing the usability of your web site is a good idea because it will increase visitor satisfaction, which in turn increases sales and user loyalty. On the business savings side, usability testing can also save you money in development, maintenance, and support costs. Unfortunately, traditional usability tests is pricey - it can cost up to tens of thousands of dollars to run a usability test..." http://tinyurl.com/6pgmyl +05: EVENTS. California Web Accessibility Conference (CalWAC4) January 12-14, 2009. California State University, Long Beach, California, U.S.A. http://www.knowbility.org/calwac/ UX Book Club A UX (User Experience) Book Club is a get-together in which people interested in the area of user experience come to discuss a book relevant to the discipline. http://uxbookclub.org/doku.php +06: INFORMATION ARCHITECTURE. Flexible Fuel: Educating the Client on IA By Keith LaFerriere. "IA is about selling ideas effectively, designing with accuracy, and working with complex interactivity to guide different types of customers through website experiences. The more your client knows about IA's processes and deliverables, the likelier the project is to succeed." http://www.alistapart.com/articles/flexiblefueleducatingtheclientonia Card Sorting: Current Practices and Beyond By Jed Wood and Larry Wood. "...Not surprisingly, a set of common practices in conducting card sort studies and analyzing the resulting data has developed over time. Although the results of these efforts have produced valuable results on balance, the practices are based more on anecdotal evidence than systematic research. We discussed what we consider to be the limitations of current practices and made recommendations based on our own experience (both as users of the methodology and as vendors of a leading online card sorting tool). We also suggested research studies that we believe need to be conducted and that we are in the process of conducting..." http://www.upassoc.org/upa_publications/jus/2008november/wood1.html A Modified Delphi Approach to a New Card Sorting Methodology By Celeste Lyn Paul. "...There is a proven benefit of participants working with a single model, rather than many. The information evolutionary model influenced by the Delphi method helps control randomness and outliers that are commonly encountered when analyzing multiple models as a single set of data. Results from the studies conducted also suggest the superiority of results generated from the Modified-Delphi card sort over the Open card sort..." http://www.upassoc.org/upa_publications/jus/2008november/paul1.html The Usability of Computerized Card Sorting: A Comparison of Three Applications by Researchers and End Users By Barbara Chaparro, Veronica Hinkle, and Shannon Riley. "Results from this two-part study are interesting in that the 'bestÓ electronic card sort application appears to be dependent on the participant group using it. Researchers preferred WebSort to set up and analyze an open card sort while end users preferred OpenSort to do the actual card sorting..." http://www.upassoc.org/upa_publications/jus/2008november/chaparro1.html Create Your Own Magnetic Prototype By Alexa Andrzejewski. When I moved to California, my going-away gift from my ever-hands-on coworkers at the design research firm, Lextant, was a metal lunchbox filled with inkjet-printed and hand-written magnets - a personalized magnetic poetry kit. Ever since, I've been looking for an opportunity to introduce those printable magnetic sheets to interaction design..." http://www.adaptivepath.com/blog/2008/11/17/magneticprototyping/ +07: JAVASCRIPT. Testing WAI-ARIA Role Support By Steve Faulkner. "For WAI-ARIA to be useful, to people with disabilities who use assistive technology, access to the information that ARIA roles and properties provides must be well supported across a range of browsers and assistive technologies. One of the activities going on over at codetalks is the development and testing of ARIA test cases. As part of this effort, I have been developing simple test cases for ARIA role support and testing them using the Firefox browser and a range of commonly used assistive software..." http://www.paciellogroup.com/blog/?p=100 Make OOP Classes in JavaScript By cpeterpan. "Anyone who has tinkered with the prototype model in JavaScript to produce classes as we know them in other languages has generally left web programming all together and taken up a career as a bus driver. There are a coterie of frameworks designed specifically to address this problem. But what if you're not wild about frameworks, preferring instead to build tools specifically suited to your needs and style? For you, there is some black magic that can revolutionize the way you interact with the current JavaScript standard (someone please thaw me out when the 2.0 standard is implemented in June 2134, or whatever the projected date is)..." http://www.webmonkey.com/tutorial/Make_OOP_Classes_in_JavaScript +08: MISCELLANEOUS. Easing The Path from Design to Development By Drew McLellan. "...When asked the question of how to smooth hand-over between design and development, almost everyone who has experienced this situation could come up with their own list. This one is mine, based on some of the more common experiences..." http://24ways.org/2008/easing-the-path-from-design-to-development +09: NAVIGATION. Site Wide Search On A Shoe String By Christian Heilmann. "...Times have moved on and nowadays you can have the same functionality for free using Yahoo's 'Build your own search service' - BOSS. The cool thing about BOSS is that it allows for a massive amount of hits a day and you can mash up the returned data in any format you want. Another good feature of it is that it comes with JSON-P as an output format which makes it possible to use it without any server-side component..." http://24ways.org/2008/sitewide-search-on-a-shoestring +10: PHP. Using PHP for the Creation of SVG Images By Ken Coar. "As with many of the pages on my Web site, my SVG images are in fact generated by PHP scripts. I end up including many of the same images in other pages, but not always with the same size or colors, so making them customizable on a case-by-case basis is a useful thing. Attributes such as size, scale, colour, rotation, and position are obtained from arguments in the URL." http://www.phpbuilder.com/columns/ken_coar20081201.php3 +11: STANDARDS, GUIDELINES & PATTERNS. Proposed Change to Dialog Example in HTML5 Section 4.6.26 By Gregory J. Rosmaita. "The dialog example in section 4.6.26 of the 3 December 2008 version of the html5 draft should use ABBR not SPAN to gloss the colloquial pronunciation and should use EmotionML to express that the shopkeeper is lying, rather than using SPAN to "convey" such information..." http://lists.w3.org/Archives/Public/public-html/2008Dec/0070.html +12: USABILITY. The Biggest Web Site Usability Mistakes You Can Make By Kim Krause Berg. "...To understand if your web site is meeting its usability requirements, ask people to take it for a spin and try it out-and more specifically, to see if they can answer the following questions..." http://tinyurl.com/5zwbar When Technology Fails By John Horrigan and Sydney Jones. "Some 48% of technology users usually need help from others to set up new devices or to show them how they function. Many tech users encounter problems with their cell phones, internet connections, and other gadgets. This, in turn, often leads to impatience and frustration as they try to get them fixed." http://www.pewinternet.org./PPF/r/267/report_display.asp American English vs. British English for Web Content By Jakob Nielsen. "Users pay attention to details in a site's writing style, and they'll notice if you use the wrong variant of the English language." http://www.useit.com/alertbox/american-british-english.html Getting Real About Agile Design By Cennydd Bowles. "Agile development was made for tough economic times, but does not fit comfortably into the research-heavy, iteration-focused process designers trust to deliver user- and brand-based sites. How can we update our thinking and methods to take advantage of what agile offers?" http://www.alistapart.com/articles/gettingrealaboutagiledesign The Greatest Secret in Web Design By Jens Meiert. ...Even if you hired the greatest designers and developers and aimed for high quality, your website will become bad if you don't focus on adding value as well as continuously maintaining your site. However, even if you screwed it up in the first place you can make a horrible site okay or even good when you focus on adding value as well as continuously maintaining your site..." http://meiert.com/en/blog/20081201/the-greatest-secret-in-web-design/ Save the Earth. Everybody's Doing t. By Kath Straub. "There are certain studies that should be replicated. Not because the findings are controversial. Rather, because the findings are so uncontroversial that you have to experience it to get how powerful the effect is..." http://www.humanfactors.com/downloads/nov08.asp [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.]