+++ WEB DESIGN UPDATE.
- Volume 10, Issue 49, May 31, 2012.

An email newsletter to distribute news and information about web design and development. 

++ISSUE 49 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: EVENTS.
04: MISCELLANEOUS.
05: NAVIGATION.
06: TYPOGRAPHY.
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.

Using Tabbed Interfaces with a Screen Reader
By Leonie Watson.
"...Tabbed interfaces are increasingly common on web pages. They make good use of space, and they can be visually intuitive. Using tabs with a screen reader is a different experience though. When it comes to tabbed interfaces on web pages, there are two disadvantages for screen reader users. The visual clues that establish the tab metaphor are not available, and the required form of interaction isn't obvious. This makes understanding and using a tabbed interface with a screen reader an interesting experience..."
http://tink.co.uk/2012/05/using-tabbed-interfaces-with-a-screen-reader/
 
President Obama Orders Government Agencies To Optimize Websites For Mobile Web Accessibility
By James Johnson.
"President Barack Obama on Wednesday issued a directive that requires all major government agencies to make two of their key services available on mobile phones within the year. The President then ordered those agencies to create websites to report on their mobile progress, sites that are due within 90 days..."
http://www.inquisitr.com/242107/president-obama-orders-government-agencies-to-optimize-websites-for-mobile-web-accessibility/

Web Accessibility: Putting People and Processes First
By Brian Kelly.
"For many web authors, developers and policy makers, the issue of accessibility to disabled people is addressed mainly by trying to ensure that their sites conform with the international Web Content Accessibility Guidelines (WCAG) maintained by the Web Accessibility Initiative (WAI) of the World Wide Web Consortium..."
http://www.headstar.com/eablive/?p=719

What's 'large text' in WCAG 2.0 Parlance?
By Steve Faulkner.
"...The take away from this is that it is likely your pages will be viewed on a range of devices and screen sizes, so I suggest sticking with the 4.5:1 color ratio for all text."
http://www.paciellogroup.com/blog/2012/05/whats-large-text-in-wcag-2-0-parlance/ 


+02: CASCADING STYLE SHEETS.

The Cost of Performance, part 1 - CSS Selector Rewriting
By Niels Matthijs. 
"...A good css selector tries to keep future changes in mind. It defines which styles should hit in what particular set of contexts. Each element within the selector should be there for a reason and shouldn't be allowed to be removed. Sometimes removing a part won't affect the css on your current site, but keep in mind the most obvious of changes in requirements. This requires a certain level of experience, but you'll catch up quickly after doing a couple of real-world projects. Clients love to swap certain boxes around, pulling them from their context and placing them where you would never have expected them to go. Making these kind of changes as painless as possible could well enough prove more important than shaving off those few milliseconds of rendering time..."
http://www.onderhond.com/blog/work/cost-of-performance-css-selector-rewriting

5 Patterns To Rearrange Responsive Layouts
By Steven Bradley.
"The most obvious way a responsive design changes is in its layout. Multiple columns become a single column. A sidebar drops below the main content. One block of design elements becomes integrated with another..."
http://www.vanseodesign.com/web-design/responsive-layout-patterns/

The CSS Clip Property
By Louis Lazaris.
"You've probably heard of CSS's clip property. It has some unique features and syntax, and in this post I'll outline how it's used. At the end of the post you'll find a link to a demo page where some photos are used to animate the clip property, just to visually demonstrate what this property does."
http://www.impressivewebs.com/css-clip-property/


+03: EVENTS.

eAccess 12
June 28, 2012.
London, England, United Kingdom
www.headstar.com/eaccess12

Open Web Camp 
July 14, 2012.
San Jose, California, U.S.A.
http://openwebcamp.org/

Smashing Conference 
September 17-19, 2012
Freiburg, Germany
http://smashingconf.com/


+04: MISCELLANEOUS.

Website Design for Tablets and Mobile
By Neal Cabage.
"Recently I went through a redesign, and as part of the effort, I reviewed how best to support tablets and mobile visitors. If you haven't been researching this topic recently, no one could blame you for dismissing mobile/tablets as a novelty that won't have much impact on your web presence. But if that's where you're at, consider this..."
http://www.sitepoint.com/website-design-for-tablets-and-mobile/

Responsive Workflow
By Viljami Salminen.
"During the last week I was at the Webshaped conference listening Stephen Hay's talk about responsive design workflow. This post isn't going to be strictly about that, but as Stephen's way reminded somewhat the way I work myself, it made me want to write down some thoughts about my own workflow and how it has evolved during the past two or three years and how it might still evolve in the future..."
http://viljamis.com/blog/2012/responsive-workflow/

Design Process In The Responsive Age
By Drew Clemens.
"You cannot plan for and design a responsive, content-focused, mobile-first website the same way you've been creating websites for years-you just can't. If your goal is to produce something that is not fixed-width and serves smaller devices just the styles they require, why would you use a dated process that contradicts those goals?.."
http://uxdesign.smashingmagazine.com/2012/05/30/design-process-responsive-age/


+05: NAVIGATION.

Navigation and Search are Twins
By Gerry McGovern.
"Well-organized websites are easier to search and navigate."
http://www.gerrymcgovern.com/nt/2012/nt-2012-05-28-Navigation-twins.htm


+06: TYPOGRAPHY.

Responsive Typography
By Oliver Reichenstein.
"With the chaos of different screen sizes and a new generation of Web browsers, the design paradigms of layout and typography have shifted away from static layouts and system fonts to dynamic layouts and custom Web fonts. But screens have not just changed in size but also in pixel density. In other words: We do not just need responsive layouts, we also need responsive typefaces. To test that assumption, iA has created its new Website with responsive typography-with a custom typeface..."
http://informationarchitects.net/blog/responsive-typography/


+07: USABILITY.

It's About the Content Stupid
By Stephanie Rieger.
"Here's a revolutionary idea. What if all sites were lightweight?..."
http://stephanierieger.com/its-about-the-content-stupid/


+08: XML.

How to Add Scalable Vector Graphics to Your Web Page
By Craig Buckler.
"...At some point, you'll want to embed your finely-crafted SVG directly into a web page. There are no less than six ways to achieve that goal - but not all methods are created equally..."
http://www.sitepoint.com/add-svg-to-web-page/

Creating Inline SVGs with HTML5
By Sue Smith.
"With HTML5 you can embed SVG (Scalable Vector Graphics) markup directly into your pages. In this tutorial we go through the process of including a simple SVG element in an HTML page. We will also run through the technique for altering SVGs in JavaScript in cases where this is preferable to using the HTML5 canvas element..."
http://www.developerdrive.com/2012/05/creating-inline-svgs-with-html5/


[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@d.umn.edu 


[Issue ends.]