[webdev] Web Design Update: January 24, 2014

Laura Carlson lcarlson at d.umn.edu
Fri Jan 24 06:18:49 CST 2014


+++ WEB DESIGN UPDATE.
- Volume 12, Issue 31, January 24, 2014.

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

++ISSUE 31 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: BOOKS
03: CASCADING STYLE SHEETS.
04: EVENTS.
05: HTML5.
06: JAVASCRIPT.
07: MISCELLANEOUS.
08: NAVIGATION.
09: PHP.
10: USABILITY.


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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Accessible UX Principles and Guidelines
By Whitney Quesenbery.
"Designing a web for everyone combines good design and usability with
accessibility to create inclusive design..."
http://rosenfeldmedia.com/blogs/a-web-for-everyone/accessible-ux-principles-and-guidelines/

Recap - A Web For Everyone, Accessibility as a Design Challenge
By Deborah Edwards-Onoro.
"At today's A Web for Everyone: Accessibility as a Design Challenge
webinar, hosted by O'Reilly Media and Rosenfeld Media, Whitney
Quesenbery spoke about a new way of thinking about designing
accessible user experiences: designing applications and websites in a
way that everyone can use them..."
http://www.lireo.com/recap-a-web-for-everyone-accessibility-as-a-design-challenge/

A Sweet Toggle Switch
By Dennis Lembree.
"In today's world of front-end web development, it's becoming
increasingly complex to create custom interface elements. A common
scenario is when your design team has required a non-standard
web-based form component. This time it's a toggle switch which seems
to be becoming more popular in the web design world. Winging the
development of a toggle switch for a prototype is one thing, but for
production a gracefully degradable and fully accessible version is
required. Let's walk through the strategy and code for developing a
sweet toggle switch. We'll create a control where the user can select
either a 'checking' or 'savings' account..."
https://www.paypal-engineering.com/2014/01/15/a-sweet-toggle-switch/

Personalized Web for the Assistive Technology
By Alexander Surkov.
"Sometimes the web authors provide a different content for screen
readers than they do that for sighted users. That could be an
additional content like 'skip to content' navigational links or set of
landmarks to create a more reliable document structure. In some cases
the web author might want to remove a content, for instance, duping
links, or make extra tricks to keep the content accessible if, for
example, the author gets out of the standard HTML. In ideal case of
course the content is supposed to be quite the same but because of
design issues and HTML imperfection it doesn't really happen. The web
repletes with examples of special content for the assistive
technology..."
http://asurkov.blogspot.com/2014/01/personalized-web-for-assistive.html

Don't Let Any Element Flash More Than Three Times Per Second
By Denis Boudreau.
"Individuals who have photosensitive seizure disorders (or
photosensitive epilepsy) can have a seizure triggered by content, if
the flashes are bright and large enough..."
http://dboudreau.tumblr.com/post/73609207931/dont-let-any-element-flash-more-than-three-times-per

Structure Tabular Information Using Table Markup
By Denis Boudreau.
"Information is considered tabular when a logical relationship between
different data pieces is represented in columns and rows. In order for
the logical relationships to be perceived, columns and rows must be
recognizable by users. The relationship presented between information
in data tables must be preserved even when users cannot see the table
or the presentation format is changed..."
http://dboudreau.tumblr.com/post/74173453663/structure-tabular-information-using-table-markup

Avoid Purely Visual Display of Tabular Information
By Denis Boudreau.
"Make sure tabular information in a way that can be determined by
assistive technology..."
http://dboudreau.tumblr.com/post/73823572773/avoid-purely-visual-display-of-tabular-information

Call for Review - WCAG 2.0 Techniques Draft Updates - January 2014
By Rakesh Paladugula.
"The W3C WAI announces a Call for Review of updates to two supporting
documents for Web Content Accessibility Guideline (WCAG) 2.0. *This is
not an update to WCAG 2.0, which is a stable document..."
http://www.maxability.co.in/2014/01/call-for-review-wcag-2-0-techniques-draft-updates-january-2014/

Airlines and Web Accessibility Litigation
By Deque Systems.
"In the past decade, there have been many lawsuits regarding web
accessibility, and the travel industry is no exception..."
http://www.deque.com/airlines-web-accessibility-litigation


+02: BOOKS.

Horton, Sarah and Quesenbery, Whitney. A Web for Everyone, Rosenfeld
Media, 2014.


+03: CASCADING STYLE SHEETS.

REMs And Viewport Measurements - Why You Shouldn't Use Them Yet
By Steven Bradley.
"Designing for the web means designing flexibly. It means dropping
absolute measurements and adopting relative ones like em and %. There
will be exceptions, but for most things you should be using relative
measurements..."
http://www.vanseodesign.com/css/rems-and-viewport-measurements/

CSS Regions Considered Harmful
By Hakon Wium Lie.
"Hakon Wium Lie is the father of CSS, the CTO of Opera, and a pioneer
advocate for web standards. His last article in this magazine led
directly to real fonts on the web. When Hakon speaks, whether we
always agree or not, we listen. In today's post, Hakon shares his
opinion on CSS Regions..."
http://alistapart.com/blog/post/css-regions-considered-harmful


+04: EVENTS.

Beyond the Desktop - Orlando
November 3-5, 2014.
Orlando, Florida, U.S.A.
https://bdconf.com/events/2014/Orlando/


+05: HTML5.

HTML Explained in 123 Tweets: The Google #htmltuesday Archive
By Jens O. Meiert.
"Did you know that Google's Webmaster Team tweeted short statements
about all HTML elements, every week, for two and a half years? It was
called '#htmltuesday' and ran from 2011 to 2013..."
http://meiert.com/en/blog/20140121/htmltuesday/

10 HTML Tags You May Not Be Using
By Aurelio De Rosa.
"...In this article, I'll show you 10 HTML tags you may not be using
or maybe even aren't yet aware of that help to increase the semantics
and maintainability of your web pages..."
http://www.sitepoint.com/10-html-tags-not-using/


+06: JAVASCRIPT.

Accessible Coverage Test Reporting for JavaScript
By Dylan Barrell.
"If you have been reading recent postings, you will know I have been
working a lot on JavaScript testing, in particular, coverage tests. As
with most development tools and Web applications, most of the tools I
could find did not generate accessible output. So while working on the
gulp-coverage plugin for the Gulp Node.js task system, I decided to
ensure that the HTML reports are totally accessible and am pleased to
announce, version 1 of the accessible HTML coverage reports. In order
to get this functionality, you will have to ensure that you have
version 0.0.11 or higher of the gulp-coverage plugin..."
http://unobfuscated.blogspot.com/2014/01/accessible-coverage-test-reporting-for.html

A Dive Into Plain JavaScript
By Viljami S.
"While I've worked over a decade building various websites, it has
only been the past 3 years that I've started learning more on how to
work with plain JavaScript, instead of using jQuery always as the
starting point..."
http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript/

The New Operator Implemented in JavaScript
By Axel Rauschmayer.
"Code snippet - this is roughly how you would implement the new
operator in JavaScript..."
http://www.2ality.com/2014/01/new-operator.html


+07: MISCELLANEOUS.

Dealing With Workaholism On Web Teams
By Yiannis Konstantakopoulos.
"Workaholism is often confused with hard work. Some people who work on
the Web seem not only to disregard its dangers, but to actively
promote it. They see it as a badge of honor-but is it really? On the
contrary, it's a serious issue that can damage Web teams."
http://www.smashingmagazine.com/2014/01/20/dealing-with-workaholism-on-web-teams/


+08: NAVIGATION.

Provide Links that Meaningfully Describe Their Purpose
By Denis Boudreau.
"Make sure the purpose of links can be determined from the text label
of each link..."
http://dboudreau.tumblr.com/post/73776496165/provide-links-that-meaningfully-describe-their-purpose

Sparkicons - Can We Make Better Links?
By Georgina Laidlaw.
"Around this time last year, Mark Boulton proposed a new way of
communicating information about linked content online. He called his
idea sparkicons, building on Edward Tufte's description of sparklines,
and pointed to some examples on large content-rich, link-heavy sites:
Wikipedia and the BBC. He also created some examples of his own..."
http://www.sitepoint.com/sparkicons-can-we-make-better-links/


+09: PHP.

What is Refactoring PHP Code?
By Stefan Mischook.
"For whatever reasons, I am in the mood to write...and I have a video
too! So, what the heck is code refactoring?..."
http://www.killerphp.com/articles/what-is-refactoring-php-code/


+10: USABILITY.

University Websites - Top 10 Design Guidelines
By Katie Sherwin.
"Effective university websites can increase conversions, strengthen
institutional credibility and brand, improve user satisfaction, and
save time and money."
http://www.nngroup.com/articles/university-sites/

Maps and Location Finders on Mobile
By Aurora Bedford.
"Maps of business locations may be more visually appealing than a
simple list view, but they introduce too many usability issues on
mobile devices."
http://www.nngroup.com/articles/mobile-maps-locations/

Scrolling is Easier Than Clicking
By Joshua Porter.
A small observation with huge implications: scrolling is easier than
clicking..."
http://bokardo.com/archives/scrolling-easier-clicking/

10 Tougher Tasks to Reduce Page Weight
By Craig Buckler.
"In my previous article, 10 Quick and Easy Fixes to Reduce Page
Weight, I discussed basic techniques that slim your site without
fundamentally changing code. If your pages are still obese, there are
more drastic dieting options you can contemplate..."
http://www.sitepoint.com/10-tougher-tasks-reduce-page-weight/

By What is Flat Design (and how do I do it)?
By Gabrielle Gosha.
"Flat design, while not a new trend is still a refreshing take on
design, whether you are a fan of it or not. There are some issues that
flat design poses but fans of minimalism and simplicity will
definitely appreciate what the trend has to offer and hopefully will
find a workaround. Even if you just want to take a break from the more
detailed work often seen in design then you should definitely give the
trend a try..."
http://www.sitepoint.com/understanding-flat-design/


[Section one ends.]


++ SECTION TWO:

+11: 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

Dreamweaver Information.
http://www.d.umn.edu/itss/training/online/webdesign/dreamweaver.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

Flash Information.
http://www.d.umn.edu/itss/training/online/webdesign/flash.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.]


More information about the Webdev mailing list