[webdev] Web Design Update: October 31, 2013

Thu Oct 31 06:28:54 CDT 2013

+++ WEB DESIGN UPDATE.
- Volume 12, Issue 19, October 31, 2013.

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

++ISSUE 19 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: HTML5.
05: JAVASCRIPT.
06: MISCELLANEOUS.
07: TOOLS.
08: TYPOGRAPHY.
09: USABILITY.

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Images Of Text
By Rakesh Paladugula.
"If the technologies being used can achieve the visual presentation,
text is used to convey information rather than images of text except
for the following: (Level AA)..."
http://www.maxability.co.in/2013/10/1-4-5-images-of-text/

How Video Accessibility Intersects with Engagement, SEO, and User Experience
By Shannon K. Murphy.
"...Let's explore the benefits of accessible video for corporate
marketing and how it ties in with engagement, SEO, and user
experience..."
http://www.3playmedia.com/2013/10/25/how-video-accessibility-intersects-engagement-seo-user-experience/

Guidelines - Accessibility (WordPress)
By wordpress.org
"The Theme Accessibility Audit provides an optional theme review for
themes submitted to the wordpress.org Theme Repository. Submitted
themes (or theme updates) that contain the tag accessibility-ready
will undergo an independent, accessibility review after they have been
approved for inclusion in the Theme Repository..."
http://make.wordpress.org/themes/guidelines/guidelines-accessibility/

+02: CASCADING STYLE SHEETS.

Icon Fonts and User-Defined Style Sheets
By Gez Lemon.
"Icon fonts are vector graphics that are included in the content using
the CSS content property on a before or after pseudo-class selector.
As with regular fonts, icon fonts are scalable and can be styled using
CSS, unlike images. They also have the benefit that they remain
visible in high contrast on Windows, unlike CSS background images. The
biggest drawback from an accessibility point of view is that they
won't work if a user's user-defined style sheet overrides the
font-family property."
http://juicystudio.com/article/icon-fonts-user-defined-stylesheets.php

CSS3 Inheritance Tips and Tricks
By Craig Buckler.
"It's easy to overlook the cascading features of stylesheets. Most
developers are aware of the inherit keyword but there are a few new
inheritance features in CSS3 you may not be aware of..."
http://www.sitepoint.com/css3-inheritance-tips-tricks/

Float Label Pattern
By Brad Frost.
"Inline form labels can cause a lot of trouble, but at the same time
the constraints of mobile screens force designers to do more with less
space. It puts people in a weird position. Let's take a look at the
pros and cons of inline labels..."
http://bradfrostweb.com/blog/post/float-label-pattern/

Well Rounded - Compound Shapes in CSS
By Parker Bennett.
"The following is a guest post by Parker Bennett. Parker is a bit of a
regular around here, known for tackling common problems with unique
solutions. This time he's back at it creating complex shapes that have
image backgrounds, shadows, and curves, yet are flexibl"
http://css-tricks.com/well-rounded-compound-shapes-css/

+03: COLOR.

Color Contrast Analyzer for Chrome - Text in Images, Gradients, PDFs and More
By Greg Krase.
"There are several good color contrast analysis tools available. I've
come to heavily depend upon some of them for analyzing text, but they
all lack some functionality that I find I'm needing. I would like to
be able to analyze text within images, and analyze text over top of
background images or gradients..."
http://accessibility.oit.ncsu.edu/blog/2013/10/29/color-contrast-analyzer-for-chrome-text-in-images-gradients-pdfs-and-more/

+04: HTML5.

The HTML5 Document Outline
By Steve Faulkner.
"...It is dangerous because it can lead unsuspecting developers to
think that using the nesting of heading elements in sectioning
elements actually has some effect for users who consume heading
semantics. Overwhelmingly the opposite is true..."
http://blog.paciellogroup.com/2013/10/html5-document-outline/

Date Input in HTML5 - Restricting Dates, and a Thought for Working
Around Limitations
By Tiffany B. Brown.
"You probably know that HTML5 introduced a date input type, which
constrains the value to a valid date string. <input type='date'>
largely eliminates the need for JavaScript-based date pickers such as
the one found in jQuery UI. In browsers that support the type, we can
pick a date using the browser's native widget. Below is an example of
this widget in Chrome..."
http://tiffanybbrown.com/2013/10/24/date-input-in-html5-restricting-dates-and-thought-for-working-around-limitations/

+05: JAVASCRIPT.

The History of "typeof null"
By Axel Rauschmayer.
In JavaScript, typeof null is 'object', which incorrectly suggests
that null is an object (it isn't, it's a primitive value, consult my
blog post on categorizing values for details). This is a bug and one
that unfortunately can't be fixed, because it would break existing
code. Let's explore the history of this bug...."
http://www.2ality.com/2013/10/typeof-null.html

+06: MISCELLANEOUS.

Responsive Design Interview Series - My Answers To Some Responsive Questions
By Steven Bradley.
"A couple months ago I had the privilege of being interviewed by
Justin Avery as part of a collection of interviews with designers on
the topic of responsive design. I say privileged given the other names
in the collection and wondering how I could be considered part of a
group that includes them..."
http://www.vanseodesign.com/web-design/responsive-design-interview/

10 Things You Need to Know About Responsive Web Design
By Carrie Cousins.
"Responsive design is all the rage these days. Almost everywhere you
look someone is talking (or writing) about it..."
http://www.adobe.com/devnet/html5/articles/ten-things-you-need-to-know-about-responsive-design.html

Responsive Design is a Poor Man's Content Strategy
By Ric van Westhreenen.
"If  your new website is not suitable for mobile devices, you'll miss
the boat. So what happens, all of the internet is flooded with
websites that are responsive. Most built according to the bootstrap
concept / framework. And yes, it is awfully nice to see that the
website adapts to the device that you visit the website with. But,
does that communicate the message you want to send out to visitors on
a smartphone or tablet?..."
http://www.roodlicht.com/responsive-design-is-a-poor-mans-content-strategy/3175?lang=en

+07: TOOLS.

Easy Chirp 2 Soft Beta Launched
By Dennis Lembree.
"Web Axe author Dennis Lembree has announced the soft release of Easy
Chirp 2 beta! Easy Chirp, originally named Accessible Twitter, is a
web-based Twitter application which is developed to be easy to use,
robust (even works without JavaScript), and of course accessible..."
http://www.webaxe.org/easy-chirp-2-soft-beta-launched/

+08: TYPOGRAPHY.

Designing For the Aging Eye
By Ilene Strizver.
"If your audience includes seniors, there are some important
recommendations to take into consideration in order to attract,
engage, and hold your readers' attention..."
http://www.creativepro.com/article/typetalk-designing-for-the-aging-eye

+09: USABILITY.

Cross-Channel Usability - HealthCare.gov UX Fails
By Janelle Estes.
"A consistent user experience, regardless of channel, is one of the 4
key elements of a usable cross-channel experience. Consistency across
channels helps build trust with customers."
http://www.nngroup.com/articles/cross-channel-consistency/

What the HealthCare.gov Fiasco Teaches Us
By Gerry McGovern.
"If the HealthCare.gov website fiasco proves anything it is how
critical a usable website is."
http://gerrymcgovern.com/new-thinking/what-healthcaregov-fiasco-teaches-us

HealthCare.gov's Account Setup - 10 Broken Usability Guidelines
By Jen Cardello.
"HealthCare.gov's account setup process is unnecessarily complex and
may be contributing to backend technology failures."
http://www.nngroup.com/articles/affordable_care_act_usability_issues/

[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.]