[webdev] Web Design Update: December 11, 2009
Laura Carlson
lcarlson at d.umn.edu
Fri Dec 11 04:12:29 CST 2009
+++ WEB DESIGN UPDATE.
- Volume 8, Issue 24, December 11, 2009.
An email newsletter to distribute news and information about web design
and development.
++ISSUE 24 CONTENTS.
SECTION ONE: New references.
What's new at the Web Design Reference site?
http://www.d.umn.edu/goto/webdesign/
New links in these categories:
01: ACCESSIBILITY.
02: CASCADING STYLE SHEETS.
03: DREAMWEAVER.
04: EVALUATION & TESTING.
05: EVENTS.
06: INFORMATION ARCHITECTURE.
07: JAVASCRIPT.
08: MISCELLANEOUS.
09: NAVIGATION.
10: PHP.
11: STANDARDS, GUIDELINES & PATTERNS.
12: TYPOGRAPHY.
13: USABILITY.
SECTION TWO:
14: What Can You Find at the Web Design Reference Site?
[Contents ends.]
++ SECTION ONE: New references.
+01: ACCESSIBILITY.
Global Accessibility Policy - Technology Changes, Civil Rights Do Not
By Cynthia Waddell.
"The UN Convention on Rights of Persons with Disabilities addresses the
rights of 650 million persons with disabilities and impacts two billion
persons worldwide, including family members of persons with
disabilities..."
http://www.headstar.com/eablive/?p=374
Involving Users in Web Projects for Better, Easier Accessibility
By W3C WAI.
"Involving people with disabilities from the beginning of a project
helps you better understand accessibility issues and implement more
effective accessibility solutions. It also broadens your perspective in
a way that can lead you to discover new ways of thinking about your
product that will make it work better for more people in more
situations..."
http://www.w3.org/WAI/users/involving.html
Safari, WebKit and alt Text for Missing Images
By Roger Johansson.
"One of the purposes of the alt attribute is to provide alternate text
that can be shown when an image cannot be displayed, either because it
is missing or broken, or because the user has disabled images in their
(graphical) web browser. Most graphical web browsers do display alt
text in place of missing images, but there is one notable exception:
Safari and most other WebKit-based browsers (iCab, Shiira, Chrome). In
those browsers, all you get when an image is missing is either a small
blue icon with a question mark in it or a broken image icon."
http://tinyurl.com/yd57je7
PDF is Only Partially Accessible
WebAIM Thread.
"Based on many of the responses from the WebAIM list, as well as from my
own research, I conclude that well structured and tagged PDF is
partially but not completely accessible..."
http://webaim.org/discussion/mail_thread.php?thread=4042
Discussion continues at:
http://webaim.org/discussion/mail_thread.php?thread=4045
United States Disability Statistics: Measurement and Sources
By Joseph Dolson.
"On Wednesday of last week, I published an article on disability
statistics in Practical eCommerce magazine. Although there's nothing
particularly wrong with the article, I find myself wanting to publish a
follow up article with more detail on the statistics. Statistics are
complicated beasts, and I feel that detailed explication of sources and
statistical problems is well worth while...if you can't wait for Google
to automatically caption the home videos of your kids opening their
Christmas presents, you can use another, lesser-known, and equally free
service..."
Captioning and YouTube
By John Eric Brandt.
"...Google is rolling this out with a select group of partners and on
specific channels. My understanding is that Google will simply start
captioning videos in these groups using this new automatic system.
Anyone who knows anything about captioning knows that automatic systems
are fraught with problems..."
http://jebswebs.net/blog/2009/12/captioning-and-youtube/
+02: CASCADING STYLE SHEETS.
Don't Lose Your :focus
By Patrick H. Lauke.
"For many web designers, accessibility conjures up images of blind
users with screenreaders, and the difficulties in making sites
accessible to this particular audience. Of course, accessibility covers
a wide range of situations that go beyond the extreme example of
screenreader users. And while it's true that making a complex site
accessible can often be a daunting prospect, there are also many small
things that don't take anything more than a bit of judicious planning,
are very easy to test (without having to buy expensive assistive
technology), and can make all the difference to certain user groups. In
this short article we'll focus on keyboard accessibility and how
careless use of CSS can potentially make your sites completely
unusable..."
http://24ways.org/2009/dont-lose-your-focus
Style Fieldsets like a Pro
By Virginia DeBolt.
"Just a few CSS rules can make your fieldset look like it was styled by
a pro. A fieldset is used to organize forms into sections that can be
identified with labels called legends. We're going to start this
discussion looking at a fieldset with no legend. We'll get to legends
in a bit..."
http://www.webteacher.ws/2009/12/10/style-fieldsets-like-a-pro
18 CSS Compression Tools and Techniques
By Joshua Johnson.
"...This post will examine several techniques you can use to optimize
your CSS as well as several online tools that can automatically
compress your code..."
http://tinyurl.com/ykdmahf
Front-End Code Reusability with CSS and JavaScript
By Trevor Morris.
"Most web standards-based developers are more than familiar with
creating their sites with semantic HTML with lots and lots of CSS. With
each new page in a design, the CSS tends to grow and grow and more
elements and styles are added. But CSS can be used to better effect..."
http://tinyurl.com/yguxdhl
The Case for the Use of Display:None
By Gary Barber.
"...Sometimes we forget about the bigger picture, about the people we
are building the sites for. A few weeks ago at the UPA Perth (chapter
in formation) meeting, Teressa from the Disability Services Commission
demonstrated with her screen reader (JAWS) why the display:none is
sometimes a good thing...."
http://tinyurl.com/yfuqac4
The Parallax Header: How I Do It
By Kyle Weems.
"...First, creating the right group of images. Secondly, with some
simple CSS and HTML. Lastly, with a surprisingly short JS script..."
http://www.cssquirrel.com/2009/12/04/the-parallax-header-how-i-do-it/
+03: DREAMWEAVER.
Use Built-In Dreamweaver CS4 Capabilities to Check Your Website Before
Going Live
By Charles Anderson.
"You just finished building a new website. Before uploading it to a
server, spend some time checking on how well it functions or first time
visitors may be last time visitors. Dreamweaver CS4 includes a number
of tools for testing websites for functionality before putting it up
for the world. Link Checker Broken links on a website are one of the
world..."
http://www.brighthub.com/internet/web-development/articles/58681.aspx
+04: EVALUATION & TESTING.
What To Do With the Data: Moving from Observations to Design Direction
By Dana Chisnell.
"What is data but observation? Observations are what was seen and what
was heard. As teams work on early designs, the data is often about
obvious design flaws and higher order behaviors, and not necessarily
tallying details. In this article, let's talk about tools for working
with observations made in exploratory or formative user research."
http://tinyurl.com/yjo46mm
Is There a Difference in Usability Data from Remote Unmoderated Tests
and Lab-Based Tests?
By Jeff Sauro.
"Why isn't usability testing done more? And when it is done why is the
sample size small? One major reason is the cost. It takes a lot of
money and time to bring users into a lab and conduct a usability test.
Even if users don't get compensated for their time, it still takes a
lot of time for a test facilitator to prepare for and attend each test.
Each additional user tested takes more time?one reason sample sizes
tend to be small. Is it possible to get the same data by having users
test themselves?"
http://www.measuringusability.com/unmoderated-testing.php
Benefits of Online, Unmoderated User Testing
By Henri Stetter.
"For most usability professionals lab-based research is the only game
in town. However, with the growth of Web 2.0 and Web 3.0 technologies
online, unmoderated user testing (also known as remote unmoderated or
asynchronous user testing) is gaining traction and being used not only
as a complement to, but in many cases as, an alternative to traditional
lab-based research..."
http://www.usabilitynews.com/news/article6125.asp
Usability Testing with Time Constraints | Remote Usability Testing
By Janet M. Six.
"In this Ask UXmatters column?which is the third in a three-part series
of columns focusing on usability?our experts discuss: 1. conducting
usability testing when time is limited 2. using remote usability
testing techniques..."
http://tinyurl.com/yegv3s5
A Summary of User Research Methods
By Patrick Kennedy.
"...In this article I give a quick overview of the methods I commonly
use, broken down in to main categories..."
http://www.gurtle.com/ppov/2009/12/06/a-summary-of-user-research-methods
+05: EVENTS.
Open Source Conference (OSCON)
July 19-23, 2010.
Portland, Oregon, U.S.A.
http://en.oreilly.com/oscon
An Event Apart - Minneapolis
July 26-27, 2010.
Minneapolis, Minnesota, U.S.A.
http://aneventapart.com/2010/minneapolis/
+06: INFORMATION ARCHITECTURE.
Where Wireframes Are Concerned
By Andy Rutledge.
"Wireframes can be useful, valuable artifacts for informing the
designer's process, but they often fail miserably as a first-step
deliverable for clients..."
http://www.andyrutledge.com/where-wireframes-are-concerned.php
Sketchy Wireframes
By Aaron Travis.
"When it comes to user interface documentation, wireframes have long
been the tool of choice. However, using traditional diagramming tools
like Visio, OmniGraffle, and InDesign, most wireframes today look the
same as their ancestors did from a decade ago ? assembled with rigid,
computer-drawn boxes, lines and text. While these artifacts have served
us well, they can also be slow to produce, burdened with unnecessary
detail and give a false impression of 'completion. To compensate for
the drawbacks of traditional wireframes, many practitioners put aside
the computer in favor of simple pencil sketches or whiteboard drawings.
This speeds up the ideation process, but doesn't always produce
presentable or maintainable documentation. There is a growing
popularity toward something in the middle: Computer-based sketchy
wireframes. These allow computer wireframes to look more like quick,
hand-drawn sketches while retaining the reusability and polish that we
expect from digital artifacts."
http://www.boxesandarrows.com/view/sketchy-wireframe
Tree Testing
By Dave O'Brien.
A big part of information architecture is organization ? creating the
structure of a site. For most sites ? particularly large ones ? this
means creating a hierarchical 'tree' of topics. But to date, the IA
community hasn't found an effective, simple technique (or tool) to test
site structures. The most common method used?closed card sorting?is
neither widespread nor particularly suited to this task. Some years
ago, Donna Spencer pioneered a simple paper-based technique to test
trees of topics. Recent refinements to that method, some made possible
by online experimentation, have now made 'tree testing' more effective
and agile.
http://www.boxesandarrows.com/view/tree-testing
+07: JAVASCRIPT.
Submitting Forms via Javascript: Button vs. Link vs. Other?
WebAIM Thread.
"Assuming Javascript is enabled (I know that, itself, can be an
accessibility issue) what are the pros/cons of using various elements
to act as the trigger for submission?..."
http://webaim.org/discussion/mail_thread.php?thread=4043
+08: MISCELLANEOUS.
Letting Go of John Hancock
By Bjorn Enki.
"Because clients expect everything to be faster, better, and simpler,
web professionals must take an instant, foolproof, paperless, modern
approach to how clients approve proposals and sign contracts.
Implementing an instantaneous contract agreement helps to get projects
off the ground, attract clients on tight timelines, and prevent
potential delays. All it takes is a little PHP and some PDF magic."
http://www.alistapart.com/articles/letting-go-of-john-hancock/
Needs + Resources + Location + Schedule + Budget = Scope
By Whitney Hess.
"Now that you've convinced a client they want to work with you, it's up
to you to define the terms of your working agreement..."
http://tinyurl.com/yjstxmv
+09: NAVIGATION.
Cameras, Music, and Mattresses: Designing Query Disambiguation
Solutions for the Real World
By Greg Nudelman.
"Our language is limited and imperfect. Typically, people type search
queries quickly and with little forethought, so queries are definitely
less than perfect..."
http://tinyurl.com/ybo4t8l
+10: PHP.
Comprehensible Code
By Paul Jones.
"Reading code is hard work. Here are some reasons why, along with some
tips on how to make it easier for other developers to understand your
code..."
http://phpadvent.org/2009/comprehensible-code-by-paul-jones
+11: STANDARDS, GUIDELINES & PATTERNS.
HTML5: Tool of Satan, or Yule of Santa?
By Bruce Lawson.
"...what HTML5 can you reasonably expect to be able to use reliably
cross-browser in the early months of 2010? The answer is that you can
use more than you might think, due to the seasonal tinsel of
feature-detection and using the sparkly pixie-dust of IE-only VML (but
used in a way that won't damage your Elf)..."
http://24ways.org/2009/html5-tool-of-satan-or-yule-of-santa
Should Error Messages be Displayed for Corrupt HTML5?
By Vlad Alexander.
"One of the primary reasons HTML is authored incorrectly today is
because Web browsers do not display error messages when processing
corrupt documents (constructed or transmitted incorrectly). Web browser
vendors like to refer to these kinds of error messages as "draconian",
i.e. unduly punitive. Why?..."
http://rebuildingtheweb.com/en/error-messages/
Your Questions Answered #4
By Richard Clark.
"Here we go with another post rounding up your HTML5 questions and
sharing the answers with the world. We cover a wide range of topics
this time, including ARIA, storage, offline capabilities, and document
outlines, so read on to find the answers."
http://html5doctor.com/your-questions-answered-4/
Canvas and SVG - Which Should I Use When?
By Daniel Davis.
"As use of HTML5 is spreading, canvas and SVG (Scalable Vector
Graphics) are being more widely used to create images within a web
page. They are both supported by all major browsers (except Internet
Explorer 8 and below) and are open alternatives to Flash for animation
and graphic interaction. Why do we need two image-creation methods,
however, and when should either be used?..."
http://my.opera.com/ODIN/blog/canvas-and-svg-which-should-i-use-when
Microformats: Boon or Bane?
By Jeff Atwood.
"...It feels like a hacky overload. While you could argue this is no
different than the web and HTML in general -- a giant wobbly teetering
tower of nasty, patched-together hacks -- something about it
fundamentally bothers me. Now, all that said, I still think
microformats are useful and worth implementing, if for no other reason
than it's too easy not to..."
http://www.codinghorror.com/blog/archives/001314.html
+12: TYPOGRAPHY.
Type-Inspired Interfaces
By Dan Mall.
"One of the things that terrifies me most about a new project is the
starting point. How is the content laid out? What colors do I pick?
Once things like that are decided, it becomes significantly easier to
continue design, but it's the blank page where I spend the most time..."
http://24ways.org/2009/type-inspired-interfaces
+13: USABILITY.
Short-Term Memory
By Jakob Nielsen.
"The human brain is not optimized for the abstract thinking and data
memorization that websites often demand. Many usability guidelines are
dictated by cognitive limitations."
http://www.useit.com/alertbox/short-term-memory.html
The Content Strategist as Digital Curator
By Erin Scime.
"As the digital landscape becomes increasingly complex, and as
businesses become ever more comfortable using the web to bring their
product and audience closer, the techniques and principles of museum
curatorship can inform how we create online experiences?particularly
when we approach content. Erin Scime shows us how."
http://www.alistapart.com/articles/content-strategist-as-digital-curator
10 (Obvious) Usability Crimes
By Adrian Roselli.
"Having stumbled across the article '10 Usability Crimes You Really
Shouldn't Commit', I can see that the suggestions are pretty obvious,
and the number 10 is probably more arbitrary than based on some natural
break in severity. However, there are some things in the article I have
been repeating for years that people just don't get. And this article
uses He-Man graphics, which makes it even cooler."
http://blog.adrianroselli.com/2009/12/10-obvious-usability-crimes.html
Optimization: Applying Moore's Law to User Experience
By Peter Hornsby.
"...If we are to take significant steps forward in the state of the art
for UX design, we need to continually question our base assumptions and
refresh our knowledge about where the boundaries of human performance
lie. Human brains are capable of adapting to changing situations and
understanding new concepts. If the rewards of innovation are
sufficiently great, we can change our current conceptions about what
computer systems should be. While it is possible that the current state
of the art is the best we can manage, I hope not."
http://tinyurl.com/yl48cso
10 Things to Consider When Writing for the Web
By Rob Mills.
"Writing for the web is a challenge. There are usually word length
restrictions, the fact that users scan rather than read every word, and
sometimes style guides to adhere to. There are enough writing tips
online to keep you reading for longer than you probably desire. Here
are 10 tips that have been the most useful to me..."
http://tinyurl.com/yf2xs95
The Construction of Instruction
By Relly Annett-Bake.
"If the world were made to my specifications, all your clients would be
happy to pay for a web writer to craft every sentence into something as
elegant as it was functional, and the client would have planned the
content so that you had it just when you asked, but we both know that
won't happen every time..."
http://24ways.org/2009/the-construction-of-instruction
Make It Difficult to Read
By Dmitry Fadeyev.
...There is no one right way to write content for the Web, just
different approaches for different circumstances. Knowing your
objectives can help you choose your strategy, just be sure to consider
all options, especially the less obvious ones."
http://www.usabilitypost.com/2009/12/08/make-it-difficult-to-read/
[Section one ends.]
++ SECTION TWO:
+14: What Can You Find at the Web Design Reference Site?
Accessibility Information.
http://www.d.umn.edu/goto/accessibility
Association Information.
http://www.d.umn.edu/goto/associations
Book Listings.
http://www.d.umn.edu/goto/books
Cascading Style Sheets Information.
http://www.d.umn.edu/goto/css
Color Information.
http://www.d.umn.edu/goto/color
Dreamweaver Information.
http://www.d.umn.edu/goto/dreamweaver
Evaluation & Testing Information.
http://www.d.umn.edu/goto/testing
Event Information.
http://www.d.umn.edu/goto/events
Flash Information.
http://www.d.umn.edu/goto/flash
Information Architecture Information.
http://www.d.umn.edu/goto/architecture
JavaScript Information.
http://www.d.umn.edu/goto/javascript
Miscellaneous Web Information.
http://www.d.umn.edu/goto/misc
Navigation Information.
http://www.d.umn.edu/goto/navigation
PHP Information.
http://www.d.umn.edu/goto/php
Sites & Blogs Listing.
http://www.d.umn.edu/goto/sites
Standards, Guidelines & Pattern Information.
http://www.d.umn.edu/goto/standards
Tool Information.
http://www.d.umn.edu/goto/tools
Typography Information.
http://www.d.umn.edu/goto/type
Usability Information.
http://www.d.umn.edu/goto/usability
XML Information.
http://www.d.umn.edu/goto/xml
[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/goto/webdevlist
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