[webdev] Web Design Update: July 11, 2013

Laura Carlson lcarlson at d.umn.edu
Thu Jul 11 06:15:10 CDT 2013


+++ WEB DESIGN UPDATE.
- Volume 12, Issue 03, July 11, 2013.

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

++ISSUE 03 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: USABILITY.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Task Force for Inclusion of People with Cognitive Disabilities
By Lisa Seeman.
"We are working to make accessibility guidelines that focus on
cognitive disabilities. Guidelines that allow author to make their
content usable by as many people as possible. It should include people
with learning disabilities, problems reading, problem solving,
attention span, short term memory loss (such as mild to moderate
Alzheimer's) and language disabilities..."
For questions or to volunteer for this project contact Lisa at
lisa.seeman at zoho.com or lisa.seeman at deque.com.
http://accessibility.athena-ict.com/cognitive/RoadmapCog02.html

Accessibility Starts in the Style Guide
By Kevin Potts.
"This article will discuss the deficiencies of WCAG 2.0 in addressing
cognitive disabilities, how a style guide can help, and why it all
matters..."
http://graphicpush.com/accessibility-starts-in-the-style-guide

Accessible RWD
By Alastair Campbell.
"With the rise in popularity for responsive web design, Alastair
Campbell says websites need to be accessible, too..."
http://www.netmagazine.com/tutorials/accessible-rwd

All About Alt Text
By Marie Mosley.
"...Well-written, relevant alt text provides valuable information
about your blog to both your human visitors and search engine robots.
Keep it brief and to the point, and leave it blank on non-essential
decorative images. And remember, it's alt text, not an alt tag..."
http://www.codeitpretty.com/2012/04/all-about-alt-text.html

Keyboard and Interaction Accessibility Techniques
By Jared Smith.
"Techniques for addressing keyboard accessibility issues for screen
reader users and sighted keyboard users."
http://www.slideshare.net/jared_w_smith/keyboard-accessibility-24070581

Web Habits of Blind Screen Reader Users (Video)
By Victor Tsaran.
"How much do we know about web habits of screen reader users, in
particular, those who live in Africa, Asia and the Middle East, and
cannot take advantage of the fast connection to the Internet? This
presentation examines results from research with 20 vision-impaired
users from various countries around the world assembled at a Social
Entrepreneurship workshop. While their answers shed the light on a lot
of interesting cognitive and cultural issues regarding the use of
assistive technology and the web in particular, the three most
prominent topics were lack of training, lack of awareness about
existing options and lack of their familiarity with the workings of
the Internet...."
http://blip.tv/uw-change/victor-tsaran-web-habits-of-blind-screen-reader-users-preliminary-evidence-from-users-in-7-african-asian-and-middle-eastern-states-2771057


+02: CASCADING STYLE SHEETS.

An Introduction to CSS Regions
By Chris Mills.
"CSS3 brings with it many features to help us build complex, flexible
layouts more easily and logically, without having to resort to
JavaScript and painful hacks. One such feature is described in the CSS
Regions Module Level 3 - the basic idea here is that you write your
content into some good old semantic HTML elements, and then also
define a separate set of (non-semantic) containers that will serve as
the scaffolding on which to hang your styles that define layout,
etc..."
http://dev.opera.com/articles/view/an-introduction-to-css-regions/

CSS Viewport Units - vw, vh, vmin and vmax
By Chris Mills.
"The CSS Values and Units Module Level 3 defines a whole host of new
units that can be used in various contexts, for example seconds and
milliseconds, degrees and radians, and rems for sizing things relative
to the font-size on the root element. One type of units that has not
been so widely discussed is viewport units, for sizing things relative
to the viewport size, a brilliant proposition for responsive design.
They are currently supported by a reasonable variety of browsers
(Opera 15, Firefox, Chrome, Blackberry 10, IE10, iOS), and allow for a
lot of interesting new possibilities. Let's explore."
http://dev.opera.com/articles/view/css-viewport-units/

Centering Percentage Width/Height Elements
By Chris Coyier.
"If you know the exact width/height of an element, you can center it
smack dab in the middle of its parent element easily with this classic
trick..."
http://css-tricks.com/centering-percentage-widthheight-elements/

Style Sheets for Blogs - What's the Purpose?
By Virginia DeBolt.
"The best practice is to choose a look you like as a template or theme
and then leave it alone. Don't use the provided toolbar to change
fonts or colors or layout as you type your content into your blog. Use
the tools to create headings and lists and blockquotes ' that formats
content into meaningful page elements ' that's okay. But font size or
alignment or color choices are not meaningful. Instead, they deal with
appearance. That's not okay."
http://www.webteacher.ws/2013/07/10/style-sheets-for-blogs-whats-the-purpose/

In Defense of the Humble id Attribute
By John Allsopp.
"...The criticisms of the use of id are almost invariably about its
shortcomings when used in CSS. But id is for more than just providing
styling hooks. I've got this crazy idea about developing for the web.
These days it's referred to as 'content out'.  The idea is that the
content of the page drives the design. By marking up the page content
as meaningfully as we can, we surface that content, and the associated
functionality of the page. Then how we present this content is driven
by the content..."
http://www.webdirections.org/blog/in-defense-of-the-humble-id-attribute/


+03: DRUPAL.

Using Drupal Book in Video Lessons
By Addison Berry.
"...This year we're happy to announce the video version of Using
Drupal. As an original author on the book I'm stoked to be able to
marry together my work on the book with my work on Drupal training
videos..."
http://drupalize.me/blog/201307/using-drupal-book-video-lessons


+04: EVALUATION & TESTING.

Ethnography is Everywhere
By Deepa Reddy.
"...Ethnography seems to have acquired a new cachet in the last
decade. It appears practically everywhere in business and consumer
research: it's the new marketing buzzword, a must-have in a designer
toolkit, a short-hand reference to qualitative research. Everyone
speaks of 'ethnography' as a straightforward people-watching,
people-studying tool. Everyone appears to be doing ethnography, too,
in short or long stints, using a mixed bag of observation and
interviews for data collection, and generating a range of visual
(photos, videos, visualizations) and written outputs. If design is
social, and we all seem to agree that it is, then ethnography is the
means to access this sociality."
http://www.humanfactors.com/downloads/jul13.asp#research

How to Benchmark Website Usability
By Jeff Sauro.
"Here are the steps we follow in designing, conducting and analyzing
benchmark usability tests..."
http://www.measuringusability.com/blog/benchmark-website-usability.php


+05: EVENTS.

User Modeling for Accessibility
July 15, 2013.
Online Symposium
http://www.w3.org/WAI/RD/2013/user-modeling/

Web and PHP Conference
September 16-18, 2013.
San Jose, California, U.S.A.
http://webandphpmag.wordpress.com/

Web Directions South 2013
October 22-25, 2013.
Sydney, Australia
http://webdirections.org/wds13/

edUi
November 4-6, 2013.
Richmond, Virginia, U.S.A.
http://eduiconf.org/


+06: HTML5.

HTML5 and ARIA Design Patterns
By Leonie Watson and Steve Faulkner.
"With HTML5 and ARIA now in regular use across the web, several design
patterns are emerging that solve common scenarios. This article takes
five HTML5 and ARIA design patterns and explains why they make good
design choices..."
http://www.netmagazine.com/features/5-html5-and-aria-design-patterns

Five Reasons Why You Should Quote Attribute Values in HTML5
By John Allsopp.
"...You can't always leave off quotes from attribute values. Think
about an element with two class attribute values..."
http://www.webdirections.org/blog/five-reasons-why-you-should-quote-attribute-values-in-html5/


+07: JAVASCRIPT.

Learn to Use ARIA: Step 1 - Understanding Roles, States,
Relationships, and Focus
By Lisa Seeman.
"This post is the first in a series that aims to demonstrate how to
use ARIA to make complex web pages and applications completely
accessible. In this introductory post, I will give you an overview of
ARIA that will explain what ARIA is trying to do and how it does it.
After reading this overview you should understand how it all fits
together, which will help lesson the chance of running into errors..."
http://www.deque.com/learn-aria-step-1-understanding-roles-states-relationships-focus

The Importance of Keyboard Accessibility and Why ARIA Widgets Don't
Work as Expected in Voice Navigation Software
By Bryan Garaventa.
"There is currently a lot of confusion regarding ARIA control types
like Listboxes, Tabs, and Menus that do not work as expected in voice
navigation software such as Dragon NaturallySpeaking..."
https://www.ssbbartgroup.com/blog/2013/07/08/the-importance-of-keyboard-accessibility-why-aria-widgets-dont-work-as-expected-in-voice-navigation-software/

ARIA Roles (L)
By Rakesh Paladugula.
"The following ARIA roles begin with the letter 'L'. Click each link
that takes you to its description..."
http://www.maxability.co.in/2013/07/aria-roles-l/

Array Iteration and Holes in JavaScript
By Axel Rauschmayer.
"The blog post describes how various functions and methods that deal
with arrays are affected by holes..."
http://www.2ality.com/2013/07/array-iteration-holes.html

Firefox 23 to Hide 'Disable JavaScript' Option
By Craig Grannell.
"A Bugzilla bug report has been getting plenty of attention over the
past 24 hours. It states the 'Disable JavaScript' checkbox will be
removed in the next major version of the browser Firefox 23..."
http://www.netmagazine.com/news/firefox-23-hide-disable-javascript-option-132851


+08: MISCELLANEOUS.

Lockdown
By Marco Arment.
"The bigger problem is that they've abandoned interoperability. RSS,
semantic markup, microformats, and open APIs all enable
interoperability, but the big players don't want that - they want to
lock you in, shut out competitors, and make a service so proprietary
that even if you could get your data out, it would be either useless
(no alternatives to import into) or cripplingly lonely (empty social
networks). Google resisted this trend admirably for a long time and
was very geek- and standards-friendly, but not since Facebook got huge
enough to effectively redefine the internet and refocus Google's plans
to be all-Google+, all the time.4 The escalating three-way war between
Google, Facebook, and Twitter - by far the three most important web
players today - is accumulating new casualties every day at our
expense..."
http://www.marco.org/2013/07/03/lockdown

The Hut Where the Internet Began
By Alexis Madrigal.
 When Douglas Engelbart read a Vannevar Bush essay on a Philippine
island in the aftermath of World War II, he found the conceptual space
to imagine what would become our Internet..."
http://www.theatlantic.com/technology/archive/2013/07/the-hut-where-the-internet-began/277551/


+09: USABILITY.

Should I Use a Carousel?
By Jared Smith.
"Every time you use a carousel, a kitten dies..."
http://shouldiuseacarousel.com/

User Story Cards for Web Writers
By  Dey Alexander.
"Do you or your colleagues have problems knowing where to start when
writing for your organisation's website? Or do you find it hard
dealing with different opinions about what you should write or who
you're writing it for? User story cards can help. They're an easy way
to do a little planning to help guide your writing..."
http://www.4syllables.com.au/2013/07/user-story-cards/

Content Is All That Matters On The Web
By Wojciech Chojnack.
"The focus and widespread knowledge towards the importance of web
design, web development, usability, and user experience is definitely
positive, considering that only a few years ago most of the meetings I
have had with clients had to start with an explanation of what the
term usability meant. However, what is missing in these discussions -
what is in desperate need of attention - is web content and the
creation of a comprehensive and unified strategy for it."
http://sixrevisions.com/content-strategy/content/

When the UI Is Too Fast
By Jakob Nielsen.
"Users might overlook things that change too fast - and even when they
do notice, changeable screen elements are harder to understand in a
limited timeframe."
http://www.nngroup.com/articles/too-fast-ux/

Organization Language Versus Customer Language
By Gerry McGovern.
"...Many government websites are riddled with propaganda. Smiley,
hand-shakey pictures of politicians and senior figures. Content
explaining in excruciating detail what the government is doing. Bucket
loads of 'news' (that is not news) and press releases about projects
that hardly anyone is interested in. To become relevant on the Web,
governments must dump all this junk, start speaking in language
ordinary people understand, stop droning on about what it's doing for
people, and instead let people quickly and easily do something
useful."
http://www.gerrymcgovern.com/new-thinking/organization-language-versus-customer-language

Flat Design Done Wrong
By Steven Bradley.
"I'd like to spend the next couple of posts talking about flat design.
Today I'll focus more on where it goes wrong and next week share more
about how much it gets right once you get past the name..."
http://www.vanseodesign.com/web-design/flat-design-done-wrong/


[Section one ends.]


++ SECTION TWO:

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