[webdev] Web Design Update: March 4, 2015

Wed Mar 4 15:55:02 CST 2015

+++ WEB DESIGN UPDATE.
- Volume 13, Issue 37, March 4, 2015.

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

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

HTML Image Description Extension (longdesc) is a W3C Recommendation
By Shawn Henry.
"The HTML5 Image Description Extension (longdesc) has been published
as a W3C Recommendation at: http://www.w3.org/TR/html-longdesc
This specification ("HTML5-longdesc") enables web authors to provide
longer textual descriptions for complex images. HTML5-longdesc is an
extension specification that is part of the HTML5 family of
specifications. HTML5-longdesc is part of W3C's work to ensure that
the Open Web Platform is accessible to people with disabilities..."
https://lists.w3.org/Archives/Public/w3c-wai-ig/2015JanMar/0162.html

Call for Review: Mobile Accessibility - How WCAG 2.0 and Other W3C/WAI
Guidelines Apply
By Shawn Henry.
"WAI invites you to comment on the First Public Working Draft of
"Mobile Accessibility: How WCAG 2.0 and Other W3C/WAI Guidelines Apply
to Mobile" at: http://www.w3.org/TR/mobile-accessibility-mapping"
https://lists.w3.org/Archives/Public/w3c-wai-ig/2015JanMar/0163.html

10 Takeaways from Building Accessible Forms
By Deborah Edwards-Onoro.
"...Here are my top lessons learned from the webinar..."
http://www.lireo.com/10-takeaways-from-building-accessible-forms/

Could Your Company's Videos Get You Sued for ADA Noncompliance?
By Deque Systems.
"...it means that everyone should be able to understand the videos you
produce and make public. Uncaptioned or poorly captioned videos can
legitimately put you at risk for legal action...."
http://www.deque.com/blog/companys-videos-sued-ada-noncompliance/

3.1.2 Language of Parts
By Rakesh Paladugula.
"The human language of each passage or phrase in the content can be
programmatically determined except for proper names, technical terms,
words of indeterminate language, and words or phrases that have become
part of the vernacular of the immediately surrounding text. (Level
AA)..."
http://www.maxability.co.in/2015/02/3-1-2-language-parts/

Placeholders are not Substitutes for Labels
By Pardot.
"Labels are captions which inform visitors what information a
particular form field is asking for. Placeholders are bits of example
content or hints which provide visitors with visual cues to aid in
form completion. Labels appear outside of their respective form field,
while placeholders appear inside of their respective form field and
disappear when visitors click or tab into the field..."
https://www.pardot.com/faqs/forms/placeholders-and-labels/

WordPress and Accessibility: Just Where is the Problem?
By Joe Dolson.
"This morning, I had a conversation that highlighted for me one of the
challenges WordPress faces in shaking off the label 'not accessible'.
It was a conversation with a large university system that was
considering deploying WordPress as a resource for faculty blogs,
within the institutional requirements that the site had to comply with
WCAG 2.0 at level AA..."
https://www.joedolson.com/2015/02/wordpress-accessibility-just-where-is-the-problem/

The Web Accessibility in Higher Education Project
By Robert Carr.
"The complex problem of ensuring that technology is accessible to
people with disabilities touches nearly every aspect of a campus, from
course material to enterprise systems for registration and financial
aid to public web pages. Solutions to creating an accessible IT
environment require a full campus effort. The Web Accessibility in
Higher Education Project (WAHEP) works across 25 Oklahoma institutions
of higher education to provide resources and help campuses meet these
goals. In this process we have learned valuable lessons regarding
campus leadership, collaboration, and expectations. These lessons can
aid any higher education institution seeking to establish or grow a
technology accessibility initiative..."
http://www.educause.edu/ero/article/web-accessibility-higher-education-project

4 Hot Issues from 1999, Still Issues on 2015
By David MacDonald.
"For over 16 years, web accessibility professionals have had
passionate opinions on the best approach to these 4 web accessibility
issues..."
http://davidmacd.com/blog/csun/accessibility-4-hot-issues.html

+02: BOOKS.

Cederholm, Dan. CSS3 For Web Designers, A Book Apart, 2015.

+03: CASCADING STYLE SHEETS.

Quantity Queries for CSS
By Heydon Pickering.
"...This is your guide to creating style breakpoints for quantities of
HTML elements, much as you already do with @media queries for viewport
dimensions. I'm not pointing at some blurry specification in the
distance or a twinkle in an implementer's eye. We're going to do this
today, with CSS that's already available..."
http://alistapart.com/article/quantity-queries-for-css

Understanding Sass Units
By Hugo Giraudel.
"I have written about units in Sass in the past for my own blog, and
not so long ago as a CSS-Tricks Sass snippet, but given how often I
notice confusion and misconception about the way units work in our
beloved preprocessor, I thought a full length article would not be
such a bad idea after all..."
http://www.sitepoint.com/understanding-sass-units/

Sass Basics: Operators
By George Martsoukos.
"In this article, we'll continue exploring Sass by diving into its
operations..."
http://www.sitepoint.com/sass-basics-operators/

+04: COLOR.

Accessible Interface Design
By Adrian Rapp.
"On designing with accessible color contrast ratios..."
https://medium.com/salesforce-ux/accessible-interface-design-d80e95cbb2c1

+05: EVALUATION & TESTING.

Five, Ten, or Twenty-Five, How Many Test Participants?
By Ellen Francik.
"...The 'magic' number 5 is not magic at all. It depends on
assumptions about problem discoverability and has implications for
design process and business risk..."
http://www.humanfactors.com/newsletters/how_many_test_participants.asp

Evangelizing User Research
By David Travis.
"User experience professionals often complain that design teams fail
to take action on the findings from user research. But researchers
need to shoulder some of the blame: research reports are often too
wordy, arrive too late and fail to engage teams with the data.
Dressed-down personas, customer journey maps, photo-ethnographies,
affinity diagramming, screenshot forensics and hallway evangelism
provide 6 alternatives..."
http://www.userfocus.co.uk/articles/evangelising-user-research.html

+06: EVENTS.

WebAIM Web Accessibility Training
May 19-20, 2015.
Logan, Utah, U.S.A.
http://webaim.org/training

+07: HTML5.

HTML5 Structural Elements-Non-Sectioning Elements
By Steven Bradley.
"When should you use an HTML5 header element? How aboout a footer
element? Do you use one of each per page or do you add them to
sections throughout your content as the spec recommends?"
http://www.vanseodesign.com/web-design/html5-non-sectioning-elements/

+08: JAVASCRIPT.

Iterables and Iterators in ECMAScript 6
By Axel Rauschmayer.
"ECMAScript 6 introduces a new interface for iteration, Iterable. This
blog post explains how it works, which language constructs consume
data via it (e.g., the new for-of loop) and which sources provide data
via it (e.g., arrays)..."
http://www.2ality.com/2015/02/es6-iteration.html

Single Page Applications, Angular.js and Accessibility
By Gavin Ogston.
"Developers face pretty specific challenges when creating a highly
accessible single page application (SPA) user experience. This
in-depth tutorial outlines some best practices and accessibility
challenges common to SPAs (and specifically Angular apps) so you can
build an SPA that works for everyone..."
http://simplyaccessible.com/article/spangular-accessibility/

No Promises - Asynchronous JavaScript with Only Generators
By Axel Rauschmayer.
"Two ECMAScript 6 features enable an intriguing new style of
asynchronous JavaScript code: promises and generators. This blog post
explains this new style and presents a way of using it without
promises..."
http://www.2ality.com/2015/03/no-promises.html

+09: NAVIGATION.

A Skip Link Primer
By Jeremy Fields.
"Of all the accessibility enhancements that can be made to a page,
adding a "skip to content" link is one of the easier wins. These links
allow keyboard-only (non-mouse) users to quickly jump to the page's
main content or other important sections..."
http://viget.com/inspire/skip-link-primer

Kill The Hamburger Button
By Josh Constine.
"That little three-lined button is the devil. Whether you call it a
side menu, navigation drawer, or a hamburger, hiding your features
off-screen behind a nondescript icon in the corner is usually a poor
mobile design choice. Interaction theory, A/B tests, and the evolution
of some of the top apps in the world all support the same thesis: The
hamburger button is bad for engagement, and you should probably
replace it with a tab bar or other navigation scheme..."
http://techcrunch.com/2014/05/24/before-the-hamburger-button-kills-you/

+10: STANDARDS, GUIDELINES & PATTERNS.

Stopping the Infighting About Digital Standards
By Lisa Welchman.
"Organizations that struggle with their digital presence often do so
because they haven't established proper governance. But good
governance is worth pursuing: clear policies and processes can answer
questions, empower teams, and enable web strategies to shine. In this
excerpt from Chapter 5 of Managing Chaos, Lisa Welchman explains the
importance of digital standards-what they are, why they matter for
governance, and how to start documenting them for your
stakeholders..."
http://alistapart.com/article/stopping-the-infighting-about-digital-standards

+11: TOOLS.

Color Safe
By Donielle Berg and Adrian Rapp.
"Empowering designers with beautiful and accessible color palettes
based on WCAG Guidelines of text and background contrast ratios..."
http://colorsafe.co/

+12: TYPOGRAPHY.

The State of Web Type
By Bram Stein.
"Typography has a long and rich history, but much has been lost in the
transition to the web. While browser support for typography has never
been better, we still have a long way to go. Features many print
designers take for granted are either nonexistent on the web or have
insufficient browser support in order to be useful. Some of the
features that are unique to web browsers such as responsive design and
web fonts could use some improvement as well. Let's take a look at
some of the features we need for an optimal (and beautiful) reading
experience..."
https://dev.opera.com/articles/state-of-web-type/

+13: USABILITY.

3 Rules Of App Design, According To Yahoo's Marissa Mayer
By Marissa May.
"The ex-Googler and current Yahoo CEO spells out three rules anyone
can use to make an app better..."
http://www.fastcodesign.com/3041374/3-rules-of-app-design-according-to-yahoos-marissa-mayer

The Paradox of Empathy
By Scott Jenson.
"If I'm ever asked what's most important in UX design, I always reply
'empathy'. It's the core meta attribute, the driver that motivates
everything else. Empathy encourages you to understand who uses your
product, forces you ask deeper questions and motivates the many
redesigns you go through to get a product right..."
http://jenson.org/paradox/

Multitasking on Mobile Devices
By Raluca Budiu.
"Multitasking involves being able to rapidly switch between different
apps and to combine multiple sources of information. Small mobile
screens limit users' ability to see content from different apps at the
same time, so current operating-system support for multitasking
focuses mostly on switching between different apps. This increases
users' memory load, so mobile designers must help users compare and
rapidly retrieve recent items."
http://www.nngroup.com/articles/multitasking-mobile/

Future Proofing Tomorrow's Technology: UX for an Aging Population
By Christopher Wilkinson and Dhaval Gandhi.
"...We conducted a systematic review of the research literature, and
based on what we learned, we created a framework to organize the
issues that directly affect the use and adoption of technology by
older users. It is a concise and simple tool, easy to apply across
numerous products to aid design thinking and evaluation from an older
person's perspective..."
http://uxpamagazine.org/future-proofing-tomorrows-technology/

[Section one ends.]

++ SECTION TWO:

+14: 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

Drupal Information.
http://www.d.umn.edu/itss/training/online/webdesign/drupal.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

HTML Information.
http://www.d.umn.edu/itss/training/online/webdesign/html.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.]