[webdev] Web Design Update: November 21, 2012

Laura Carlson lcarlson at d.umn.edu
Wed Nov 21 06:14:58 CST 2012


+++ WEB DESIGN UPDATE.
- Volume 10, Issue 22, November 21, 2012.

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

++ISSUE 22 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: EVALUATION & TESTING.
04: INFORMATION ARCHITECTURE.
05: JAVASCRIPT.
06: NAVIGATION.
07: STANDARDS, GUIDELINES & PATTERNS.
08: USABILITY.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Yes, Actually It May Be You One Day
By Karl Groves.
"...The data doesn't lie. If you're lucky enough to live to an
advanced age, your chances of having some kind of disability rises
significantly - to 50% and beyond. So when you're considering whether
or not accessibility is important, keep in mind that it could actually
be you you're ensuring accessibility for. If it isn't you, it will
definitely be someone you know, and possibly someone you love...."
http://www.karlgroves.com/2012/11/16/yes-actually-it-may-be-you-one-day/

Accessible Custom Checkboxes and Radio Buttons
By Roger Johansson.
"Every now and then I'm handed a design comp that has customised
checkboxes and radio buttons. This used to make me think 'Oh no, not
again' because I simply didn't know of a reliable way to customise
these particular form controls..."
http://www.456bereastreet.com/archive/201211/accessible_custom_checkboxes_and_radio_buttons/

Accessible Client-side Form Validation with HTML5
By Paul J. Adam.
"...In this three part blog series we'll learn to make accessible
forms with HTML5, WAI-ARIA, and jQuery Validation. Our strategy will
be to first try validation with HTML5 in the latest browsers that
support these form attributes, then we will use WAI-ARIA which works
with the latest screen readers, and finally for the folks who just
can't upgrade we'll add the jQuery Validation plugin so even IE6 users
can accessibly submit forms..."
http://www.deque.com/accessible-client-side-form-validation-html5

Accessible Client-side Form Validation with HTML5 & WAI-ARIA
By Paul J. Adam.
"In part two of the three-part series on accessible form validation
and usability enhancements we're going to use WAI-ARIA (Web
Accessibility Initiative - Accessible Rich Internet Applications) to
communicate information to screen reader users only..."
http://www.deque.com/accessible-client-side-form-validation-html5-wai-aria

Accessible Client-side Form Validation with HTML5, WAI-ARIA, & the
jQuery Validation Plugin
By Paul J. Adam.
"In the last part of our series on accessible form validation and
usability enhancements we're adding the jQuery Validation plugin to
make sure our form is universally accessible on all devices that
support JavaScript including the dreaded IE6."
http://www.deque.com/accessible-client-side-form-validation-html5-wai-aria-jquery-validation-plugin

Accessibility with WordPress - Accessing Higher Ground 2012
By Deborah Edwards-Onoro.
"At his Accessibility with WordPress presentation at Accessing Higher
Ground 2012 Joe Dolson discussed the benefits and limitations of
WordPress accessibility. He highlighted issues with themes, plugins,
administration, discussed the upcoming 3.5 release and his recently
released plugin that corrects theme accessibility issues. Here are my
notes..."
http://deboraheo.posterous.com/accessibility-with-wordpress-accessing-higher


+02: CASCADING STYLE SHEETS.

Should You Use Inline-Blocks As A Substitute For Floats?
By Steven Bradley.
"When it comes to developing a site layout with css, floats do most of
the heavy lifting. We use them for the big blocks like our main
content and sidebar and we use them for the smaller blocks inside
these big ones. Are floats always the answer?..."
http://www.vanseodesign.com/css/inline-blocks/

CSS Architecture
By Appfolio Engineering.
"Today's web applications are larger than ever, and a poorly
thought-out CSS architecture can cripple development. It's time to
evaluate CSS the same way we evaluate every other part of the
application. It cannot be an afterthought or written off as merely the
'designer's' problem."
http://engineering.appfolio.com/2012/11/16/css-architecture/


+03: EVALUATION & TESTING.

Conducting Effective Design Critiques
By Janet M. Six.
"In this edition of Ask UXmatters, our experts discuss how to conduct
an effective design critique..."
http://www.uxmatters.com/mt/archives/2012/11/conducting-effective-design-critiques.php


+04: INFORMATION ARCHITECTURE.

Agile, OmniGraffle, and Native Mobile Wireframing
By Simon Keatley.
"... you'll see that I've found some ways to create wireframes more
efficiently, with some UX process and philosophy sprinkled in..."
http://www.uxmatters.com/mt/archives/2012/11/agile-omnigraffle-and-native-mobile-wireframing.php


+05: JAVASCRIPT.

Building A Relationship Between CSS & JavaScript
By Tim Wright.
"jQuery, Prototype, Node.js, Backbone.js, Mustache and thousands of
JavaScript microlibraries all combine into a single undeniable fact:
JavaScript is popular. It's so popular, in fact, that we often find
ourselves using it in places where another solution might be better in
the long run..."
http://coding.smashingmagazine.com/2012/11/19/building-relationship-between-css-javascript/


+06: NAVIGATION.

Changes in Web-User Behaviour
By Roger Hudson.
"...This apparent decline in the ability to understand, or willingness
to learn, the navigation systems common to many sites may not be
confined to novice web users or people with lower-level reading skills
like those involved in the 2012 project. Instead, an emerging
‘Facebook effect’ may help explain why some regular web users today
are less likely to participate in the exploratory, web-surfing
behaviour of the past...A combination of this growing reliance on
Google, and the suggested 'Facebook effect' may mean that it is time
to reconsider some basic usability and accessibility principals, and
the potential impact it could have for web users with cognitive
impairments and/or limited internet experience. Furthermore, I believe
it may have more general implications for WCAG 2, in particular,
'Guideline 2.4 Navigable: Provide ways to help users navigate, find
content, and determine where they are...'"
http://usability.com.au/2012/11/changes-in-web-user-behaviour/

Responsive Menu Concepts
By Tim Pietrusky.
"When it comes to responsive design we are faced with various
techniques on how to best handle altering our navigation menus for
small screens. The resources seem endless. That's why I'm going to
show you four main concepts and discuss the advantages and
disadvantages of all of them."
http://css-tricks.com/responsive-menu-concepts/


+07: PHP.

Usage of MySQL in PHP
By Gayanath Jayarathne.
"Almost all web applications associate with a database. MySQL has been
the popular choice for many database-driven PHP applications. Articles
listed here will teach you how to communicate with MySQL via PHP..."
http://www.phpknowhow.com/mysql/


+08: STANDARDS, GUIDELINES & PATTERNS.

The Menu Element
By Ian Devlin.
"ne of the less talked about elements that is included in the HTML5
specification is the menu element. This is probably due to the fact
that most browsers either don't support it at all, or only fleetingly.
Here I will take a quick look at this element and how it can be
used..."
http://www.iandevlin.com/blog/2012/11/html5/the-menu-element

Jaws Scripts for the HTML5 Main Element
By Leonie Watson.
"The main element extension specifies a way to markup the primary
content area of a web page in HTML5. There are several good reasons
for introducing the main element, including a more reliable way for
screen readers to pinpoint the start of the primary content area on
the page..."
http://tink.co.uk/2012/11/jaws-scripts-for-the-html5-main-element/


+09: USABILITY.

Windows 8 - Disappointing Usability for Both Novice and Power Users
By Jakob Nielsen.
"Hidden features, reduced discoverability, cognitive overhead from
dual environments, and reduced power from a single-window UI and low
information density. Too bad."
http://www.useit.com/alertbox/windows-8.html

Why Lean Thinking is the Answer to Complexity
By Gerry McGovern.
"When things get very complex you need to get very lean and flexible.
You can't predict the future but you can adapt to it."
http://www.gerrymcgovern.com/new-thinking/why-lean-thinking-answer-complexity

[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