[webdev] Web Design Update: July 17, 2014

Thu Jul 17 06:24:00 CDT 2014

+++ WEB DESIGN UPDATE.
- Volume 13, Issue 03, July 17, 2014.

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

++ISSUE 03 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: JAVASCRIPT.
07: MISCELLANEOUS.
08: PHP.
09: STANDARDS, GUIDELINES & PATTERNS.
10: TOOLS.
11: USABILITY.

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Did Someone Say Map?
By Gian Wild.
"The important things you need to do to make a map accessible is..."
http://www.gianwild.com/2014/07/did-someone-say-map/

Accessibility Developer Guidelines
By International Business Machines (IBM).
"Accessibility, as it pertains to information technology (IT), is
about removing barriers that inhibit the access of certain groups,
including people with disabilities, mature users, and non-native
language learners. When you design or modify software or hardware to
allow access by the greatest number of people, you make it accessible.
"
http://www-03.ibm.com/able/guidelines/index.html

Provide Text Descriptions to Identify Required Fields Left Blank
By Denis Boudreau.
"Make sure required fields that were not completed are identified
using a text description..."
http://dboudreau.tumblr.com/post/76386944176/provide-text-descriptions-to-identify-required-fields

More Tips for Creating Accessible Forms
By Kate Bradbury.
"Following on from a blog post written about rules for creating
accessible forms, I am going to be providing more tips to help you
make your forms more accessible..."
http://www.nomensa.com/blog/2014/more-tips-for-creating-accessible-forms/

Provide Meaningful Section Headings to Every Section of a Document
By Denis Boudreau.
"Make sure every single section of a document starts with a meaningful
section heading..."
http://dboudreau.tumblr.com/post/91652667467/provide-meaningful-section-headings-to-every-section-of

Teach Your Browser New Tricks
By Dirk Ginader.
Dirk's slides from his Open Web Camp presentation.
http://www.slideshare.net/ginader/2014-0712teachyourbrowsernewtricks

7 Resources That Will Improve Your Training Program's Accessibility
By Talance.
"Talance's courses are always built for standards in accessibility,
but the reason we take the extra care and precautions isn't
necessarily clear. The following resources will help program directors
understand what's so important about making courses available to
everyone, along with some tips to improve what you offer..."
http://talance.com/blog/2014/06/10/7-resources-that-will-improve-your-training-programs-accessibility/

Writing for the Web #6: Freeing your Content from HTML Tables Used for Layout
By Linnea Ann Williams.
"...people sometimes (especially in the recent past) have used tables
to put content side-by-side or add spacing around information, or a
myriad of other design reasons. This is a misuse of tables in HTML and
is a no-no for accessibility and basic web quality standards..."
https://swsblog.stanford.edu/blog/writing-web-6-freeing-your-content-html-tables-used-layout

Accessibility is Good for the Planet
By Nicolas Hoffmann.
"Preserving environment through Web accessibility? Unusual idea, even
possibly incongruous... Yet, not so much if one realises that some of
the flagship good practices in accessibility can reduce the carbon
footprint of a Website..."
http://openweb.eu.org/articles/accessibility-is-good-for-the-planet

Think Your Mobile App can Avoid the ADA? Well, Think Again...
By Kelley Drye, et al.
"The Department of Justice continues to aggressively pursue its
enforcement agenda when it comes to ensuring that websites are
accessible to persons with disabilities under the Americans with
Disabilities Act..."
http://www.lexology.com/library/detail.aspx?g=2fdca4f1-47f6-4fa6-97c1-95c757e6fb91

Businesses Nationwide Hit By Wave of Lawsuits Alleging Inaccessible Websites
By Seyfarth Shaw.
"In the past month, we have seen an onslaught of case filings and
demand letters threatening lawsuits from private plaintiffs alleging
that retailers, colleges, and other businesses denied blind
individuals access to the businesses' goods and services by having
inaccessible websites or mobile applications..."
http://www.adatitleiii.com/2014/07/businesses-nationwide-hit-by-wave-of-lawsuits-alleging-inaccessible-websites/

+02: CASCADING STYLE SHEETS.

Recreate Informative Images Using HTML and CSS Instead
By Denis Boudreau.
"Make sure none of the informative content in the page is provided in images..."
http://dboudreau.tumblr.com/post/91752548227/recreate-informative-images-using-html-and-css-instead

CSS Summit 2014 - Making Your Site Printable
By Deborah Edwards-Onoro.
"We're promoting our responsive web designs, but forgetting something
that dates back more than a decade before responsive design, says
Adrian Roselli, author and vice president at Algonquin Studios..."
http://www.lireo.com/css-summit-2014-making-websites-printable/

Making Your Site Printable
By Adrian Roselli.
Adrian's "Making Your Site Printable" CSS Summit presentation slides.
http://blog.adrianroselli.com/2014/07/css-summit-2014-slides-making-your-site.html

CSS Pattern Library
By Russ Weakley.
Russ' CSS pattern library CSS Summit presentation slides.
http://www.slideshare.net/maxdesign/css-pattern-libraries

Inheriting Box-Sizing Probably Slightly Better Best-Practice
By Chris Coyier.
"I'm a big fan of resetting box-sizing to border-box, so much that we
have a special day of the year around here. But there is a little
adjustment to setting it that seems like a pretty good idea..."
http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/

Authoring Critical Above-the-Fold CSS
By Ben Edwards.
"Google PageSpeed Insights and my web pages; it was a match made in
heaven, until things changed..."
http://css-tricks.com/authoring-critical-fold-css/

'Native Experience' vs Styling Select Boxes
By Bruce Lawson.
"...why this urge to re-style page elements that end-users are
familiar with? You'll be shocked to learn that I'm not actually
trained as a designer - so what am I failing to understand? Or is it
that we love native look and feel, except when we don't?"
http://www.brucelawson.co.uk/2014/native-experience-vs-styling-select-boxes/

CSS Shapes - Breaking the Rectangular Design Shackles
By Patrick Catanzariti.
"The capabilities of HTML5 and CSS3 completely outshine what we could
do on the web just five years ago. The CSS Shapes Module Level 1
specification has the potential to break us out of the rectangular
limitations of the web and transform web design to new heights..."
http://www.sitepoint.com/css-shapes-breaking-rectangular-design/

+03: COLOR.

Design and Accessibility - Use of Colour
By Gian Wild.
"The most important thing to remember when it comes to designing an
accessible web site, app or interface is colour contrast. This is the
kind of thing that needs to be picked up in the design, and there are
a couple of ways to do it."
http://www.gianwild.com/2014/07/design-and-accessibility-use-of-colour/

+04: EVALUATION & TESTING.

Affirming the Consequent
By Karl Groves.
"Today I came across a post by Simon Harper titled Web Accessibility
Evaluation Tools Only Produce a 60-70% Correctness which is
essentially a response to my earlier critique of a seriously flawed
academic paper...The implication from this paper is that because tools
do not provide complete coverage, they should not be used. This is
preposterous and, I believe, born from a lack of experience outside of
accessibility and a lack of experience in a modern software
development environment...Perhaps what we need most in terms of
avoiding an 'over-reliance' on tools is for people to stop treating
them like they're all-or-nothing."
http://www.karlgroves.com/2014/07/10/affirming-the-consequent/

Datasets Employed in the Paper 'Benchmarking Web Accessibility
Evaluation Tools: Measuring the Harm of Sole Reliance on Automated
Tests'
By Markel Vigo.
"As the first author of this terrible paper I'm not going to rebut
every single accusation of "serious flaws" and "obvious bias',
apparently there are too many. The paper speaks for itself: we do an
exercise of deductive reasoning, we make some assumptions, we describe
our methods and protocols, we don't overstate and we were very careful
in contextualising the outcomes and limitations of the study..."
http://www.markelvigo.info/ds/bench12/

Website Accessibility Conformance Evaluation Methodology (WCAG-EM) 1.0
By Eric Velleman and Shadi Abou-Zahra, editors.
"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 complement the WCAG 2.0 Documents. It does not
define additional WCAG 2.0 requirements nor does it replace or
supersede them in any way..."
http://www.w3.org/TR/WCAG-EM/

A Roadmap To Becoming An A/B Testing Expert
By Kevin Holesh.
"A/B testing, also known as split testing, is the method of pitting
two versions of a landing page against each other in a battle of
conversion. You test to see which version does a better job of leading
visitors to one of your goals, like signing up or subscribing to a
newsletter. You can test two entirely different designs for a landing
page or you can test small tweaks, like changes to a few words in your
copy..."
http://www.smashingmagazine.com/2014/07/11/roadmap-to-becoming-an-a-b-testing-expert/

5 Variables to Manage in a Comparative Usability Study
By Jeff Sauro.
"One of the primary goals of a comparative study is to understand
which product or website performs the best or worst on usability
metrics such as completion rates or perceptions of usability..."
http://www.measuringusability.com/blog/comparative-variables.php

+05: EVENTS.

SmashingConf
December 9-12, 2014.
Whistler, Canada
http://smashingconf.com/whistler-2014/

+06: JAVASCRIPT.

Expanding the Use of the aria-haspopup Property
By Sam Joehl.
"The WAI-ARIA 1.0 Specification adopted by the W3C currently limits
use of the aria-haspopup attribute to context menus and sub-level
menus. It also states that..."
https://www.ssbbartgroup.com/blog/2014/07/15/expanding-the-use-of-the-aria-haspopup-property/

+07: MISCELLANEOUS.

Why Do So Many Responsive Sites Look The Same?
By Steven Bradley.
"Do you think too many responsive sites look the same? It seems to be
a very common perception. If you do think they look alike, have you
thought about why? Is it something inherent in responsive web design
or are there other reasons?..."
http://www.vanseodesign.com/web-design/responsive-sites-look-the-same/

All Code Is Not Equal - on Research and Production Code
By Jens O Meiert.
"Web development is at a point at which we need to make more
fundamental distinctions..."
http://meiert.com/en/blog/20140716/research-and-production/

+08: PHP.

Unfashionably Profitable
By Rachel Andrew.
"...It's important that we, as professionals, are aware of new tools
and techniques. It's important to keep at least an overview of what is
on the horizon, otherwise we run the risk of sticking to older methods
because that is all we know, or because we are afraid of change. What
I do advocate though is taking great care about diving into the latest
shiny techniques when it comes to your product. There are products to
be built and profit to be made when you turn your focus to your real
customers, who tend to care more about reliability and less about what
is fashionable."
http://www.rachelandrew.co.uk/archives/2013/10/17/unfashionably-profitable/

+09: STANDARDS, GUIDELINES & PATTERNS.

Native Versus Web - A Moment In Time
By Greg Cox.
"...Put differently, the web represents independence from platform
owners. It offers incredible freedom to build what you to want build,
and to ship when you are ready to ship, without any gatekeepers. While
I love my native apps today, I believe in the long term potential of
this freedom. Other problems that native app stores solve today - and
there are many, like discoverability, security and peace of mind -
will be solved on the web in ways that won't require a platform
overlord."
http://expletiveinserted.com/2014/07/10/native-versus-web-a-moment-in-time/

+10: TOOLS.

Longdesc Chrome Extension
By Dirk Ginader.
"Making the Longdesc content available to users without assistive technologies."
https://chrome.google.com/webstore/detail/longdesc/apfomgoblcegnecnacnjdpaemlddlkdb

ARIA Validator Chrome Extension
By Rick Brown.
"Scans page for WAI-ARIA implementation issues. Not an HTML5 validtor,
just ARIA and nothing else."
https://chrome.google.com/webstore/detail/aria-validator/oigghlanfjgnkcndchmnlnmaojahnjoc

How to Check Broken Links on Your Website
By Deborah Edwards-Onoro.
"...Whatever the reason, you want to stay on top of broken links. And
the best way to do that is with a link checker..."
http://www.lireo.com/check-broken-links-on-your-website/

+11: USABILITY.

Direct Access vs. Sequential Access in User Interface Design
By Raluca Budiu.
"In interface design favor direct access to the users preferred item
instead of forcing users to go through your content in a serial
order."
http://www.nngroup.com/articles/direct-vs-sequential-access/

Behold, the Fold
By Sophie Shepherd.
"If you're in the web industry and reading this article, you're
probably thinking, 'Over halfway through 2014 and she's writing about
the fold on the web! I thought  we settled this!' But, the existence
of the fold is still something that gets debated on many of our
projects."
http://cognition.happycog.com/article/behold-the-fold

Usability Tip - Interfaces Need Rhythm
By Tammy Guy.
"The overall presentation of a site must be clean and professional in
order to gain user's trust..."
http://uxmag.com/articles/usability-tip-interfaces-needs-rhythm

[Section one ends.]

++ SECTION TWO:

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