Topics

[webdev] Web Design Update: July 6, 2018

David Dillard
 


Laura Carlson <lcarlson@d.umn.edu>

Jul 6, 2018, 7:38 AM
to webdev
+++ WEB DESIGN UPDATE.
- Volume 17, Issue 02, July 6, 2018.

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

++ISSUE 02 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: COLOR.
04: EVALUATION & TESTING.
05: EVENTS.
06: HTML.
07: JAVASCRIPT.
08: MISCELLANEOUS.
09: NAVIGATION.
10: PHP.
11: TYPOGRAPHY.
12: USABILITY.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

I Used The Web For A Day With Just A Keyboard
By Chris Ashton.
"Many of us are taught to make sure our sites can be used via
keyboard. Why is that, and what is it like in practice? Chris Ashton
did an experiment to find out…"
https://www.smashingmagazine.com/2018/07/web-with-just-a-keyboard/

Artificial Intelligence for Web Accessibility - Conformance Evaluation
as a Way Forward?
By Shadi Abou-Zahra, Judy Brewer, and Michael Cooper.
"For people with disabilities there are immense potential…However, a
significant drawback of artificial intelligence for web accessibility
at this time is a lack of accuracy and reliability…"
https://dspace.mit.edu/handle/1721.1/116479

Revised "Inaccessibility of CAPTCHA" Draft for Review
By Janina Sajka.
"…Web Content Accessibility Guidelines 2.0 and 2.1 refer to the
requirement for accessible CAPTCHA in Success Criterion 1.1.1 Non-Text
Content. This document is an important complement to that requirement
which provides more detail on how to meet these requirements, and
relevant considerations in accessible authentication of Web users…"
https://www.w3.org/blog/2018/07/captcha-update/

Exploring WCAG 2.1 - 2.5.3 Label in Name
By Becky Gibson.
"Our series of new WCAG 2.1 Success Criteria continues with the next
success criterion within the new 2.5 Input Modalities guideline: 2.5.3
Label in Name…"
https://knowbility.org/blog/2018/WCAG21-253LabelInName/

What's New with WCAG 2.1 (Video)
By Andrew Macpherson, Drupal 8 Core Accessibility Maintainer.
"The long-awaited updates to the Web Content Accessibility Guidelines
(WCAG 2.1) were released in early June - but what does that mean for
you and your organization?"
https://www.youtube.com/watch?v=6uCCDTwpIlo

How Technology Can Shut Out People with Disabilities
By Simon Dermer.
"If the recent, updated 2.1 release of the Web Content Accessibility
Guidelines (WCAG) demonstrates anything, it's that technology is
swiftly changing, and keeping up with it from an accessibility
perspective is an ongoing effort. But that's only because the needs of
people with disabilities typically aren't heeded from the get-go…"
http://techtrends.tech/tech-trends/expert-view-how-technology-can-shut-out-people-with-disabilities/

Automated Testing is Not Enough For Web Accessibility ADA Compliance
By Giacomo Petri and Christian Federici.
Over 80% of WCAG 2.0 Success Criteria requires Manual Review and 100%
of the new WCAG 2.1 Success Criteria will require the same…"
http://blog.usablenet.com/automated-testing-is-not-enough-for-web-accessibility-ada-compliance

Accessible Word Document Training
By Minnesota IT Services.
"This is the State of Minnesota e-Learning program on how to create
accessible documents…"
https://mn.gov/mnit/programs/accessibility/training/

AccessAbility: A Practical Handbook on Accessible Graphic Design (PDF)
By The Association of Registered Graphic Designers of Ontario.
"All design by definition promotes accessibility…"
https://www.rgd.ca/database/files/library/RGD_AccessAbility_Handbook.pdf

Hit Refresh - Eleventh Circuit Decision Opens Door for Copycat ADA Lawsuits
By Eversheds Sutherland.
"…Eleventh Circuit ruled that the private settlement of an ADA website
accessibility suit and ongoing remediation efforts by the defendant
pursuant to that settlement, do not bar an ADA accessibility action
filed later with respect to the same website…"
https://us.eversheds-sutherland.com/NewsCommentary/Legal-Alerts/212601/Legal-Alert-Hit-refreshEleventh-Circuit-decision-opens-door-for-copycat-ADA-lawsuits


+02: CASCADING STYLE SHEETS.

:focus-visible
By Chris David Mills, Rob Dodson, et al.
"The :focus-visible pseudo-class applies while an element matches the
focus pseudo-class and the UA determines via heuristics that the focus
should be made evident on the element…"
https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible

CSS Grid Level 2: Here Comes Subgrid
By Rachel Andrew.
"CSS Grid Level 2 is already in the process of being specified, and
the main feature of this level of the spec is to bring us subgrid. In
this article, Rachel Andrew explains the new features…"
https://www.smashingmagazine.com/2018/07/css-grid-2/

Clearfix: A Lesson in Web Development Evolution
By Jason Hoffman.
"…I thought it might be fun (and fascinating) to actually follow this
creative exchange all the way through. To take a look at a popular CSS
trick, the clearfix, and find out exactly how a web design technique
comes to be…"
https://css-tricks.com/clearfix-a-lesson-in-web-development-evolution/

CSS-in-JS: FTW || WTF? (Video)
By Bruce Lawson.
"Here's the video of my closing keynote at CSSDay.nl…"
https://www.brucelawson.co.uk/2018/css-in-js-ftw-wtf/

One-Offs
By Chris Coyier.
"…with the 36 flavors of CSS-in-JS. When your styles are attached to
your components, all components are one-offs. Stop using that
component, stop using those styles."
https://css-tricks.com/one-offs/


+03: COLOR.

The Science of Color Contrast - An Expert Designer's Guide
By Justin Baker.
"Understanding the complexity of color contrast for better design and
accessibility…"
https://medium.muz.li/the-science-of-color-contrast-an-expert-designers-guide-33e84c41d156


+04: EVALUATION & TESTING.

Anatomy of a User Research Consent Form
By David Travis.
"We've always treated the informed consent process seriously and we
have always gained explicit consent from people that take part in our
field visits and usability tests. Although I think we do a good job of
gaining consent, the advent of GDPR gave us an opportunity to review
what we do. We were interested if there was a way we could improve our
practice."
https://www.userfocus.co.uk/articles/anatomy-of-a-consent-form.html

Match Between the System and the Real World: The 2nd Usability
Heuristics Explained
By Anna Kaley.
"Systems should speak the users' language with familiar words,
phrases, and concepts rather than system-oriented terms. Interfaces
that follow real-world conventions and make information appear in a
natural and logical order demonstrate empathy and acknowledgement for
users."
https://www.nngroup.com/articles/match-system-real-world/


+05: EVENTS.

PHPDetroit Conference
July 26-28, 2018.
Livonia, Michigan, U.S.A.
https://phpdetroit.io/

Hue Design Summit
July 26-29, 2018.
Atlanta, Georgia, U.S.A.
http://huedesignsummit.com/

NEJS Conf
July 27, 2018.
Omaha, Nebraska, U.S.A.
https://2018.nejsconf.com/

UX Camp California
July 27-29, 2018.
Annapolis, California, U.S.A.
http://uxcamp.com/california/index.html

That Conference
August 6-8, 2018.
Wisconsin Dells, Wisconsin, U.S.A.
https://www.thatconference.com/

ConvergeSE
August 8-10, 2018.
Columbia, South Carolina, U.S.A.
http://convergese.com/

Southeast PHP Conference
August 16-17, 2018.
Nashville, Tennessee, U.S.A.
https://southeastphp.com/


+06: HTML.

Anatomy of Accessible Forms: Errors of the ways
By Raghavendra Satish Peri.
"When we submit user data as in financial transactions, travel and
entertainment bookings, or in filling surveys, it is quite common that
we make mistakes…"
https://www.digitala11y.com/anatomy-of-accessible-forms-errors-of-the-ways/


+07: JAVASCRIPT.

Easy ARIA Tip #8: Use aria-roledescription to Selectively Enhance the
User Experience
By Maro Zehe.
"In WAI-ARIA 1.1, the aria-roledescription attribute has been added to
give web authors the ability to further describe the function of a
widget. Here are a few tips for usage…"
https://www.marcozehe.de/2018/07/05/easy-aria-tip-8-use-aria-roledescription-to-selectively-enhance-the-user-experience/

aria-roledescription (property)
By Rakesh Paladugula.
"Aria-roledescription property is new in ARIA 1.1 specification…"
http://www.maxability.co.in/2018/07/aria-roledescription-property/

Accessible Carrousel Using ARIA
By Nicolas Hoffmann.
"This script will transform some Hx/contents into a nice accessible
carrousel, using ARIA…"
https://van11y.net/accessible-carrousel/

The Power and the Danger of WAI-ARIA: Speech Recognition Edition
By Deborah Kaplan.
"Use ARIA, and use it wisely…"
https://deborah.dreamwidth.org/84274.html

Is the new world of JavaScript confusing or intimidating? I thought
so, and recorded a video course how to feel better
By Christian Heilmann.
"JavaScript used to be easy. Misunderstood, but easy…"
https://christianheilmann.com/2018/07/03/is-the-new-world-of-javascript-confusing-or-intimidating-i-thought-so-and-recorded-a-video-course-how-to-feel-better/

The Cost Of JavaScript (Video)
By Addy Osmani.
"…Addy Osmani explains how and why JavaScript is the most expensive
resource your site uses today-especially on mobile. Addy also shares
tips for fixing JavaScript performance issues so everything loads
quicker. A little discipline can help if you want your site to load
and be interactive as soon as possible on mobile. Originally presented
at Fluent Conf 2018 in San Jose."
https://www.youtube.com/watch?v=63I-mEuSvGA


+08: MISCELLANEOUS.

'I Was Devastated': Tim Berners-Lee, the Man Who Created the World
Wide Web, Has Some Regrets
By Katrina Brooker.
"Berners-Lee has seen his creation debased by everything from fake
news to mass surveillance. But he’s got a plan to fix it."
https://www.vanityfair.com/news/2018/07/the-man-who-created-the-world-wide-web-has-some-regrets

An Ode to Web Pages
By Blake Watson.
"Challenge: Make a web page. Make it about anything you want. Put it
on your web server or hosting service."
https://www.blakewatson.com/journal/an-ode-to-web-pages/


+09: NAVIGATION.

Skip Navigation (Video)
By Microsoft.
"What are the accessibility requirements for allowing users to bypass
blocks of content? Learn about the skip navigation link on webpages
with this short video."
https://www.youtube.com/watch?v=PrPPz8KbWmU


+10: PHP.

Improve Your PHP Performance By Upgrading To PHP 7
By Steven Bradley.
"…Today I want to talk about PHP 7 and about how and why it's faster
than the versions that came before it. I'm hoping to convince you to
upgrade if you haven't already done so…"
https://vanseodesign.com/web-design/performance-php-7/


+11: TYPOGRAPHY.

Notes on Font Stacks for CJK
By Jonathan Snook.
"Working on a client project, we needed a font stack that would work
for Chinese, Japanese, and Korean, (aka CJK) along with all the usual
Latin locales…"
https://snook.ca/archives/html_and_css/cjk-font-stack-notes


+12: USABILITY.

The Hidden Cost of Touch Screens
By Amber Case.
"…Serious interfaces - those that are repeatedly used by a
knowledgeable professional and/or in potentially hazardous situations,
should not be touchscreen based. If a touchscreen must be used, it
should be embedded alongside a set of fixed, physical buttons that
support muscle memory and single actions…"
https://medium.com/@caseorganic/why-do-we-keep-building-cars-with-touchscreens-alt-the-hidden-lives-of-touchscreens-55faf92799bf

Icon Usability and Design Best Practices
By Micah Bowers.
"…The ultimate aim of icon usability and design is to enhance the user
experience, not confuse it. But what does that look like, and how can
user interface designers ensure that the icons they make will be
easily understood?…"
https://www.toptal.com/designers/ui/icon-usability-and-design

Order Out of Chaos: Patterns of Organization for Writing on the Job
By Richard Rabil, Jr.
"The meaning of what you write isn't only the the words. The sequence
of information, the categories you use, the emphasis you imply through
your hierarchy-all of these decisions have a huge influence on
audience understanding. Richard Rabil, Jr., explains how to use
foundational patterns of organization to help you convey what you mean
to say."
https://alistapart.com/article/order-out-of-chaos-patterns-of-organization-for-writing-on-the-job

10 Small Design Mistakes We Still Make
By Eugen Eşanu.
"…We should be told at least once a month about these small principles
until we live and breath good design…"
https://uxplanet.org/10-small-design-mistakes-we-still-make-1cd5f60bc708

The State of Transactional Email
By Kate Moran.
"Automated email messages are more usable than they used to be. Good
transactional email should be concise, clear, and easy for users to
process."
https://www.nngroup.com/articles/state-transactional-email/


[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

lcarlson@d.umn.edu


[Issue ends.]

Preview YouTube video The Cost Of JavaScript - Addy Osmani - Fluent 2018

Preview YouTube video Skip Navigation

 

 

 


--

Sincerely,

David Dillard
astrojwne@...

NET-GOLD

http://groups.yahoo.com/group/net-gold


https://groups.io/org/groupsio/net-gold/archives

 

Research Guides

https://sites.google.com/site/researchguidesonsites/

 

Research Paper Writing

https://sites.google.com/site/howtowriteasuperresearchpaper/

Employment

https://sites.google.com/site/employmentsources/


Internships

https://sites.google.com/site/internshipsarticles/

 

Blog

https://educatorgold.wordpress.com/


Twitter: davidpdillard


Sport-Med

https://www.jiscmail.ac.uk/lists/sport-med.html

https://groups.io/g/SportMed/topics