[webdev] Web Design Update: May 8, 2014

Thu May 8 06:10:08 CDT 2014

+++ WEB DESIGN UPDATE.
- Volume 12, Issue 46, May 8, 2014.

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

++ISSUE 46 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: DRUPAL.
04: EVALUATION & TESTING.
05: EVENTS.
06: HTML5.
07: JAVASCRIPT.
08: NAVIGATION.
09: TOOLS.
10: TYPOGRAPHY.
11: USABILITY.
12: XML.

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

An Accessibility Primer
By Virgina DeBolt.
"Create web sites that: Use web standards; Use semantic HTML - POSH;
Integrate accessibility from the start of a project. Are POUR..."
http://www.webteacher.ws/2014/05/07/accessibility-primer/

The Little Button That Could
By Karl Groves.
"...Turns out we've decided to use a button. All we needed to do was
change a few CSS declarations. Thanks so much for the help."
http://www.karlgroves.com/2014/05/02/the-little-button-that-could/

Give Your Users Total Control of Your Website
By Luke McGrath.
"Some of your users find automatic changes hard to deal with.
Unexpected actions can interrupt their concentration and stop them
reaching their goals. You can help your users by keeping them in
control and avoiding elements on your website that change
automatically..."
http://www.wuhcag.com/change-on-request/

Help Your Users with Unusual and Confusing Pronunciations
By Luke McGrath.
"We all agree that your users deserve to understand your website. You
can help make this happen by paying attention to words that are hard
or confusing to pronounce. Words like these can make it hard for your
users to focus and understand your content..."
http://www.wuhcag.com/pronunciation/

Ensure Content Remains Readable and Legible When Resized to 200%
By Denis Boudreau.
"Make sure reading remains efficient when content is set to 200% of
its initial size."
http://dboudreau.tumblr.com/post/84648096322/ensure-content-remains-readable-and-legible-when

Website Accessibility Laws Guide - International
By Tim Lohman.
"An overview of international law and policy that supports web
accessibility and Web Content Accessibility Guidelines (WCAG) 2.0
compliance..."
http://www.accessiq.org/news/news/2014/04/website-accessibility-laws-guide-international

Accessibility Suit Filed Against US General Services Administration
By Tim Lohman.
"An accessibility law suit has been brought against the United States
General Services Administration (GSA) alleging that its website,
SAM.gov, is inaccessible and does not comply with Section 504 of the
Rehabilitation Act of 1973."
http://www.accessiq.org/news/news/2014/04/accessibility-suit-filed-against-us-general-services-administration

Justice Department Targets Websites, Mobile Apps, and POS Devices
By Seyfarth Shaw.
"Only four months into 2014, the Department of Justice (DOJ) has
already made clear that it is pursuing an aggressive enforcement
agenda when it comes to the obligation of public accommodations to
ensure effective communication with individuals with disabilities..."
http://www.adatitleiii.com/2014/04/justice-department-targets-websites-mobile-apps-and-pos-devices/

Consent Decree - National Federation of the Blind et al and the United
States of America vs H&R Block
By ADA Title III
http://www.adatitleiii.com/files/2014/04/Consent-Decree.pdf

Disclosure-Button Custom Control
By Steve Faulkner.
"Cedric Trevisan and I have been cooking up a simple custom element,
web component (using polymer) that provides a flexible disclosure
control with accessibility baked in..."
http://blog.paciellogroup.com/2014/05/disclosure-button-custom-control/

+02: CASCADING STYLE SHEETS.

Cargo Cult CSS
By Jonathan Christopher.
"...I don't know if I'll ever find the balance of OOCSS I'm really
looking for, but I think it's getting better with each project I take
on, so that's a good thing. Articles like this keep me on my toes."
http://mondaybynoon.com/kapowaz-cargo-cult-css/

Moving Forward with CSS Shapes
By Sara Soueidan.
"If you liked my CSS Shapes 101 article last week and are as excited
about CSS Shapes as I am, then you may find a list of resources to dig
deeper into CSS Shapes useful..."
http://alistapart.com/blog/post/moving-forward-with-css-shapes

+03: DRUPAL.

User Facing Accessibility Improvements in Core (Part 1 of D8 A11y Update)
By Mike Gifford.
"Drupal 7 still remains the most accessible open source CMS available.
The changes that the community began implementing in 2008 to improve
accessibility for the entire user interface (public, content editor,
administrator and developer) has still not been matched by any other
piece of web software (open source or proprietary). By focusing
accessibility efforts on improving Core, we are able to fix
accessibility problems by default regardless of what themes, or
extensions are used in any given implementation. That being said,
Drupal 8 is already considerably better, and not just because we
removed Overlay..."
https://groups.drupal.org/node/420413

+04: EVALUATION & TESTING.

How Tech Companies Can Take Advantage of Fresh Eyes During Onboarding
By Stef Miller.
"The first week or so of any onboarding experience is chock-full of
raw feedback opportunities. As more and more companies continue to
fill experience-focused roles, it makes sense that we take advantage
of each new hire's fresh eyes..."
http://www.usertesting.com/blog/2014/04/28/how-tech-companies-can-take-advantage-of-fresh-eyes-during-onboarding/

+05: EVENTS.

Web Usability - An Introduction to User Experience
August 11-12, 2014.
London, England, United Kingdom
http://www.userfocus.co.uk/training/webusability.html

+06: HTML5.

Should You Use HTML5 Header and Footer?
By Bruce Lawson.
"...my advice is: yes, use them - especially the main <header>,
<footer>, <nav> and (once per page) <main>..."
http://www.brucelawson.co.uk/2014/should-you-use-html5-header-and-footer/

Meet the Site of the Web Components Community
By Axel Rauschmayer.
"The Web Components community has a new site..."
http://www.2ality.com/2014/05/webcomponents-org.html

+07: JAVASCRIPT.

JavaScript's 'this' - How It Works and Where It Can Trip You Up
By Axel Rauschmayer.
"In JavaScript, the special variable this is relatively complicated,
because it is available everywhere, not just in object-oriented
settings. This blog post explains how this works and where it can
cause problems, concluding with best practices..."
http://www.2ality.com/2014/05/this.html

+08: NAVIGATION.

Provide a Mechanism to Skip Content Repeated Across Pages
By Denis Boudreau.
"Make sure content that is repeated across pages can be easily bypassed..."
http://dboudreau.tumblr.com/post/84619099882/provide-a-mechanism-to-skip-content-repeated-across

Skip Links Shouldn't Be This Hard
By Greg Kraus.
"I've been creating skip-to links for years, like 'Skip to Main
Content' or 'Skip Navigation', but I recently ran into a problem with
them in HTML5 pages, notably in IE with JAWS. In this one particular
case they simply were not working. I would click on the skip link and
I wouldn't go anywhere - I was still at the top of the page..."
http://accessibility.oit.ncsu.edu/blog/2014/05/02/skip-links-shouldnt-be-this-hard/

Tips on Combining Image and Text Links
By Kate Bradbury.
"Tips on combining image and text links that link to the same
resource, a requirement stated in the Web Content Accessibility
guidelines..."
http://www.nomensa.com/blog/2014/tips-on-combining-image-and-text-links/

Burying the URL
By Allen Pike.
"Today, a Canary build of Google Chrome removed something kind of
important from the browser: the URL..."
http://www.allenpike.com/2014/burying-the-url/

On Hiding URLs in the Browser
By Adrian Roselli.
"...At this point, my resistance to the change is that I am a web
developer who consumes URLs and that I don't want to have to re-train
my parents how to send a link (without using some nonsense 'share'
button). I'd rather not see URLs go away, but I'm a professional, I
can sort it out."
http://blog.adrianroselli.com/2014/05/on-hiding-urls-in-browser.html

Web Accessibility and URLs
By Derek Featherstone.
"Hiding URLs in the browser is like hiding anything. For
accessibility, things are usually best left out in the open."
http://simplyaccessible.com/article/web-accessibility-and-urls/

URLy Warning
By Jeremy Keith.
"Im genuinely shocked that Jake thinks that Chrome hiding URLs is a
good thing..."
http://adactio.com/journal/6779/

+09: TOOLS.

Contrast Ratio
By Lea Verou.
"As you type, the contrast ratio indicated will update. Hover over the
circle to get more detailed information. When semi-transparent colors
are involved as backgrounds, the contrast ratio will have an error
margin, to account for the different colors they may be over..."
http://leaverou.github.io/contrast-ratio/

+10: TYPOGRAPHY.

Avoid Justified, Centered or Right-Aligned Text in Content
By Denis Boudreau.
"Make sure text content is always aligned to the left..."
http://dboudreau.tumblr.com/post/84344543792/avoid-justified-centered-or-right-aligned-text-in

+11: USABILITY.

Revenge of the Brochureware Billboard Designers
By Gerry McGovern.
"Organizations can't resist broadcasting when customers just want to
get something done...It is possible to have the best of both worlds.
For example, the University of Ottawa website...does use big pictures
on its homepage, but in the center of the pictures are clear tasks:
Find a Program, Estimate Costs, Calendar & Deadlines, Search the
iLibrary. Things that actually matter to people. Useful things..."
http://www.gerrymcgovern.com/new-thinking/revenge-brochureware-billboard-designers

Post Flat Design
By Wells Riley.
"...I propose post flat design - not just as a new way of thinking
about design aesthetic - but also creating sensible visual hierarchy
and more understandable interfaces for our users..."
http://blog.collectiveray.com/post/82108622609/post-flat

Responsive Web Design (RWD) and User Experience
By Amy Schade.
"Responsive design teams create a single site to support many devices,
but need to consider content, design and performance across devices to
ensure usability."
http://www.nngroup.com/articles/responsive-web-design-definition/

Designing Mobile Usability (Interview)
By Jakob Nielsen.
"In this interview Jakob Nielsen, explains the rules of mobile
usability. He outlines how to create seamless experiences and why
designers are plagued with 'featuritis'. He then goes onto explain the
reciprocity principle and the importance of user-centred design..."
http://drt.fm/jakob-nielsen/

The User
By Dmitry Fadeyev.
"There's no such thing as the user, only users, and no single user has
exactly the same needs, wants, tastes or ideas about what constitutes
the perfect product. A large part of design is making the choice
between these potential audiences, picking the people you are going to
make the product for and saying no to all the rest..."
http://usabilitypost.com/2014/05/05/the-user/

Avoid Inline Scroll Areas (50% Get it Wrong)
By Christian Holst.
"...In this article we'll go over the usability issues brought on by
having such separate scrollable lists within the page, outlining both
the conceptual and 5 concrete interaction issues that crop up when
relying on this unfriendly design anti-pattern..."
http://baymard.com/blog/inline-scroll-areas

+12: XML.

Tips for Creating Accessible SVG
By Leonie Watson.
"Scalable Vector Graphics (SVG) exists in a quantum state of
accessibility. Which is to say that SVG is both accessible and
inaccessible at the same time. Happily, there is no SVG uncertainty
principle. We know which aspects of SVG are accessible to whom, which
are not, and what we can do to improve both..."
http://www.sitepoint.com/tips-accessible-svg/

[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.]