+++ WEB DESIGN UPDATE. - Volume 12, Issue 32, January 30, 2014. An email newsletter to distribute news and information about web design and development. ++ISSUE 32 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: EVENTS. 05: HTML5. 06: JAVASCRIPT. 07: NAVIGATION. 08: TYPOGRAPHY. 09: USABILITY. SECTION TWO: 10: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Effective January 1 - New University Web Accessibility Standard By ITSS, University of Minnesota Duluth. "The W3C Web Content Accessibility Guidelines 2.0 (WCAG), level AA, now serve as Web accessibility standards for the University of Minnesota..." http://blog.lib.umn.edu/itsshelp/news/2014/01/effective-january-1-new-university-web-accessibility-standard.html Endangered Species of the Web - The Image By Christian Heilmann. "...If the image plays an important role to the message of the document, or represents an interactive element like a button, use an img tag. These allow for alternative texts and error handling much easier than CSS solutions do. If you use an img give it a sensible alternative text, do not omit the alt attribute or give it an empty attribute or [image]..." http://christianheilmann.com/2014/01/23/endangered-species-of-the-web-the-image/ Provide alt Attributes for Active Images By Denis Boudreau. "Make sure link images have alt attribute values that properly describe their purpose..." http://dboudreau.tumblr.com/post/74918343534/provide-alt-attributes-for-active-images Simple Accessibility Updates to Improve New York Times New Redesign - Part 1 By John F. Croston III. "...I found that the New York Times had missed a lot of what I thought were easy items, such as missing ALT text, empty or missing headings, missing form LABELs, etc. I was able to confirm Patrick's findings. On Saturday evening at about 6:30 PM EST with the WebAIM WAVE toolbar, I found 115 errors...." http://www.jfciii.com/blog/2014/01/27/simple-accessibility-updates-to-improve-new-york-times-new-redesign-part-1/ Part of the Plan - Accessibility From Design to Development By Gerry Heaton. "...70% of accessibility issues could have been avoided..." http://www.visionaustralia.org/living-with-low-vision/learning-to-live-independently/using-technology-and-computers/blog---accessibility-and-assistive-technology-blog/blog/accessibility-blog/2014/01/21/accessibility-by-design-a-process-to-reduce-retrofit Mobile APP-cessibility - A Holistic Approach By Digital Access Team. "It could be said that mobile devices have the most to gain from accessibility. Not only will accessible features support various disability groups, they can assist all users when environmental factors come into play. Why, then, are a number of user groups being forgotten when it comes to the accessibility of mobile apps?..." http://www.visionaustralia.org/living-with-low-vision/learning-to-live-independently/using-technology-and-computers/blog---accessibility-and-assistive-technology-blog/blog/accessibility-blog/2014/01/21/mobile-app-cessibility-a-holistic-approach +02: CASCADING STYLE SHEETS. The Current Generation of CSS3 Selectors By Louis Lazaris. "After CSS 2.1, the W3C added a whole slew of new selectors to help us target elements in unique ways. Just about all of these selectors have excellent browser support, so you can - and probably should - already be using them..." http://www.sitepoint.com/current-generation-css3-selectors/ Embedding Video in a Responsive Site By Rob Glazebrook. "We live in the future, and one of the benefits of our brave new world is the thousands of cat videos that are just a click away. Let's say you've just found the perfect felicitous feline video to share with all your friends. You post it to your fancy responsive website quick as a flash (because it's the future and we can do that), but whoops: the video doesn't fit! It's too wide, too narrow, or just awkwardly sized. Let's fix that..." http://www.cssnewbie.com/embedding-video-responsive-site/ CSS Variables - How To Use Custom Properties For Cascading Variables By Steven Bradley. "We live in the future, and one of the benefits of our brave new world is the thousands of cat videos that are just a click away. Let's say you've just found the perfect felicitous feline video to share with all your friends. You post it to your fancy responsive website quick as a flash (because it's the future and we can do that), but whoops: the video doesn't fit! It's too wide, too narrow, or just awkwardly sized. Let's fix that..." http://www.vanseodesign.com/css/native-variables/ On CSS Variables By Thomas Gossmann. ""Since Firefox supports CSS variables in their nightly build (version 29), I recently tested CSS variables (View on dabblet). While the spec has changed over one and a half year ago to use the var-* syntax, Atkins Jr (spec author) also explains why..." http://gos.si/blog/on-css-variables Px to Rem Conversion By Estelle Weyl. "If you have :root {font-size: 16px;} you can use the following table to convert from PIXELS to REMS..." http://www.standardista.com/px-to-rem-conversion-if-root-font-size-is-16px/ +03: EVALUATION & TESTING. Expert Reviews - What Works Best? By Janet M. Six. "...Instead of noting each instance of a problem, you can note just one example, indicate that it's prevalent throughout the user interface, and describe the impact that has overall..." http://uxmatters.com/mt/archives/2014/01/conducting-expert-reviews-what-works-best.php +04: EVENTS. jQuery Conference San Diego February 12-13, 2014. San Diego, California, U.S.A. http://events.jquery.org/2014/san-diego/ London JS Conf February 13, 2014. London, England, United Kingdom http://www.londonjsconf.com/ Snow*Mobile February 21-22, 2014. Madison, Wisconsin, U.S.A. https://tito.io/sapling/snow-mbile/ Usability Week San Diego February 24-27, 2014. San Diego, California, U.S.A. http://www.nngroup.com/training/san-diego/ Mobile World Congress February 24-27, 2014. Barcelona, Spain http://www.mobileworldcongress.com/ The Intersection of Cloud and Mobility March 25-27, 2014. Gaithersburg, Maryland, U.S.A. http://www.nist.gov/itl/cloud/intersection-of-cloud-and-mobility.cfm +05: HTML5. The Rock'n'roll Guide to ARIA and HTML5 (Video) By Leonie Watson. "Leonie's Generate Conference 2013 presentation" http://www.youtube.com/watch?v=Fe1behOSjdU Slides: http://www.slideshare.net/LeonieWatson/generate-2013-09 +06: JAVASCRIPT. Why is Progressive Enhancement so Unpopular? By Drew McLellan. "...Does that mean we shouldn't use JavaScript? Of course not. Scripting in the browser is an important part of the experience of using the web in 2014. It's my opinion that you shouldn't depend on JavaScript running for your site to work. Build with HTML, add styling with CSS, add behaviour with JavaScript. If the JavaScript fails, the HTML should still work..." http://allinthehead.com/retro/367/why-is-progressive-enhancement-so-unpopular Prototypes Are Not Classes By raganwald. "JavaScript does not have classes. JavaScript has prototypes, and prototypes are not classes. And understanding why JavaScript's prototypes are not classes can be helpful for understanding how to 'Think in JavaScript' and indeed how to 'Think in Objects'..." http://raganwald.com/2014/01/19/prototypes-are-not-classes.html Binary Bitwise Operators in JavaScript By Axel Rauschmayer. "This blog post describes JavaScript's binary bitwise operators: bitwise And (&), bitwise Or (|), and bitwise Xor (^)..." http://www.2ality.com/2014/01/binary-bitwise-operators.html Introducing an Accessible Accordion Widget By Shaumik Daityari. "At the dawn of the millennium, a blind gentleman successfully sued the Sydney Organizing Committee of the Olympic Games as they had failed to make the official website of the Olympic Games adequately accessible to blind users. Over the years, many such cases have come to light, and numerous acts have been passed in various countries which make it mandatory for you to make your website adequately accessible..." http://www.sitepoint.com/introducing-accessible-accordion-widget/ +07: NAVIGATION. Skip-To Widget By PayPal Accessibility Team. "SkipTo is a replacement for your old classic "Skipnav" link, (so please use it as such)! The SkipTo script creates a drop-down menu consisting of the links to the important places on a given web page. The menu will make it easier for keyboard and screen reader users to quickly jump to the desired location by simply choosing it from the list of options..." http://paypal.github.io/SkipTo/ +08: TYPOGRAPHY. @font-face is a Nice Idea But... By David Dorward. "I like the idea of @font-face, but some implementations leave a little to be desired..." http://dorward.me.uk/blog/2014/01/24/font-face +09: USABILITY. Designing for Easy Interaction By Sarah Horton and Whitney Quesenbery. "Success in interaction design is largely a matter of following established patterns, so people can apply what they already know to new contexts. Using known and well-established interactive controls goes a long way in designing for easy interaction. There are specific considerations that will help make controls more usable for people using assistive technologies. And there are design considerations that make interaction more usable and enjoyable for everyone, including people with disabilities." http://alistapart.com/article/designing-for-easy-interaction All Content Must Prove Value By Gerry McGovern. "Some believe that because they are not involved in commercial websites they don't have to prove value. That's not true." http://www.gerrymcgovern.com/new-thinking/all-content-must-prove-value Cards - The Next Paradigm? By Wan-Ting Huang. "I'm going to share some insights about cards and explore other design patterns that those drawn to cards might want to consider...The cards design pattern is a smart solution for the modern web, which is both dynamic and responsive. However, the pattern has its limitations and might be a challenge to adopt when designing for a complex interface..." http://echouser.com/blog/cards-the-next-paradigm/ [Section one ends.] ++ SECTION TWO: +10: 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.]