[webdev] Web Design Update: July 16, 2015

Thu Jul 16 06:17:51 CDT 2015

+++ WEB DESIGN UPDATE.
- Volume 14, Issue 03, July 16, 2015.

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: EVALUATION & TESTING.
04: EVENTS.
05: HTML5.
06: JAVASCRIPT.
07: STANDARDS, GUIDELINES & PATTERNS.
08: USABILITY.
09: XML.

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Let's Share More Accessibility Experiences
By Adrian Roselli.
"I think the accessibility community has an opportunity (has had an
ongoing opportunity) to get its message across to the broader
developer community that it hasn't realized. A couple recent write-ups
make me think we should all be trying harder..."
http://adrianroselli.com/2015/07/lets-share-more-accessibility-experiences.html

Why Creating Accessible Digital Products is Important [Infographic]
By Deborah Edwards-Onoro.
"Creating an accessible digital product means anyone can use it.
Because digital technology is a vital role in everyday life, designing
digital products that are accessible benefits people with or without
disabilities, as well as businesses..."
http://www.lireo.com/creating-accessible-digital-products-is-important-infographic/

Multi-Modal Content Delivery for People with Cognitive Disabilities
By John Rochford.
"Textual content can be delivered in different modes to help people
with cognitive disabilities comprehend it. These modes can include..."
https://clearhelper.wordpress.com/2015/07/13/multi-modal-content-delivery-for-people-with-cognitive-disabilities/

Low Vision Proposal - Needs
By Wayne Dick.
"This is a first draft at defining what is needed to extend access to
people with low vision/ partial sight..."
http://nosetothepage.org/LVOverview/LV_Needs.html

Labelling Forms, Images and Links - Screen Reader Compatibility
By Powermapper.
" Screen reader compatibility for a variety of form, image and link
labelling techniques, showing how failures and techniques work in
specific screen reader / browser combinations..."
http://www.powermapper.com/tests/screen-readers/labelling/index.html

Deep Visual-Semantic Alignments for Generating Image Descriptions
By Andrej Karpathy and Li Fei-Fei.
"We present a model that generates natural language descriptions of
images and their regions. Our approach leverages datasets of images
and their sentence descriptions to learn about the inter-modal
correspondences between language and visual data..."
http://cs.stanford.edu/people/karpathy/deepimagesent/

Get Started with Electronic Accessibility
By University of Montana.
This site includes info on creating accessible documents, Web sites, and media.
http://www.umt.edu/accessibility/getstarted/

A11Y Slackers
By Steve Faulkner.
"A ubiquitous issue for people involved in moving the web forward is
that there is always too much to do. Identifiying and prioritising
tasks is critical. Identifying is fairly easy, prioritising not so.
Priorities depend on both internal and external factors often beyond
our control..."
http://www.paciellogroup.com/blog/2015/07/a11y-slackers/

+02: CASCADING STYLE SHEETS.

Dear Webdevs, from European Blind Union
By Bruce Lawson.
"...yes, please use viewport meta to make content responsive. But
don't muck around with maximum-scale, minimum-scale, and user-scalable
properties, as these restrict zooming..."
http://www.brucelawson.co.uk/2015/dear-webdevs-from-european-blind-union/

Using the Web Speech API to Simulate CSS Speech Support
By Leonie Watson.
"The CSS Speech properties are intended to give content aural style,
in the same way other CSS properties give content visual style. The
CSS Speech module is unsupported by browsers, but the Web Speech API
can be used to demonstrate something of the way CSS Speech might work
in practice..."
http://tink.uk/using-the-web-speech-api-to-simulate-css-speech-support/

CSS and Text Content - Screen Reader Compatibility
By Powermapper.
"Screen reader compatibility for CSS and text, showing how failures
and techniques work in specific screen reader / browser
combinations..."
http://www.powermapper.com/tests/screen-readers/content/index.html

CSS and System Fonts
By Adrian Roselli.
" This weekend I read a post about techniques to get Apple's new San
Francisco font into your CSS. Since San Francisco is only just being
added to iOS and OS X, it can be a bit tricky to get hold of it in
Safari. What struck me was the use case outlined in the post for why a
UI person might want to get that font into play..."
http://adrianroselli.com/2015/07/css-and-system-fonts.html

Print Stylesheet Approaches - Blacklist vs Whitelist
By Chris Coyier.
"The "blacklist" is a common approach to print stylesheets. We know
that people probably don't need to see our site navigation if they
print out an article on our site. So we hide it from print like we
would hide it from the screen (display: none;). Is there a way to
reverse that?..."
https://css-tricks.com/print-stylesheet-approaches-blacklist-vs-whitelist/

12 Little-Known CSS Facts (The Sequel)
By Louis Lazaris.
"I've been collecting more little CSS tips and tidbits for a new post.
Because we all know that every successful movie should spawn a cheesy
sequel, right?..."
http://www.sitepoint.com/12-little-known-css-facts-the-sequel/

Quantity Ordering With CSS
By Drew Minns.
"Here is your mission, should you choose to accept it: create a table
of items. Each item should span a third of the content area, with the
fourth item starting on a new row, much like floats. However, a
particular item must always display the price at the end of the first
row..."
http://www.smashingmagazine.com/2015/07/14/quantity-ordering-with-css/

+03: EVALUATION & TESTING.

Remote Moderated Usability Tools Description, Benefits and Listings
By W Craig Tomlin.
"Remote moderated usability tools offer a better way to identify user
experience task flow issues. Learn the description, benefits, method
and tools for conducting remote moderated usability testing..."
http://www.usefulusability.com/remote-moderated-usability-tools/

How To Use The System Usability Scale (SUS) To Evaluate The Usability
Of Your Website
By Nathan Thomas.
"...The SUS has been tried and tested throughout almost 30 years of
use, and has proven itself to be a dependable method of evaluating the
usability of systems compared to industry standards..."
http://usabilitygeek.com/how-to-use-the-system-usability-scale-sus-to-evaluate-the-usability-of-your-website/

5 Things to Know about Likert Scales
By Jeff Sauro.
"...Here are five things to know about the famous Likert scale. (One
for each response option!).."
http://www.measuringu.com/blog/likert-scales.php

+04: EVENTS.

Web Accessibility Training
October 6-7, 2015.
Logan, Utah, U.S.A.
http://webaim.org/training/

Connect.JS
October 16-17, 2015.
Atlanta, Georgia, U.S.A.
http://connect-js.com/

HTML5 Developer Conference
October 19-20, 2015.
San Francisco, California, U.S.A.
http://html5devconf.com/

Interact London
October 20-21, 2015.
London, England, United Kingdom
http://2015.interactconf.com/

Web Directions 2015
October 29-30, 2015.
Sydney, Australia
http://www.webdirections.org/wd15/

+05: HTML5.

Headings - Screen Reader Compatibility
By Powermapper.
"Screen reader compatibility for HTML and ARIA headings, showing how
failures and techniques work in specific screen reader / browser
combinations..."
http://www.powermapper.com/tests/screen-readers/headings/index.html

HTML Elements - Screen Reader Compatibility
By Powermapper.
"Shows how different HTML elements behave in commonly used screen readers..."
http://www.powermapper.com/tests/screen-readers/elements/index.html

HTML Attributes - Screen Reader Compatibility
By Powermapper.
"Shows how different HTML attributes behave in commonly used screen readers..."
http://www.powermapper.com/tests/screen-readers/attributes/index.html

+06: JAVASCRIPT.

The ARIA Roles Model Part 1
By Steven Bradley.
"What can you do when the native semantics of the HTML you use don't
communicate enough information or they don't communicate appropriate
information to assistive devices? You use ARIA roles, states, and
properties to communicate the semantics instead..."
http://www.vanseodesign.com/web-design/aria-roles-model-1/

WAI-ARIA - Screen Reader Compatibility
By powermapper.
"Shows how different WAI-ARIA attributes behave in commonly used
screen readers..."
http://www.powermapper.com/tests/screen-readers/aria/index.html

Designing with Progressive Enhancement
By Jason Garber.
"The following is the text (and links!) from my presentation at the
seventh annual CSS Summit, delivered Tuesday morning, July 7th, 2015.
Slides from this talk are also available."
http://sixtwothree.org/posts/designing-with-progressive-enhancement

+07: STANDARDS, GUIDELINES & PATTERNS.

Seeing the Extensible Web Manifesto Through
By Mat Marquis.
"Participating in the creation of a new standard means joining
listservs that look like they were put together circa 1850 and
asynchronous arguments in IRC channels that span any/all timezones. It
means devoting your nights and weekends to learning how to tinker with
specs and fighting with professional web standards reps. To get
certain things done for real, you need to start attending F2F
meetings-so, be prepared to buy the occasional out-of-pocket plane
ticket to Europe and to burn through your vacation time. On top of it
all, as a web developer, expect to have your vote count for less than
that of a browser representative, and the vast majority of web
standards participants are browser reps. It has all the makings of a
lousy part-time job, minus the pay. Whenever I encourage web devs to
get involved-to help change the power balance by sheer force of
numbers-I do so with an unspoken apology..."
https://bocoup.com/weblog/extensible-web-manifesto/

+08: USABILITY.

Why Plain Language is Vital for Website Usability
By Whitney Quesenbery.
"Whitney Quesenbery explains how using the right words can help keep
your content accessible..."
http://www.creativebloq.com/web-design/why-plain-language-vital-website-usability-51514999

The Characteristics of Minimalism in Web Design
By Kate Meyer.
"Our analysis of 112 minimalist websites revealed the defining
features of minimalism: flat design, limited color schemes, few UI
elements, use of negative space, and dramatic typography. Some are
used well; others less so."
http://www.nngroup.com/articles/characteristics-minimalism/

5 Rules to Better Design
By Stelios.
"...let's look at five rules that help guide our designs, from user
flows to how we set the color of a button..."
https://medium.com/@stothelios/design-philosophy-at-reliefwatch-156aab951e18

Recognizing a Bad User Interface at First Glance
By Piet Hadermann.
"When I wrote my previous blog post, it dawned on me that a trained
eye can often spot unfriendly software a mile away..."
http://www.hadermann.be/blog/134/recognising-a-bad-user-interface-at-first-glance/

How Button Placement Standards Reinforce User Habits
By UX Movement.
"Buttons work like door knobs. People wouldn't be able to use doors
efficiently if door knobs weren't placed in a consistent area. But
because they are, everyone with a hand can walk through doors without
much thought. The placement standard of door knobs across doors
creates an unconscious habit in people."
http://uxmovement.com/buttons/how-button-placement-standards-reinforce-user-habits/

Login Form Usability Problem Solved
By Ben Hunt.
"Here's a little usability design problem for you..."
http://webdesignfromscratch.com/usability/login-form-usability-problem-solved/

Digital Change is Cultural Change
By Gerry McGovern.
"...Digital change is cultural change. If you give digital tools to an
organization with an old mind you get lots of PDFs, lots of emails,
lots of other useless content, lots of pictures of actors pretending
to be customers and lots of news propaganda from senior management
that nobody wants to hear about..."
http://www.gerrymcgovern.com/new-thinking/digital-change-cultural-change

+09: XML.

Scalable Vector Graphics (SVG) WG: 2 Drafts Published
By W3C.
"The SVG Working Group has published a First Public Working Draft and
one Working Draft..."
http://www.w3.org/blog/news/archives/4806

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