+++ WEB DESIGN UPDATE. - Volume 8, Issue 16, October 16, 2009. An email newsletter to distribute news and information about web design and development. ++ISSUE 16 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. 07: JAVASCRIPT. 08: MISCELLANEOUS. 09: NAVIGATION. 10: PHP. 11: STANDARDS, GUIDELINES & PATTERNS. 12: TOOLS. 13: TYPOGRAPHY. 14: USABILITY. 15: XML. SECTION TWO: 16: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Perspectives on Web Accessibility By W3C. "Along with the redesigned W3C website, we have a new Accessibility page that introduces the what, why, where, and how of web accessibility. Read what it says about how the impact of disabilities can be radically changed for people using the Web when websites, web technologies, and web tools are properly designed." http://www.w3.org/standards/webdesign/accessibility Google Wave Preview Accessibility Review By Jared Smith. "Totally inaccessible...In short, the potential for Google Wave to streamline and enhance communication for people with disabilities, especially screen reader users, is great. Could Google Wave be made accessible? I believe it could be..." http://webaim.org/blog/google-wave-preview-accessibility-review/ Improve Your Keyboard Accessibility By Roger Johansson. "One of my pet peeves is websites that aren't keyboard friendly. I've been on about it in posts like Don't forget keyboard navigation and Do not remove the outline from links and form controls..." http://tinyurl.com/yfwfrkq Call for Law to Improve Websites for Disabled By Tom Espiner. "European information commissioner Viviane Reding has proposed a pan-European law that would ensure website accessibility for disabled people." http://news.zdnet.co.uk/internet/0,1000000097,39785385,00.htm 5 Accessible and Pretty CSS Tips By Tim Nash. "We are in the last few bits of the new site and while designing it a major focus has been on accessibility and not just for search engines." http://tinyurl.com/yzxs85k +02: CASCADING STYLE SHEETS. Basic iPhone Styling By Jonathan Stark. Chapter from "Building iPhone Apps with HTML, CSS, and JavaScript": "In this chapter, I'll show you how to apply CSS styles to a bunch of existing HTML pages so that they are easily navigable on an iPhone. So, in addition to moving closer to building a native app, you'll be learning a practical (and valuable) skill that you can use immediately." http://building-iphone-apps.labs.oreilly.com/ch02.html Advanced iPhone Styling By Jonathan Stark. Chapter from "Building iPhone Apps with HTML, CSS, and JavaScript": "In this chapter, we'll lay the groundwork to make those same pages behave like an iPhone app. Specifically, we'll discuss using Ajax to turn a full website into a single page app, how to create a back button with history using JavaScript, and how to take advantage of the Web Clip Icon and Full Screen Mode features of the iPhone to launch your app without Mobile Safari intruding upon the user experience." http://building-iphone-apps.labs.oreilly.com/ch03.html How Do I Design Web Pages for the iPhone? By Thomas Boutell. "Apple's iPhone is an exciting device. But how do you design web pages specifically to look their best on the iPhone?..." http://www.boutell.com/newfaq/creating/iphone.html Remove the Outline from Links on :active only By Roger Johansson. "A few months ago I emphasized the importance of not making things difficult for people who do not use a mouse by removing the outline from links and form controls. If leaving the outline property at its default is not an option for you, perhaps the technique Patrick Lauke describes in Better CSS outline suppression could work. It's so simple I can't believe I haven't heard or thought of it before - remove the outline for the :active state only..." http://tinyurl.com/yhqekwq How to Create Simple and Effective Sub Navs with Definition Lists By Mark Otto. "We use our extranet daily to present a lot of work to our clients and we have several established ways of presenting that information, including the use of a dl-powered navigation list. When we need simple and effective on-page navigation, to either jump to content on the page or flip to another view, we use the DL element. Its sub elements, the DT and DD, make it very easy for us to create inline links with clear intent and purpose." http://tinyurl.com/ykgm2jo The Great WebKit Comparison Table By Peter-Paul Koch. "On this page I compare 19 WebKits in order to prove that there is no 'WebKit on Mobile' and to figure out which one is the best. My hope is that eventually I'm going to gain some insight in the 'family tree' of all WebKits." http://www.quirksmode.org/webkit.html CSS Differences in Internet Explorer 6, 7 and 8 By Louis Lazaris. "One of the most bizarre statistical facts in relation to browser use has to be the virtual widespread numbers that currently exist in the use of Internet Explorer versions 6, 7 and 8. As of this writing, Internet Explorer holds about a 65% market share combined across all their currently used browsers. In the web development community, this number is much lower, showing about a 40% share..." http://tinyurl.com/yk2kxhc +03: DREAMWEAVER. Using Dreamweaver Site Map View to Change or Update Links By Charles Anderson. "Web design software like Dreamweaver can make creating Web pages relatively simple. Because of this, it is easy to fall into the habit of rapidly creating pages without a lot of thought about updating them, particularly when website links change. Dreamweaver's 'Site View' option can help." http://www.brighthub.com/internet/web-development/articles/51933.aspx +04: EVALUATION & TESTING. Do Users Fail a Task and Still Rate It As Easy? By Jeff Sauro. "...So do users who fail a task still rate it as easy? If we restrict "easy" to only mean the maximum level of satisfaction, then about 14% of users do. If we more loosely define easy as anything above 75% of the maximum score (3.75 out of 5 and 4.9 out of 7), then this happens about 1/3 of the time. I'm inclined to think that it's those extreme responses that garner all the attention. There are likely a number of reasons for the less than perfect correlation between task success and satisfaction rating..." http://www.measuringusability.com/failed-sat.php Hard Data From Think-Aloud Tests By Usability Advice. "A well-executed think-aloud study can yield useful quantitative data (for example, rate of an occurrence or behavior) as well as qualitative data. We recommend that before you invest in more costly testing techniques, you try collecting and analyzing the quantitative data you may be missing from your think-aloud studies..." http://tinyurl.com/yzy5tec +05: EVENTS. Computer, Information, and Systems Sciences, and Engineering (CISSE 09) December 4-12, 2009. Online Conference. http://cisse2009.org/home.aspx +06: JAVASCRIPT. Password Unmasking By Jeremy Keith. "A few months ago, Jakob Nielsen wrote about password. Specifically, he wrote about the standard practice of the contents of password fields being masked by default. In his typical black/white, on/off, right/wrong Boolean world view, Father Jakob called for this practice to be abolished completely..." http://adactio.com/journal/1618/ Creating User-Defined JavaScript Objects, Properties and Methods By Chrysanthus Forcha. "Did you know that the user could create his own objects, properties and methods? This is the third and last part of a series on adding and deleting JavaScript properties and methods. First, we shall see how to add and delete properties and methods at run time. After that I will show you the privilege that JavaScript gives to the user..." http://tinyurl.com/yj9mmvx Properties and Methods of Custom 2D JavaScript Arrays By Chrysanthus Forcha. "This is part two of a series that discusses custom 2D JavaScript arrays. In this part of the series, we see how to develop the properties and methods of our custom 2D array..." http://tinyurl.com/yk6aaur +07: MISCELLANEOUS. Thoughts on the HighEdWeb 2009 Experience By Jesse Rodgers. "On the way home yesterday I wrote this post in my head about dozen times. Lots buzzing around after some great discussions and some late nights in Milwaukee. HighEdWeb is by far the best conference focused on web technology, strategy, and networking in higher education. It isn't because of the speakers (although some were simply amazing), it is because it brings together people from the most diverse collection of schools from across North America all with similar problems but different solutions..." http://tinyurl.com/ykawx98 Victor Tsaran The Yahoo! Accessibility Manager (Interview) By Tom Babinszki. "I recently spoke with Victor Tsaran, who works as the accessibility manager at Yahoo!. I asked him about how he started to work with the company, what accessibility means to him personally and what Yahoo! does to ensure the accessibility of their products. Below, you can read what Victor says about the current Yahoo! accessibility work, and his testimony on how accessibility makes a difference in his own life..." http://www.evengrounds.com/blog/accessible-experts-victor-tsaran The Web's Inventor Regrets One Small Thing By Steve Lohr. ".... He would get rid of the double slash '//' after the 'http:' in Web addresses. The double slash, though a programming convention at the time, turned out to not be really necessary..." http://tinyurl.com/yl3ju9l Cameron Adams - Making Waves The audio recording of Cameron Adams's Web Directions South 2009 presentation on Google Wave is available. http://tinyurl.com/yztt45z Kelly Goto - WorkFLOW The audio recording of Kelly Goto's Web Directions South 2009 presentation on the FLOW Method is available. http://www.webdirections.org/resources/kelly-goto-workflow/ Donna Spencer - Information Seeking Behaviors The audio recording of Donna Spencer's Web Directions South 2009 presentation on information behaviors is available. http://tinyurl.com/yfxotv4 +08: NAVIGATION. An Evolution of Search By John D. Holt and David J. Miller. "The technology of information retrieval systems continues to evolve, and in particular, the technology of search has continued to evolve. A new stage in the evolution of search has arrived with the advent of entity-based searching. This paper provides a brief review of some of the earlier stages of search evolution in the context of the evolutionary pressures of the concurrent improvement of both precision and recall." http://asis.org/Bulletin/Oct-09/OctNov09_Holt_Miller.html When Alphabetical Order Is Not Logical By Elizabeth Buie. "Every so often, the question comes up among interaction designers and usability professionals regarding whether alphabetical order is a logical order. We've all seen numerous lists that appear in alphabetical order (and in which it makes sense): country, state, surname, street name, auto manufacturer. We've also seen many that do not: month, day of week, browser history, File menu." http://tinyurl.com/yf455g2 +09: PHP. Object Orientated Programming- The Beginning By J. Leidago Noabeb. "This article explores the new Object Orientated Programming that became available in PHP 5. Get some hands-on experience as we create an application demonstrating the concepts." http://www.webreference.com/programming/php/OOP_01/index.html How To Write A Function In PHP By Brandon Savage. "For new developers, especially developers who have never been programmers before, moving from writing simple scripts to writing functions is a process that takes time. I developed in PHP for years before I wrote a single function. I also never found a comprehensive tutorial on how functions work, or how to write them. There's documentation in the manual, but it's a bit hard to grasp if you're new. This article is about writing functions..." http://www.brandonsavage.net/how-to-write-a-function-in-php/ +10: STANDARDS, GUIDELINES & PATTERNS. The Future of HTML 5 By Bruce Lawson. "At FOWA London 2009 Bruce Lawson gave an introduction to HTML 5 and how it might be used in the future..." http://carsonified.com/blog/web-apps/the-future-of-html-5/ Why Designers Should Care About HTML5 By Cennydd Bowles. "...there's more to HTML5 than simply keeping our skills sharp. It could make a big difference to the way we design for the web..." http://html5doctor.com/why-designers-should-care-about-html5/ The Coming HTML 5 Train Wreck By Kurt Cagle. "...My prediction? We're looking at a train wreck about to happen. Vendors will implement those parts of the HTML 5 spec that happen to best fulfill their own particular objectives, and will be sloppy about implementing anything else - sloppy specs produce sloppy conformance. We'll be back to the days of the late HTML 3 spec...My hope? At some point in the very near future, older and wiser heads will prevail, will take the kids out of the sandbox and take them inside for a bath, then spend some time cleaning up the mess. There are some good ideas buried in HTML 5, but shoveling the muck to get to them is probably not worth the effort." http://www.xmltoday.org/content/coming-html-5-train-wreck An Introduction to HTML5 By Robert Nyman. It seems like everyone is talking about HTML5 now, but the discussion is spread out and seldom gives the background, explanation what HTML5 really is and if/when it's usable..." http://robertnyman.com/2009/10/14/an-introduction-to-html5/ YUI Theater Brad Neuberg - Introduction to HTML5 By Eric Miraglia. "Brad Neuberg of the Google Developer programs stopped by Yahoo! last week talk about HTML5. Brad has been hard at work on SVG Web lately, but he covered a lot of ground in this talk, including SVG/Canvas rendering, CSS transforms, app-cache, local databases, web workers, and much more. Brad does a fantastic job identifying the scope and practical implications of the changes that are coming along with HTML5 support in modern browsers. And he pulls no punches about which browsers fall into the 'modern' category at this point." http://www.yuiblog.com/blog/2009/10/13/video-neuberg-html5/ Are We Still Arguing About Validation? By John Foliot. "As someone who has been teaching HTML for over a decade, I have recollections of students (authoring in Notepad) in total panic because they forgot to close their s, and thus Netscape 3 would deliver a blank page (Draconian error handling has a history too) - I also remember that they only made that mistake once, and never forgot it after that..." http://john.foliot.ca/are-we-still-arguing-about-validation/ WebJam 2009 Talk on Video Accessibility By Silvia Pfeiffer. "A 3 min presentation I gave at yesterday's WebJam in Sydney on video accessibility with the HTML5 video element - proposed tags and actual work..." http://tinyurl.com/yzxv7ey This Week in HTML5 - Episode 37 By Mark Pilgrim. "The big news this week is microdata. Google sponsored a usability study on microdata syntax, which resulted in significant changes to the spec [r4066]..." http://blog.whatwg.org/this-week-in-html5-episode-37 dd-details Wrong Again By Remy Sharp. "You may recall that I blogged about legend not being so legend as the heading element for details or figure. After enough noise was made the spec was changed so that the heading and contents of these elements can now be marked up using the dt/dd combo. Although not immediately obvious why it's the right choice, it appeared to work for our needsÉat first. Of course now, it's been discovered that it's actually a pretty bad idea..." http://html5doctor.com/dd-details-wrong-again/ +11: TOOLS. Modernizer "Modernizr is a javascript library which detects your browsers' support for the latest CSS and HTML5 features. Essentially it tells you how modern your browser is." http://findmebyip.com/ iPhoney By M. Onyschuk. "iPhone Browser Simulator provides an iPhone sized web view with which to test your iPhone targeted apps, all in a pretty iPhone-inspired package." http://sourceforge.net/projects/iphonesimulator/ iphonetester By Atmail. http://www.iphonetester.com/ +12: TYPOGRAPHY. @font-face and Performance By Steve Souders. "Given the high number of posts about @font-face recently, I expect we'll see more performance issues and workarounds as we grapple with how to use this feature in today's browsers while ensuring our users get the fast experience they want and deserve..." http://www.stevesouders.com/blog/2009/10/13/font-face-and-performance/ +13: USABILITY. Inside User Research at YouTube By YouTube Inc. "If you think about watching a video online, it may seem pretty easy. A player, a play/pause button and some content. Done. But what about if the video is being played on a mobile phone? Or on a big screen? What if it's being viewed in Nairobi? Or Shanghai? Now let's say it's being viewed by someone who wants to share her thoughts on the video and by someone who wants to do nothing more than watch more videos. Before you know it, watching a video becomes more complicated than you realize." http://tinyurl.com/yat9les Google Wave Doesn't Stop Information Overload By Mark Hurst. "The solution to overload isn't primarily Google Wave or any other tool, because technology isn't the primary reason for overload. Tools are essential, but overload is primarily a behavioral problem: on the sending side people aren't writing clearly or acting with empathy for the people they email to; on the receiving side, people haven't been trained to spend five minutes a day emptying their inbox and sending action items to a todo list..." http://goodexperience.com/2009/10/google-wave-doesnt-st.php Stop Counting Clicks By David Hamill. The 3-click-rule is the Freddy Kreuger of web design advice. You think it's finally dead and then it comes back and starts slashing up sensible debate about usable design. I'm hoping to convince you to stop talking about the 3-click rule. I don't mean substituting it with the 4-click rule or the 5-click rule. You should stop counting clicks as a measure of usability altogether. http://www.uxbooth.com/blog/stop-counting-clicks/ Streams, Walls, and Feeds - Distributing Content Through Social Networks and RSS By Jakob Nielsen. "Users like the simplicity of messages that pass into oblivion over time, but were frequently frustrated by unscannable writing, overly frequent postings, and their inability to locate companies on social networks." http://www.useit.com/alertbox/streams-feeds.html The 'Search, Compare, Verify' Generation By Gerry McGovern. "Success on the Web is not about making customers do what you want. It is about helping customers do what they want..." http://www.gerrymcgovern.com/nt/2009/nt-2009-10-11-Search-compare.htm 5 Tips For Creating An Effective Call To Action Button By Jennifer Farley. "Call to action buttons are the best way to grab attention, but you need to make it clear exactly what it is you want the user to do. Here are five tips to keep in mind when designing a call to action button or advert..." http://tinyurl.com/yhzdlt5 Restoring Spring to iPhone/iPod Touch Springboard by Bruce Tognazzini. "...In this article, I want to present a simple solution to Springboard's current limitations, limitations that are about to plateau app sales, costing both Apple and its developers billions of dollars..." http://www.asktog.com/columns/080Springboard.html +14: XML. Beyond XHTML (Keynote from SVGOpen) By Sam Ruby. "One of the factors limiting SVG adoption is the association with XML. XML has been helpful in a number of ways: from providing a concrete syntax that enables both a focus on higher level constructs and simplifies tooling. It also has been an inhibitor in places where tight integration with less well formed content is a necessity. This talk is about small lessons that you can learn from the web to increase adoption of SVG, and big lessons of the web that you will have to deal that will be direct consequences of the 'unwashed masses' copy/pasting SVG fragments onto MySpace pages or equivalent and expecting it to all 'just work'." http://www.youtube.com/watch?v=vd7ILwrFwQY [Section one ends.] ++ SECTION TWO: +15: 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@d.umn.edu [Issue ends.]