+++ WEB DESIGN UPDATE.
- Volume 15, Issue 15, October 6, 2016.

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

++ISSUE 15 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: EVENTS.
04: HTML5.
05: INFORMATION ARCHITECTURE.
06: JAVASCRIPT.
07: MISCELLANEOUS.
08: STANDARDS, GUIDELINES & PATTERNS.
09: TOOLS.
10: TYPOGRAPHY.
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.

Alternative Text and Images
By Ire Aderinokun. 
"...most websites are not made up of pure text. We have other types of content that is not so malleable, like images. To make these alternative forms of content more accessible, we need to provide a text alternative of them..."
https://bitsofco.de/alternative-text-and-images/

Building Accessible Websites: What Not To Do
By Richard Gauder.
"...It's always best to put the chocolate chips in the cookie before baking them..."
https://www.linkedin.com/pulse/building-accessible-websites-what-do-richard-gauder-1

Accessibility from the Ground Up: Build Captions and Usable Design into All eLearning
By Pamela Hogle.
"Many eLearning developers assume that accessibility features, like captioning, can be added if someone requests an accommodation. But it's not always possible to make existing content accessible; designing for barrier-free access avoids potential problems..."
http://www.learningsolutionsmag.com/articles/2076/accessibility-from-the-ground-up-build-captions-and-usable-design-into-all-elearning/

2016 Legal Update on Digital Accessibility Cases
By Lainey Feingold.
Webinar recording and slide deck of Lainey Feingold's September 29th presentation.
http://www.3playmedia.com/resources/webinars/legal-update-09-29-2016/

Stop Talking About Accessibility. Start Talking About Inclusive Design.
By Paul Boag.
"By talking about accessibility we marginalise it to being about disability. In truth, making your digital services accessible benefits everybody..."
https://envato.com/blog/stop-talking-accessibility-start-talking-inclusive-design/

Accessible Instructional Materials Bill Introduced with Higher Ed., Disability, Publishing, and Tech Groups' Support
By Jarret Cummings.
"U.S. Representatives Phil Roe (R-TN) and Joe Courtney (D-CT) have introduced the Accessible Instructional Materials in Higher Education (AIM-HE) Act into Congress. ..."
https://er.educause.edu/blogs/2016/9/accessible-instructional-materials-bill-introduced


+02: CASCADING STYLE SHEETS.

Grid Layout is a Much Needed Step-Change for CSS 
By Matt Hinchliffe.
"...CSS grid layout is nothing like the CSS grids we're used to..."
http://maketea.co.uk/2016/09/28/css-grid-layout-is-a-step-change.html

CSS Grid Layout Module Level 1 at Candidate Recommendation
By Rachel Andrew.
"Today CSS Grid Layout has transitioned to become a Candidate Recommendation. In this post I explain what that means, and encourage you to get involved in these final months before we can really start to use it..."
https://rachelandrew.co.uk/archives/2016/09/29/css-grid-layout-module-level-1-at-candidate-recommendation/

Will We be Flattening our HTML for CSS Grids?
By Chris Coyier.
"The good news is that, as of just a few days ago, the spec is really stable and has entered 'Candidate Recommendation' status. Since all browsers have been developing against the spec, it's likely that widespread non-prefixed ready-to-go support will drop in all stable browsers fairly soon. The bad news is that it will probably do-so without subgrid support, a point that Rachel underscored well in her talk..."
https://css-tricks.com/will-flattening-html-css-grids/

Debug Your CSS with Outline Visualizations
By Karl Dubost.
"...I often use a trick for having a better understanding of the way the elements flow with regards to each other..."
http://www.otsukare.info/2016/10/05/debugging-css

Can We Stop Bad-Mouthing CSS in Developer Talks, Please?
By Christian Heilmann.
"...CSS is a very expressive language to build complex interfaces that cater to a lot of varying user needs. If you can't get your head around that - and I am admitting that I can't anymore - have the decency to not belittle those who do. Applaud them for their efforts and work with them instead."
https://www.christianheilmann.com/2016/10/05/can-we-stop-bad-mouthing-css-in-developer-talks-please/


+03: EVENTS.

The Paciello Group Meetup
October, 13, 2016.
Brighton, England, United Kingdom.
https://www.paciellogroup.com/blog/2016/10/paciello-group-meetup-brighton-thursday-13th/

New CSS Layout
October 17-18, 2016.
Boston, Massachusetts, U.S.A.
http://www.oreilly.com/live-training/new-css-layout.html

DOMCODE
November 4, 2016.
Utrecht, The Netherlands.
http://conference.domcode.org/

Accessibility Toronto Camp 
November 5, 2016.
Toronto, Canada.
http://www.accessibilitycampto.org/

CSS Animation
November 17-18, 2016.
Boston, Massachusetts, U.S.A.
http://www.oreilly.com/live-training/css-animation.html


+04: HTML5.

Firefox 49 Supports the HTML5 <details> and <summary> Elements
By Marco Zehe.
"As you may or may not have heard, Firefox 49 supports the HTML5 <details> and <summary> elements. Both full keyboard support and support for assistive technologies is also available right from the start."
https://www.marcozehe.de/2016/10/05/firefox-49-supports-the-html5-details-and-summary-elements/


+05: INFORMATION ARCHITECTURE.

How and When to Use an Affinity Diagram
By Jeff Sauro.
"...Creating an affinity diagram is a good first step for organizing seemingly disconnected information. It can be low-tech (sticky notes) or high-tech if you want to make it digital (and potentially involve remote members). Because it is done in a group, it also has the added benefit of allowing people to have a voice and contribute ideas."
http://www.measuringu.com/blog/affinity-diagram.php

On Information Design (PDF)
By Petra Černe Oven and Cvetka Požar. 
"The book you have before you is sediment, an old-fashioned document that registers an event that, in Slovenia, could well represent a utopian or at least an optimistic step into cutting-edge thought, while, in its English version, it contributes important knowledge to the existing, internationally recognized discipline we call information design..."
http://www.mao.si/Upload/file/On-information-design_e-book%20.pdf


+06: JAVASCRIPT.

Add or Remove a CSS Class with Vanilla JavaScript
By Yaphi Berhanu.
"Sometimes you need to add or remove a CSS class with JavaScript, and you don't want to include an entire library like jQuery to do it..."
https://www.sitepoint.com/add-remove-css-class-vanilla-js/


+07: MISCELLANEOUS.

The Web Belongs To All of Us: Q&A with the Web's Inventor, Sir Tim Berners-Lee
By Sir Tim Berners-Lee.
"...The Web...is vital to democracy and now more critical to free expression than any other medium. The gap in empowerment between those who use it and those who cannot is growing. For those reasons, I believe Internet access should be a right..."
http://www.fordfoundation.org/ideas/equals-change-blog/posts/the-web-belongs-to-all-of-us-qa-with-the-web-s-inventor-sir-tim-berners-lee/

Léonie Watson Talking Web APIs at Paris Web
By Bernard Tyers.
"...I had a quick chat with Léonie.."
http://www.ei8fdb.org/thoughts/2016/10/leonie-watson-talking-web-apis-at-paris-web/


+08: NAVIGATION.

Save Us From Skip Links
By George Gooding. 
Time and time again web developers resort to hacks when web browser vendors fail to implement basic functionality. Skip links are a hack, browsers need to provide a solution.
https://www.epinova.no/en/blog/save-us-from-skip-links/

Why the Footer is the New Site Map
By UX Movement.
"Years ago it was common practice to place a link to your sitemap in the footer navigation. Those days are over because the footer itself has become the new site map..."
http://uxmovement.com/navigation/why-the-footer-is-the-new-site-map/


+09: TOOLS.

Landmarks (browser extension) (Hat Tip to Jennifer Sutton)
By Matthew Tylee Atkinson.
"Allows you to navigate a web page via WAI-ARIA landmarks, using the keyboard or a pop-up menu..."
http://matatk.agrip.org.uk/landmarks/


+10: TYPOGRAPHY.

Your Body Text Is Too Small
By Christian Miller.
"Why website body text should be bigger, and ways to optimize it..."
https://medium.com/@xtianmiller/your-body-text-is-too-small-5e02d36dc902

Intro to Variable Fonts in Web Design
By Jake Rocheleau.
"There's been talk for years of creating fonts that come with adjustable sizes by default..."
http://designmodo.com/variable-fonts/


+11: USABILITY.

6 Tips for Successful Personalization
By Amy Schade. 
"Well-designed personalization carefully considers the creation of roles or types, ensures content is available for those roles, goes beyond content, and retains some user control over the experience."
https://www.nngroup.com/articles/personalization/

What if Your Icon Choices Ruined Your Work? 
By  Catarina Borges.  
"...For a good experience and UI interaction without any kind of doubt, confusion or frustration, when you use an icon give it, in some way, a label. It is really important, especially for icons that want to achieve the completion of a task..."
https://www.sitepoint.com/what-if-an-icon-choice-ruined-your-work/

100 UX Design Quotes to Inspire and Motivate You
By Laura Patterson.
"...We've put together a compilation of 100 inspiring, tweetable quotes from some of our favorite influencers and experts in the UX community- even including some from before the term 'UX' had been coined..."
http://www.intechnic.com/blog/100-ux-design-quotes-to-inspire-and-motivate-you/


+12: XML.

Hiding Inline SVG Icons from Screen Readers
By Roger Johansson.
"Icon fonts are finally being phased out in favour of a technology that's more fit for purpose: SVG. There are many tutorials and guides that describe different ways in which you can use SVG icons, which is great. I do however see an issue related to accessibility pop up now and again, so I'd like to share a little tip about that."
http://www.456bereastreet.com/archive/201609/hiding_inline_svg_icons_from_screen_readers/

The SVG Path Syntax: An Illustrated Guide
By Chris Coyier.
"The <path> element in SVG is the ultimate drawing element..."
https://css-tricks.com/svg-path-syntax-illustrated-guide/

SVG has More Potential
By Mike Riethmulle.
"I think many of us are not using SVG to its full potential..."
https://madebymike.com.au//writing/svg-has-more-potential/


[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

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