[webdev] Web Design Update: January 16, 2015

Laura Carlson lcarlson at d.umn.edu
Fri Jan 16 06:23:54 CST 2015


+++ WEB DESIGN UPDATE.
- Volume 13, Issue 29, January 16, 2015.

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

++ISSUE 29 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: TOOLS.
09: USABILITY.
10: XML.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Call for Review - WCAG 2.0 Techniques Draft Updates
By Shawn Henry.
"Updates of two supporting documents for Web Content Accessibility
Guideline (WCAG) 2.0 are available for review. *This is not an update
to WCAG 2.0, which is a stable document*. The supporting documents
(W3C Working Group Notes) are updated periodically to reflect current
practices and technologies. The existing Techniques and Understanding
documents remain in place as W3C Notes while the separate draft
updates are under review and the WCAG Working Group addresses
comments..."
http://lists.w3.org/Archives/Public/w3c-wai-ig/2015JanMar/0003.html

Understanding the Structure of WCAG 2.0
By Ken Nakata.
"...While WCAG 2.0 can appear daunting at first, it can be best
explained as a hierarchy comprising of four levels of information..."
http://blog.hisoftware.com/2015/accessibility/understanding-the-structure-of-wcag-2-0

Quickly Check Your Website for Common Accessibility Problems with tenon.io
By Marco Zehe.
"Tenon.io is a new tool to test web sites against some of the Web
Content Accessibility Guidelines criteria. While this does not
guarantee the usability of a web site, it gives you an idea of where
you may have some problems. Due to its API, it can be integrated into
workflows for test automation and other building steps for web
projects..."
http://www.marcozehe.de/2015/01/14/quickly-check-your-website-for-common-accessibility-problems-with-tenon-io/

Indicating Link Purpose with ARIA
By Heidi Jungel.
"Authors must avoid using the same text for links that retrieve
different resources. Users without disabilities may be able to
identify the links differently based on other page content; however,
users with cognitive disabilities and users who are blind or visually
impaired may have difficulty making the distinction when link text
does not adequately describe each link's purpose..."
https://www.ssbbartgroup.com/blog/2015/01/09/indicating-link-purpose-with-aria/

The iframe Delemma
By David MacDonald.
"...I propose the following: A missing title on an iframe is a failure
of WCAG 4.1.2 unless it is presenting content that is not distinct
from its surrounding context in which case the iframe should be given
tabinex="-1" so it doesn't receive tab focus OR unless it is hidden
from all users and AT..."
http://davidmacd.com/blog/is-title-attribute-on-iframe-required-by-wcag.html


+02: CASCADING STYLE SHEETS.

CSS4 May Include Some Useful Pseudo Classes
By Virginia DeBolt.
"The editor's draft (emphasis on draft) for Level 4 Selectors from the
W3C mentions some potential new pseudo selectors that the W3C
describes as functional."
http://www.webteacher.ws/2015/01/12/css4-may-include-useful-functional-pseudo-classes/

Strategies for Keeping CSS Specificity Low
By Chris Coyier.
"Keeping CSS specificity low across all the selectors in your project
is a worthy goal. It's generally a sign that things are in relative
harmony. You aren't fighting against yourself and you have plenty of
room to override styles when you need to. Specificity on selectors
tends to creep up over time, and there is a hard ceiling to that. I'm
sure we've all felt the pain of !important tags and inline styles..."
http://css-tricks.com/strategies-keeping-css-specificity-low/


+03: EVALUATION & TESTING.

6 Opposing UX Concepts that are Really Complementary
By Jeff Sauro.
"...The following pairs of essential concepts are often portrayed as
mutually exclusive while, in fact, the elements of each pair
complement each other..."
http://www.measuringu.com/blog/opposite-ux.php


+04: EVENTS.

Web Design Day 2015
June 12, 2015.
Pittsburgh, Pennsylvania, U.S.A.
http://www.webdesignday.com/

Breaking Development (BDConf)
June 19-20, 2015.
Nashville, Tennessee, U.S.A.
https://bdconf.com/

Society for Technical Communication (STC) Summit 2015
June 20-24, 2015.
Columbus, Ohio U.S.A.
http://summit.stc.org/

Human-Computer Interaction (HCI) International 2015
August 2-7, 2015.
Los Angeles, California, U.S.A.
http://2015.hci.international/index.php


+05: HTML5.

On Use of the Lang Attribute
By Adrian Roselli.
"Way back in October I noticed this WHATWG HTML bug (26942) where
someone asked "why do these examples of <html> lack the lang
attribute?" I thought the answer from Hixie was a bit dismissive and
not based on any data or real-world benefits of use, particularly in
the context of screen readers..."
http://blog.adrianroselli.com/2015/01/on-use-of-lang-attribute.html


+06: JAVASCRIPT.

JavaScript Cookbook 2nd Edition Examples
By Shelley Powers.
Shelley loaded her JavaScript Cookbook 2nd edition examples into Github.
https://github.com/shelleyp/javascriptcookbook

Interactive JavaScript Tutorials
By Jacob Gube.
"Learning the fundamentals of JavaScript can be easier and more fun
through interactive tutorials. Interactive tutorials are immersive,
letting you write and experience code immediately..."
http://sixrevisions.com/javascript/interactive-javascript-tutorials/

ECMAScript 6 Sets - union, intersection, difference
By Axel Rauschmayer.
"A recent question by Dmitry Moskowski reminded me: ECMAScript 6 sets
have no methods for computing the union (e.g. addAll), intersection
(e.g. retainAll) or difference (e.g. removeAll). This blog post
explains how to work around that limitation..."
http://www.2ality.com/2015/01/es6-set-operations.html


+07: MISCELLANEOUS.

W3C Web Content Accessibility Guideline (WCAG) 2.0 Compliance at
Illinois (video)
Jon Gunderson's presentation at the University of Illinois Webmaster Workshop.
https://illinois.mediaspace.kaltura.com/media/W3C+Web+Content+Accessibility+Guideline+%28WCAG%29+2.0+Compliance+at+Illinois/1_iwps5qea/25369341


+08: TOOLS.

Tenon Check (Mozilla Add On)
By Marco Zehe.
"Tenon.io is a new platform to test your website against the most
common accessibility and usability errors. This add-on allows you to
quickly check the page that is loaded in your current tab against the
Tenon test suite and get immediate results without having to write JS
and validate the returned JSON code yourself. The results will be
displayed in a new tab. To invoke the test, you can either use the
toolbar button, or right-click your web page and choose the "Check
page with Tenon" context menu item. This latter also works with the
keyboard, so you don't even need to use a mouse to test your web page
for accessibility. The web page must be on a publicly reachable URL."
https://addons.mozilla.org/en-US/firefox/addon/tenon-check/

UX Check (Chrome Extension)
By Chris Gallello.
"Run a heuristic evaluation on your website... The extension will open
up Nielsen's Ten Heuristics in a side pane next to your website. When
you click on an element that doesn't comply with a heuristic, you can
add notes, and a screenshot will be saved. At the end, your results
are exported to a docx so that you can share them with your
teammates."
https://chrome.google.com/webstore/detail/ux-check/giekhiebdpmljgchjojblnekkcgpdobp


+09: USABILITY.

Timing Guidelines for Exposing Hidden Content
By Aurora Bedford.
"Events triggered via hover or click require distinct timing to avoid
accidental activations and ensure that the user feels in control of
the interface."
http://www.nngroup.com/articles/timing-exposing-content/

UX is Key to Branding. Here's Why.
By Tom Kenny.
"Branding can inform UX and UX can Define Branding"
http://inspectelement.com/articles/ux-branding/


+10: XML.

SVG Basics-How To Create Simple Shapes And Lines
By Steven Bradley.
"... I kind of covered some simple SVG shapes before, but I thought
I'd run through them again as my previous coverage was limited and the
run through will help me understand things better..."
http://www.vanseodesign.com/web-design/svg-shapes-lines/


[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

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


More information about the Webdev mailing list