[webdev] Web Design Update: March 15, 2012

Laura Carlson lcarlson at d.umn.edu
Thu Mar 15 06:17:42 CDT 2012


+++ WEB DESIGN UPDATE.
- Volume 10, Issue 38, March 15, 2012.

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

++ISSUE 38 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: JAVASCRIPT.
05: MISCELLANEOUS.
06: NAVIGATION.
07: STANDARDS, GUIDELINES & PATTERNS.
08: TOOLS.
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.

Strategy for Handling Legacy PDF Accessibility
By Leonie Watson.
"The web is saturated with Portable Document Format (PDF) files. For
more than 20 years PDF has been the Defacto standard for print
documents on the web. PDF files are also notorious for their lack of
accessibility. With legacy PDFs running into the thousands on many
websites, just how can you tackle the job of making them
accessible?..."
http://www.nomensa.com/blog/2012/strategy-for-handling-legacy-pdf-accessibility/

Google+ Hangouts Become Accessible to the Blind
By Janko Roettger.
"Blind and otherwise visually impaired people now have an easier time
using Google+ Hangouts group video chats, thanks to a Chrome extension
hacked together by a software engineer called Mohamed Mansour..."
http://gigaom.com/video/google-hangouts-accessible-blind/

WCAG 2.0 Undermined by 3 Generations of Digital Illiteracy
By Rachel McAlpine.
"...Olly, Holly and Polly are all floundering in the digital work
environment. They're intelligent and good at their jobs, but their
proper concerns are with policy, HR and office supplies-not with
writing for the Web. They have never even been introduced to business
English or the proper use of MS Word, let alone information theory. So
every day, they unwittingly wreck the web team's efforts to make all
content accessible..."
http://contented.com/contented/2012/wcag-2-0-undermined-by-3-generations-of-digital-illiteracy/

CSUN Conference Presentations
The 2012 CSUN Conference Presentations are now online.
http://www.webable.tv/FeaturedContent/WebAbleTvUpcomingandRecentWebcast/CSUN2012.aspx


+02: CASCADING STYLE SHEETS.

Understanding em Units in CSS
By Louis Lazaris.
"I hope this will serve as a nice summary of what em units are all
about and how you can use them in your designs."
http://www.impressivewebs.com/understanding-em-units-css/

Scaling with EM Units
By Viljami Salminen.
"Recently I started testing how proportional scaling of bigger layouts
would work in reality and if it makes any sense. It's possible when
using EM units and then changing body's font-size when viewport's
height grows above certain point. Basically that means, that I have to
change only one or two css properties between @media queries which are
targeting larger screen sizes."
http://viljamis.com/blog/2012/scaling-with-em-units/

Negative Proximity
By Eric A. Meyer.
"There's a subtle aspect of CSS descendant selectors that most people
won't have noticed because it rarely comes up: selectors have no
notion of element proximity. Here's the classic demonstration of this
principle..."
http://meyerweb.com/eric/thoughts/2012/03/07/negative-proximity/

Mastering CSS3 - 7 Cool text-shadow Samples You Can't Miss
By Konstantin Kichinsky.
"We've been exploring the basics on how to use CSS3 shadows:
box-shadow and text-shadow. Today, we are going to improve our skills
and look into how to build some amazing text-shadows..."
http://www.sitepoint.com/mastering-css3-7-cool-text-shadow-samples-you-can't-miss/

The 2 Principles Of Object Oriented CSS
By Steven Bradley.
"Do our current css practices scale? Are our stylesheets easy to
maintain? Can non-css coders quickly and easily to build new web pages
with our styles? Object oriented css (OOCSS) is an approach to writing
html and css that allows us to answer yes to each of these
questions..."
http://www.vanseodesign.com/css/object-oriented-css/

5 Things I Love About CSS3
By Viki Hoo.
"...CSS3 brings us a lot of convenience. We can achieve effects that
were previously only possible with plugins, using the element itself
instead of mostly pictures. The web page download time will also be
faster. Therefore, the old content of pictures could be searched by
search engines. Although the HTML5 and CSS3 standards haven't been
officially established, and the support by browsers varies, the day
they are unified will eventually come."
http://www.sitepoint.com/5-things-i-love-about-css3-2/


+03: EVALUATION & TESTING.

Nine Misconceptions About Statistics and Usability
By Jeff Sauro.
"There are many reasons why usability professionals don't use
statistics and I've heard most of them..."
http://www.measuringusability.com/blog/stats-usability-errors.php


+04: JAVASCRIPT.

The Five Biggest JavaScript Misconceptions
By Larry Ullman.
"JavaScript, despite its importance and widespread use in today's web,
is a very misunderstood language. Whether it's thinking that
JavaScript is somehow related to Java, or that you can't implement
access control without classes, there are plenty of misconceptions
about JavaScript, one of the world's most used programming languages.
In this article, programming expert Larry Ullman discusses five of the
biggest misconceptions commonly held when it comes to the language..."
http://www.peachpit.com/articles/article.aspx?p=1843879


+05: MISCELLANEOUS.

Mobile First Design -  Why It's Great and Why It Sucks
By Joshua Johnson.
"Historically, most web designers and their clients have approached
the desktop side of any project first, while leaving the mobile part
as a secondary goal that gets accomplished later. Even with the rise
of responsive design, many of us begin with the 'full size' site and
work our way down. There's a growing trend in the industry though to
flip this workflow on its head and actually begin with mobile
considerations and then work up to a larger desktop version. Why would
you ever approach a project this way? What are some of the pros and
cons of this strategy?..."
http://designshack.net/articles/css/mobilefirst/

For a Future-Friendly Web
By Brad Frost.
"It is time to move toward a future-friendly web. Our current device
landscape is a plethora of desktops, laptops, netbooks, tablets,
feature phones, smartphones, and more, but this is just the beginning.
The rapid pace of technological change is accelerating, and our
current processes, standards, and infrastructure are quickly reaching
their breaking points. How can we deal with increasing device
diversity and decreasing attention spans? Brad Frost of
futurefriend.ly explains how, while this era of ubiquitous
connectivity creates new challenges, it also creates tremendous
opportunities to reach people wherever they may be..."
http://www.alistapart.com/articles/for-a-future-friendly-web/

The Best Browser is the One You Have with You
By Stephanie Rieger.
"The web as we know and build it has primarily been accessed from the
desktop. That is about to change. The ITU predicts that in the next
18-24 months, mobile devices will overtake PCs as the most popular way
to access the web. If these predictions come true, very soon the
web-and its users-will be mostly mobile. Even designers who embrace
this change can find it confusing. One problem is that we still
consider the mobile web a separate thing. Stephanie Rieger of
futurefriend.ly and the W3C presents principles to understand and
design for a new normal, in which users are channel agnostic, devices
are plentiful, standards are fleeting, mobile use doesn't necessarily
mean 'hide the desktop version,' and every byte counts."
http://www.alistapart.com/articles/the-best-browser-is-the-one-you-have-with-you/

What Users Want From Mobile, and What We Can Re-learn From Them
By Bruce Lawson.
"From Stephanie Rieger's excellent piece The Best Browser is the One
You Have with You, I came upon a report called What Users Want from
Mobile (PDF, 3.6 MB), 'A study of consumers' mobile web and
application expectations and experiences conducted by Equation
Research on behalf of Compuware', dated July 2011..."
http://www.brucelawson.co.uk/2012/what-users-want-from-mobile-and-what-we-can-re-learn-from-them/


+06: NAVIGATION.

Code a Responsive Navigation Menu
By Joshua Johnson.
"Navigation menus used to be a fairly simple thing. Code up an
unordered list, float it left and you're good to go. With responsive
design being all the rage these days though you're faced with some new
challenges when creating a menu design. Follow along as we start from
scratch and code a simple but effective responsive navigation menu
that you can easily modify and reuse in your own projects..."
http://designshack.net/articles/css/code-a-responsive-navigation-menu/

Skip Links and Other in Page Links in WebKit Browsers
By Roger Johansson.
"...In summary: following an in page link (a link that targets an
element on the same page, like <a href="#main">Skip to main
content</a>) does not properly move keyboard focus in WebKit browsers.
This means that when you press tab after activating an in page link,
focus is moved to the first focusable element after the link rather
than the first focusable element after the target..."
http://www.456bereastreet.com/archive/201203/skip_links_and_other_in_page_links_in_webkit_browsers/

To Underline or Not Underline Links
By  Kim Krause Berg.
"As visually entertaining the latest trends in web design may be,
there are a few usability walls we run into while reading. One is the
appearance of a hyperlink..."
http://cre8pc.com/2012/03/09/to-underline-or-not-underline-links/


+07: STANDARDS, GUIDELINES & PATTERNS.

HTML5 and Enterprise on Mobile
By Adrian Roselli.
"...When I get past all the misunderstandings of the specifications in
the posts, including HTML5, I tend to agree with the overall message
of the original post that rapid adoption, possibly for the sake of
being cutting edge, is a real issue. This also assumes, of course,
that the writer of (and responders to) the original article actually
understand what "enterprise" means..."
http://blog.adrianroselli.com/2012/03/html5-and-enterprise-on-mobile.html

Working with Text in HTML5
By Elizabeth Castro and Bruce Hyslop.
"Unless a site is heavy on videos or photo galleries, most content on
Web pages is text. This chapter explains which HTML semantics are
appropriate for different types of text, especially (but not solely)
for text within a sentence or phrase..."
http://www.peachpit.com/articles/article.aspx?p=1826714

5 Things I Hate About HTML5
By Craig Buckler.
"...here are my five pet peeves..."
http://www.sitepoint.com/5-things-i-hate-about-html5/


+08: TOOLS.

Firefox Extension:  WAI-ARIA Landmarks
By David Todd.
"This repository contains a Firefox extension that enables keyboard
navigation of WAI-ARIA landmarks." Documentation is in the README
file.
https://github.com/davidtodd/landmarks


+09: USABILITY.

Disruptive Workflow Design
By Jakob Nielsen.
"Smooth-flow task performance makes application use pleasurable. But
disruptions are all too common due to crinkly design or creaking
implementation..."
http://www.useit.com/alertbox/disrupting-users.html


+10: XML.

Use XSLT as a Stylesheet for HTML
By Jurgen M. Regel.
"As the name suggests, Extensible Stylesheet Language Transformations
(XSLT) can be used as a stylesheet. Like Cascading Style Sheets (CSS),
XSLT helps to separate style from content. You can simplify and enrich
your XHTML documents with XSLT, which relieves the XHTML document of
navigation. In this article, learn how to use XSLT as stylesheets,
which can be executed on the server or in every modern Internet
browser. Several examples show how to start developing your own XSLT
stylesheets..."
http://www.ibm.com/developerworks/web/library/wa-xsltstyle/index.html


[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