. Date: Sat, 12 Mar 2011 05:40:22 -0600 From: Laura Carlson <lcarlson@xxxxxxxxx> To: webdev <webdev@xxxxxxxxxxxxxxx> Subject: [webdev] Web Design Update: March 12, 2011 +++ WEB DESIGN UPDATE. - Volume 9, Issue 37, March 12, 2011. An email newsletter to distribute news and information about web design and development. ++ISSUE 37 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: STANDARDS, GUIDELINES & PATTERNS. 07: USABILITY. 08: XML. SECTION TWO: 09: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Accessible HTML5 Video with JW Player as Fallback By Terrill Thompson. "The DO-IT Video site recently got a face-lift. Among the changes was a new player, which uses the HTML5 <video> element for browsers that support it, and falls back to the JW Player for those that don't..." http://terrillthompson.blogspot.com/2011/03/accessible-html5-video-with-jw-player.html Accessible Tabs - Part 1: The Problem By Emily Coward. "...ideally tabs on the web should replicate the functionality used in applications, so they are more intuitive for everyone..." http://www.nomensa.com/blog/2011/accessible-tabs-part-1-the-problem/ UK Census: Are Screen Reader Users Stupid? By Gez Lemon. "Every 10 years we have to complete a census survey in the UK. I'm working in London this week, so don't have access to the full online survey, but from an initial check it seems an assumption has been made about the intelligence of screen reader users..." http://juicystudio.com/article/uk-census-are-screen-reader-users-stupid.php Using HTML Lists By Leonie Watson. "HTML lists are simple but extremely useful. Like HTML headings, they help give semantic meaning to information on a web page. Coded correctly, lists also give screen reader users important insights into the nature of the content they're exploring..." http://www.nomensa.com/blog/2011/using-html-lists/ Crowdsourcing to Fix the Web By Sharon Perry. "Well.. not the whole web, obviously, but some of the inaccessible bits. Fix The Web is a site which encourages people with disabilities to report any accessibility problems they have with a website. Volunteers then take these problems up with the website owners..." http://blogs.cetis.ac.uk/accessibility/2011/03/08/crowdsourcing-to-fix-the-web/ Captioning Video By John Eric Brandt. "I was recently introduced to a new free captioning service called Universal Subtitles. This service essentially takes the place of a captioning application that you might use (or a professional captioner or speech-to-test reporter) to view, listen and transcribe the speaking parts of a video.As you know, the captioning of video is an accessibility requirement if you want to make your video content available to the Deaf and Hard of Hearing folks." http://jebswebs.net/blog/2011/03/captioning-video/http://jebswebs.net/blog/2011/03/captioning-video/ Mature Age ICT Users Survey 2 By Roger Hudson. "The results of the second survey into how people over the age of 60 use information and communication technologies (ICT) are now available..." http://www.dingoaccess.com/accessibility/mature-age-ict-users-survey-2/ +02: CASCADING STYLE SHEETS. Create a Stylish Contact Form with HTML5 & CSS3 By Chris Spooner. "Follow this step by step process to create your own stylish contact form completely out of HTML5 and CSS3. We'll be using a couple of the handy new features in HTML5 to add cool functionality to our form, while making use of cool CSS3 properties to recreate our Photoshop concept purely in code..." http://line25.com/tutorials/create-a-stylish-contact-form-with-html5-css3 CSS Floats 101 By Noah Stokes. "The float property is a valuable and powerful asset to any web designer/developer working with HTML and CSS. Tragically, it can also cause frustration and confusion if you don't fully understand how it works. Test or refresh your knowledge as Noah Stokes explores float theory and behavior, and guides us through common float-related coding pitfalls..." http://www.alistapart.com/articles/css-floats-101/ Scoped Styles in HTML5 By Louis Lazaris. "The topic of scoped CSS styles in HTML5 came up twice in the comments of a recent post by Chris Coyier. The post itself was discussing the contenteditable attribute, but a few users brought up HTML5's new scoped attribute, used on the <style> element. Let's take a brief look at this future HTML5 feature and see how it might be useful in the ever-changing web development landscape..." http://www.impressivewebs.com/scoped-styles-html5/ CSS Border Tricks with Collapsed Boxes By Thierry Koblentz. "These tricks will help you achieve designs without resorting to the use of images, CSS3 gradient or extraneous markup. By collapsing boxes with zero line-height and height values, we can display content outside of the content box, over borders..." http://www.yuiblog.com/blog/2011/03/08/css-border-tricks-with-collapsed-boxes/ Flexible Height Vertical Centering with CSS, Beyond IE7 By Roger Johansson. "One of the most common CSS questions is undoubtedly how to center an element vertically. There are several techniques for doing that, but many, including one that I posted more than seven years ago in Centering with CSS, rely on specifying a height for the centered content. That obviously makes the technique somewhat inflexible..." http://www.456bereastreet.com/archive/201103/flexible_height_vertical_centering_with_css_beyond_ie7/ +03: COLOR. Colour Contrast and CSS Sprite Maps By Gez Lemon. "CSS sprite maps improve efficiency by making fewer HTTP requests to the server, but most implementations cause serious problems for users who view content in high contrast mode." http://juicystudio.com/article/colour-contrast-css-sprite-maps.php +04: EVALUATION & TESTING. 4 Forgotten Principles of Usability Testing By David Travis. "Many usability tests are worthless. Researchers recruit the wrong kind of participants, test the wrong kind of tasks, put too much weight on people's opinions, and expect participants to generate design solutions..." http://www.userfocus.co.uk/articles/4-forgotten-principles-of-usability-testing.html +05: EVENTS. Midwest UX April 9-10, 2011. Columbus Ohio, U.S.A. http://www.midwestuxconference.com/ Hands-On HTML5 May 5, 2011 in Melbourne, Australia. May 12, 2011 in Brisbane, Australia. May 16, 2011 in Sydney, Australia. May 19, 2011 in Canberra, Australia. http://www.maxdesign.com.au/workshops/#sec1 Hands-On CSS3 May 6, 2011 in Melbourne, Australia. May 13, 2011 in Brisbane, Australia. May 17, 2011 in Sydney, Australia. May 20, 2011 in Canberra, Australia. http://www.maxdesign.com.au/workshops/#sec2 Designer/Developer Workflow Conference July 14-16, 2011. Kansas City, Missouri, U.S.A. http://d2wc.com/ +06: STANDARDS, GUIDELINES & PATTERNS. HTML5 Simplequiz 6 - Zeldman's Fat Footer By Bruce Lawson. "For the last couple of years, it's been fashionable to have 'fat footers' in websites..." http://html5doctor.com/html5-simplequiz-6-zeldmans-fat-footer/ HTML5 Accessibility Chops - Section Elements By Steve Faulkner. "HTML5 introduces new section elements. The new elements include header, footer, section, article, nav and aside. What is the accessibility potential of these new elements for users of assistive technology such as screen readers?..." http://www.paciellogroup.com/blog/2011/03/html5-accessibility-chops-section-elements/ Microsoft's Anti-IE6 Rhetoric By Mike Davies (Isolani). "...I caution web developers supporting this public campaign. As my good friend Steve Webster notes: Microsoft's idea of an upgrade is to IE8, which today has no support for HTML5 or CSS 3 and is already two years behind the current crop of modern web browsers. This isn't a great leap forward...." http://isolani.co.uk/blog/standards/MicrosoftsAntiIe6Rhetoric +07: USABILITY. The Dangers of Design by User By Demetrius Madrigal and Bryan McClain. "...While it is always advisable to understand the user perspective, there are certain dangers that are associated with an over reliance on user input. As we've mentioned in the past, improperly conducted user research can be a liability that could lead you down the wrong path. These kinds of mistakes are extremely costly and easily avoidable. The trick is to know where the pitfalls lie and ensure that you navigate them properly. This month, we'll talk about ways to be a critical consumer of user research..." http://www.uxmatters.com/mt/archives/2011/03/the-dangers-of-design-by-user.php We Killed the Content By Gary Barber. "...So at the end of the day we are responsible in part for killing the web content, just because we have provided people with tools allowing them easy alternation of the content with no real training..." http://manwithnoblog.com/2011/03/07/we-killed-the-content/ A Checklist for Content Work By Erin Kissane. "There's really only one central principle of good content: it should be appropriate for your business, for your users, and for its context. Appropriate in its method of delivery, in its style and structure, and above all in its substance. As Erin Kissane explains, content strategy is the practice of determining what each of those things means for your project-and how to get there from where you are now. We are delighted to present an excerpt from Erin's new book, (and the third title from A Book Apart), The Elements of Content Strategy..." http://www.alistapart.com/articles/a-checklist-for-content-work/ +08: XML. HTML is not XML By Tiffany B. Brown. "...Let me emphasize the above point: server MIME types - not DOCTYPES - determine which parsing rules the browser applies. So what does this mean? It means you need to be a better coder. Make sure that what your server says agrees with what your document delivers. If you can't configure the server, make sure you code your documents according to the MIME type your server says it is. Use a DOCTYPE. Understand the differences between XHTML and HTML. And, as always, validate your code." http://tiffanybbrown.com/2011/03/10/html-is-not-xml/ [Section one ends.] ++ SECTION TWO: +09: 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@xxxxxxxxx [Issue ends.]