[webdev] Web Design Update: March 19, 2015

Thu Mar 19 06:42:15 CDT 2015

+++ WEB DESIGN UPDATE.
- Volume 13, Issue 39, March 19, 2015.

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

++ISSUE 39 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: EVALUATION & TESTING.
04: EVENTS.
05: HTML5.
06: JAVASCRIPT.
07: MISCELLANEOUS.
08: TYPOGRAPHY.
09: USABILITY.

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Adding Haptic Feedback to HTML
By Diagram Center.
"Adding haptics to an HTML page requires knowledge of javascript,
HTML, and an Android tablet that contains a web browser supporting the
W3C Vibration API. We have provided sample code below as well as on
GitHub..."
http://diagramcenter.org/adding-haptic-feedback-to-html.html

Accessibility Tip: Making Maps Accessible
By Allayne Woodford.
"Maps. We're lost without them. Here's how to make sure people with
vision impairments can continue to find their way with accessible
maps."
http://www.accessiq.org/news/news/2015/03/accessibility-tip-making-maps-accessible

Cognitive Accessibility 101 - Part 2: How it Effects Me & the Tools I Use
By Jamie Knight.
"This article is based on the content of my 2015 CSUN session of the
same title..."
http://jkg3.com/Journal/cognitive-accessibility-101-part-2-how-it-effects-me-the-tools-i-use

Digital Accessibility Legal Update (CSUN 2015)
By Lainey Feingold.
"This post is a version of the presentation Lainey Feingold gave in
March 2015 at CSUN - the International Technology and People with
Disabilities conference held annually in San Diego, California. "
http://lflegal.com/2015/03/legal-update-csun15/

University Works to Improve Website Accessibility for Students with Disabilities
By Russell Hausfeld.
"Following a report released in December from the U.S. Office of Civil
Rights that determined the University of Cincinnati's website violated
federal law - noting that accessibility for disabled students was
lacking - the university is working to make its web content more
accessible, particularly for the visually impaired..."
http://www.newsrecord.org/news/university-works-to-improve-website-accessibility-for-students-with-disabilities/article_939f74de-bc7c-11e4-a605-772c56dac595.html

CSUN15 Review and Interviews in Podcast 101
By Dennis Lembree.
"Another CSUN conference has come and gone. This year was the 30th
Annual International Technology and Persons with Disabilities
Conference (Twitter hash tag #CSUN15) held in downtown San Diego,
California from March 2 to March 7, 2015 at the Manchester Grand Hyatt
Hotel..."
http://www.webaxe.org/csun15-review-interviews-podcast-101/

Accessibility APIs - A Key To Web Accessibility
By Leonie Watson and Chaals McCathie Nevile.
"Web accessibility is about people. Successful web accessibility is
about anticipating the different needs of all sorts of people,
understanding your fellow web users and the different ways they
consume information, empathizing with them and their sense of what is
convenient and what frustratingly unnecessary barriers you could help
them to avoid..."
http://www.smashingmagazine.com/2015/03/16/web-accessibility-with-accessibility-api/

Why Do We Treat Accessibility as a Footnote?
By Luke McGrath.
"Someone asked me a brilliant and all-to-common question today: why do
so many projects run through all their requirements and then tag on at
the end 'and it needs to be accessible'? That's like asking someone to
plan a round-the-world holiday and then, just as you're about to buy
the ticket, asking if you can get everywhere by boat. You've just
changed a core feature of your trip, now you need to start again and
plan which countries have a coastline..."
https://www.wuhcag.com/footnote/

Access Board ICT Refresh Update
By Rakesh Paladugula.
"In the years following initial promulgation of the 508 Standards and
255 Guidelines, technology continued to evolve at a rapid pace..."
http://www.maxability.co.in/2015/03/access-board-ict-refresh-update/

What I Blew My Accessibility Budget On
By Deborah Edwards-Onoro.
"It all started with a tweet by Heydon Pickering last month,
encouraging people on Twitter to join the conversation about web
project accessibility budgets..."
http://www.lireo.com/what-i-blew-my-accessibility-budget-on/

New Episode from The Viking and The Lumberjack: Rebranding Accessibility
By Billy Gregory.
"Some people say accessibility isn't cool but don't worry, The Viking
and The Lumberjack have an idea how to change that. Join Karl 'The
Viking' Groves and Billy 'The Lumberjack' Gregory as they discuss how
to 'Rebrand Accessibility' as only they could do!"..."
http://www.paciellogroup.com/blog/2015/03/new-episode-from-the-viking-and-the-lumberjack-rebranding-accessibility/

+02: CASCADING STYLE SHEETS.

All Your Base, Are Belong to Us - Or what Base Size Do Em-Based Media
Queries Use?
By Stephanie Rewis.
"Yesterday, we had a discussion at work about rems, ems and
percentages. I've used ems for media queries for years. I've used rems
for font sizing for a couple of years. I felt like I had a pretty good
handle on how it all works. Most of you probably understand the
difference, but let's do a quick recap to refresh..."
http://blog.w3conversions.com/2015/03/all-your-base-are-belong-to-us-%E2%80%94-or-what-base-size-do-em-based-media-queries-use/

Enhancing Responsiveness with Flexbox Presentation at RWD Summit
By Zoe M. Gillenwater.
"Download the slides and view the demos for my presentation on
practical flexbox progressive enhancement for RWD, 'Enhancing
Responsiveness with Flexbox' for the RWD Summit, as well as get links
to related articles, tutorials, and tools on Flexible Box Layout..."
http://zomigi.com/blog/rwd-flexbox/

Understanding CSS Grid Systems From the Ground Up
By Ryan Morr.
"Over the past few years CSS grid systems have grown a lot in
popularity, quickly becoming considered best practice for rapid layout
scaffolding. As a result, there has been no shortage of frameworks
popping up offering their own grid systems trying to garner favor..."
http://www.sitepoint.com/understanding-css-grid-systems/

Probably Use initial-scale=1
By Chris Coyier.
"If you're doing responsive design, you're using viewport <meta> tags.
These tell the browser what width it should render the viewport at. If
you don't use this tag, it will render at the device's default, which
almost certainly isn't what you want. But even if you are using
viewport <meta>, there are subtle differences in the value you put in
it. I just wanna focus on one little difference here"
https://css-tricks.com/probably-use-initial-scale1/

+03: EVALUATION & TESTING.

SUPR-Q - A Comprehensive Measure of the Quality of the Website User Experience
By Jeff Sauro.
"A three part study conducted over five years involving 4,000 user
responses to experiences with over 100 websites was analyzed to
generate an eight-item questionnaire of website quality-the
Standardized User Experience Percentile Rank Questionnaire (SUPR-Q).
The SUPR-Q contains four factors: usability, trust, appearance, and
loyalty. The factor structure was replicated across three studies with
data collected both during usability tests and retrospectively in
surveys. There was evidence of convergent validity with existing
questionnaires, including the System Usability Scale (SUS). The
overall average score was shown to have high internal consistency
reliability (α = .86). An initial distribution of scores across the
websites generated a database used to produce percentile ranks and
make scores more meaningful to researchers and practitioners. The
questionnaire can be used to generate reliable scores in benchmarking
websites, and the normed scores can be used to understand how well a
website scores relative to others in the database."
http://uxpajournal.org/supr-q-a-comprehensive-measure-of-the-quality-of-the-website-user-experience/

+04: EVENTS.

CSS Dev Conf
October 26-28, 2015.
The Queen Mary, Long Beach, California, U.S.A.
http://2015.cssdevconf.com/

18th Annual Accessing Higher Ground
November 16-20, 2015.
Westminster, Colorado, U.S.A.
http://accessinghigherground.org/

+05: HTML5.

HTML5 Tests - Inputs (Desktop Browsers)
By Peter-Paul Koch.
"This page tests the new input values of HTML5..."
http://quirksmode.org/html5/inputs/

HTML5 Tests - Inputs (Mobile Browsers)
By Peter-Paul Koch.
"This page tests the new input values of HTML5 in mobile browsers..."
http://quirksmode.org/html5/inputs/mobile.html

Polymer and Web Component Accessibility: Best Practices
By Dylan Barrell.
"Polymer and Web Components promise great flexibility for custom UI
widget authors to be able to implement custom elements that are on a
par with native DOM elements. However the Polymer components are some
of the worst offenders from an accessibility perspective. To see
whether there was anything inherent in the framework that is causing
this, I implemented an accessible ARIA menu (simplified) in 100%
native web components and then ported that implementation to Polymer,
resulting in an accessible Polymer ARIA menu. The two implementations
share almost all of their code (certainly the JavaScript code is
almost 100% the same). The only differences are in the basic
bootstrapping and some small changes to take into account the fact
that Polymer emulates the shadow DOM in browsers that do not yet
support it natively. The bottom line is that it is possible to create
accessible components. The code for both implementation can be found
on the Axponents GitHub repository. Here are a some of the lessons I
learned..."
http://unobfuscated.blogspot.com/2015/03/polymer-and-web-component-accessibility.html

+06: JAVASCRIPT.

The Destructuring Algorithm in ECMAScript 6
By Axel Rauschmayer.
"This blog post looks at destructuring from a different angle: as a
recursive matching algorithm. At the end, I'll use this new knowledge
to explain one especially tricky case of destructuring..."
http://www.2ality.com/2015/03/destructuring-algorithm.html

Why Developers Should Embrace Progressive Enhancement
By Paula Borowska.
"...Progressive enhancement is a philosophy that makes sure that
people have an easy access to your information, no matter their
device; because it focuses on how you build your website...."
http://www.developerdrive.com/2015/03/why-developers-should-embrace-progressive-enhancement/

js;dr = JavaScript Required; Didn't Read
By Tantek Celik.
"Pages that are empty without JS: dead to history (archive-org),
unreliable for search results (despite any search engine claims of JS
support, check it yourself), and thus ignorable. No need to waste time
reading or responding..."
http://tantek.com/2015/069/t1/js-dr-javascript-required-dead

+07: MISCELLANEOUS.

Future Friendly Fruition
By Brad Frost.
"It's been three and a half years since the the Future Friendly
manifesto was drafted, and yesterday's Apple Watch announcement got me
thinking about how the manifesto and its principles are coming to
fruition. After all, here's an emerging device class that has people
simultaneously excited and skeptical about its utility and
potential..."
http://bradfrost.com/blog/post/future-friendly-fruition/

+08: TYPOGRAPHY.

Typefaces for Dyslexia
By Adrian Roselli.
"I've been writing this post in fits, so it may be a bit disjointed. I
started it on my flight home from CSUN, and continued to work on it on
subsequent flights. Apologies if it's a bit chaotic..."
http://blog.adrianroselli.com/2015/03/typefaces-for-dyslexia.html

+09: USABILITY.

Pop-ups and Adaptive Help Get a Refresh
By Katie Sherwin.
"Presenting adaptive help in a small overlay can make it faster to
find answers to simple questions, but the tradeoffs of obscuring the
page and failing to predict user needs may not be worthwhile."
http://www.nngroup.com/articles/pop-up-adaptive-help/

Black Hat UX and How to Fight It
By Peter W Szabo.
"Conversion rates can be improved by designing experiences that are
intentionally difficult to use or that trick users. This needs to
stop..."
http://blog.whatusersdo.com/2015/03/13/black-hat-ux-and-how-to-fight-it/

The Never-Dying Number of Clicks Argument
By Steve Grobschmidt.
"Every so often, I still hear the 'above the fold' line - that tired,
ancient lament by people who forget about conventions like
scrolling..."
http://www.theaccessibility.com/2015/03/the-never-dying-number-of-clicks-argument/

[Section one ends.]

++ SECTION TWO:

+10: 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.]