.
Date: Thu, 23 Feb 2017 06:22:16 -0600
From: Laura Carlson <lcarlson@xxxxxxxxx>
To: webdev <webdev@xxxxxxxxx>
Subject: [webdev] Web Design Update: February 23, 2017
+++ WEB DESIGN UPDATE.
- Volume 15, Issue 35, February 23, 2017.
An email newsletter to distribute news and information about web
design and development.
++ISSUE 35 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: HTML5.
07: JAVASCRIPT.
08: MISCELLANEOUS.
09: NAVIGATION.
10: STANDARDS, GUIDELINES & PATTERNS.
11: TOOLS.
12: TYPOGRAPHY.
13: USABILITY.
SECTION TWO:
14: What Can You Find at the Web Design Reference Site?
[Contents ends.]
++ SECTION ONE: New references.
+01: ACCESSIBILITY.
Four Levels of Accessibility Customisation
By Alastair Campbell.
"There are some interesting discussions on customisation going on with
the work on WCAG 2.1, the much anticipated (I hope) update to the Web
Content Accessibility Guidelines..."
https://alastairc.ac/2017/02/four-levels-of-accessibility-customisation/
Today, I Learned About the Accessibility Tree
By Michael Schofield.
"The accessibility tree and the DOM tree are parallel structures..."
http://libux.co/today-learned-accessibility-tree/
An Overview of PDF Inaccessibility
By Jon Metz.
"There's a lot of help online about making Portable Document Format
(PDF) accessible. Even with all the advice out there, I still
encounter people who find it difficult to make their documents
friendly to people with disabilities..."
https://www.paciellogroup.com/blog/2017/02/pdf-inaccessibility/
Not All Screen Reader Users Are Blind
By Adrian Roselli.
"The title says it all...the best approach to making a web site
accessible (to screen readers or not) is by using proper HTML. If done
well, ARIA is only needed for complex controls (tabs, trees,
carousels, ...). Screen reader users still benefit the same way
sighted users do from hidden elements, particularly visual (and in
this case auditory) assaults such as mega menus."
http://adrianroselli.com/2017/02/not-all-screen-reader-users-are-blind.html
Learn How to Use ChromeVox Next Screen Reader (Videos)
By Deborah Edwards-Onoro.
"...One of the new features I think many people may have overlooked in
Chrome 56 was the new ChromeVox screen reader..."
https://www.lireo.com/learn-to-use-chromevox-next-screen-reader-videos/
Modal Dialogs and Accessibility: A Tricky Minefield
By Shwetank Dixit.
"...One of the most common pain points we find are inaccessible modal
dialogs..."
http://blog.barrierbreak.com/2017/02/14/modal-dialogs-and-accessibility-a-tricky-minefield/
Utilitarianism, Pragmatism/ Practicalism, and Perfection
By Karl Groves.
"I feel strongly that every person has an intrinsic sense of what is
'right' and what is 'wrong'..."
http://www.karlgroves.com/2017/02/21/
utilitarianism-pragmatism-practicalism-and-perfection/
+02: CASCADING STYLE SHEETS.
Deep Dive CSS: Font Metrics, line-height and vertical-align
By Vincent De Oliveira.
"Line-height and vertical-align are simple CSS properties. So simple
that most of us are convinced to fully understand how they work and
how to use them. But it's not. They really are complex, maybe the
hardest ones, as they have a major role in the creation of one of the
less-known feature of CSS: inline formatting context..."
http://iamvdo.me/en/blog/css-font-metrics-line-height-and-vertical-align
Updated Working Drafts: CSS Display, CSS Sizing, CSS Box Alignment
By Tab Atkins Jr.
"The CSS Working Group has published several updated Working Drafts..."
https://www.w3.org/blog/CSS/2017/02/17/display-sizing-align-update/
A Box Alignment Cheatsheet
By Rachel Andrew.
"...I'm doing a lot of work around the CSS Grid Layout and related
specifications, and have created some detailed notes for myself about
how various things work and interact with each other..."
https://www.rachelandrew.co.uk/archives/
2017/02/20/a-box-alignment-cheatsheet/
Toolbars, Keyboards, and the Viewports
By Peter-Paul Koch.
"All mobile browsers have two viewports. The layout viewport
constrains your CSS - width: 100% means 100% of the layout viewport -
while the visual viewport describes the area of the page the user is
currently seeing. This visualisation of the two viewports might be
useful as a reminder. Today's article studies what happens when these
viewports change size. It also studies the resize event..."
https://medium.com/samsung-internet-dev/
toolbars-keyboards-and-the-viewports-10abcc6c3769
+03: DRUPAL.
Drupal 8's Web Accessibility Improvements
By Rich Lawson.
"...Drupal 8 comes packed with loads of new web accessible features
that help people with disabilities drastically improve their website
navigation..."
https://thoughts.duoconsulting.com/
blog/drupal-8-web-accessibility-improvements
+04: EVALUATION & TESTING.
5 Steps to Quick-Start A/B Testing
By Jennifer Leigh Brown.
"The debate was about the best color for the toolbar on the webpage..."
http://www.uxbooth.com/articles/5-steps-to-quick-start-ab-testing/
+05: EVENTS.
State of UX: Trends in Tools and Techniques
March 9, 2017.
Minneapolis, Minnesota, U.S.A.
http://uxpamn.org/event-2471158
JS Remote Conf
March 15-16, 2017.
Online
https://devchat.tv/conferences/js-remote-conf-2017
Midwest PHP
March 17-18, 2017.
Bloomington, Minnesota, U.S.A.
http://2017.midwestphp.org/
UX in the City Oxford
March 20-21, 2017.
Oxford, England, United Kingdom.
http://uxinthecity.net/2017/oxford/
Front
May 9-10, 2017. (Correct date)
Salt Lake City, Utah, U.S.A.
https://www.frontutah.com/saltlakecity
+06: HTML5.
Accessible Form Placeholder Text
By Zoltan Hawryluk.
"...I personally am not a huge fan of placeholder text, and avoid them
whenever possible (the simplest solutions are the ones easiest to
implement). Any form field hints should be marked up using
aria-labelledby instead. However, if for some reason you really need
to use placeholder text, this script is a good tool to have in your
back pocket"
http://www.useragentman.com/blog/
2017/02/20/accessible-form-placeholder-text/
Beyond XML: Making Books with HTML
By Dave Cramer.
"An overview of Hachette's trade book publishing system."
https://www.xml.com/articles/2017/02/20/beyond-xml-making-books-html/
+07: JAVASCRIPT.
JavaScript Without Loops
By James Sinclair.
"...These iteration functions are a great example of why (well-chosen)
abstractions are so useful and elegant..."
http://jrsinclair.com/articles/2017/javascript-without-loops/
JavaScript's Journey Through 2016
By Tara Manicsic.
"...Every year there seems to be more and more ways to use JavaScript
and 2016 turned out to be no different..."
http://developer.telerik.com/topics/
web-development/javascripts-journey-2016/
+08: MISCELLANEOUS.
What is a Web Developer?
By Peter-Paul Koch.
"Last week I was the target of a good old-fashioned internet witch
hunt when I dared to propose that you should be able to work without
tools (frameworks, libraries, and so on) in order to be a web
developer..."
http://www.quirksmode.org/blog/archives/2017/02/what_is_a_web_d.html
On Design Tools and Processes
By Viljami Salminen.
"...Our design products are becoming more and more dynamic, but our
tools still treat them as blank canvases to paint on. Why?..."
https://viljamis.com/2017/design-tools-processes/
The Secret History of Hypertext
By Alex Wright.
"The conventional history of computing leaves out some key thinkers..."
https://www.theatlantic.com/technology/archive/
2014/05/in-search-of-the-proto-memex/371385/
+09: NAVIGATION.
Hamburger Menus Hurt UX Metrics (Video)
By Kara Pernice.
"Summary of user research on the effect of reduced visibility of the
main navigation on websites when used in both mobile and desktop
settings."
https://www.youtube.com/watch?v=rdeoPuPzONg
+10: STANDARDS, GUIDELINES & PATTERNS.
Validating HTML5 Documents
By Louis Lazaris.
"... the validator will let you know if your markup conflicts with the
specification, so it's still a valuable tool when developing your
pages..."
https://www.sitepoint.com/validating-html5-documents/
+11: TOOLS.
WAVE Accessibility Extension 1.0.3 (FireFox Extension)
By WebAIM.
The WAVE FireFox Extension is back: "Evaluate web accessibility within
the Firefox browser. When activated, the WAVE extension injects icons
and indicators into your page to give feedback about accessibility and
to facilitate manual evaluation."
https://addons.mozilla.org/en-US/firefox/addon/wave-accessibility-tool/
+12: TYPOGRAPHY.
Getting Started with Variable Fonts
By Richard Rutter.
"The following is an unedited extract from my forthcoming book..."
http://clagnut.com/blog/2389/
Introducing OpenType Variable Fonts
By John Hudson.
"Version 1.8 of the OpenType font format specification introduces an
extensive new technology, affecting almost every area of the format.
An OpenType variable font is one in which the equivalent of multiple
individual fonts can be compactly packaged within a single font
file..."
https://medium.com/@tiro/https-medium-com-tiro-
introducing-opentype-variable-fonts-12ba6cd2369
+13: USABILITY.
Beyond Usability: 3 User Experiences Reshaping Their Industries
By Sarah Gibbons.
"Rent the Runway, Uber, and Airbnb challenge the traditional
experiences of their industries."
https://www.nngroup.com/articles/3-user-experiences-reshaping-industries/
Narrative Biases: When Storytelling HURTS User Experience
By Kathryn Whitenton.
"Over reliance on narrative details and assumptions about
cause-and-effect explanations can lead to errors in judgment by UX
practitioners."
https://www.nngroup.com/articles/narrative-biases/
The UX of Voice: The Invisible Interface
By Jason Amunwa.
'...In this post, we're going to explain some of the profound
implications of the rise of voice interaction for UX design. Just as
the internet began as a playground of raw new technical capability
that embraced the guiding principles of intuitive, user-friendly
product design over time, so too I see today's voice-enabled tools and
devices in their infancy, with limitless potential ready to be
unlocked through innovative, user-centered design..."
http://www.dtelepathy.com/blog/design/
the-ux-of-voice-the-invisible-interface
How to Not Utterly Ruin Your Mobile App's User Interface
By Luke Konior.
"...I've seen every one of these mistakes made by designers of all
levels of experience. There's no shame in that - a good UI design is a
multifaceted challenge, and it's easy to overlook some aspects of
it..."
https://medium.freecodecamp.com/how-to-not-
utterly-ruin-your-mobile-apps-user-interface-8433cee6477d
[Section one ends.]
++ SECTION TWO:
+14: 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@xxxxxxxxx
[Issue ends.]
.
.
