. Date: Fri, 4 Mar 2011 05:20:52 -0600 From: Laura Carlson <lcarlson@xxxxxxxxx> To: webdev <webdev@xxxxxxxxxxxxxxx> Subject: [webdev] Web Design Update: March 4, 2011 +++ WEB DESIGN UPDATE. - Volume 9, Issue 36, March 4, 2011. An email newsletter to distribute news and information about web design and development. ++ISSUE 36 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: DREAMWEAVER. 05: EVALUATION & TESTING. 06: EVENTS. 07: INFORMATION ARCHITECTURE. 08: JAVASCRIPT. 09: MISCELLANEOUS. 10: NAVIGATION. 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. Accessibility for Web Writers, Part 3 - Information and Relationships By Dey Alexander. "Web writers need to use HTML tags to identify certain types of information and relationships between information. For instance, headings need the appropriate heading tag because font size increases aren't visible to everyone. Some blind people use software that reads out the headings. This gives them a sense of the document contents and structure-but it only works if heading tags are used..." http://www.deyalexander.com.au/blog/2011/02/accessibility-for-web-writers-part-3/ WebAIM Screen Reader User Survey Number 3 Results By WebAIM. "WebAIM has released the results of our most recent screen reader user survey. These results provide informative and interesting data that should drive accessible web development and practices." http://webaim.org/projects/screenreadersurvey3/ Web Accessibility and Human Rights: Is the Internet the Great Equaliser? By Sandi Wassmer. "...Web accessibility is a fundamental human right and if democratic countries play their part in fulfilling their moral and legal obligations to the surety of an accessible web, then we will be well on our way. Even though there was no Internet back in 1948, the articles within the Declaration are implicit, and when considered in light of web accessibility, there is absolutely no ambiguity..." http://www.actionforblindpeople.org.uk/your-community/blogs/sandi-wassmer/web-accessibility-and-human-rights-is-the-internet-the-great-equaliser/ How Usability Testing Adds Value to Accessibility Evaluations By Mary Donnelly. "Whenever I am presented with steps on how to conduct an accessibility evaluation, user testing with real users is always listed as a step. What I rarely see is information on why testing is so important, what the benefits from testing real users are, and what you get by testing with real users that you can't get by using accessibility tools or testing with your own screen reader." http://userexperience.evantageconsulting.com/2011/03/how-usability-testing-adds-value-to-accessibility-evaluations/ +02: CASCADING STYLE SHEETS. W3C Validator Needs type='text/css' in Order to Find CSS Files By Russ Weakley. "...However, the W3C CSS validator seems to have some issues with HTML5 documents that exclude type="text/css"..." http://www.maxdesign.com.au/2011/03/02/css-validator/ Show and Edit Style Element By Chris Coyier. "Kind of a classic little trick for ya'll today. You know the <style> blocks you can put in the <head> of your HTML to do styling? You don't actually have to put those in your head, they can be anywhere on the page. It's not valid (or good practice) but it works..." http://css-tricks.com/show-and-edit-style-element/ CSS Value Lengths, Times, Frequencies and Angles By Estelle Weyl. "Many of the property values are keywords unique to that property. But for some properties, the values can include length, frequency or time values or units. In this article we go over all the math type units that can be applied as property values in CSS..." http://www.standardista.com/css3/css-values-lengths-times-frequenc-angles What Does a Blur Radius Mean? By David Baron. "A bunch of Web platform features involve blurring. For example, the CSS text-shadow property lets a shadow be both positioned and blurred. Each shadow is given with three numbers: the first two give the position and the third gives the blur radius. For example..." http://dbaron.org/log/20110225-blur-radius Problems With the Sans-Serif Hack By Harry Roberts. Chris Coyier's sans-serif hack article has been doing its rounds lately, however it isn't without its drawbacks… and it is a hack. http://csswizardry.com/2011/03/problems-with-the-sans-serif-hack/ The No-Pressure Introduction to CSS3 By Kean Richmond. "...Whether you call it Progressive Enhancement, Graceful Degradation or Hardboiled it doesn't matter really, so long as you accept that a website doesn't need to look the same in all browsers. If you can accept this simple truth then you will see that CSS3 can be adopted today without negatively affecting the user experience of those using older browsers..." http://www.onextrapixel.com/2011/02/14/the-no-pressure-introduction-to-css3/ To Reset or Not Reset - That's the CSS Question By Craig Buckler. "Every web browser uses a base stylesheet. It ensures HTML is rendered reasonably well when you don't provide custom CSS. You know the kind of thing: blue for unvisited links, purple for visited links, bold for strong tags, larger text for h1 titles etc. Unfortunately, vendors love making our lives complicated and each browser uses a different base. So how can you ensure your custom CSS is not affected by a default style implemented on a specific device?..." http://blogs.sitepoint.com/2011/03/03/css-resets-useful-or-useless/ +03: COLOR. Eye Resources - Understanding Color Blindness "Color blindness refers to the inability to see differences in certain colors which can be discerned by others. Typically, people who suffer from color blindness cannot tell red from green or the colors appear somewhat differently to them. About 10 million men in America suffer from color blindness. Color blindness affects a great number of people across the world. With the right education and management, they can learn to improve their color vision deficiency..." http://lasiksurgerycost.net/articles/understanding-color-blindness.html +04: DREAMWEAVER. Adobe Dreamweaver CS5 with PHP - Why PHP and Why Dreamweaver CS5? By David Powers. Book excerpt. http://www.peachpit.com/articles/article.aspx?p=1681082 +05: EVALUATION & TESTING. Anecdotes Persuade More Than Data By Susan Weinschenk. "Anecdotes are in story form. They will invoke empathy, which triggers emotional reactions. With emotional reactions people will process the data and the feelings. Emotions will also trigger the memory centers in the brain." http://www.whatmakesthemclick.net/2011/02/28/100-things-you-should-know-about-people-67-anecdotes-persuade-more-than-data/ +06: EVENTS. An Event Apart Minneapolis August 8-10, 2011. Minneapolis, Minnesota, U.S.A. http://www.aneventapart.com/2011/minneapolis/ UX Australia August 22-26, 2011. Sydney, Australia http://www.uxaustralia.com.au/ UX Week August 23-26, 2011. San Francisco, California, U.S.A. http://www.uxweek.com/ Web Directions South October 11-14, 2011. Sydney, Australia http://south11.webdirections.org/ +07: INFORMATION ARCHITECTURE. Open vs. Closed Prototypes By Tom Maiorana. "An open prototype is one that involves the user in a direct way. It is typically something you could hand over to a user...A closed prototype is an experience that users watch, but won't interact with directly. The lack of direct user interaction can make it harder to learn from a closed prototype." http://dschool.typepad.com/news/2011/02/open-vs-closed-prototypes-1.html +08: JAVASCRIPT. JavaScript and Screenreaders By Bruce Lawson. "For three years Jared Smith and his lovable chums at WebAIM have conducted a survey of screenreader users, analysed the result and posted them. This year's results are out. Let's take a minute to give them a round of applause. There is much to digest, but one figure really caught my attention: only 1.6% of respondents had JavaScript disabled. Turning that round, 98.4% of screenreader users had JavaScript enabled..." http://www.brucelawson.co.uk/2011/javascript-and-screenreaders/ +09: MISCELLANEOUS. Creating Great Design Principles - 6 Counter-intuitive Tests By Jared M. Spool. "...Great design principles help designers learn more about their design and make critical decisions about what they're building..." http://www.uie.com/articles/creating-design-principles Testing Your Design Principles By Ted Boren. "...Here are his six tests, with a little elaboration on how our design principles fared when put up to these standards..." http://northtemple.com/2011/03/02/testing-your-design-princi +10: NAVIGATION. Skip Navigation By John Eric Brandt. "As the years have gone by, screen reader technology has changed dramatically, and there are now methods built into all of the major screen readers that allow the user to move about the web page more readily ostensibly allowing the user to 'browse' the content without having to read every word...I suspect that when Section 508 is revise the 'skip navigation' requirement itself will be…skipped!" http://jebswebs.net/blog/2011/02/skip-navigation/ +11: STANDARDS, GUIDELINES & PATTERNS. HTML5 sectioning elements, headings, and document outlines By Roger Johansson. "Recently I've been taking a closer look at how HTML5 changes the way document outlines are created. I'm not entirely sure that I have understood the specification fully, but if I have, I think the new outline algorithm requires you to think carefully when using the new sectioning elements (article, section, nav, and aside) if you also want a coherent document outline without untitled sections..." http://www.456bereastreet.com/archive/201103/html5_sectioning_elements_headings_and_document_outlines/ Tweaking HTML5 - Edition For Web Authors By Steve Faulkner. "In mid 2010 Anthony Kolber and Ben Schwarz started a discussion about the usability of W3C specifications, this resulted in Ben and Anthony's initial restyled version of the W3C HTML5 - Edition for Web Authors. Tweaks needed..." http://www.paciellogroup.com/blog/2011/03/tweaking-html5-edition-for-web-authors/ Your Questions Number 16 By Richard Clark. "The clinic is getting busy with more HTML5 ailments! This week, we'll cover the separation of formatting and content, custom elements, using <aside> for social links, sections with no visible titles, and <canvas> in the DOM..." http://html5doctor.com/your-questions-16/ +12: TYPOGRAPHY. CSS Typography: The Basics Kayla Knight. "...How can we use CSS for great typography in our web designs? This is a question we'll try to answer..." http://via.pulsene.ws/13W2C Sans-Serif By Chris Coyier. "Macs will get awesome Helvetica by default. On PC's, even if they have Helvetica it can look worse that Arial for whatever reason, so this way they get Arial by default. And you're still covered by the generic keyword. Shorter, easier, yay..." http://css-tricks.com/sans-serif/ What's So Smart About Those Quotes By Jennifer Farley. "Amongst typographers and type-lovers it is often considered to be a type faux pas to use the wrong type of quotes. Did you know there is a wrong type of quote, a quote from the wrong side of the tracks? Well there are such things known as smart quotes and dumb quotes. Smart quotes (sometimes known as book quotes) are the curly or curved style of quote. The have an opening and closing style. Dumb or straight quotes are straight up and down, sometimes tapered vertical marks. So what's the big deal? It really depends on how pedantic you want to be with your web or print typography..." http://blogs.sitepoint.com/2011/02/28/whats-so-smart-about-those-quotes/ The @Font-Face Rule and Useful Web Font Tricks By Ralf Hermann. "The possibility of embedding any font you like into websites via @font-face is an additional stylistic device which promises to abolish the monotony of the usual system fonts. It surely would be all too easy if there was only one Web font format out there. Instead, there's quite a variety, as you will get to know in this article..." http://www.smashingmagazine.com/2011/03/02/the-font-face-rule-revisited-and-useful-tricks/ +13: USABILITY. Mobile Content Is Twice as Difficult By Jakob Nielsen. "When reading from an iPhone-sized screen, comprehension scores for complex Web content were 48% of desktop monitor scores." http://www.useit.com/alertbox/mobile-content-comprehension.html [Section one ends.] ++ SECTION TWO: +14: 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@xxxxxxxxx [Issue ends.]