+++ WEB DESIGN UPDATE. - Volume 9, Issue 48, May 27, 2011. An email newsletter to distribute news and information about web design and development. ++ISSUE 48 CONTENTS. SECTION ONE: New references. What's new at the Web Design Reference site? http://www.d.umn.edu/itss/training/online/webdesign/ New links in these categories: 01: ACCESSIBILITY. 02: CASCADING STYLE SHEETS. 03: COLOR. 04: EVALUATION & TESTING. 05: EVENTS. 06: MISCELLANEOUS. 07: NAVIGATION. 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. When Should You Invite tabindex to the Accessibility Party? By Glenda Sims. "I am a minimalist. I believe that simple solutions are better. So, when it comes to tabindex, I rarely invite 'him' to the accessibility party. Why? Because if you will just write the source code in the same order you need the items for the visual presentation, then tabindex is not necessary. But there are two decent reasons for using tabindex..." http://www.glendathegood.com/blog/?p=604 Do Unobtrusive, Accessible Social Media Sharing Widgets Exist? By Roger Johansson. "Many clients are still asking for various bookmarking widgets for social media. You know, the kind that shows a bunch of icons for Twitter, Facebook, email, etc. Two popular examples are ShareThis and AddThis, but there are others. What bugs me with every social media sharing widget I have looked at is that they are not very keyboard friendly, i.e. they are difficult or even impossible to use without a mouse. They also tend to use invalid, obtrusive markup." http://www.456bereastreet.com/archive/201105/do_unobtrusive_accessible_social_media_sharing_widgets_exist/ Overlays and Lightboxes - Keys to Success By Derek Featherstone. "In this article, we take a look at a fairly common pattern on the web today: the overlay. We'll ask the question "should we use this effect at all?" and examine what we need to do to ensure they are as accessible as possible." http://webstandardssherpa.com/reviews/overlays-and-lightboxes-keys-to-success/ Curing the JetBlues By Derek Featherstone. "Did you know that JetBlue (the US-based airline) is being sued for their lack of accessibility on their website and on their self-serve kiosks in airports? I didn't either, but in this article I took a quick look at a few of the reasons why they've got some pretty serious accessibility issues." http://webstandardssherpa.com/reviews/curing-the-jetblues/ +02: CASCADING STYLE SHEETS. Styling Ordered List Numbers By Roger Johansson. "I've always been annoyed by how difficult it is to style the numbers of ordered lists. Quite often a design calls for something other than just a plain figure - a different font, size, colour, background, whatever..." http://www.456bereastreet.com/archive/201105/styling_ordered_list_numbers/ Better Semantics with CSS Combinators and Selectors By Chris Sealey. "...At design school we were all taught about classes and IDs, using . and # respectively, to directly target elements. That's enough control to build a functional website - but it's not flexible enough to handle a complete design shift. It also creates a lot more work than needed by using presentational values within markup. Let's take a look at an alternative approach to targeting those difficult-to-get-to ements." http://designfestival.com/better-semantics-with-css-combinators-and-selectors/ When Using !important is The Right Choice By Chris Coyier. "...So when is the !important rule actually useful and a good idea? In my opinion, utility classes are a good use case..." http://css-tricks.com/when-using-important-is-the-right-choice/ Media Queries By Eivind Uggedal. "A collection of responsive web designs..." http://mediaqueri.es/popular/ +03: COLOR. Named Colors By Estelle Weyl. "CSS3 adds names colors from SVG and well as colors defined by Hue, Saturation and Lighness. I've added a new page to this blog that lists all named colors along with their hexidecimal, RGB and HSL values..." http://www.standardista.com/new-post-on-named-colors +04: EVALUATION & TESTING. Capturing Meaningful and Significant User Experience Metrics By Kim Oslob. "How many times have you wondered how you can collect meaningful and significant metrics to validate your research? Many researchers struggle with this same dilemma on a daily basis. For example, how can we know the magnitude of the issues we are detecting in a traditional usability lab study? Surprisingly, there are many ways to capture useful UX metrics if you have the knowledge of what solutions to use and how to use them..." http://www.uxmatters.com/mt/archives/2011/05/capturing-meaningful-and-significant-user-experience-metrics.php +05: EVENTS. Two Apps Per Day: iOS App Design Workshop for Web Designers June 5, 2011. San Francisco, California, U.S.A. http://www.twoappsperday.com/ +06: MISCELLANEOUS. Teamwork and Collaboration Across Departments By Janet M. Six. "In this edition of Ask UXmatters, our experts discuss how to foster teamwork and collaboration across departments..." http://www.uxmatters.com/mt/archives/2011/05/teamwork-and-collaboration-across-departments.php Two Cats In A Sack - Designer-Developer Discord By Cassie McDaniel. "The differences between designers and developers often erupt in pointed jabs on the Web or at conferences. Jokes or not, the jabs create friction whose consequences are real..." http://www.smashingmagazine.com/2011/05/13/two-cats-in-a-sack-designer-developer-discord/ 8 Things They Don't Tell You About Being a Web Designer By Jason Schubring. "...In this article, I'll share with you 8 things I wish I had known about web development as a profession and as an industry..." http://sixrevisions.com/project-management/8-things-they-dont-tell-you-about-being-a-web-designer/ +07: NAVIGATION. Tweaking Your Facets, Part I: Supporting Hierarchy with Multiple Selection By Jaimie Sirovich. "Faceted navigation is one of the most important breakthroughs in modern Web site design. It provides an almost universally positive enhancement to usability..." http://www.uxmatters.com/mt/archives/2011/05/tweaking-your-facets-part-i-supporting-hierarchy-with-multiple-selection.php +08: STANDARDS, GUIDELINES & PATTERNS. W3C Invites Broad Review of HTML5 By W3C. "W3C today called for broad review of HTML5 and five related specifications that constitute the foundation of W3C's Open Web Platform. At the heart of this platform, HTML5 offers powerful tools for creating Web-based applications that will run on any device. Due to the significant impact of this technology on industry and society, W3C is actively seeking feedback at this phase of the standards process..." http://www.w3.org/2011/05/html5lc-pr.html.en FAQ for HTML5 Last Call By Philippe Le Hegaret and Ian Jacobs. "...there remain open issues about some features, particularly related to accessibility. The Working Group will address those issues during Last Call...In order to advance the specification to W3C Recommendation, the Working Group must resolve accessibility issues to the satisfaction of the Director..." http://www.w3.org/2011/05/html5lc-faq.html HTML5 Spec Hits Last Call Status By Paul Cotton. "Late yesterday the W3CÕs HTML Working Group announced that the HTML5 specification has reached Last Call status..." http://blogs.msdn.com/b/interoperability/archive/2011/05/26/html5-spec-hits-last-call-status.aspx About Obsolete Features in HTML5 By Louis Lazaris. "...As many of you may be aware, validating your pages in HTML5 has become a whole new adventure. Along with changes in what now constitutes 'valid' and 'invalid' markup, the HTML5 Validator (which, by the way, is the same tool that runs the W3C's HTML5 validator) will provide some warnings about obsolete features in HTML5..." http://www.impressivewebs.com/obsolete-features-html5/ A Basic HTML5 Template By Louis Lazaris. "This article is an excerpt from HTML5 & CSS3 for the Real World, by Alexis Goldstein, Louis Lazaris & Estelle Weyl." http://blogs.sitepoint.com/a-basic-html5-template/ Creating Accessible Interactive Web Apps using HTML5 (Video) By Dominic Mazzoni, Rachel Shearer. "Providing a basic HTML site used to be the best way to make sure your content was accessible to all users. But times have changed, and now you can use HTML5 techniques to provide an experience that's just as rich and interactive for people who use assistive technology. The emphasis of this talk will be on techniques that work today in the latest browser versions. Techniques covered will include proper use of ARIA along with focus management and keyboard navigation.." http://www.google.com/events/io/2011/sessions/creating-accessible-interactive-web-apps-using-html5.html HTML5 and Accessibility By Bruce Lawson, Steve Faulkner. "...The arrival of HTML5 has further muddied the water. For some, HTML5 saves the world. For others Ð including many accessibility practitioners Ð it is the embodiment of evil..." http://msdn.microsoft.com/en-us/scriptjunkie/hh204741.aspx HTML5 is More than Cool By Robert Nyman. "HTML5 is here to save us all: it has the cool functions, eye-dazzling features and APIs to go around. I get to see a lot of great things developed with HTML5, but IÕd like to issue a word of caution as well..." http://robertnyman.com/2011/05/26/html5-is-more-than-cool/ How HTML5 Will Change The World By Deborah Edwards-Onoro. "At the May 23, 2011 online webinar, Robert Nyman, Molly Holzschlag, Lachlan Hunt and Tady Walsh provided their insights and tips on HTML5 and CSS3." http://storify.com/redcrew/how-html5-will-change-the-world How Important Is Semantic HTML? By Steven Bradley. "...Semantic html is using html to reinforce structural meaning. It's about using tags, class names, and ids that reinforce the meaning of the content within the tags..." http://www.vanseodesign.com/web-design/semantic-html/ +09: TOOLS. Holmes The CSS Markup Detective By Luke Williams. "Holmes is stand-alone diagnostic CSS stylesheet that can highlight potentially invalid, inaccessible or erroneous HTML(5) markup by adding one class." http://www.red-root.com/sandbox/holmes/ +10: USABILITY. Redesigning vs Realigning - A Case Study By Sacha Greif. "Cameron Moll famously stated that 'good designers redesign, great designers realign'. But what does that mean exactly? To get a better understanding of the term, here's a real-life example..." http://www.attackofdesign.com/redesigning-vs-realigning-a-case-study/ [Section one ends.] ++ SECTION TWO: +11: What Can You Find at the Web Design Reference Site? Accessibility Information. http://www.d.umn.edu/itss/training/online/webdesign/accessibility.html Association Information. http://www.d.umn.edu/itss/training/online/webdesign/associations.html Book Listings. http://www.d.umn.edu/itss/training/online/webdesign/books.html Cascading Style Sheets Information. http://www.d.umn.edu/itss/training/online/webdesign/css.html Color Information. http://www.d.umn.edu/itss/training/online/webdesign/color.html Dreamweaver Information. http://www.d.umn.edu/itss/training/online/webdesign/dreamweaver.html Evaluation & Testing Information. http://www.d.umn.edu/itss/training/online/webdesign/testing.html Event Information. http://www.d.umn.edu/itss/training/online/webdesign/events.html Flash Information. http://www.d.umn.edu/itss/training/online/webdesign/flash.html Information Architecture Information. http://www.d.umn.edu/itss/training/online/webdesign/architecture.html JavaScript Information. http://www.d.umn.edu/itss/training/online/webdesign/javascript.html Miscellaneous Web Information. http://www.d.umn.edu/itss/training/online/webdesign/misc.html Navigation Information. http://www.d.umn.edu/itss/training/online/webdesign/navigation.html PHP Information. http://www.d.umn.edu/itss/training/online/webdesign/php.html Sites & Blogs Listing. http://www.d.umn.edu/itss/training/online/webdesign/sites.html Standards, Guidelines & Pattern Information. http://www.d.umn.edu/itss/training/online/webdesign/standards.html Tool Information. http://www.d.umn.edu/itss/training/online/webdesign/tools.html Typography Information. http://www.d.umn.edu/itss/training/online/webdesign/type.html Usability Information. http://www.d.umn.edu/itss/training/online/webdesign/usability.html XML Information. http://www.d.umn.edu/itss/training/online/webdesign/xml.html [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/itss/training/online/webdesign/webdev_listserv.html 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.]