[webdev] Web Design Update: October 4, 2012

Thu Oct 4 06:23:09 CDT 2012

+++ WEB DESIGN UPDATE.
- Volume 10, Issue 15, October 4, 2012.

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

++ISSUE 15 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: BOOKS.
03: CASCADING STYLE SHEETS.
04: EVALUATION & TESTING.
05: EVENTS.
06: JAVASCRIPT.
07: MISCELLANEOUS.
08: NAVIGATION.
09: STANDARDS, GUIDELINES & PATTERNS.
10: TOOLS.
11: TYPOGRAPHY.
12: USABILITY.

SECTION TWO:
13: What Can You Find at the Web Design Reference Site?

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

New Image-Description Guidelines Coming from ISO/IEC
By Geoff Freed.
"Image-description enthusiasts will be happy to learn that ISO and the
IEC are preparing to issue a new set of guidelines pertaining to…
well, image descriptions. It's called 'ISO/IEC TS 20071-11 -
Information Technology - User Interface Component Accessibility - Part
11 Guidance for Text Alternatives for Images,' and, having just passed
through the approval process, should be available in its final format
shortly..."
http://blog.diagramcenter.org/?p=365

Google Announces Accessibility Updates to Apps
By John Eric Brandt.
"After some strong criticism last year from the Access Technology
Higher Education Network (ATHEN) Google Apps Accessibility Interest
Group (published in October 2011), Google appears to have responded.
I wrote up a summary of those concerns for Maine CITE..."
http://jebswebs.net/blog/2012/09/google-announces-accessibility-updates-to-apps/

Greater Accessibility for Google Apps
By Google.
"It's been a year since we posted about enhanced accessibility in
Google Docs, Sites and Calendar. As we close out another summer, we
want to update our users on some of the new features and improvements
in our products since then. We know that assistive technologies for
the web are still evolving, and we're committed to moving the state of
accessibility forward in our applications."
http://googleblog.blogspot.com/2012/09/greater-accessibility-for-google-apps.html

An Update on Apps Accessibility in the Last Year
By Jeffrey Harris, Google.
"...With the new school year already underway, we wanted to do a quick
recap of some of the accessibility changes we've made in the past year
... so that there's an easy place to look for a list of some of the
bigger changes we've been making in Apps..."
https://groups.google.com/forum/#!topic/accessible/BVvL293pWJ0/discussion

Cheat Sheets
By The National Center on Disability and Access to Education.
"A series of informative accessibility pamphlets, or 'Cheat Sheets,'
have been developed to assist anyone who is creating accessible
content. These resources are catered to less-technical individuals,
such as faculty and staff, and are available to all. GOALS regularly
adds new resources to the NCDAE site..."
http://www.ncdae.org/resources/cheatsheets/

Survey - Cloud Accessibility for Visually Impaired and Normally Sighted People
By Diana Kornbrot.
"The aim of the project  was to obtain key information that could
influence the design of CLOUD applications to make them easier to use
for both visually impaired and  sighted individuals.."
http://dianakornbrot.wordpress.com/projects/survey-cloud-accessibility-for-visually-impaired-and-normally-sighted-people/

A Challenge to Accessibility Testing Tool Vendors
By Karl Groves.
"...All five of these criteria are aimed at one thing: Quality. For me
to give out a recommendation for any product - not just an automated
accessibility testing tool - I have to feel comfortable that I'm
steering people to a vendor and a product which has a firm commitment
to quality, not just for their product but for their related services
and support. I'm not going to vouch for anything less. That's my
promise to my customers, potential customers, peers, and members of
the accessibility community."
http://www.karlgroves.com/2012/10/03/a-challenge-to-accessibility-testing-tool-vendors/

+02: BOOKS.

Cunningham, Katie. The Accessibility Handbook, O'Reilly Media, 2012.

+03: CASCADING STYLE SHEETS.

Use Inherit to Reduce Repetition of CSS Property Values
By Roger Johansson.
Every now and then you will find yourself having to repeat the same
value for a particular property in several CSS rules. Sometimes doing
so is necessary, but there are some situations when you can use the
'inherit' value to avoid repeating yourself.
http://www.456bereastreet.com/archive/201209/use_inherit_to_reduce_repetition_of_css_property_values/

CSS: The Definitive Guide, Fourth Edition
By Eric A. Meyer.
"I'm really excited to announce that CSS: The Definitive Guide, Fourth
Edition, is being released one piece at a time..."
http://meyerweb.com/eric/thoughts/2012/10/01/csstdg4e/

Default CSS Display Values for Different HTML Elements
By Louis Lazaris.
"Every element in an HTML document accepts a value for the CSS display
property. The possible values you can use for display are many..."
http://www.impressivewebs.com/default-css-display-values-html-elements/

Styling Buttons in iOS WebKit and -webkit-appearance:none
By Roger Johansson.
I just recently ran into an issue when styling buttons that had me
pulling my hair for a while. I had my buttons looking the way they
were supposed to look in desktop browsers, but when I went to have a
look in Safari for iOS, much of my CSS wasn't applied.
http://www.456bereastreet.com/archive/201111/styling_buttons_in_ios_webkit_and_-webkit-appearancenone/

+04: EVALUATION & TESTING.

2 Kinds of Usability Test
By David Travis.
"There are two different types of usability test and each has
different aims. Which test you choose will have implications for the
number of participants you test, the methodology you use and the way
you log, analyse and present the data."
http://www.userfocus.co.uk/articles/2-kinds-of-usability-test.html

Five Critical Quantitative UX Concepts
By Jeff Sauro.
"...Here are five of the more critical but challenging concepts. We
didn't just pick some arbitrary geeky stuff to stump math geeks (or
get you an interview at Google). These are fundamental concepts that
take practice and patience but are worth the effort to understand..."
http://www.measuringusability.com/blog/five-hard-quant.php

+05: EVENTS.

Mobile JS Summit 2012
November 12, 2012.
Online
http://www.environmentsforhumans.com/2012/mobile-javascript-summit

+06: JAVASCRIPT.

Learnable Programming
By Bret Victor.
"Designing a programming system for understanding programs..."
http://worrydream.com/LearnableProgramming/

Unobtrusive JavaScript
By Jason Moon.
"The meaning of the phrase unobtrusive JavaScript has changed since
jQuery came around. To understand this change, let's first go back to
when we used to write code like this..."
http://blog.socialcast.com/unobtrusive-javascript-2/

+07: MISCELLANEOUS.

Beyond the Responsive Homepage in #highered: UNL and Some?
By Karine Joly.
The past 12 months have been marked by a rising interest for
responsive web design techniques in higher education..."
http://collegewebeditor.com/blog/index.php/archives/2012/09/27/beyond-the-responsive-homepage-in-highered-unl-and-some/

Encouraging Better Client Participation In Responsive Design Projects
- Design Process
By Andy Clarke.
"Last week at the fabulous Smashing Conference in Freiburg, I gave a
new talk, one I'd written just a few hours prior. I chose not to use
slides, but instead to speak about three things that I'm incredibly
enthusiastic about..."
http://www.smashingmagazine.com/2012/09/28/better-client-participation-in-responsive-design-projects/

The Responsive Design Myth
By Giselle Abramovich.
"Responsive design is the new HTML5, a fancy term thrown around to
prove that you 'get it' in mobile. On the surface, responsive design
makes total sense: design for an optimal experience across a wide
range of devices..."
http://www.digiday.com/publishers/the-responsive-design-myth/

The Art of Web Design (Video)
By Virginia DeBolt.
"Whitney Hess recently mentioned this video from PBS on her site. It's
an interview with Whitney, Jeffrey Zeldman, and Jason Santa Maria
about web design. It's short and you're gonna love it..."
http://www.webteacher.ws/2012/09/28/the-art-of-web-design-video/

+08: NAVIGATION.

Avoiding the Dirty Magnet in Navigation Design
By Gerry McGovern.
"A dirty magnet is a link that attracts people to click on it
promising to bring them somewhere that it won't."
http://www.gerrymcgovern.com/new-thinking/avoiding-dirty-magnet-navigation-design

+09: STANDARDS, GUIDELINES & PATTERNS.

Recent W3C HTML5 Updates
By Adrian Roselli.
"I've been a member of the W3C HTML Working Group for a month now and
appear to have joined at a point when there is a push to get HTML5
wrapped up as quickly as possible. While we all (should) know that
HTML5 as it is referenced in the media is really a combination of
related specifications, this push is about the core HTML5
specification itself..."
http://blog.adrianroselli.com/2012/09/recent-w3c-html5-updates.html

HTML5 Image Description Extension
Charles McCathie Nevile, Editor.
"This specification defines a longdesc attribute to extended
descriptions to images in HTML5-based content."
http://lists.w3.org/Archives/Public/public-html-a11y/2012Sep/att-0478/longdesc.html

Using HTML5 and Javascript to Deliver Text-Based Audio Descriptions
By IBM and The National Center for Accessible Media (NCAM).
"...NCAM has also investigated how to use HTML5, Javascript, MathML
and the Popcorn.js HTML5 Media Framework to deliver accessible math
alongside video embedded in a Web page..."
http://ncamftp.wgbh.org/ibm/dvs/

Using HTML5 and Javascript to Deliver Accessible Supplemental Materials
By The National Center for Accessible Media (NCAM).
"This new project aims to demonstrate the inclusion of enhancements in
ways that are both visual and non-visual, all of which are
screen-reader accessible and delivered using HTML5, Javascript and the
Popcorn.js HTML5 Media Framework. Read on to learn about the
demonstration model that is now available for you to test..."
http://ncamftp.wgbh.org/rd/quadratic/

+10: TOOLS.

FireFox HeadingsMap Extension
By Rumoroso.
"The extension generates an index (or map) of any web document
structured with headings. There are some differences from other, for
example..."
https://addons.mozilla.org/en-US/firefox/addon/headingsmap/

Web Evaluation Tools Bookmarklet
By NC State University IT Accessibility Resources.
"This tool will visually show you any headings, ARIA landmarks,
internal links, and tabindex attributes present on a page. This
information is useful for examining the structure of a page as a
screen reader user would experience it, without having to actually
start up a screen reader to test it..."
http://accessibility.oit.ncsu.edu/tools/web-evaluation-tools/

WAVE Toolbar
By WebAIM.
"The WAVE Firefox toolbar provides a mechanism for running WAVE
reports directly within Firefox. Because the toolbar reports runs
entirely within your web browser, no information is sent to the WAVE
server. This ensures 100% private and secure accessibility reporting.
The toolbar can check intranet, password-protected, dynamically
generated, or sensitive web pages. Also, because the WAVE toolbar
evaluates the rendered version of your page, locally displayed styles
and dynamically-generated content from scripts or AJAX can be
evaluated..."
http://wave.webaim.org/toolbar

Restyle Your CSS Declarations With CSScomb
By Craig Buckler.
"How do you order your CSS properties? Some developers prefer an
alphabetical list. Some prefer grouping by related types. Ultimately,
it doesn't matter. There's no 'wrong' way and you should use whatever
style suits you. It will become a habit and you'll be able to shave
precious seconds when searching your own CSS code..."
http://www.sitepoint.com/csscomb-css-property-sorting/

+11: TYPOGRAPHY.

How Sans-Serif Typeface Styles Affect Readability
By anthony.
"...There are lots of sans-serif typefaces you can choose from. But
before you choose, ask yourself whether reading speed and ease is of
prime concern for the user's task. If the user will find themselves in
situations where they need to spend less time fixating on a screen and
more attention on doing an outside task, then make sure you choose a
typeface that's proven to make reading text fast and easy. Choosing a
typeface isn't always about interface aesthetics. Sometimes it's about
user readability and safety, which are far more important."
http://uxmovement.com/content/how-sans-serif-typeface-styles-affect-readability/

Chromatic Type with Pseudo Elements
By Adrian A. Roselli.
"Typography on the web has come a long way from the days of a handful
of web-safe fonts, six sizes, and little other control. With the
ability to embed custom typefaces in web pages and exert a great deal
of control via CSS, it was a matter of time before old-world printing
techniques for multi-colored text came to the web..."
http://blog.adrianroselli.com/2012/10/chromatic-type-with-pseudo-elements.html

Beauty and Ugliness in Type Design
By ilovetypography.
"Peter Bilak on the process of designing his newly releases Karloff typeface..."
http://ilovetypography.com/2012/09/25/beauty-and-ugliness-in-type-font-design/

+12: USABILITY.

Don't Let Your CMS Wreck Your Content, Part 2
By Dey Alexander.
"In part 1, I wrote about problems with page titles generated by
content management systems. In this article, we'll look at problems
with generating file names and text alternatives for images. And I
make suggestions about how to set up your CMS for better results..."
http://www.4syllables.com.au/2012/09/cms-wreck-content-part2/

Fixing A Broken User Experience - UX Strategy
By Stefan Klocek.
"... In this article, we'll introduce you to a strategy for fixing the
broken experience that starts with surface improvements, goes
progressively deeper into structural issues and ends with a big
organizational shift..."
http://uxdesign.smashingmagazine.com/2012/09/27/fixing-broken-user-experience/

Small But Significant Usability Sins that Websites Should Never Commit
By Elezea.
"...So, here it is - an incomplete, top-of-mind list of usability sins
your website should never commit, based on data gathered through
in-person usability testing: Don't use an asterisk (*) to mark
required form fields...Don't open links in new browser tabs...Don't
have an FAQ page...Don't use PDFs at all...Don't give table rows
highlighting mouse-overs if the rows aren't clickable... "
http://www.elezea.com/2012/09/usability-sins/

14 Guidelines for Creating Great Headlines and Web Copy
By Christian Watson.
"Here is a summary of the guidelines - click through to read the
details for each..."
http://www.smileycat.com/miaow/archives/002998.php

[Section one ends.]

++ SECTION TWO:

+13: 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 at d.umn.edu

[Issue ends.]