[webdev] Web Design Update: June 19, 2014

Thu Jun 19 06:32:33 CDT 2014

+++ WEB DESIGN UPDATE.
- Volume 12, Issue 52, June 19, 2014.

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

++ISSUE 52 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: DREAMWEAVER.
04: HTML5.
05: JAVASCRIPT.
06: MISCELLANEOUS.
07: NAVIGATION.
08: STANDARDS, GUIDELINES & PATTERNS.
09: TOOLS.
10: USABILITY.

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Does that WCAG 2 Success Criteria Really Apply?
By Jonathan Avila.
"...It is important for testers, developers, and those creating
accessibility requirements understand what is covered by WCAG 2
success criteria. This is not only important in reporting the correct
results of an accessibility audit but also to ensure that requirements
and implementation efforts correctly meet the WCAG SC. Testers should
use a platform such as AMP to ensure that correct SC are automatically
flagged and accurate WCAG support and conformance documents can be
created..."
https://www.ssbbartgroup.com/blog/2014/06/11/does-that-wcag-2-success-criteria-really-apply/

Giz Explains - How Blind People See the Internet
By John Herrman.
"...whether you're an app developer, web designer or just a dude who
likes to update his blog every once in a while, remember that someone,
somewhere, might be listening to what you've written. And that alt
texts in images aren't just for jokes..."
http://gizmodo.com/5620079/giz-explains-how-blind-people-see-the-internet

3% of Users Browse with IE9 and 14% of Users have a Disability. Why do
We Only Cater for the Former?
By Fiona Taylor Gorringe.
"I'd like to start this post with a disclaimer: I don't know much
about creating accessible websites. That's what has brought me to
writing this blog post today - it concerns me that as a senior
developer I've made it this far without gaining much meaningful
knowledge on the subject..."
http://www.fionatg.com/BlogPost/1005/3-of-users-browse-with-ie9-and-14-of-users

Did You Know? 80 Percent of People Who Use Closed Captions Are Not
Hard of Hearing
By Lily Bond.
"...Ofcom found that of the 7.5 million people using closed captions
in their study, only 1.5 million had a hearing impairment. That means
that 80% of people using closed captions had no hearing impairment at
all. That's an amazing statistic, given that many people think closed
captions only provide benefit to those with hearing impairments...."
http://www.captionsforyoutube.com/blog/posts/13-did-you-know?-80-percent-of-people-who-use-closed-captions-have-no-hearing-impairment

Open Letter on Future of Web Accessibility
By Rich Schwerdtfeger.
"We are at a critical juncture in the in the accessibility field
today. More pressure than at any previous time has been placed on
businesses world-wide to deliver accessible Information and
communications technology (ICT)..."
http://blog.knowbility.org/content/open-letter-to-all-who-want-accessible-web/

Mix Audio so Foreground Speech is Louder than Background Sounds
By Denis Boudreau.
"Make sure foreground speech is always four times louder than
background sounds..."
http://dboudreau.tumblr.com/post/89056260322/mix-audio-so-foreground-speech-is-louder-than

+02: CASCADING STYLE SHEETS.

Center and Crop Thumbnails with CSS
By Jonathan Nicol.
"Here is a handy CSS centering technique I first noticed in the
WordPress media library, where it is used to centre and crop
irregularly sized thumbnails within a square container..."
http://jonathannicol.com/blog/2014/06/16/centre-crop-thumbnails-with-css/

+03: DREAMWEAVER.

Form New Habits for Working with CSS in Dreamweaver CC
By  Virginia DeBolt.
"The way the CSS Designer in Dreamweaver CC creates selectors is
different from the way you may be in the habit of working with
previous version of Dreamweaver..."
http://www.webteacher.ws/2014/06/17/form-new-habits-working-css-dreamweaver-cc/

+04: HTML5.

The Picture Element
W3C Working Draft, 16 June 2014
"This specification defines the HTML picture element and extends the
img and source elements to allow authors to declaratively control or
give hints to the user agent about which image resource to use, based
on the screen pixel density, viewport size, image format, and other
factors. "
http://picture.responsiveimages.org/

Implementation Status for HTML5 Element/Attribute Accessibility Mappings
By Steve Faulkner.
"...Using the Model CR Exit Criteria (Public Permissive version 3) the
following is asserted..."
http://stevefaulkner.github.io/html-mapping-tests/

HTML5 Accessibility Implementation Support in Browsers
By Steve Faulkner.
"I have been testing and tracking browser accessibility implementation
support for a range of new HTML features since 2010. Data can be found
on HTML5accessibility.com. Over the last week I also undertook a more
formal, targeted testing of the normative implementation requirements
in the WAI-ARIA section of the HTML5.0 specification which is
currently on its way to becoming a W3C Recommendation..."
http://blog.paciellogroup.com/2014/06/html5-accessibility-implementation-support-browsers/

Adding Captions and Subtitles to HTML5 Video
By Ian-Devlin and Chris David Mills.
"In other articles we looked at how to build a cross browser video
player using the HTMLMediaElement and Window.fullScreen APIs, and also
at how to style the player. This article will take the same player and
show how to add captions and subtitles to it, using
Web_Video_Text_Tracks_Format and the <track> element..."
https://developer.mozilla.org/en-US/Apps/Build/Manipulating_media/Adding_captions_and_subtitles_to_HTML5_video

<w3c-h>
By Matthew Tylee Atkinson.
"Custom heading element intended to replace <h1> to <h6> with a single
heading element (yup just like XHTML promised land) and the promise of
the HTML5 outline..."
https://github.com/ThePacielloGroup/w3c-h#w3c-h

+05: JAVASCRIPT.

Multiple Return Values in ECMAScript 6
By Axel Rauschmayer.
"If you combine the features 'property value shorthand' and
'destructuring', ECMAScript 6 gives you an elegant way to handle
multiple return values. This blog post explains why that is useful and
how it works..."
http://www.2ality.com/2014/06/es6-multiple-return-values.html

+06: MISCELLANEOUS.

Doing Responsive Right (video)
By Derek Featherstone.
Derek's Mobilism 2013 presentation: "Your mobile computing devices use
technology that was originally designed for accessibility purposes.
There has always been a significant overlap in terms of mobile and
accessibility best practices. Rooted in simplifying and optimizing
interfaces, Responsive Web Design gives us tools that help us provide
a better user experience. And while there is a cross-over between
mobile and accessibility and similar philosophies between
accessibility and RWD, using Responsive Web Design techniques doesn't
automatically make something accessible. Making a Responsive design
accessible actually requires a deep look at design patterns, layout,
interaction and more. In this session, Derek looks at accessibility
issues that creep into Responsive designs, what you can do about them,
and provides guiding principles for ensuring that you're creating an
experience that is optimized for everyone, including people with
disabilities."
http://vimeo.com/68965033

+07: NAVIGATION.

Help Users Orient Themselves in a Set of Pages Using a Breadcrumb Trail
By Denis Boudreau.
"Make sure users can rely on a breadcrumb trail to easily locate where
they are..."
http://dboudreau.tumblr.com/post/88770020962/help-users-orient-themselves-in-a-set-of-pages-using-a

Provide Links That are Meaningful from Link Text Labels Only
By Denis Boudreau.
"Make sure the purpose of links can be completely determined solely
from the link's text label"
http://dboudreau.tumblr.com/post/88857881642/provide-links-that-are-meaningful-from-link-text-labels

+08: STANDARDS, GUIDELINES & PATTERNS.

HTML5: On Our Way to Recommendation
By Philippe le Hegaret.
"In 2012, the HTML Working Group Chairs came up with a plan to
progress HTML, aka "Plan 2014". The plan has several objectives..."
http://www.w3.org/blog/2014/06/html5-on-our-way-to-recommendation/

+09: TOOLS.

SEE (Chrome Extension)
By Q42.
"SEE lets you view the web as a user with a visual impairment might
What is it like to be visually impaired? As a well-sighted person
you'll likely never fully get to understand that. But SEE helps you
imagine what it's like."
https://chrome.google.com/webstore/detail/see/dkihcccbkkakkbpikjmpnbamkgbjfdcn?hl=en

+10: USABILITY.

Make Me Think, Or Else
By Steven Bradley.
"'m sure you've heard the advice 'don't make me think' in regards to
website usability. It's the idea that visitors of a site can use the
site with as little cognitive strain as possible. Is it good advice?
Well...yes, but there are times when making people think a little more
might be the better option..."
http://www.vanseodesign.com/web-design/make-me-think/

Simplicity is Key to Self-Service Success
By Gerry McGovern.
"...The reason why so much 'print' content is migrated to the Web is
because it's cheap and easy to do. Organizations are making life easy
for themselves and miserable for their customers. However, they will
pay the price in reduced customer loyalty."
http://gerrymcgovern.com/new-thinking/simplicity-key-self-service-success

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

[Issue ends.]