[webdev] Web Design Update: May 25, 2012

Fri May 25 06:23:30 CDT 2012

+++ WEB DESIGN UPDATE.
- Volume 10, Issue 48, May 25, 2012.

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

++ISSUE 48 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: EVENTS.
05: JAVASCRIPT.
06: MISCELLANEOUS.
07: STANDARDS, GUIDELINES & PATTERNS.
08: TYPOGRAPHY.
09: USABILITY.
10: XML.

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

What's 'Large Text' in WCAG 2.0 Parlance?
By Steve Faulkner.
"Text that is larger and has wider character strokes is easier to read
at lower contrast. The contrast requirement for larger text is
therefore lower. This allows authors to use a wider range of color
choices for large text, which is helpful for design of pages,
particularly titles. 18 point text or 14 point bold text is judged to
be large enough to require a lower contrast ratio. (See The American
Printing House for the Blind Guidelines for Large Printing and The
Library of Congress Guidelines for Large Print). '18 point' and 'bold'
can both have different meanings in different fonts but, except for
very thin or unusual fonts, they should be sufficient. Since there are
so many different fonts, the general measures are used and a note
regarding fancy or thin fonts is included."
http://www.html5accessibility.com/tests/small-large.html

Notes on Applying Multiple Labels for a Control Using the Label Element
By Steve Faulkner.
"While it is conforming to have multiple label elements pointing to a
single control for labelling purposes, it is not recommended. It has
been conforming as per (X)HTML specifications for many years, but it
is not robustly supported. Other techniques such as wrapping the label
around text and control and aria-labelledby do the job better and are
much better supported in modern browsers and assistive technology."
http://www.paciellogroup.com/blog/2012/05/notes-on-using-multiple-labels-for-a-control-using-the-label-element/

+02: CASCADING STYLE SHEETS.

CSS Generated Content and Screen Readers
By Roger Johansson.
"As all widely used web browsers (unless you still consider IE7 as
being widely used) now support the :before and :after pseudo-elements
along with the content property, using those pseduo-elements has
become more and more common..."
http://www.456bereastreet.com/archive/201205/css_generated_content_and_screen_readers/

Understanding the CSS Transforms Matrix
By Tiffany Brown.
"In this article, I'll cover both the 3-by-3 matrix used for 2D
transforms and the 4-by-4 matrix used for 3D transforms."
http://dev.opera.com/articles/view/understanding-the-css-transforms-matrix/

How to Center Anything With CSS
By Joshua Johnson.
"...There are a bunch of different types of web elements and layout
situations, each calling for a unique solution for centering (both
vertically and horizontally). Today we'll go over a bunch of these
scenarios so you can wrap your mind around how they work and come away
with the confidence to center anything!..."
http://designshack.net/articles/css/how-to-center-anything-with-css/

Responsive Web Design Presentation at STC Summit
By Zoe Gillenwater.
"Download the slides for my presentation on CSS3, Media Queries, and
Responsive Web Design for the STC Summit 2012, as well as get links to
related resources on media query and responsive web design techniques,
tools, and inspiration."
http://zomigi.com/blog/responsive-web-design-presentation/

+03: COLOR.

A Precise CSS3 Color Table
By Eric A. Meyer.
"...I created my own table, which you can now find in the CSS area of meyerweb."
http://meyerweb.com/eric/css/colors/

+04: EVENTS.

Breaking Development: focus on Responsive
June 4, 2012.
Minneapolis, Minnesota, U.S.A.
http://bdconf.com/2012/focuson-responsive-mn

+05: JAVASCRIPT.

ECMAScript Language Specification - ECMA-262 Edition 5.1
"This Ecma Standard is based on several originating technologies, the
most well known being JavaScript (Netscape) and JScript (Microsoft).
The language was invented by Brendan Eich at Netscape and first
appeared in that company's Navigator 2.0 browser. It has appeared in
all subsequent browsers from Netscape and in all browsers from
Microsoft starting with Internet Explorer 3.0..."
http://ecma-international.org/ecma-262/5.1/

Some Random JavaScript Coding Tidbits
By Louis Lazaris.
"Some Random JavaScript Coding TidbitsAlthough my knowledge of HTML
and CSS seems somewhat rounded and complete, I don't feel the same way
about JavaScript. I always seem to be learning something new, or else
reminding myself of stuff I might have learned years ago but have
forgotten. So here are a few things I've recently learned or read
about that might be useful to you..."
http://www.impressivewebs.com/random-javascript-coding-tidbits/

+06: MISCELLANEOUS.

Why Publishers Don't Like Apps
By Jason Pontin.
"The future of media on mobile devices isn't with applications but
with the Web."
http://www.technologyreview.com/business/40319/

Anatomy of a Mobile-First Responsive Web Design
By Brad Frost.
"...Every element of a mobile-first responsive web design explained
from a user experience point of view."
http://bradfrostweb.com/blog/mobile/anatomy-of-a-mobile-first-responsive-web-design/

Why Responsive Design?
By Steven Bradley.
"Responsive design has grown from an idea and a buzzword to a new
approach to designing websites. As it's gained attention, challenges
in building responsive sites have emerged, solutions to some of those
problems have been proposed, and patterns for how designs adapt have
been observed..."
http://www.vanseodesign.com/web-design/why-responsive-design/

Browsers at Odds With Web Developers Over 'Adaptive Images'
By Scott Gilbertson.
"The web design community continues to debate the merits and drawbacks
of the WHATWG's proposed adaptive images solution..."
http://www.webmonkey.com/2012/05/browsers-at-odds-with-web-developers-over-adaptive-images/

+07: STANDARDS, GUIDELINES & PATTERNS.

The Unbearable Lightness of HTML5 - or, The Priority of Constituencies
versus the Great Dictator
By Jeffery Zeldman.
"LET'S DIG A BIT DEEPER into the latest conflict between web
developers who are passionate about the future of HTML, and the
WHATWG..."
http://www.zeldman.com/2012/05/17/editor-vs-constituencies/

HTML - A New Standard
By Kyle Weems.
"In the past couple days far more eloquent people have spoken about
the current srcset 'fiasco' with calmer voices, analyzing the
situation with a maturity and fairness that frequently escapes my
grasp when I'm hastily penning a post and drawing a comic..."
http://cssquirrel.com/blog/2012/05/17/html-a-new-standard/

Publication Standards Part 2 - A Standard Future
By Nick Disabato.
"The internet is disrupting many content-focused industries, and the
publishing landscape is beginning its own transformation in response.
Tools haven't yet been developed to properly, semantically export
long-form writing. Most books are encumbered by Digital Rights
Management (DRM), a piracy-encouraging practice long since abandoned
by the music industry. In the second article of a two-part series in
this issue, Nick Disabato discusses the ramifications of these
practices for various publishers and proposes a way forward, so we can
all continue sharing information openly, in a way that benefits
publishers, writers, and readers alike."
http://www.alistapart.com/articles/publication-standards-part-2-a-standard-future/

The Real Conflict Behind <picture> and @srcset
By Jason Grigsby.
"...We have an existential problem here. A chicken and egg conundrum.
How do we reconcile a pre-parser that wants to know what size image to
download ahead of time with an image technique that wants to respond
to its environment once the page layout has been calculated?..."
http://blog.cloudfour.com/the-real-conflict-behind-picture-and-srcset/

+08: TYPOGRAPHY.

Web Design Manifesto 2012
By Jeffery Zeldman.
"THANK YOU for the screen shot. I was actually already aware that the
type on my site is big. I designed it that way. And while I'm grateful
for your kind desire to help me, I actually do know how the site looks
in a browser with default settings on a desktop computer. I am
fortunate enough to own a desktop computer. Moreover, I work in a
design studio where we have several of them..."
http://www.zeldman.com/2012/05/18/web-design-manifesto-2012/

Typesetting Paragraphs on Web Pages
By Louis Lazaris.
"I don't know who started it, but at some point in the web's
relatively short history, we decided that paragraphs displayed on web
pages should be 'typeset' in a manner similar to what we see by
default in a Microsoft Word document: an empty line after a paragraph,
and no indent for each paragraph..."
http://www.impressivewebs.com/typesetting-paragraphs-web-pages/

+09: USABILITY.

Beautiful Does Not Always Mean Usable
By Gerry McGovern.
"It's good to make your website or application as beautiful as
possible, but not at the expense of usefulness."
http://www.gerrymcgovern.com/nt/2012/nt-2012-05-21-Function-triumph.htm

Repurposing versus Optimized Design
By Jakob Nielsen.
"Repurposing design or content has never a successful strategy. "It's
cheap but degrading to reuse content and design across diverging media
forms like print vs. online or desktop vs. mobile. Superior UX
requires tight platform integration."
http://www.useit.com/alertbox/repurposing.html

Repurposing vs Optimized Design: It's Not a Battle
By Craig Buckler.
"...Jakob has been accused of bashing responsive design. The tone of
his article gives that impression and it detracts from his main point:
a dedicated mobile design offers a better mobile experience. If he's
guilty of anything, it's stating the obvious."
http://www.sitepoint.com/jakob-nielsen-repurposing-vs-optimized-design-feedback/

Separate Mobile Site vs. Responsive Design
By Paul Boag.
"Is responsive design really the right answer? Would you be better
having a separate mobile website? Its all about return on investment."
http://boagworld.com/mobile-web/separate-mobile-site-vs-responsive-design/

Forms Part One - The Reservoir of Goodwill
By Michael Harris.
"In this and subsequent articles, I will be focussing on improving
long, multistep forms..."
http://www.nomensa.com/blog/2012/forms-part-one-the-reservoir-of-goodwill/

Quick Course On Effective Website Copywriting
By Peep Laja.
"Many dismiss copywriting as something that ad agency people do.
Truthfully, all of us need to pay close attention to copywriting if we
want to achieve our business objectives..."
http://www.smashingmagazine.com/2012/05/18/quick-course-on-effective-website-copywriting/

The History Of Usability: From Simplicity To Complexity
By Mads Soegaard.
"The story of usability is a perverse journey from simplicity to
complexity. That's right, from simplicity to complexity-not the other
way around..."
http://uxdesign.smashingmagazine.com/2012/05/23/the-history-of-usability-from-simplicity-to-complexity/

+10: XML.

Scalable Vector Graphics: Drawing Basics
By Craig Buckler.
"In my previous posts we discussed what SVGs are and reasons you
should consider SVGs for your project. In this article we'll look at
the basic concepts, document structure and drawing elements..."
http://www.sitepoint.com/svg-drawing-basics/

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