[webdev] Web Design Update: December 16, 2011

Laura Carlson lcarlson at d.umn.edu
Fri Dec 16 06:24:59 CST 2011


+++ WEB DESIGN UPDATE.
- Volume 10, Issue 25, December 16, 2011.

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

++ISSUE 25 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: EVENTS.
05: JAVASCRIPT.
06: MISCELLANEOUS.
07: NAVIGATION.
08: PHP.
09: TYPOGRAPHY.
10: USABILITY.


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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Website Accessibility Metrics - Online Symposium
By Simon Harper.
"Yesterday we had the first (of what are planned to be many) W3C WAI
Research and Development Working Group (RDWG) Website Accessibility
Metrics Online Symposium..."
http://simon.harper.name/2011/12/06/website-accessibility-metrics-online-symposium-rdwg-a11y-accessibility/

Automated Captioning for Lectures in Higher Education with experts
from Liberated Learning Consortium and IBM
By Ginny Perelson, Keith Bain, Mike Wald, and Peter Fay.
Transcript from December 8, 2011 Facebook Accessibility Expert Hour.
http://www-03.ibm.com/able/education/index.html#Education

Constructing a POUR Website
By WebAIM.
"There are at least three main kinds of reasons that might motivate
people to create accessible web content..."
http://webaim.org/articles/pour/


+02: CASCADING STYLE SHEETS.

Six CSS Layout Features To Look Forward To
By Divya Manian.
"A few concerns keep bobbing up now and then for Web developers, one
of which relates to how to lay out a given design. Developers have
made numerous attempts to do so with existing solutions. Several
articles have been written on finding the holy grail of CSS layouts
(http://www.alistapart.com/articles/holygrail/), but to date, not a
single solution works without major caveats. At the W3Conf
(http://w3conf.org), I gave a talk on how the CSS Working Group is
attempting to solve the concerns of Web developers with multiple
proposals. There are six layout proposals that are relevant to us, all
of which I described in the talk..."
http://coding.smashingmagazine.com/2011/12/15/six-css-layout-features-to-look-forward-to/

The Future of CSS Layouts
By Peter Gasston.
"For all the wonderful features it provides, CSS does a surprisingly
poor job of the fundamentals of page layout. But options for richer,
more dynamic pages are on their way, as Peter Gasston explains..."
http://www.netmagazine.com/features/future-css-layouts

Media Query Fact Sheet
By Virginia DeBolt.
"Something to keep at hand so you can check on all the possibilities
and see the measurements..."
http://www.webteacher.ws/2011/12/15/media-query-fact-sheet/

Styling Lists 101
By Virginia DeBolt.
"This week I've been sharing some material I wrote as handouts for a
CSS class at UNM Continuing Ed. Here's the one about styling lists..."
http://www.webteacher.ws/2011/12/09/styling-lists-101/

Drop That Shadow
By html5advent2011.
"Nothing gives more depth to a design then shadows (or at least the
illusion of one). That's why we sought some ways to find ways to
exploit them. The best news in all of this is that dropshadows
(box-shadow) are pretty widely supported (IE9+, Firefox, Chrome,
Safari, Opera), even without vendor-prefixes..."
http://html5advent2011.digitpaint.nl/15/index.html

Shady Text Effects
By html5advent2011.
"There are a lot of situations where you want to give your headings
just that little bit of extra. With wide support for text-shadow we
are able to add all kinds of effects and best of all, they're very
easy to implement..."
http://html5advent2011.digitpaint.nl/12/index.html

:before and ever :after
By html5advent2011.
"Two of our favourite pseudo-elements are the :before and :after
elements. They are very useful to add all kinds of visual gimmicks to
your elements, especially if you don't want to clutter up your
beautifully crafted HTML..."
http://html5advent2011.digitpaint.nl/10/index.html


+03: EVALUATION & TESTING.

How to Find the Right Sample Size for a Usability Test
By Jeff Sauro.
"...There are actually good ways for estimating the sample size that
don't rely on intuition, dogma or conventions..."
http://www.measuringusability.com/blog/sample-size-problems.php

Test in Lynx and Print, It's Your Job
By Adrian Roselli.
"...I can't imagine a testing process that doesn't include Lynx. Lynx
is the truly lowest common denominator on the web. It gives you
insight into how a page is structured, how assistive technology will
approach it, and even how search engines will perceive it...Let's stop
setting the bar so low and expect more of ourselves as developers.
Until we do that we aren't professionals, we're hobbyists. Ego-driven
hobbyists. "
http://blog.adrianroselli.com/2011/12/test-in-lynx-and-print-its-your-job.html

Measuring User Interface Disasters
By Jeff Sauro.
"...The most effective way of measuring disasters is to collect binary
completion rates (pass and fail) and ask users how confident they were
they completed the task successfully.  I use a single 7 point item to
measure confidence (1= Not at all confident and 7 = Extremely
Confident) but you could use a 5, 9 or 11 point scale too..."
http://www.measuringusability.com/blog/ui-disasters.php


+04: EVENTS.

Mobile Web and Application Best Practices
Starts January 30, 2012. (Eight week course)
Online
http://www.w3devcampus.com/mobile-web-and-application-best-practices-training/

Bringing Mobile Learning to Your Institution
February 20-22, 2012.
Houston, Texas, U.S.A.
http://www.academicimpressions.com/events/event_listing.php?i=1269


+05: JAVASCRIPT.

The Mobile Case for Progressive Enhancement
By Brad Frost.
"...There's a mentality that in order to do create functional
experiences in the browser, especially for mobile, you need to use
some hardcore JS framework, rewrite the scrolling logic, add a bunch
of interstitial animations, create overlays and add swipes. I have
nothing against frameworks or these techniques, but for whatever
reason people think they're a prerequisite for creating mobile web
experiences. They're not..."
http://bradfrostweb.com/blog/mobile/the-mobile-case-for-progressive-enhancement/

Introducing ECMAScript 5.1
By Mike Taylor.
"ECMAScript 5.1 (or just ES5) is the latest revision of the ECMAScript
standard - the specification that JavaScript is based on. Similar in
spirit to the HTML5 specification process, ES5 standardizes existing
JavaScript implementations in conjunction with additions to the
language and native ECMAScript objects. ES5 also introduces a strict
variant of the language known as "strict mode"..."
http://dev.opera.com/articles/view/introducing-ecmascript-5-1/

Why I'm Excited About Names in JavaScript
By Tab Aktins.
"There's a ton of exciting activity taking place in TC39, which is the
standards group responsible for handling JavaScript (known as
ECMAScript there, as ECMA is the standards body that TC39 is part of).
One in particular that I like quite a bit is Names. It's not very
obvious why this is so good, though, or what advantages these have
over other, similar proposals or similar features in other
languages..."
http://www.xanthir.com/blog/b4FJ0


+06: MISCELLANEOUS.

Ten Best Practices for Designing Mobile Websites
By Andrew Henderson.
"...In this article, I offer my views on some of the most important
factors to consider while designing mobile websites..."
http://www.adobe.com/newsletters/inspire/november2011/articles/article6/

HTML Filter for Responsive - A Server-Side Solution
By Niels Matthijs.
"These days mobile-first responsive design is all the rage. And with
good reason as at least the theory behind it should work for most
websites. Things might be a little different for service-oriented
sites who'd benefit from a more tailored solution, but responsive
should be suitable enough for 75-80% of all the sites out there and
would prove to be a great improvement over the current situation.
There is one big hurdle left though, which lies with the served html
between different resolutions."
http://www.onderhond.com/blog/work/server-side-html-filter-for-responsive

What I Learned About the Web in 2011
By Our Gentle Readers.
"As the year draws to a close, we asked some A List Apart readers to
tell us what they learned about the web in 2011. Together their
responses summarize the joys and challenges of this magical place we
call the internet. We need to continue to iterate, to embrace change,
and challenge complexity to keep shipping. Above all, we must continue
to reach out to one another, to teach, to support, to help, and to
build the community that sustains us."
http://www.alistapart.com/articles/what-i-learned-about-the-web-in-2011/


+07: NAVIGATION.

The Secret Lives of Links
By Luke Wroblewski.
"In his presentation at An Event Apart in San Francisco, CA 2011 Jared
Spool detailed the importance and role of links on Web pages. Here are
my notes from his The Secret Lives of Links talk..."
http://www.lukew.com/ff/entry.asp?1473


+08: PHP.

PHP Arrays - Advanced Iteration and Manipulation
By Jason Gilmore.
"Sporting more than 70 native array-related functions, PHP's array
manipulation capabilities have long been one of the language's most
attractive features. Whether you want to reverse an array, determine
whether a value exists, convert an array to a string, or calculate the
array size, completing the task is as simple as executing the
appropriate function. There are however many array-related tasks which
ask a bit more of the developer than merely knowing what part of the
manual one needs to consult. Many such tasks require a somewhat more
in-depth understanding of the native features, or are possible only
when a bit of imagination is applied to the problem..."
http://www.phpbuilder.com/columns/php_arrays/PHP_Arrays_12-8-2011.php3

Better Object-Oriented Arrays
By Ryan Parman.
"I've been working on developer-facing software and SDKs in PHP for
nearly a decade, and through the experience of supporting these
developers, I've learned something interesting about the PHP community
at-large. The majority of PHP developers have a very good
understanding of native types (e.g., strings, arrays, integers,
booleans). Since they're the lowest common denominators of the PHP
language, it's generally pretty easy for developers to understand
these types..."
http://phpadvent.org/2011/better-object-oriented-arrays-by-ryan-parman

Learning Loops
By Iain Tench.
"A significant advantage of computers is that they can perform
repetitive tasks easily and efficiently. Instead of writing repetitive
code you can write a set of statements that processes some data and
then have the computer execute them repeatedly by using a construct
known as a loop. Loops come in several different flavors in PHP: for,
while, do-while, and foreach. I'll introduce you to each of them and
show you how they can making repetitive tasks straightforward and easy
to maintain."
http://phpmaster.com/loops/

Merry Error Handling
By Samer Atiani.
"PHP does not enjoy the same consistency in error (and exception)
handling as other languages, mostly due to historical reasons and the
lack of a formal specification. But, there are things that you can do
to make error handling saner and easier to maintain..."
http://phpadvent.org/2011/merry-error-handling-by-samer-atiani


+09: TYPOGRAPHY.

A Better Way to Use Icon Fonts
By Eric Eggert.
"There are some browser and screen reader combinations that treat CSS
not only as a presentational thing, but apply meaning according to the
used properties. For example some won't read a list if you use
list-style: none; in your CSS. This assumes that the meaning of your
HTML is overwritten by the visual style: If it doesn't look like a
dumb bullet list, it must be no list at all. I'm not sure I conclude
with that assumption, but that isn't the main point of the article
here..."
http://yatil.net/a-better-way-to-use-icon-fonts


+10: USABILITY.

The Problem With QR Codes (Video)
By Scott Stratten.
"Scott Stratten's UnMarketing Keynote at the NAMP conference,
discussing QR Codes and the problem with them."
http://www.youtube.com/watch?v=V2rVYvylvZc

Mobile First Content in Practice
By Georgina Laidlaw.
"In this post, we'll look more closely at the issues you're likely to
face as you strive to make your content more comprehensible to mobile
users with the help of these scores. We'll do that by considering a
couple of text-heavy mobile apps..."
http://buildmobile.com/mobile-first-content-in-practice/

Improve Your Site's iPad Usability in 1 Simple Step
By Linda Bustos.
"..We should be aware that our current site designs may be problematic
on tablets, and ensure our navigation menus, calls to action and
configuration features are touch-screen friendly..."
http://www.getelastic.com/improve-your-sites-ipad-usability-in-1-simple-step/

[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