+++ WEB DESIGN UPDATE. - Volume 7, Issue 15, October 10, 2008. An email newsletter to distribute news and information about web design and development. ++ISSUE 15 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: TOOLS. 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. Web Accessibility QuickTips: WCAG 2.0 at a Glance By W3C Web Accessibility Initiative (WAI). "This page provides a summary of Web Content Accessibility Guidelines WCAG 2.0; however, it is paraphrased and it is not a definitive version. Please see the following key resources for learning and using WCAG 2.0..." http://www.w3.org/WAI/WCAG20/glance/ Get Started with Web Content Accessibility Guidelines Version 2.0 By Henny Swan. "The Web has evolved considerably since 1999 when the Web Content Accessibility Guidelines (WCAG) version 1.0 was published. Today, we see increased functionality, interactivity and use of technologies such as multimedia, Flash, AJAX, and more. Combined these bring a richer experience to most Web users but due to their complexities have left many disabled users behind. The WCAG version builds on WCAG 1.0 to accommodate all of today's Web technologies and help bring an accessible rich experience to all Web users..." http://a3.barrierbreak.com/web_getstarted.php Acknowledging the Elephant in the Room - Moving Toward Media Accessibility By Rahul Gonsalves. "...the accessibility of online media-videos, audios and interactive presentations, which combine the two - has been carefully ignored and cannot be solved via technical means alone. No amount of tinkering with the source code is going to make them accessible to people who cannot see, hear or who are deaf-blind. The solution is obvious - captioning is needed for those who cannot hear while text descriptions which can be both accessed on a Braille device and converted to speech are required for the deaf-blind and the blind respectively..." http://a3.barrierbreak.com/media_acknowledging.php Working with Captions By Mamta H. Tandel. "Video plays an important role in the education, as it is increasingly utilized in Web-based learning applications. But, how many of these are accessible to people who are deaf or hard of hearing and senior citizens? Would people using mobile devices be able to access the audio content in a noisy environment? Is there a way to make prerecorded videos accessible to these people?..." http://a3.barrierbreak.com/workingwithcaptions.php Easy YouTube and Learning Disabilities By Christian Heilmann. "Those of you who attended Scripting Enabled in London will remember Antonia Hyde showing the video of Lizzie, a user with learning disabilities trying to watch her own video on YouTube and giving feedback on Easy YouTube. Antonia now uploaded the video for all of us to see..." http://tinyurl.com/4us35v +02: CASCADING STYLE SHEETS. Aligning Inline Images with the Vertical-Align Property By Russ Weakley. "I recently received the following question: How do you vertically position a small image inside a paragraph of text?..." http://www.maxdesign.com.au/2008/10/05/vertical-align/ Smarter CSS Using an Adjacent Selector By Clive Walker. "Wouldn't it be great if you could add styles to your web page by specifying a style for a particular element on the basis of its proximity to another element? Well, in fact, you can do this using the adjacent-sibling selector..." http://tinyurl.com/4z734l Yellow Fade with CSS and a Simple Image By Emil Stenstrom. "Via Think Vitamin I find a cool way to highlight the current element. Lots of people do this by calling some kind of javascript library, it's so common it's been dubbed the yellow fade technique. But javascript isn't really needed, you just need CSS and an image..." http://friendlybit.com/css/yellow-fade-with-css-and-a-simple-image/ Floatitis Part 1 - An Introduction By Niels Matthijs. "Floats, the nightmare of everyone starting out with css. Sure they are helpful, but are they worth all the bugs and cursing and exceptions on exceptions on rules? The next couple of articles will take a closer look at floats, giving a small introduction on their nature and elaborating on methods to avoid using floats. This way you can hopefully ignore a whole lot of potential future bugs and browser fixes." http://www.onderhond.com/blog/work/floatitis-pt1-introduction eduStyle By Stewart Foss. "eduStyle is a web design gallery dedicated to higher education websites and powered by higher education web design professionals. Users submit, review, and comment on sites they like (or don't like)." http://www.edustyle.net/about.php +03: DREAMWEAVER. The Related Files Bar in Dreamweaver CS4 By Virginia DeBolt. "Adobe Dreamweaver CS4 introduced the related files bar. It appears at the top of each document window and lists all CSS and JavaScript files that are related to the web page. If you're using a server-side programming language like PHP, you also see included server-side files listed in the related files bar..." http://tinyurl.com/3w4zwx +04: EVALUATION & TESTING. When to Use Which User Experience Research Methods By Jakob Nielsen. "Modern day user experience research methods can now answer a wide range of questions. Knowing when to use each method can be understood by mapping them in 3 key dimensions and across typical product development phases." http://www.useit.com/alertbox/user-research-methods.html You Won't See What You Don't Look At... By Kath Straub. "Using eyetracking to evaluate engagement and click likelihood" http://www.humanfactors.com/downloads/sep08.asp +05: EVENTS. Understanding User Centered Design October 16, 2008. Bristol, United Kingdom. http://www.pureusability.co.uk/ucdworkshop A Practical Introduction to Website Accessibility November 12, 2008. London, United Kingdom. http://www.abilitynet.org.uk/webintroaccessibility W4A April 20-21, 2009. Madrid, Spain. http://www.w4a.info/ CSUN March 16-21, 2009. Los Angeles, California, U.S.A. http://www.csun.edu/cod/conf/ Web 2.0 Expo San Francisco March 31-April 3, 2009 San Francisco, California, U.S.A. http://en.oreilly.com/webexsf2009/public/content/home An Event Apart 2009 May 4-5, 2009 in Seattle, Washington, U.S.A. June 22-23, 2009 in Boston, Massachusetts, U.S.A. December 7-8, 2009 in San Francisco, California U.S.A. http://www.aneventapart.com/news/2008/10/an_event_apart_2009.php +06: INFORMATION ARCHITECTURE. Extending Card-Sorting Techniques to Inform the Design of Web Site Hierarchies By Michael Hawley. "Card sorting is a useful technique for discovering user perspectives on site navigation. However, designers or user researchers who conduct card-sorting exercises should be aware of the method's challenges and assumptions. This column has presented a number of alternative methods that can extend and complement card sorting and thus provide the most comprehensive insights for designing an effective information hierarchy." http://www.uxmatters.com/MT/archives/000332.php +07: JAVASCRIPT. Using JavaScript to Increase Accessibility By Christian Heilmann. "I've talked about Scripting Enabled recently at the @mediaAjax conference in London, here are slides and the audio recording of the talk..." http://scriptingenabled.org/2008/10/scripting-enabled-using/ Understanding Progressive Enhancement By Aaron Gustafson. "Steven Champeon turned web development upside down, and created an instant best practice of standards-based design, when he introduced the notion of designing for content and experience instead of browsers. In part one of a series, ALA's Gustafson refreshes us on the principles of progressive enhancement. Upcoming installments will translate the philosophy into sophisticated, future-focused design and code." http://www.alistapart.com/articles/understandingprogressiveenhancement JavaScript Inheritance - How and Why By Robert Nyman. "Currently I'm working a fair bit with JavaScript and teaching different ways to use it, and what I want to talk to you about is if and how you use inheritance in JavaScript." http://tinyurl.com/3kqqrj Introducing onFocus and onBlur By Todd Kloots. "...we've rolled PPK's solution into two methods of the Event Utility: addFocusListener and addBlurListener (or onFocus and onBlur for short)..." http://yuiblog.com/blog/2008/10/07/onfocus-onblur/ +08: MISCELLANEOUS. Derek Featherstone - Accessibility is More Than Compliance (Interview) By Kevin Yank. "At the Web Directions South conference last week, SitePoint's Kevin Yank had the opportunity to speak with Derek Featherstone, a well-known web developer, author, and accessibility advocate..." http://www.sitepoint.com/article/interview-derek-featherstone/ Douglas Crockford - JavaScript Doesn't Suck (Interview) By Kevin Yank. "JavaScript guru and Yahoo architect, Douglas Crockford was in Sydney town recently for the annual event that is Web Directions South. He kindly gave up some of his time to chat to SitePoint's Kevin Yank on the continuing evolution of JavaScript." http://www.sitepoint.com/article/interview-doug-crockford/ Web Professional Education - Interview with Molly Holzschlag, Author, Web Professional and Speaker By Bill Cullifer. "...I asked Molly to share her viewpoints on what we need to do as a profession and as a professional organization to influence education in the Web profession and for students at the primary, secondary and the post secondary level..." http://tinyurl.com/496bw7 +09: NAVIGATION. Hidden Barriers - Multiple Links in Headings By Bim Egan. "Most of you won't believe what I'm about to describe, and would never use heading structure in this way. This post isn't for you, it's for the people who believe that it's OK to wrap several links inside a single heading tag, or in fact use one heading to enclose one or more other elements or types of content..." http://tinyurl.com/4mgsbk +10: PHP. My PHP Best Practices By Mike Bernat. "...I've come up with a list of things that I feel are most important to me when it comes to coding..." http://www.mikebernat.com/blog/My_PHP_Best_Practices +11: STANDARDS, GUIDELINES & PATTERNS. This Week in HTML 5 - Episode 8 By Mark Pilgrim. "...It's time to catch up on the myriad of changes to the HTML 5 spec. The big news this week is the continued merging of Web Forms 2 into HTML 5..." http://blog.whatwg.org/this-week-in-html-5-episode-8 Last Week in HTML5 By Jean-Baptiste Clamence. "Documenting the sublime utterences of the WHAT working group." http://lastweekinhtml5.blogspot.com/ HTML 5, Headings and Sections By Matt Ryall. "...Whereas HTML 4 had just six levels of headings for the entire document, the working draft for HTML 5 stipulates that each section has its own heading hierarchy. An h1 element that appears at the top level in a document is considered to 'rank higher than' an h1 element found in a section or article within the document..." http://www.mattryall.net/blog/2008/10/html-5-headings-and-sections Is it Time to Start Using HTML5? By Cody Hatch. "Is it time to start using HTML5? Someone has to start sometime but is now the time?..." http://tinyurl.com/4v5xdg IE8: The Bad (Update) By Anne van Kesteren. "In March I wrote a post titled IE8: The Bad, since then a new beta of Internet Explorer has been released. It still seems a bit dubious whether they are actually committing to standards. This could be a communication issue or actually intended. It is mostly unclear to me..." http://annevankesteren.nl/2008/10/ie8-bad-update +12: TOOLS. Examining WAI-ARIA Live Regions By Gez Lemon. "TPG are working with the Mozilla foundation to develop accessibility testing tools. Specifically, we're developing WAI-ARIA tools, as well as improving accessibility of mainstream tools such as Firebug and providing ARIA testing features in mainstream developer tools. As part of that work, this Firefox extension examines WAI-ARIA's Live Regions (this functionality will eventually be incorporated into a WAT for Firefox extension). The live regions extension is currently available in a toolbar with the latest versions of the colour contrast analyser and table inspector extensions." http://juicystudio.com/article/examining-wai-aria-live-regions.php Examining WAI-ARIA Document Landmark Roles By Gez Lemon. "I have updated the accessibility extension to investigate WAI-ARIA document landmark roles." http://juicystudio.com/article/examining-wai-aria-document-andmark-roles.php Examining WAI-ARIA Roles By Gez Lemon. "I have updated the accessibility extension to display all WAI-ARIA roles." http://juicystudio.com/article/examining-wai-aria-roles.php +13: USABILITY. Block Reading - How We Read on the Web By Gerry McGovern. "We don't scan a web page. Instead, we scan a particular block or section of it..." http://tinyurl.com/4mmnuk Writing For People Who Do Not Read Easily - Workshop Review By Mike Unwalla. "The workshop 'Writing for people who do not read easily'...took place on 2 September 2008 as part of 'HCI2008 Culture, Creativity, Interaction'...at Liverpool John Moores University. Mike Unwalla gives his perspectives of the discussions, which were about both reading on paper and reading on a computer screen. This article is not a complete review of the workshop..." http://www.techscribe.co.uk/ta/read-easily-hci-2008.htm Communicate Quick - First Impressions Through Visual Web Design By Luke Wroblewski. "While many people still associate visual design for the Web with 'making things look pretty', investing in the presentation layer of Web sites can quickly yield more significant returns. When done right, the visual design of a Web page can communicate key concepts to Web users: what am I looking at, how do I use it, and why would I care to? Of these fundamental questions, one gets asked before the others and often determines if people give your Web site a chance to succeed or not." http://www.uie.com/articles/communicate_quick/ +14: XML. XHTML - Myths and Reality By Tina Holmboe. "It is difficult to find a web development language today which is as misunderstood as XHTML. In the following article we'll examine why, sort out a few concepts that frequently confuse authors, and offer practical suggestions on real-life XHTML usage..." http://www.dev-archive.net/articles/xhtml.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.]