+++ WEB DESIGN UPDATE. - Volume 10, Issue 01, July 1, 2012. An email newsletter to distribute news and information about web design and development. ++ISSUE 01 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: EVENTS. 05: JAVASCRIPT. 06: MISCELLANEOUS. 07: NAVIGATION. 08: STANDARDS, GUIDELINES & PATTERNS. 09: TYPOGRAPHY. 10: USABILITY. SECTION TWO: 11: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Four Keys to System-wide Web Accessibility By Jon Whiting. "The main focus of the GOALS project (a partner of WebAIM) is to help institutions of higher education develop a system-wide approach to web accessibility. At the beginning of the GOALS project, we analyzed several exemplary post-secondary institutions to identify what sets these institutions apart from schools that have been less successful in implementing web accessibility. These findings helped form Recommended Practice Indicators for Institutional Web Accessibility. This document is targeted to higher education, but I think the four principles at its foundation are universal. They are (in less academic terms)..." http://webaim.org/blog/four-keys-to-accessibility/ How do You Solve the Accessible Video and Audio Challenge? By Glenda Sims. "After a decade of working in the field of web accessibility, I still hear people who think that creating accessibile multimedia for the web is too expensive and too hard to do. I'll admit, I was initially overwhelmed by the challenges. But today, I know that accessible multimedia is doable and smart business. You just need to know how to be super efficient with your resources and how to prioritize. And while I know a lot about this topic, it is evolving and I can always learn more from the accessibility tribe..." http://www.glendathegood.com/blog/?p=718 Federal Judge Rules that ADA Covers Web-only Businesses By Lainey Feingold. "Those who believe that web content should be available to everyone regardless of disability received welcomed news on Tuesday, June 19. On that day, a federal district court judge in Massachusetts held that the Americans with Disabilities Act (ADA) applies to web-only businesses. The ruling came in a case brought by the National Association of the Deaf (NAD) against Netflix for the streaming video giant's failure to provide closed captioning on most of its 'Watch Instantly' programming streamed on the Internet. Netflix had tried to get the case thrown out of court, arguing that the ADA only applies to physical places, and not to a web-only operation like Netflix' streaming video service..." http://lflegal.com/2012/06/netflix/ Ruling on Accessibility and the ADA By Andrew Kirkpatrick. "The United States District Court in Massachusetts ruled June 19 on a motion to dismiss a suit brought against Netflix by the National Association of the Deaf (NAD) and others. The suit is about Netflix not providing enough captions for videos delivered via the 'Watch Instantly' site, but the ruling addresses the applicability of the Americans with Disabilities Act (ADA) for electronic accessibility in general, not just limited to access issues for users who are deaf or hard of hearing..." http://blogs.adobe.com/accessibility/2012/06/ruling-on-accessibility-and-the-ada.html Let's Put Down the Pitchforks and Get Some Perspective By Karl Groves. "...As a community, I think it is important that we remember to take into consideration the way we deliver our message. The single best trait that is universal among the people I've encountered in this community is our shared passion for making things better for others and it is the closest thing to true altruism I've ever experienced. We must remember, however, that we're running a marathon and not a sprint..." http://www.karlgroves.com/2012/06/21/lets-put-down-the-pitchforks-and-get-some-perspective/ +02: CASCADING STYLE SHEETS. Using Media Queries to Hide CSS3 from Older Browsers By Roger Johansson. "When working around bugs and different levels of support in various browsers, a common approach is using conditional comments to target certain versions of Internet Explorer. Come to think of it, it's pretty rare to need to fix something for an older version of any other browser. People who do not use IE tend to upgrade quicker and CSS-related bugs in other browsers tend to be less severe than in IE, especially compared to IE7 and older..." http://www.456bereastreet.com/archive/201206/using_media_queries_to_hide_css3_from_older_browsers/ Powerful New CSS- and JavaScript Techniques By Smashing. "Since the release of the previous post, we've been collecting, sorting, filtering and preparing a compact overview of powerful new CSS techniques. Today we finally present some of these techniques. Use them right away or save them for future reference..." http://coding.smashingmagazine.com/2012/06/21/powerful-new-cssjavascript-techniques/ Using Min/Max Width and Height in CSS By Louis Lazaris. "Even if you're just getting started with CSS, you've likely used the height and width properties quite a bit already. But you've probably noticed that those properties can put unnecessary constraints on your page elements. So you might benefit from knowing and using related properties that use the 'min' and 'max' prefixes..." http://www.impressivewebs.com/min-max-width-height-css/ Working with CSS Regions and Shadow DOM By Razvan Caliman. "When we set out to develop CSS Regions we knew that most innovative applications of the technology would come from creative integrations with other web standards. Shadow DOM is one such example of a web standard just itching to be experimented with..." http://blogs.adobe.com/webplatform/2012/06/25/working-with-css-regions-and-shadow-dom/ +03: COLOR. F-M 100 Hue Test - Compare Your Result with Others By Daniel Fluck. "A few days ago I released the F-M 100 Hue Color Vision Deficiency Test on Colblindor. Since then many people have taken the test which makes it possible to give you some added value on the test. From today on you can also compare your result with 'the rest of the world'..." http://www.colblindor.com/2012/06/25/f-m-100-hue-test-compare-your-result-with-others/ +04: EVENTS. The Future Of Web Design October 22-24, 2012. New York, New York, U.S.A. http://futureofwebdesign.com/new-york-2012/ User Interface 17 Conference November 5-7, 2012. Boston, Massachusetts, U.S.A. http://www.uie.com/events/uiconf/2012/ Full Frontal 2012 November 9, 2012. Brighton, England, United Kingdom http://2012.full-frontal.org/ +05: JAVASCRIPT. JavaScript Closures Demystified By Colin Ihrig. "Closures are a somewhat advanced, and often misunderstood feature of the JavaScript language. Simply put, closures are objects that contain a function and a reference to the environment in which the function was created. However, in order to fully understand closures, there are two other features of the JavaScript language that must first be understood―first-class functions and inner functions..." http://www.sitepoint.com/javascript-closures-demystified/ ARIA role=alert Browser Support By Steve Faulkner. "ARIA role=alert is supported across modern browsers and assistive technology, but implementation in browsers differ, which can lead to role=alert appearing to be unsupported..." http://www.paciellogroup.com/blog/2012/06/html5-accessibility-chops-aria-rolealert-browser-support/ Notes on Using ARIA By Steve Faulkner. "I have jotted down some notes on ARIA concepts and usage that may be useful for developers. The first rule of ARIA use: If you can use a native HTML element or attribute instead of an ARIA role, state or property, then do so..." http://www.paciellogroup.com/blog/2012/06/html5-accessibility-chops-using-aria-notes/ +06: MISCELLANEOUS. Why HTML5 Urgently Needs an HTML Adaptive Images Mechanism By Bruce Lawson. "...Webkit has implemented a new non-standard CSS function called -webkit-image-set...I bet it's 0.03 nanoseconds before developers convert useful alternate text into an empty
s with adaptive background images using -webkit-image-set and (please!) a fallback background images for non-webkit browsers. Why wouldn't they? Retina screens will download massive but beautiful images, while users of lower-res phones save bandwidth by downloading smaller images instead of huge images and then reducing them down. Problem solved. And, unfortunately, people who don't download images, or can't perceive images won't get any alternate text, as there is no content element any more. Those guys have always been last in the pecking order and there's no reason to assume they'll get a better deal this time." http://www.brucelawson.co.uk/2012/html5-urgently-needs-adaptive-images-mechanism/ Optimizing vs. Adapting for Devices By Luke Wroblewski. "In multi-device adaptation vs. optimization I highlighted a common distinction between responsive Web design and server-side solutions for adjusting Web sites to different devices. Later I read two articles that did a good job of illustrating this distinction..." http://www.lukew.com/ff/entry.asp?1572 Are Tablets Mobile Devices? By Luke Wroblewski. "Many organizations include tablets in their overall definition of 'mobile"' computing. But when you look at where and when tablets are being used today, they're much more "mobile in the home" than mobile..." http://www.lukew.com/ff/entry.asp?1571 Survey - Tablet Owners Prefer Browsers to Native Apps By John Paul Titlow. "...Among tablet owners, at least, reading on the mobile Web is preferable to using native apps, according to a recent survey from the Online Publishers Association. Forty-one percent of tablet-bound readers prefer reading on the Web, compared to the 30% who would rather launch a standalone app from a specific publisher." http://www.readwriteweb.com/archives/survey-tablet-owners-prefer-browsers-to-native-apps.php +07: NAVIGATION. Enhancing ARIA Landmarks with Aria-Labelledby By Leonie Watson. "ARIA landmark roles provide a useful way for screen reader users to navigate through web pages, and to understand the purpose of different sections of content on the page. With just a little bit more ARIA you can make landmarks even more helpful to blind and partially sighted people..." http://tink.co.uk/2012/06/enhancing-aria-landmarks-with-aria-labelledby/ Expandable Mobile Search Form By Nick La. I'm going to share a CSS tutorial on how to make an expandable search form that is suitable for mobile and responsive designs. This trick uses native CSS properties - no Javascript or extra markups required. It is a simple and effective way to design a compact search form. http://webdesignerwall.com/tutorials/expandable-mobile-search-form +08: STANDARDS, GUIDELINES & PATTERNS. HTML5 Multimedia: Using Video with Canvas By Ian Devlin. "In addition to native multimedia, one of the most talked about capabilities that HTML5 brings to the web table is the ability to draw and manipulate graphics using JavaScript via the new canvas element. The element defines an area on a web page that you can draw on using a JavaScript API. Ian Devlin shows you how to use it..." http://www.peachpit.com/articles/article.aspx?p=1760497&WT +09: TYPOGRAPHY. How To Maintain Readable Type In Responsive Design By Steven Bradley. "Setting type involves choices that create proportional relationships in your text. Done well and your text will be both easy and desirable to read. As responsive layouts adapt to varying screen widths, one of these choices (line-length) changes. To maintain the same proportional relationships other aspects of the type need to adjust..." http://www.vanseodesign.com/web-design/responsive-typography/ +10: USABILITY. 7 Cs of Uuality Web Content. By Dey Alexander. "If you want to write better content for your website, intranet or blog, aim for these 7 qualities. They're based on the classic '7 Cs of communication', reworked for communicating online..." http://www.4syllables.com.au/2012/06/7-cs-web-content/ Is There a Real Issue? By Russ Weakley. "The Australian Museum web team recently discussed some potential tweaks to the What's on page. During the discussion, the web manager, Lynda Kelly, asked the key question - 'Is there a real problem here'..." http://www.maxdesign.com.au/2012/06/21/is-there-a-real-problem/ Getting Agreement for Your Homepage By Paul Boag. "Social media, search engines and deep linking have all reduced the importance of your homepage. However, that doesn't stop everybody from wanting their content on it..." http://boagworld.com/business-strategy/getting-agreement-for-your-homepage/ Balancing Simplicity and Complexity By Gerry McGovern. "Do people want a simple life? Or do they want the complex life made simple?..." http://www.gerrymcgovern.com/nt/2012/nt-2012-06-25-Complexity-simplicity.htm [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.]