[webdev] Web Design Update: February 13, 2014

Thu Feb 13 06:18:49 CST 2014

+++ WEB DESIGN UPDATE.
- Volume 12, Issue 34, February 13, 2014.

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

++ISSUE 34 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: COLOR.
04: EVALUATION & TESTING.
05: EVENTS.
06: HTML5.
07: JAVASCRIPT.
08: MISCELLANEOUS.
09: NAVIGATION.
10: TOOLS.
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.

Website Accessibility Conformance Evaluation Methodology (WCAG-EM) 1.0
By W3C.
"This document provides guidance on evaluating how well websites
conform to the Web Content Accessibility Guidelines (WCAG) 2.0. It
describes a procedure to evaluate websites and includes considerations
to guide evaluators and to promote good practice. It does not provide
instructions for evaluating web content feature by feature, which is
addressed by WCAG 2.0 success criteria. This document is one of a
series of informative W3C/WAI resources about Evaluating Websites for
Accessibility that complements the WCAG 2.0 Documents. It does not
define additional WCAG 2.0 requirements nor does it replace or
supersede it in any way..."
http://www.w3.org/TR/WCAG-EM/

Visually Highlight Interface Components When They Receive Focus
By Denis Boudreau.
"Make sure active elements are highlighted when they receive keyboard focus..."
http://dboudreau.tumblr.com/post/75684104222/visually-highlight-interface-components-when-they

Organize Content in a Sequential Reading Order That Remains Logical
By Denis Boudreau.
"Make sure the reading order remains meaningful, regardless of technology..."
http://dboudreau.tumblr.com/post/75899954465/organize-content-in-a-sequential-reading-order-that

Making an Accessible Dialog Box
By Nicholas C. Zakas.
"In today's web applications, dialog boxes are about as common place
as they are in desktop applications. It's pretty easy to show or hide
an element that is overlayed on the page using a little JavaScript and
CSS but few take into account how this affects accessibility. In most
cases, it's an accessibility disaster. The input focus isn't handled
correctly and screen readers aren't able to tell that something is
changed. In reality, it's not all that difficult to make a dialog
that's fully accessible, you just need to understand the importance of
a few lines of code"
http://www.nczonline.net/blog/2013/02/12/making-an-accessible-dialog-box/

Why Don't Screen Readers Always Read What's on the Screen? Part 1:
Punctuation and Typographic Symbols
By Paul Bohman.
"...Unfortunately, screen readers don't always read what's on the screen..."
http://www.deque.com/dont-screen-readers-read-whats-screen-part-1-punctuation-typographic-symbols

Three Tips to Improve the Accessibility on Your Website
By Deborah Edwards-Onoro.
"Yesterday I had the pleasure of speaking to our Metro Detroit
WordPress group about how to improve accessibility on your website.
Creating an accessible website allows everyone, no matter their
application, software, hardware or other capabilities, to use your
site..."
http://www.lireo.com/three-tips-improve-accessibility-on-your-website/

Advocacy Group Wants Google to Rethink CAPTCHA
By Global Accessibility News.
"An Australian Not for Profit consumer advocacy organization has
accused Google of not meeting its mission to make online information
'universally accessible' by making its reCAPTCHA service fully
accessible...."
http://globalaccessibilitynews.com/2014/02/06/advocacy-group-wants-google-to-rethink-captcha/

+02: CASCADING STYLE SHEETS.

Floated Label Pattern with CSS Only
By Jonathan Snook.
"I came across Brad Frost's post about the Floated Label Pattern and
instantly thought, "I think you can do this in CSS" and set out to
prove it. It turned out to be a little trickier than expected but I
created a quick proof of concept..."
http://snook.ca/archives/html_and_css/floated-label-pattern-css

UI Animation and UX - A Not-So-Secret Friendship
By Val Head.
"...This article uses CSS animations and transitions in the associated
examples..."
http://alistapart.com/article/ui-animation-and-ux-a-not-so-secret-friendship

+03: COLOR.

Provide Enhanced Contrasts for Large Sized Text
By Denis Boudreau.
"Make sure a contrast ratio of at least 4.5 to 1 exists between text
and background..."
http://dboudreau.tumblr.com/post/76109877158/provide-enhanced-contrasts-for-large-sized-text

+04: EVALUATION & TESTING.

Usability Testing for Mobile Is Easy
By Raluca Budiu.
"Testing phones, tablets, or other mobile devices with real users is
similar to studies with regular computers, but requires special
consideration for recording equipment, room setup, and even the test
participants."
http://www.nngroup.com/articles/mobile-usability-testing/

+05: EVENTS.

WebVisions Portland
May 7-9, 2014.
Portland, Oregon, U.S.A.
http://www.webvisionsevent.com/portland/

Society for Technical Communication Summit
May 17-21, 2014.
Phoenix, Arizona, U.S.A.
http://summit.stc.org/

CSS Conf
May 27, 2014.
Amelia Island, Florida, U.S.A.
http://2014.cssconf.com/

UX London 2014
May 28-30, 2014.
London, England, England, United Kingdom
http://2014.uxlondon.com/

International PHP Conference
June 1-4, 2014.
Berlin, Germany
http://phpconference.com/2014se/en/

+06: HTML5.

Screen Reader Support for HTML5 Sections
By Leonie Watson.
"HTML5 includes a handful of section elements that give documents a
robust semantic structure. The header, footer, nav, article, section
and aside elements give different regions of a document meaning.
Amongst other things, that meaning can be understood by screen
readers, and the information used to help blind and partially sighted
people orient themselves and navigate around the page..."
http://tink.co.uk/2013/02/screen-reader-support-for-html5-sections/

+07: JAVASCRIPT.

Video - Fake Operator Overloading
By Axel Rauschmayer.
"I held the talk 'Fake operator overloading' at Fluent Conference, in
San Francisco. The video is now publicly available..."
http://www.2ality.com/2014/02/video-fake-operator-overloading.html

What are Integers in JavaScript?
By Axel Rauschmayer.
"According to the ECMAScript specification, all numbers in JavaScript
are floating-point. Yet, the notion of integer comes up occasionally.
This blog post explains what it means..."
http://www.2ality.com/2014/02/javascript-integers.html

Choosing Vanilla JavaScript
By Anthony Colangelo.
"...Sometimes it makes sense to put down the power screwdriver and use
some good old-fashioned elbow grease..."
http://alistapart.com/blog/post/choosing-vanilla-javascript/

+08: MISCELLANEOUS.

Tim Berners-Lee - We Need to Re-Decentralize The Web
By Liat Clark.
"The greatest danger is the emergence of a balkanized Internet..."
http://arstechnica.com/tech-policy/2014/02/tim-berners-lee-we-need-to-re-decentralize-the-web/

The Early History of HTML
By Sean B. Palmer.
"HTML in 1990 - 1992"
http://infomesh.net/html/history/early/

+09: NAVIGATION.

Killing Off the Global Navigation - One Trend to Avoid
By Kathryn Whitenton.
"For desktop sites, demoting your main content categories into a
drop-down menu makes it harder for users to discover your offerings."
http://www.nngroup.com/articles/killing-global-navigation-one-trend-avoid/

Assign a ContentInfo Landmark Role to the Page's Footer Section
By Denis Boudreau.
"Make sure the page footer is identified using the contentinfo landmark role..."
http://dboudreau.tumblr.com/post/75792790382/assign-a-contentinfo-landmark-role-to-the-pages-footer

Usability Tip - Don't Make Me Search for Search
By Tammy Guy.
"One of the best ways to learn what works and what doesn't work when
it comes to UI and usability is to look at as many samples as
possible, testing out pages and evaluating how certain elements are
being treated."
http://uxmag.com/articles/usability-tip-dont-make-me-search-for-search

+10: TOOLS.

Web Accessibility - Tools and Considerations
By Shaumik Daityari.
"...In this roundup of some of the evaluation tools that are available
to check web accessibility, we will discuss a few tools and the
intended scenarios where they might be useful. Before we proceed, you
could check the complete list of tools maintained by W3C..."
http://www.sitepoint.com/web-accessibility-tools-considerations/

14 Usability Testing Tools Matrix and Comprehensive Reviews
By W Craig Tomlin.
"...the following matrix and comprehensive review of 14 usability
testing tools will help practitioners who are looking for tools for
specific testing tasks..."
http://www.usefulusability.com/14-usability-testing-tools-matrix-and-comprehensive-reviews/

+11: USABILITY.

An Argument for Complexity Rather than Simplicity in Technical Communication
By Tom Johnson.
"... I'm saying that products and their related documentation should
not be portrayed as being simple and easy to use when they are not.
Technical writers should be truth-tellers, with a respect for the
complexity of information. Certainly we communicate in a human
readable way, using lists, numbered steps, subheadings, visuals,
examples, and other tools to communicate ideas. These techniques make
the language usable. But we don't betray the complexity of the
products or processes by supposing that they are simple or that the
concepts, tasks, and processes for using them can be made simple."
http://idratherbewriting.com/2014/02/07/an-argument-for-complexity-rather-than-simplicity-in-technical-communication/

Web Animation at Work
By Rachel Nabors.
"...Animation is powerful because it can create the 'illusion of
life.' This means taking into account physical things like gravity,
reaction, squash, stretch, and timing..."
http://alistapart.com/article/web-animation-at-work

+12: XML.

Scalable Vector Graphics (SVG) 2
By W3C.
"This specification defines the features and syntax for Scalable
Vector Graphics (SVG) Version 2, a language for describing
two-dimensional vector and mixed vector/raster graphics. Although an
XML serialization is given, processing is defined in terms of a
DOM..."
http://www.w3.org/TR/2014/WD-SVG2-20140211/

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