[webdev] Web Design Update: January 5, 2017

 

.

.

Date: Thu, 5 Jan 2017 06:14:08 -0600
From: Laura Carlson <lcarlson@d.umn.edu>
To: webdev <webdev@d.umn.edu>
Subject: [webdev] Web Design Update: January 5, 2017

+++ WEB DESIGN UPDATE.

– Volume 15, Issue 28, January 5, 2017.

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

++ISSUE 28 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: STANDARDS, GUIDELINES & PATTERNS.

09: TOOLS.

10: TYPOGRAPHY.

11: USABILITY.

SECTION TWO:

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

What are WCAG Success Criteria?

By David MacDonald.

“This article started with my opinion on the characteristics of
Success Criteria, with significant input from Loretta Guarino Reid and
Gregg Vanderheiden, previous chairs of WCAG 2.0. Since then, the WCAG
Working Group created a WCAG Success Requirements document, which has
general consensus. I’ve updated this article uniformity with those
requirements. Here I hope to provide helpful advice to understanding
them for those trying to write Success Criteria, or understand
them…”

http://www.davidmacd.com/blog/what-are-WCAG-success-criteria.html

What’s Holding Back Accessibility in 2016?

By Oliver Lindberg. (Hat tip to Jennifer Sutton)

“…To help highlight why designers are still lagging behind where
they should be, we spoke to seven experts to shed some light on the
situation…”

http://www.creativebloq.com/advice/ whats-holding-back-accessibility-in-2016

Accessible Emoji, Tweaked

By Adrian Roselli.

“… I have enhanced Léonie’s example to make that handy aria-label
display when the mouse hovers over the emoji. Add an unfortunate
tabindex and now a keyboard-only user can put focus on the emoji…”

http://adrianroselli.com/2016/12/accessible-emoji-tweaked.html

Inclusive Design Tips: Presenting Information in Multiple Ways

By Caitlin Geier.

“…This blog post addresses three related topics in the area of
accessible design: 1.) Providing text or visual alternatives when
using color as a form of information. 2.) Making sure that audio cues
don’t rely entirely on the user’s ability to hear. 3.) Ensuring that
references to visual information like color, shape, and position are
presented so that users without sight can still understand…”

http://www.deque.com/blog/ inclusive-design-tips-presenting-information-multiple-ways/

What Companies Lose by Ignoring Digital Accessibility

By Cristopher Broyles.

“…Without a digitally accessible business, you will lose out on
customer opportunities. You also risk fines, legal fees, and brand
damage due to noncompliance with accessibility laws…”

http://data-informed.com/ what-companies-lose-by-ignoring-digital-accessibility/

Accessibility in Email Marketing

By Emily Austin.

“…For most companies, having a website that meets accessibility
standards is generally regarded as a must-have. The same goes for
email…”

https://blog.mailchimp.com/accessibility-in-email-marketing/

How Learning ASL Improved my Alt Text (Video)

By Shaun Lariaut.

Shaun’s January 2, 2017 A11y NYC meetup presentation.

https://www.youtube.com/watch?v=gHOYghYYNIM

Slides:

https://docs.google.com/presentation/d/ 17hty4vcbsmvByuvhMdX60TxWGOdi66aM35P5HQRjIMQ/

Implementing Accessible Workplace Tech Creating Accessible Tables for
the Web (Video)

By Gian Wild.

Gian’s November 9, 2016 PEAT Works Webinar.
https://www.youtube.com/watch?v=ZK9WMygCAZs

Slides (PPT):

http://www.peatworks.org/sites/peatworks.org/files/uploads/ attachments/node/1314/tables_webinar_-_final.ppt

+02: CASCADING STYLE SHEETS.

Vertical Limit

By Jeremy Keith.

“When I was first styling Resilient Web Design, I made heavy use of vh units…”

https://adactio.com/journal/11690

CSS Grid is Coming

By Rachel Andrew.

“…This post is a round-up of questions I keep being asked about
browser support and grid layout…”

https://www.rachelandrew.co.uk/archives/2017/01/03/css-grid-is-coming/

Kiss My Classname

By Jeffery Zeldman.

“SORRY. I disagree. Nonsemantic classnames that refer to visual styles
will always be a bad idea…”

http://www.zeldman.com/2017/01/03/kiss-my-classname/

Taking CSS Shapes to the Next Level

By Louie Rootfield.

“…Let’s now explore more complex shapes, making our page layouts
richer and less boxy…”

https://webdesign.tutsplus.com/tutorials/ taking-css-shapes-to-the-next-level–cms-27907

+03: DRUPAL.

Accessibility Within Reach for Drupal 7 Content Managers With WYSIWYG

A11yChecker Module

By Jenna Tollerson.

“…The Accessibility Checker, or A11yChecker, adds a button to
CKEditor that fires up a wizard-like interface for checking the
accessibility of the work of content managers. Content managers can
simply add their content in the WYSIWYG field, then click the
A11yChecker button to run the wizard and step through necessary
changes. It can even fix some errors automatically…”

http://portal.georgia.gov/interactive/blog/2017-01-03/ accessibility-within-reach-drupal-7-content-managers- wysiwyg-a11ychecker-module

+04: EVALUATION & TESTING.

27 Tips and Tricks for Conducting Successful User Research in the Field

By Susan Farrell.

“Leave your office, already, and go where the users are. There are
some common pitfalls, but they can be avoided if you learn from our
experience.”

https://www.nngroup.com/articles/tips-user-research-field/

Does Thinking Aloud Affect Where People Look?

By Jeff Sauro.

“…The results of this study found that thinking aloud does affect
where and how long people look at parts of a website homepage in the
first five seconds…In this study, thinking aloud tended to shift
participants’ gaze from the upper navigation of the webpage to the
left navigation…”

http://www.measuringu.com/blog/ta-gazepaths.php

Strategic UX: The Value of Making the Problem Bigger

By David Siegel.

“…to contribute at the strategic level, we have to shift minds
toward not only resolving design flaws but also seeing new
possibilities-especially possibilities with important implications
beyond the immediate problem…”

https://interactions.acm.org/archive/view/january-february-2017/strategic-ux

+05: EVENTS.

ForwardJS
February 25-March 5, 2017.
San Francisco, California, U.S.A.
https://forwardjs.com/

San Diego UX Conference
February 26-March 2, 2017.
San Diego, California, U.S.A
https://www.nngroup.com/training/san-diego/

Midwest PHP 2017
March 17-18, 2017.
Bloomington, Minnesota, U.S.A.
https://2017.midwestphp.org/

IA Summit
March 22-26, 2017.
Vancouver, British Columbia, Canada
http://www.iasummit.org/

Design It, Build It
March 30-31, 2017.
Edinburgh, Scotland United Kingdom
http://dibiconference.com/

+06: JAVASCRIPT.

Improve Your Website’s Accessibility With WAI-ARIA

By Louis Lazaris.

“The following is an extract from our book, HTML5 & CSS3 for the Real
World, 2nd Edition, written by Alexis Goldstein, Louis Lazaris, and
Estelle Weyl…”

https://www.sitepoint.com/wai-aria/

+07: MISCELLANEOUS.

What Comes Next…

By Eric A. Meyer.

“There is a documentary about the history of the web. It’s an hour
long, and now it’s free to watch. Also, I’m in it-a fair amount, it
turns out. Please do not let this dissuade you from watching it…”

http://meyerweb.com/eric/thoughts/2016/12/29/what-comes-next/

+08: STANDARDS, GUIDELINES & PATTERNS.

On Leaving W3C

By Doug Schepers.

“Today is my last day at the World Wide Web Consortium (W3C)…”

http://schepers.cc/on-leaving-w3c

+08: TOOLS.

ImageOptim

By Kornel Lesiński.

“Removes bloated metadata. Saves disk space & bandwidth by compressing
images without losing quality…”

https://imageoptim.com/versions.html

accesslint.js

By Cameron Cundiff, et al.

“Accessibility warnings for dynamic web content…accesslint.js runs
assertions from the aXe-core accessibility library wherever you
include the script once on page load, and again for each DOM change
event. This feature gives you feedback on new content introduced via
AJAX, for example, or updates to a single page app…”

https://github.com/accesslint/accesslint.js

+10: TYPOGRAPHY.

Has the Internet Killed Curly Quotes?

By Glenn Fleishman.

“Web publications tend to favor straight quotation marks, a pragmatic
approach to typography that old-school stylists can’t stand…”

https://www.theatlantic.com/technology/ archive/2016/12/quotation-mark-wars/511766/

+11: USABILITY.

Now You’re Speaking My Language

By Melita Little.

“Microcopy and the small ways you’re irritating your users…Ideally,
CTA microcopy will act as a signpost or clue for what to expect next.
Done wrong, it will make a user unsure of what to expect next. The
generic ‘Click Here’ button is a perfect example of this. It is the
creepy windowless van of the microcopy world…”

https://medium.com/nasdaq-design/ now-youre-speaking-my-language-11a70c0112b

User-Experience Quiz: 2016 UX Year in Review

By Raluca Budiu.

“Test your UX knowledge by taking our quiz. All questions and answers
are based on articles that we published last year.”

https://www.nngroup.com/articles/ux-quiz/

UX Design Top 10 Articles of The Year (v.2017)

By Mybridge. (Hat tip to Jennifer Sutton)

“For the past year, we’ve ranked nearly 10,500 UX Design articles to
pick the Top 10 stories (0.095% chance) that can help you prepare your
design career in 2017…”

https://medium.mybridge.co/ ux-design-top-10-articles-of-the-year-v-2017-489111b3c7db

[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@d.umn.edu

[Issue ends.]

.

*

-=-=-=-=-=-=-=-=-=-=-=-

*
Groups.io Links:

You receive all messages sent to this group.

View/Reply Online (#240): https://groups.io/g/DigitalScholarship/message/240
View All Messages In Topic (1): https://groups.io/g/DigitalScholarship/topic/4036978

*
-=-=-=-=-=-=-=-=-=-=-=-

Attachments area
Preview YouTube video How Learning ASL Improved my Alt Text

How Learning ASL Improved my Alt Text

Preview YouTube video Implementing Accessible Workplace Tech Creating Accessible Tables for the Web 11 0

Implementing Accessible Workplace Tech Creating Accessible Tables for the Web 11 0
 *
*
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s