+++ WEB DESIGN UPDATE. - Volume 10, Issue 48, May 25, 2012. 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: EVENTS. 05: JAVASCRIPT. 06: MISCELLANEOUS. 07: STANDARDS, GUIDELINES & PATTERNS. 08: TYPOGRAPHY. 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. What's 'Large Text' in WCAG 2.0 Parlance? By Steve Faulkner. "Text that is larger and has wider character strokes is easier to read at lower contrast. The contrast requirement for larger text is therefore lower. This allows authors to use a wider range of color choices for large text, which is helpful for design of pages, particularly titles. 18 point text or 14 point bold text is judged to be large enough to require a lower contrast ratio. (See The American Printing House for the Blind Guidelines for Large Printing and The Library of Congress Guidelines for Large Print). '18 point' and 'bold' can both have different meanings in different fonts but, except for very thin or unusual fonts, they should be sufficient. Since there are so many different fonts, the general measures are used and a note regarding fancy or thin fonts is included." http://www.html5accessibility.com/tests/small-large.html Notes on Applying Multiple Labels for a Control Using the Label Element By Steve Faulkner. "While it is conforming to have multiple label elements pointing to a single control for labelling purposes, it is not recommended. It has been conforming as per (X)HTML specifications for many years, but it is not robustly supported. Other techniques such as wrapping the label around text and control and aria-labelledby do the job better and are much better supported in modern browsers and assistive technology." http://www.paciellogroup.com/blog/2012/05/notes-on-using-multiple-labels-for-a-control-using-the-label-element/ +02: CASCADING STYLE SHEETS. CSS Generated Content and Screen Readers By Roger Johansson. "As all widely used web browsers (unless you still consider IE7 as being widely used) now support the :before and :after pseudo-elements along with the content property, using those pseduo-elements has become more and more common..." http://www.456bereastreet.com/archive/201205/css_generated_content_and_screen_readers/ Understanding the CSS Transforms Matrix By Tiffany Brown. "In this article, I'll cover both the 3-by-3 matrix used for 2D transforms and the 4-by-4 matrix used for 3D transforms." http://dev.opera.com/articles/view/understanding-the-css-transforms-matrix/ How to Center Anything With CSS By Joshua Johnson. "...There are a bunch of different types of web elements and layout situations, each calling for a unique solution for centering (both vertically and horizontally). Today we'll go over a bunch of these scenarios so you can wrap your mind around how they work and come away with the confidence to center anything!..." http://designshack.net/articles/css/how-to-center-anything-with-css/ Responsive Web Design Presentation at STC Summit By Zoe Gillenwater. "Download the slides for my presentation on CSS3, Media Queries, and Responsive Web Design for the STC Summit 2012, as well as get links to related resources on media query and responsive web design techniques, tools, and inspiration." http://zomigi.com/blog/responsive-web-design-presentation/ +03: COLOR. A Precise CSS3 Color Table By Eric A. Meyer. "...I created my own table, which you can now find in the CSS area of meyerweb." http://meyerweb.com/eric/css/colors/ +04: EVENTS. Breaking Development: focus on Responsive June 4, 2012. Minneapolis, Minnesota, U.S.A. http://bdconf.com/2012/focuson-responsive-mn +05: JAVASCRIPT. ECMAScript Language Specification - ECMA-262 Edition 5.1 "This Ecma Standard is based on several originating technologies, the most well known being JavaScript (Netscape) and JScript (Microsoft). The language was invented by Brendan Eich at Netscape and first appeared in that company's Navigator 2.0 browser. It has appeared in all subsequent browsers from Netscape and in all browsers from Microsoft starting with Internet Explorer 3.0..." http://ecma-international.org/ecma-262/5.1/ Some Random JavaScript Coding Tidbits By Louis Lazaris. "Some Random JavaScript Coding TidbitsAlthough my knowledge of HTML and CSS seems somewhat rounded and complete, I don't feel the same way about JavaScript. I always seem to be learning something new, or else reminding myself of stuff I might have learned years ago but have forgotten. So here are a few things I've recently learned or read about that might be useful to you..." http://www.impressivewebs.com/random-javascript-coding-tidbits/ +06: MISCELLANEOUS. Why Publishers Don't Like Apps By Jason Pontin. "The future of media on mobile devices isn't with applications but with the Web." http://www.technologyreview.com/business/40319/ Anatomy of a Mobile-First Responsive Web Design By Brad Frost. "...Every element of a mobile-first responsive web design explained from a user experience point of view." http://bradfrostweb.com/blog/mobile/anatomy-of-a-mobile-first-responsive-web-design/ Why Responsive Design? By Steven Bradley. "Responsive design has grown from an idea and a buzzword to a new approach to designing websites. As it's gained attention, challenges in building responsive sites have emerged, solutions to some of those problems have been proposed, and patterns for how designs adapt have been observed..." http://www.vanseodesign.com/web-design/why-responsive-design/ Browsers at Odds With Web Developers Over 'Adaptive Images' By Scott Gilbertson. "The web design community continues to debate the merits and drawbacks of the WHATWG's proposed adaptive images solution..." http://www.webmonkey.com/2012/05/browsers-at-odds-with-web-developers-over-adaptive-images/ +07: STANDARDS, GUIDELINES & PATTERNS. The Unbearable Lightness of HTML5 - or, The Priority of Constituencies versus the Great Dictator By Jeffery Zeldman. "LET'S DIG A BIT DEEPER into the latest conflict between web developers who are passionate about the future of HTML, and the WHATWG..." http://www.zeldman.com/2012/05/17/editor-vs-constituencies/ HTML - A New Standard By Kyle Weems. "In the past couple days far more eloquent people have spoken about the current srcset 'fiasco' with calmer voices, analyzing the situation with a maturity and fairness that frequently escapes my grasp when I'm hastily penning a post and drawing a comic..." http://cssquirrel.com/blog/2012/05/17/html-a-new-standard/ Publication Standards Part 2 - A Standard Future By Nick Disabato. "The internet is disrupting many content-focused industries, and the publishing landscape is beginning its own transformation in response. Tools haven't yet been developed to properly, semantically export long-form writing. Most books are encumbered by Digital Rights Management (DRM), a piracy-encouraging practice long since abandoned by the music industry. In the second article of a two-part series in this issue, Nick Disabato discusses the ramifications of these practices for various publishers and proposes a way forward, so we can all continue sharing information openly, in a way that benefits publishers, writers, and readers alike." http://www.alistapart.com/articles/publication-standards-part-2-a-standard-future/ The Real Conflict Behind and @srcset By Jason Grigsby. "...We have an existential problem here. A chicken and egg conundrum. How do we reconcile a pre-parser that wants to know what size image to download ahead of time with an image technique that wants to respond to its environment once the page layout has been calculated?..." http://blog.cloudfour.com/the-real-conflict-behind-picture-and-srcset/ +08: TYPOGRAPHY. Web Design Manifesto 2012 By Jeffery Zeldman. "THANK YOU for the screen shot. I was actually already aware that the type on my site is big. I designed it that way. And while I'm grateful for your kind desire to help me, I actually do know how the site looks in a browser with default settings on a desktop computer. I am fortunate enough to own a desktop computer. Moreover, I work in a design studio where we have several of them..." http://www.zeldman.com/2012/05/18/web-design-manifesto-2012/ Typesetting Paragraphs on Web Pages By Louis Lazaris. "I don't know who started it, but at some point in the web's relatively short history, we decided that paragraphs displayed on web pages should be 'typeset' in a manner similar to what we see by default in a Microsoft Word document: an empty line after a paragraph, and no indent for each paragraph..." http://www.impressivewebs.com/typesetting-paragraphs-web-pages/ +09: USABILITY. Beautiful Does Not Always Mean Usable By Gerry McGovern. "It's good to make your website or application as beautiful as possible, but not at the expense of usefulness." http://www.gerrymcgovern.com/nt/2012/nt-2012-05-21-Function-triumph.htm Repurposing versus Optimized Design By Jakob Nielsen. "Repurposing design or content has never a successful strategy. "It's cheap but degrading to reuse content and design across diverging media forms like print vs. online or desktop vs. mobile. Superior UX requires tight platform integration." http://www.useit.com/alertbox/repurposing.html Repurposing vs Optimized Design: It's Not a Battle By Craig Buckler. "...Jakob has been accused of bashing responsive design. The tone of his article gives that impression and it detracts from his main point: a dedicated mobile design offers a better mobile experience. If he's guilty of anything, it's stating the obvious." http://www.sitepoint.com/jakob-nielsen-repurposing-vs-optimized-design-feedback/ Separate Mobile Site vs. Responsive Design By Paul Boag. "Is responsive design really the right answer? Would you be better having a separate mobile website? Its all about return on investment." http://boagworld.com/mobile-web/separate-mobile-site-vs-responsive-design/ Forms Part One - The Reservoir of Goodwill By Michael Harris. "In this and subsequent articles, I will be focussing on improving long, multistep forms..." http://www.nomensa.com/blog/2012/forms-part-one-the-reservoir-of-goodwill/ Quick Course On Effective Website Copywriting By Peep Laja. "Many dismiss copywriting as something that ad agency people do. Truthfully, all of us need to pay close attention to copywriting if we want to achieve our business objectives..." http://www.smashingmagazine.com/2012/05/18/quick-course-on-effective-website-copywriting/ The History Of Usability: From Simplicity To Complexity By Mads Soegaard. "The story of usability is a perverse journey from simplicity to complexity. That's right, from simplicity to complexity-not the other way around..." http://uxdesign.smashingmagazine.com/2012/05/23/the-history-of-usability-from-simplicity-to-complexity/ +10: XML. Scalable Vector Graphics: Drawing Basics By Craig Buckler. "In my previous posts we discussed what SVGs are and reasons you should consider SVGs for your project. In this article we'll look at the basic concepts, document structure and drawing elements..." http://www.sitepoint.com/svg-drawing-basics/ [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.]