+++ WEB DESIGN UPDATE. - Volume 10, Issue 38, March 15, 2012. An email newsletter to distribute news and information about web design and development. ++ISSUE 38 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: EVALUATION & TESTING. 04: JAVASCRIPT. 05: MISCELLANEOUS. 06: NAVIGATION. 07: STANDARDS, GUIDELINES & PATTERNS. 08: TOOLS. 09: USABILITY. 10: XML. SECTION TWO: 11: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Strategy for Handling Legacy PDF Accessibility By Leonie Watson. "The web is saturated with Portable Document Format (PDF) files. For more than 20 years PDF has been the Defacto standard for print documents on the web. PDF files are also notorious for their lack of accessibility. With legacy PDFs running into the thousands on many websites, just how can you tackle the job of making them accessible?..." http://www.nomensa.com/blog/2012/strategy-for-handling-legacy-pdf-accessibility/ Google+ Hangouts Become Accessible to the Blind By Janko Roettger. "Blind and otherwise visually impaired people now have an easier time using Google+ Hangouts group video chats, thanks to a Chrome extension hacked together by a software engineer called Mohamed Mansour..." http://gigaom.com/video/google-hangouts-accessible-blind/ WCAG 2.0 Undermined by 3 Generations of Digital Illiteracy By Rachel McAlpine. "...Olly, Holly and Polly are all floundering in the digital work environment. They're intelligent and good at their jobs, but their proper concerns are with policy, HR and office supplies-not with writing for the Web. They have never even been introduced to business English or the proper use of MS Word, let alone information theory. So every day, they unwittingly wreck the web team's efforts to make all content accessible..." http://contented.com/contented/2012/wcag-2-0-undermined-by-3-generations-of-digital-illiteracy/ CSUN Conference Presentations The 2012 CSUN Conference Presentations are now online. http://www.webable.tv/FeaturedContent/WebAbleTvUpcomingandRecentWebcast/CSUN2012.aspx +02: CASCADING STYLE SHEETS. Understanding em Units in CSS By Louis Lazaris. "I hope this will serve as a nice summary of what em units are all about and how you can use them in your designs." http://www.impressivewebs.com/understanding-em-units-css/ Scaling with EM Units By Viljami Salminen. "Recently I started testing how proportional scaling of bigger layouts would work in reality and if it makes any sense. It's possible when using EM units and then changing body's font-size when viewport's height grows above certain point. Basically that means, that I have to change only one or two css properties between @media queries which are targeting larger screen sizes." http://viljamis.com/blog/2012/scaling-with-em-units/ Negative Proximity By Eric A. Meyer. "There's a subtle aspect of CSS descendant selectors that most people won't have noticed because it rarely comes up: selectors have no notion of element proximity. Here's the classic demonstration of this principle..." http://meyerweb.com/eric/thoughts/2012/03/07/negative-proximity/ Mastering CSS3 - 7 Cool text-shadow Samples You Can't Miss By Konstantin Kichinsky. "We've been exploring the basics on how to use CSS3 shadows: box-shadow and text-shadow. Today, we are going to improve our skills and look into how to build some amazing text-shadows..." http://www.sitepoint.com/mastering-css3-7-cool-text-shadow-samples-you-can't-miss/ The 2 Principles Of Object Oriented CSS By Steven Bradley. "Do our current css practices scale? Are our stylesheets easy to maintain? Can non-css coders quickly and easily to build new web pages with our styles? Object oriented css (OOCSS) is an approach to writing html and css that allows us to answer yes to each of these questions..." http://www.vanseodesign.com/css/object-oriented-css/ 5 Things I Love About CSS3 By Viki Hoo. "...CSS3 brings us a lot of convenience. We can achieve effects that were previously only possible with plugins, using the element itself instead of mostly pictures. The web page download time will also be faster. Therefore, the old content of pictures could be searched by search engines. Although the HTML5 and CSS3 standards haven't been officially established, and the support by browsers varies, the day they are unified will eventually come." http://www.sitepoint.com/5-things-i-love-about-css3-2/ +03: EVALUATION & TESTING. Nine Misconceptions About Statistics and Usability By Jeff Sauro. "There are many reasons why usability professionals don't use statistics and I've heard most of them..." http://www.measuringusability.com/blog/stats-usability-errors.php +04: JAVASCRIPT. The Five Biggest JavaScript Misconceptions By Larry Ullman. "JavaScript, despite its importance and widespread use in today's web, is a very misunderstood language. Whether it's thinking that JavaScript is somehow related to Java, or that you can't implement access control without classes, there are plenty of misconceptions about JavaScript, one of the world's most used programming languages. In this article, programming expert Larry Ullman discusses five of the biggest misconceptions commonly held when it comes to the language..." http://www.peachpit.com/articles/article.aspx?p=1843879 +05: MISCELLANEOUS. Mobile First Design - Why It's Great and Why It Sucks By Joshua Johnson. "Historically, most web designers and their clients have approached the desktop side of any project first, while leaving the mobile part as a secondary goal that gets accomplished later. Even with the rise of responsive design, many of us begin with the 'full size' site and work our way down. There's a growing trend in the industry though to flip this workflow on its head and actually begin with mobile considerations and then work up to a larger desktop version. Why would you ever approach a project this way? What are some of the pros and cons of this strategy?..." http://designshack.net/articles/css/mobilefirst/ For a Future-Friendly Web By Brad Frost. "It is time to move toward a future-friendly web. Our current device landscape is a plethora of desktops, laptops, netbooks, tablets, feature phones, smartphones, and more, but this is just the beginning. The rapid pace of technological change is accelerating, and our current processes, standards, and infrastructure are quickly reaching their breaking points. How can we deal with increasing device diversity and decreasing attention spans? Brad Frost of futurefriend.ly explains how, while this era of ubiquitous connectivity creates new challenges, it also creates tremendous opportunities to reach people wherever they may be..." http://www.alistapart.com/articles/for-a-future-friendly-web/ The Best Browser is the One You Have with You By Stephanie Rieger. "The web as we know and build it has primarily been accessed from the desktop. That is about to change. The ITU predicts that in the next 18-24 months, mobile devices will overtake PCs as the most popular way to access the web. If these predictions come true, very soon the web-and its users-will be mostly mobile. Even designers who embrace this change can find it confusing. One problem is that we still consider the mobile web a separate thing. Stephanie Rieger of futurefriend.ly and the W3C presents principles to understand and design for a new normal, in which users are channel agnostic, devices are plentiful, standards are fleeting, mobile use doesn't necessarily mean 'hide the desktop version,' and every byte counts." http://www.alistapart.com/articles/the-best-browser-is-the-one-you-have-with-you/ What Users Want From Mobile, and What We Can Re-learn From Them By Bruce Lawson. "From Stephanie Rieger's excellent piece The Best Browser is the One You Have with You, I came upon a report called What Users Want from Mobile (PDF, 3.6 MB), 'A study of consumers' mobile web and application expectations and experiences conducted by Equation Research on behalf of Compuware', dated July 2011..." http://www.brucelawson.co.uk/2012/what-users-want-from-mobile-and-what-we-can-re-learn-from-them/ +06: NAVIGATION. Code a Responsive Navigation Menu By Joshua Johnson. "Navigation menus used to be a fairly simple thing. Code up an unordered list, float it left and you're good to go. With responsive design being all the rage these days though you're faced with some new challenges when creating a menu design. Follow along as we start from scratch and code a simple but effective responsive navigation menu that you can easily modify and reuse in your own projects..." http://designshack.net/articles/css/code-a-responsive-navigation-menu/ Skip Links and Other in Page Links in WebKit Browsers By Roger Johansson. "...In summary: following an in page link (a link that targets an element on the same page, like Skip to main content) does not properly move keyboard focus in WebKit browsers. This means that when you press tab after activating an in page link, focus is moved to the first focusable element after the link rather than the first focusable element after the target..." http://www.456bereastreet.com/archive/201203/skip_links_and_other_in_page_links_in_webkit_browsers/ To Underline or Not Underline Links By Kim Krause Berg. "As visually entertaining the latest trends in web design may be, there are a few usability walls we run into while reading. One is the appearance of a hyperlink..." http://cre8pc.com/2012/03/09/to-underline-or-not-underline-links/ +07: STANDARDS, GUIDELINES & PATTERNS. HTML5 and Enterprise on Mobile By Adrian Roselli. "...When I get past all the misunderstandings of the specifications in the posts, including HTML5, I tend to agree with the overall message of the original post that rapid adoption, possibly for the sake of being cutting edge, is a real issue. This also assumes, of course, that the writer of (and responders to) the original article actually understand what "enterprise" means..." http://blog.adrianroselli.com/2012/03/html5-and-enterprise-on-mobile.html Working with Text in HTML5 By Elizabeth Castro and Bruce Hyslop. "Unless a site is heavy on videos or photo galleries, most content on Web pages is text. This chapter explains which HTML semantics are appropriate for different types of text, especially (but not solely) for text within a sentence or phrase..." http://www.peachpit.com/articles/article.aspx?p=1826714 5 Things I Hate About HTML5 By Craig Buckler. "...here are my five pet peeves..." http://www.sitepoint.com/5-things-i-hate-about-html5/ +08: TOOLS. Firefox Extension: WAI-ARIA Landmarks By David Todd. "This repository contains a Firefox extension that enables keyboard navigation of WAI-ARIA landmarks." Documentation is in the README file. https://github.com/davidtodd/landmarks +09: USABILITY. Disruptive Workflow Design By Jakob Nielsen. "Smooth-flow task performance makes application use pleasurable. But disruptions are all too common due to crinkly design or creaking implementation..." http://www.useit.com/alertbox/disrupting-users.html +10: XML. Use XSLT as a Stylesheet for HTML By Jurgen M. Regel. "As the name suggests, Extensible Stylesheet Language Transformations (XSLT) can be used as a stylesheet. Like Cascading Style Sheets (CSS), XSLT helps to separate style from content. You can simplify and enrich your XHTML documents with XSLT, which relieves the XHTML document of navigation. In this article, learn how to use XSLT as stylesheets, which can be executed on the server or in every modern Internet browser. Several examples show how to start developing your own XSLT stylesheets..." http://www.ibm.com/developerworks/web/library/wa-xsltstyle/index.html [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.]