+++ WEB DESIGN UPDATE. - Volume 5, Issue 07, August 11, 2006. An email newsletter to distribute news and information about web design and development. ++ISSUE 07 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: EVENTS. 05: FLASH. 06: INFORMATION ARCHITECTURE. 07: JAVASCRIPT. 08: MISCELLANEOUS. 09: NAVIGATION. 10: PHP. 11: STANDARDS, GUIDELINES & PATTERNS. 12: TOOLS. 13: USABILITY. 14: XML. SECTION TWO: 15: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. WCAG 2 - A Backward Step for Accessibility? By David Moore. "As people who work with accessibility and websites, we're used to the arcane world of the Web Content Accessibility Guidelines (WCAG), but the new guidelines are going to change things a lot, and maybe not for the better." http://tinyurl.com/pgsyn WCAG 2 - Moving Forward By Charles McCathieNevile. WCAG is "...not yet ready to replace WCAG 1.0 as the international reference. They do not provide the guidance that is needed to make their framework useful outside HTML. For their coverage of HTML they do not provide the information developers really need - a clear assessment of the impact on users. Instead they try to tell developers what will be easy or hard and therefore what is necessary or just nice to have, in a way that is totally inappropriate (and actually makes them unsuitable for policy use in many countries outside the USA)..." http://www.opera.com/operabits/06/07/blog.dml On Accessibility By Catherine Roy. "...there seems to be a growing trend towards confusing accessibility with universal access (or what some people call universality or access for all). And while these two ideas are indeed closely related, they are generally well-defined concepts and they are not interchangeable (and I say this being fully aware of the usage of accessibility concepts in other fields)...unlike some people who seem to see this as a sign that persons with disabilities are being magically mainstreamed, their needs being considered on the same footing as other needs and hence, their status miraculously transitioning to that of true equality, I see this as just one more reason for people to get it wrong... it is indicative of the continued marginalisation of persons with disabilities by going so far as to disappropriate them of their own issues or, at the very least, push them over to the sidelines with respect to something that is all about them or, most assuredly, about them in a big way..." http://www.catherine-roy.net/blog/?p=3 Guide to Voiceover Basics By Blind Techs Wiki. http://blindtechs.net/wiki/index.php/Guide_to_Voiceover_basics Evaluating for Accessibility By Shawn Lawton Henry and Mary Grossnickle. "...how the evaluation phase fits with other steps..." http://www.uiaccess.com/accessucd/evaluate.html Why CSS is Important for Accessibility By Alastair Campbell. "...It would actually be very hard work to try and fulfil the WAI guidelines without using CSS. These checkpoints are all double-A, and very difficult (or impossible) to fulfil without using CSS to separate style from content..." http://alastairc.ac/2006/08/why-css-is-important-for-accessibility/ +02: CASCADING STYLE SHEETS. A Handy CSS Debugging Snippet By Chris Page. "I use the following bit of CSS to help visualize the structure of an XHTML (or HTML) document by putting a colored outline around the border of every element. At each level in the hierarchy the color changes so you can see when 'depth' changes." http://tinyurl.com/o9w4o CSS: Smart Corners By Mike Cherim. "Rounded corners can be cool. They're certainly popular at the moment. Thus I couldn't help myself and just had to create this Smart Corners experiment." http://mikecherim.com/gbcms_xml/news_page.php?id=10 CSS Princess By MS Web Centar Studio. "CSS Princess is project with the main idea for promoting and supporting beautiful and interesting css sites made by woman's hand or woman's touch. It's well known that women designers have special sensibility which they always put in their work, and main idea of web site gallery created by cssprincess.com is to show the best web sites worldwide which have a woman's touch in their design." http://cssprincess.com/ CSS Layouts By Code Sucks. An assortment of one, two, three, and four column templates. http://www.code-sucks.com/css%20layouts/index.php +03: DREAMWEAVER. Microsoft's Expression Web Designer vs. Adobe's Dreamweaver By Matthew David. "...There is no mistake that Adobe and Microsoft are setting the battle field and will square off against each other. In this new war of Web designer tools, Microsoft is looking a lot like David and Adobe is looking like a limber and strong Goliath. Let the rumble begin." http://networking.itbusinessnet.com/articles/viewarticle.jsp?id=43025 Introducing CMX Jumpstart Greenville By Sheri German. "The name Greenville evokes the radiant ambiance of gardens, nurseries, and landscapes. And that is just how Heidi Bautista paints it in our latest Community MX JumpStart: Greenville, NC. Let's take a closer look at this bloomingly lovely design to see what new treasure we've added to our JumpStart collection." http://www.communitymx.com/content/article.cfm?cid=0BE7B +04: EVENTS. Webmaster Jamsession September 22-23, 2006. Dallas, Texas U.S.A. http://www.webjamsession.com/ South by Southwest (SXSW) Interactive March 9-13, 2007. Austin, Texas U.S.A. http://2007.sxsw.com/interactive/ "Help SXSW Interactive decide panel programming for the 2007 event..." Vote for your ten favorite program proposals by September 8, 2006 at: http://2007.sxsw.com/interactive/panel_picker/ BarCamp http://barcamp.org/ BrainJams http://www.brainjams.org/event Unconference http://www.kaliyasblogs.net/unconference/ Understanding the Unconference By Jonathan Follett. "A brave new way to learn, share, and collaborate, or a disorganized free-for-all? If you've been to BarCamp or a BrainJam, you already know. If not, let Jonathan Follett guide you through Unconferences, the latest low-cost way to exchange ideas with fellow web professionals." http://www.digital-web.com/articles/understanding_the_unconference/ +05: FLASH. Best Practices for Accessible Flash Design: Part 2 By Bob Regan. "This week we look at methods for controlling the reading order using off stage content, screen reader detection, keyboard access, how to avoid empty hit areas, control over audio playback and more." http://www.webreference.com/authoring/flash2/ Moving Screen Reader Focus in Flash By Andrew Kirkpatrick. "I've been asked various forms of the question 'how can I make JAWS move the focus for my Flash application?' recently and decided to create a quick post. The answer: sometimes you can, sometimes you can't..." http://tinyurl.com/p4zrj +06: INFORMATION ARCHITECTURE. Information Architecture By Valentin. "Information Architecture (often abbreviated "IA") is the practice of structuring information (knowledge or data) for a purpose. These are often structured according to their context in user interactions or larger databases..." http://www.clicknet.ro/networks/2006/08/information-architecture.html +07: JAVASCRIPT. Drag and Drop Controls By Free Usability Advice. "Question: Are there any usability issues with using drag and drop controls in a web application?" (Answer:) "AJAX technology makes it easier to add drag and drop controls to a web application...Before you decide to implement drag and drop, consider whether it is the right solution for your users. Don't just implement new technology for new technology's sake. If you do decide to use drag and drop functionality, make sure to give users a way to notice and learn the interaction." http://freeusabilityadvice.com/archive/28/drag-and-drop-controls Drag 'n Drop is Invisible To Users By Jared Spool. "...They [Netflix] offer a margin feature that allows their users to see the top items in their movie queue. And, to give users that extra umph of interface goodness, you can reorder the queue with drag-and-drop. What Netflix figured out was that nobody else would figure it out unless they included instructions. So, that's exactly what they do. In a very concise box at the bottom of the list, they include a Helpful Tip that visually demonstrates the drag-and-drop capability." http://tinyurl.com/h38kx Usability by Hand, AJAX and Efficiency By Thomas Baekdal. "We have seen a huge amount of drag and drop...Some work, some are very interesting, but most of them directly kill your efficiency...Take drag and drop shopping carts...drag and drop is over 1000% slower than clicking an 'add to cart' button." http://www.baekdal.com/articles/Usability/usability-ajax-efficiency/ Interview with Jakob Nielsen (implementations of AJAX question 1) By Matt Mickiewicz. "...The definition of usability states that usability is a combination of five quality attributes, including learnability and efficiency of use. You have to balance these qualities differently depending on the type of user interface you're designing. It's important to remember that most web sites are not used repeatedly. Usually, users will visit a given page only once. This means that the efficiency of any given operation takes a back seat to the discoverability and learnability of the feature. Therefore, interaction techniques like drag-and-drop should almost never be used on web sites. Instead, focus on showing a few important features and making them accessible through a single click on a simple link or button..." http://www.sitepoint.com/article/interview-jakob-nielsen#title Docking Boxes (dbx) By James Edwards (a.k.a. brothercake). "Docking boxes (dbx) adds animated drag 'n' drop, snap-to-grid, and show/hide-contents functionality to any group of elements. And ... in what might be another world-first for brothercake - dbx is fully accessible to the keyboard as well as the mouse...where the script is not supported, you'll get a default HTML and CSS layout with no dynamic behaviors. This isn't necessarily an issue for things like navigation or news boxes, where the scripting is supplementary to the core functionality. But its use as an application interface should be restricted to situations where browser and scripting support is predictable, or where equivalent server-side functionality is also provided..." http://www.brothercake.com/site/resources/scripts/dbx/ +08: MISCELLANEOUS. Web Visions Podcasts http://www.webvisionsevent.com/wp/?page_id=6 Private Offices Redux By Joel Spolsky. "...Open space is fun but not productive...Last summer, the Project Aardvark interns were all in a big open space. The net result was that there was no such thing as a conversation between two people. Every time I went out there to talk to one of them, it became a conversation with all of them; every time two people had to talk, instead of going off to a quiet space somewhere, they just spoke directly to each other, interrupting the other two's concentration. Although this slightly helps keep everyone 'in the loop,' it also knocks programmers out of flow causing them to lose their concentration and devastating productivity, so I prefer to keep people in the loop using more formal methods..." http://www.joelonsoftware.com/items/2006/07/30.html How to Ruin a Web Design - The Design Curve By Matt Inman. "As a professional web designer I've noticed a consistent trend in the majority of the projects I've worked on: The more time that is spent dissecting, analyzing, and critiquing a design by the wrong kinds of people the worse that design gets. The same trend applies to the number of people involved in the design process." http://www.seomoz.org/blogdetail.php?ID=1230 A Few Reasons Why Designs Fail By D. Keith Robinson. "...I've said it many times in the past, there is no such thing as a perfect design. We're usually trying and hit the sweet spot where we satisfy the needs of our audiences, the opinions of our stakeholders, the goals of the business, etc. This balance is usually easiest found by clarifying direction, increasing constraint, focusing on priorities, etc. Less usually ends up being more, if you catch my drift. Adding more opinions, more stakeholders, more goals, more audiences, more direction and more time to the mix usually gets you further away from that mark. Especially when those opinions, stakeholders, audiences, etc. aren't the right kind. Of course there's some subjectivity to that, but, is it really that hard to find the right mix? I think a bit of honest reflection on the above will usually do the trick. To take it a step further, if you want the best design you can get, you need to find that mix..." http://www.blueflavor.com/ed/design/a_few_reasons_why_designs_fail.php +09: NAVIGATION. Clickstream Study Reveals Dynamic Web By Andrew B. King. "The nature of web navigation is changing from static information delivery to dynamic interactive web services. The speed of web navigation is high with short stay times, but long download times for ISDN and dial-up users. To enable rapid interactivity web designers should design fast loading web pages with concise headlines and be aware of web page hot spots to maximize conversion rates." http://www.websiteoptimization.com/speed/tweak/clickstream/ Where Am I? By Derek Powazek. "It's 2006 and we're still messing up global navigation. Derek Powazek gets back to basics and offers a few simple guidelines for getting it right." http://www.alistapart.com/articles/whereami Call for Support: Evaluating Google Accessible Search By Ann Light. "Google has asked RNIB to collect and collate feedback on how the present version of Accessible Search might be improved. RNIB's Julie Howell says: 'It would be extremely helpful if you would give it a try and let me know what you think in an email.' Her address is julie.howell [at] rnib.org.uk" http://www.usabilitynews.com/news/article3309.asp +10: PHP. eBooks from APress APress is offering several free ebooks on their website. Including "A Programmer's Introduction to PHP 4.0" http://agarwalmk.spaces.live.com/Blog/cns!780CD8FB86EF8F7C!335.entry Killer PHP - For Web Designers By Stefan Mischook. "This is a beginners website/course on PHP created for web designers who have little to no programming experience. Where most other PHP tutorials and books assume you know programming (or at least, that's what it seems like ...) killerphp.com assumes you need to have things explained (and demonstrated) in non-nerd terms..." http://www.killerphp.com/ Classes as PHP Functions By Jacques Noah. "A class is a function of PHP that has its roots in object oriented programming. The ability to use classes in PHP has been increasing with later versions. If you want to add the power of classes to your PHP programming, keep reading..." http://www.devshed.com/c/a/PHP/Classes-as-PHP-Functions/ +11: STANDARDS, GUIDELINES & PATTERNS. Google Strict vs Google Deprecated By Philipp Lenssen. "...I get the feeling Google doesn't use deprecated HTML on their front page 'cause they feel it's better; it's just completely deprecated for no good reason other than Google, by and large, not caring too much about web standards." http://blog.outer-court.com/archive/2006-08-10-n50.html Designing with Patterns By Bill Scott. "Yahoo!'s AJAX evangelist Bill Scott explains what Yahoo!'s design pattern library can do for you." http://www.netmag.co.uk/zine/home/designing-with-patterns +12: TOOLS. GetWebKit / Swift (Run Safari on Windows) "Welcome to GetWebKit, the home of the first and only WebKit based Windows web browser. Featuring the excellent rendering engine used in popular Macintosh web browsers Safari and Shiira, GetWebKit offers a free, powerful, and open-source internet experience." http://www.getwebkit.org/ Palette Grabber Firefox Extension By Konstantine Prevas. "Creates a color palette for Photoshop, Paint Shop Pro, or Flash based on the current page." https://addons.mozilla.org/firefox/2290/ +13: USABILITY. More on Why Major Relaunches are a Bad Idea By Jared Spool. "...design is all about trade-offs. What's the trade-off of the costs to support multiple architectures in a staged-roll-out versus the costs of the user experience disruption that comes from a sudden major redesign? That's the question that needs asking...The main impetus behind my article is about reducing risk...While a major relaunch is tempting, when you factor in the time spent dealing with all the things that will likely go wrong, the incremental approach is probably less time. And it's less embarrassing when Murphy raises his ugly face...Designs evolve in a certain direction because of cultural forces. And cultural forces are hard to shift suddenly. As with anything, incremental approaches to cultural shifts will encounter much less resistance..." http://tinyurl.com/hzavh Long Versus Short Pages By Free Usability Advice. "Which is better-long scrolling pages, or short pages that don't scroll?" http://freeusabilityadvice.com/archive/27/long-versus-short-pages A Crash Course in User Interfaces By Nate Kohari. Whenever the topic of interface development comes up, I'm always surprised to see most software engineers cringe as if they're being told they need a root canal. Almost all modern applications require some sort of graphical user interface, and yet the UI is commonly the last consideration of development. Worse yet (particularly when it comes to web development) the user interface is often created by a graphic designer who isn't familiar with software development. The resulting separation that occurs between the application's internals and its interface can cause serious problems with the project." http://kohari.org/2006/07/27/a-crash-course-in-user-interfaces/ It's The User, Stupid By Ken Magill. "But the most important person in deciding which features and functions should be on the site and how they should be presented is absent. Who is that? The user. Or for those who find the term 'user' off-putting, the customer." http://multichannelmerchant.com/webchannel/Website_usability_07012006/ Gentle Reader, Stay Awhile; I Will Be Faithful By Amber Simmons. "Bloggers and copywriters take heed: it takes more than daily publication to build relationships. Amber Simmons provides advice on engaging readers and keeping them coming back." http://www.alistapart.com/articles/readerstayawhile +14: XML. XHTML Reference By David Chau, Belus Technology. "This reference is a best-practice approach, based on XHTML 1.0 Strict / XHTML 1.1." http://xhtml.com/en/xhtml/reference/ Media Types - How The Web Works By Belus Technology. "Media types (sometimes called MIME types or content types) are a classification system used to identify files commonly found on Web sites. Media types are crucial to the functioning of the Web, because when a client computer requests a Web page from the server, the client computer uses media types to tell the server what type of files the client computer will accept. Conversely, when the server sends files back to the client computer, the server uses media types to identify what type of files it is sending back. This information tells the client computer software (for example a Web browser) how to render or process the files that it receives." http://xhtml.com/en/xhtml/media-types-how-the-web-works/ Serving XHTML As XML By Belus Technology. "When a browser opens a Web page and the media type for the page is set to application/xhtml+xml, the browser will process the page as XML and will enforce the rules of XML. If there are markup errors on a Web page, the browser will not render the Web page. Instead, most Web browsers will display an XML parsing error message such as the one seen in the screen shot below..." http://xhtml.com/en/xhtml/serving-xhtml-as-xml/ Serving XHTML As HTML By Belus Technology. "...Below are rules for authoring XHTML that will be compatible with current and future Web browsers..." http://xhtml.com/en/xhtml/serving-xhtml-as-html/ Understanding XForms: Events and Actions By Kurt Cagle. "...I'd like to give you the fifth installment about XForms, of six - this has been a remarkably well read series, which gives me a certain amount of hope for the specification. I should be making an announcement shortly concerning XForms in this space..." http://tinyurl.com/l624c Understanding XForms: AJAX, XBL and XForms.org By Kurt Cagle. "...I've already dealt with XBL previously in this series, but at the time specifically avoided getting into the use of such bindings much beyond creating simple replacements for certain elements (such as displaying images rather than URIs in output elements). However, as part of the advantage of the Mozilla XForms implementation comes in its integration with XBL, I felt it was worthwhile to readdress the XForms/XBL connection in a little more depth..." http://tinyurl.com/z4ke5 [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.]