<?xml version="1.0" encoding="UTF-8"?>
 <rdf:RDF xmlns="http://purl.org/rss/1.0/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://web.resource.org/cc/" xmlns:syn="http://purl.org/rss/1.0/modules/syndication/" xmlns:admin="http://webns.net/mvcb/">
  <channel rdf:about="http://pinboard.in">
    <title>Pinboard (alexhansford)</title>
    <link>https://pinboard.in/u:alexhansford/public/</link>
    <description>recent bookmarks from alexhansford</description>
    <items>
      <rdf:Seq>	<rdf:li rdf:resource="http://www.webcredible.co.uk/user-friendly-resources/web-accessibility/wcag-guidelines-20.shtml"/>
	<rdf:li rdf:resource="http://www.washington.edu/doit/Brochures/Technology/universal.design.html"/>
	<rdf:li rdf:resource="http://www.rnib.org.uk/xpedio/groups/public/documents/code/public_rnib003460.hcsp"/>
	<rdf:li rdf:resource="http://boxesandarrows.com/"/>
	<rdf:li rdf:resource="http://www.cs.tut.fi/~jkorpela/www/click.html"/>
	<rdf:li rdf:resource="http://www.accessify.com/default.asp"/>
	<rdf:li rdf:resource="http://www.alistapart.com/articles/perfect404"/>
	<rdf:li rdf:resource="http://joeclark.org/book/sashay/serialization/"/>
	<rdf:li rdf:resource="http://www.smashingmagazine.com/2011/02/24/designing-appropriately-for-a-startups-audience/"/>
	<rdf:li rdf:resource="http://www.1stwebdesigner.com/design/tools-browser-compatibility-check/"/>
	<rdf:li rdf:resource="http://www.pronetadvertising.com/articles/5-ways-to-building-a-better-blog.html"/>
	<rdf:li rdf:resource="http://www.webstyleguide.com/"/>
      </rdf:Seq>
    </items>
  </channel><item rdf:about="http://www.webcredible.co.uk/user-friendly-resources/web-accessibility/wcag-guidelines-20.shtml">
    <title>WCAG 2.0: The new W3C accessibility guidelines evaluated</title>
    <dc:date>2011-06-08T17:06:03+00:00</dc:date>
    <link>http://www.webcredible.co.uk/user-friendly-resources/web-accessibility/wcag-guidelines-20.shtml</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks delicious-export guidelines standards usability web</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:4197f6495ef8/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:guidelines"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:standards"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:web"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.washington.edu/doit/Brochures/Technology/universal.design.html">
    <title>World Wide Access: Accessible Web Design</title>
    <dc:date>2011-06-08T16:20:06+00:00</dc:date>
    <link>http://www.washington.edu/doit/Brochures/Technology/universal.design.html</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks WebAccessibility delicious-export software standards usability webdesign</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:43630d0c8f57/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:WebAccessibility"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:software"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:standards"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:webdesign"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.rnib.org.uk/xpedio/groups/public/documents/code/public_rnib003460.hcsp">
    <title>RNIB Good Design Home</title>
    <dc:date>2011-06-08T16:18:05+00:00</dc:date>
    <link>http://www.rnib.org.uk/xpedio/groups/public/documents/code/public_rnib003460.hcsp</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks WebAccessibility delicious-export guidelines seo usability web</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:f79d0206d5b5/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:WebAccessibility"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:guidelines"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:seo"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:web"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://boxesandarrows.com/">
    <title>Boxes and Arrows: The design behind the design</title>
    <dc:date>2011-06-08T16:08:04+00:00</dc:date>
    <link>http://boxesandarrows.com/</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks delicious-export design reference usability web webdesign</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:e1df275dc498/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:reference"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:web"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:webdesign"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.cs.tut.fi/~jkorpela/www/click.html">
    <title>Why &quot;Click here&quot; is bad linking practice</title>
    <dc:date>2011-06-08T16:02:29+00:00</dc:date>
    <link>http://www.cs.tut.fi/~jkorpela/www/click.html</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks WebAccessibility delicious-export design usability web webdesign writing</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:d3d1924922a7/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:WebAccessibility"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:web"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:webdesign"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:writing"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.accessify.com/default.asp">
    <title>Accessify.com - all the tools, links and resources you'll ever need to make your web site accessible.</title>
    <dc:date>2011-06-08T15:33:42+00:00</dc:date>
    <link>http://www.accessify.com/default.asp</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks WebAccessibility css delicious-export design tools usability web webdesign</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:a34e6deb63ec/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:WebAccessibility"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:tools"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:web"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:webdesign"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.alistapart.com/articles/perfect404">
    <title>A List Apart: Articles: The Perfect 404</title>
    <dc:date>2011-06-08T15:33:42+00:00</dc:date>
    <link>http://www.alistapart.com/articles/perfect404</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks Webmaster delicious-export design html usability web webdesign</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:c065bdede8b7/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Webmaster"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:html"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:web"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:webdesign"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://joeclark.org/book/sashay/serialization/">
    <title>‘Building Accessible Websites’ serialization</title>
    <dc:date>2011-06-08T15:33:42+00:00</dc:date>
    <link>http://joeclark.org/book/sashay/serialization/</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks WebAccessibility css delicious-export design standards usability web webdesign</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:dca05054bc44/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:WebAccessibility"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:standards"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:web"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:webdesign"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.smashingmagazine.com/2011/02/24/designing-appropriately-for-a-startups-audience/">
    <title>Designing For Start-Ups: How To Deliver The Message Across</title>
    <dc:date>2011-02-24T15:16:53+00:00</dc:date>
    <link>http://www.smashingmagazine.com/2011/02/24/designing-appropriately-for-a-startups-audience/</link>
    <dc:creator>alexhansford</dc:creator><description><![CDATA[    Start-up organizations provide an extraordinary example of chaos organized into manageable chunks. Perhaps more than anyone else, the individuals who comprise a start-up team are required to understand their team’s goals across a variety of disciplines — research, marketing, design, development, architecture, etc. — as well as their own responsibility to move the company’s overarching objective forward. Entrepreneurs must choose the direction, designers must think through the options, and developers must cull a functional product or service, all while giving feedback to and receiving it from their colleagues.
At least, that’s the idea. Most start-ups tend to take liberties somewhere along the way. Some start-ups begin with a novel business model, whereas others begin with a beautiful design. Still others try to test things out first with a functional prototype, even if it is a bit ugly. All of them — regardless of their initial approach — adapt their process over time in order to create a well-rounded product or service. And for this reason, most of today’s start-ups describe themselves as “agile.”
Agile start-ups, as the name implies, should be capable of changing their design, development and/or business objectives on a dime. This is much easier said than done — especially for today’s user experience designers. The user experience (UX) designers who work at agile start-ups are required to do two things exceptionally well: (1) grasp the intent of the product or service being developed, and (2) effectively communicate those good intentions to end users in a language they’ll understand. Neither of these is as straightforward as it might sound.
Ideally, designers will jumpstart their design process by carefully selecting well-reasoned entrepreneurs to work with; but what happens when the designer is altogether alien to the community he is designing for? The breakneck speed of agile start-ups makes it incredibly difficult for designers to craft appropriate messages to their audience at large. Only by understanding the processes and opinions that dominate start-ups can designers begin to reach out and make a difference for the end users of their product or service.
User-Centered Design, Sans UserDesigning with a clear idea of who the users are has never been simple. Most designers who have experience with the trial by fire known as a “lean start-up” will almost vehemently agree: because there are more than a few fires to fight, adopting a big-d Design process at start-up organizations is, simply put, exceedingly difficult. Invariably, this means that most start-up organizations devolve to the point that salability reigns supreme, or form trumps function. But whereas flexible, agile environments are very good for getting those things done, good design takes time, which makes the design process of start-ups almost universally hamstrung.
 Keep the levels of UX in mind. (Image: Jon and Barb)
In short, agile, user-centered design tends to ignore the aesthetic, intangible, ambient qualities that good experiences are all about. As a consequence, budding artistic directors, brand ninjas and interaction designers have been apt to worry. Without the ability to intimately understand the audience for whom they’re designing, these team members can’t do their jobs. The logical question becomes, how can they? How can designers effectively communicate with an audience they’ve yet to meet?
The textbook definition(s) of UX design yields some clue. User-centered designers are encouraged to perform design research and then create personas as well as other deliverables. Certainly those would spotlight the factors that affect a company’s relationship with its users… right? Perhaps. While research is undoubtedly necessary to the design process, its deliverables are not.
I’ve written before that designers should bootstrap their own culture of UX within an organization. In this article, I’ll take that idea one step further: in order for a start-up to effectively communicate with its target audience, a spirit of empathy must pervade its every design decision — empathy cultivated by engaging in an ongoing, outward, user-centered conversation.
Where Has All The Empathy Gone?The task of any designer who works in a start-up environment requires empathy. The designer, perhaps more than any other team member, must empathize with stakeholders (to understand the project’s business objectives), developers (to understand its technical requirements) and, of course, users (to understand the nature of the problem they’re solving), all at once. Designing with consideration for all three parties effectively frames their strife.
Valuable though it may be, however, most start-up environments discourage empathy. Consider the number of times you’ve heard something like, “We’re targeting wealthy single males, ages 45 to 55,” or “We’re just like Amazon, but for baby boomers.” Well, that’s just great. A product description like that might initially help a team grok (a word that, ironically, means “understand by empathy”) an idea, but as far as rhetoric goes, merely saying that you know what segment you’re targeting isn’t enough.
Every e-commerce company sells products. Newcomers to the space can, and often do, learn a lot by studying the desire paths paved by industry notables (indeed, entire books are written on the subject). But let’s be clear: “I want to be Amazon” doesn’t imbue the designer with empathy. Creating something that looks and feels like Amazon will, of course, look and feel like Amazon. If that website is then marketed to a wholly different crowd, then the resulting outfit will be disingenuous — the polar opposite of empathetic.
In order to create something real, unique, of lasting value and with a look and feel of its own, members of start-up teams must vacate their cubicles.
One… Erm, Three ProcessesAdding to this perceived resistance are the various processes that drive start-up organizations at any given time. A recent blog post by Whitney Hess contrasts three specific types. It’s worth noting that all of the approaches detailed below show the exact same verbs in the exact same sequence. What’s different in each is the primary action that drives change along the way.
To cite Hess:

I see a lot of products developed using the Reactive Procedure:
I’m scratching my itch.Should I keep scratching this itch?I’ll scratch this other itch.As a designer who frequently consults with agile start-ups, I concur with Whitney’s sentiments: the reactive approach (“build it and they will come”) is far and away the most common. There is, of course, a good reason for all that action: development drives change. Start-ups act in order to build an initial prototype. Prototypes, in turn, move the company — indeed, the user feedback loop — forward.
Unfortunately, the prototypes developed by most start-ups exhibit a keen lack of consideration. Who is the prototype targeted at? 40 to 50 somethings? There are certainly a lot of them. Will those 40 to 50 somethings be able to grok it? That is, will users be able to tell what it’s “all about” from the design? Because this kind of subjectivity is incredibly nebulous, prudent start-ups rely on experienced UX designers to help them uncover the answers. It’s no wonder that Whitney and I see this in our line of work.

As a user experience designer, consultant and member of the New York tech community, I instead advocate for using the Preactive Procedure:
Who’s itchy?That itch isn’t being scratched.This is how to scratch that itch.I believe that most UX designers would agree — dare I say, empathize — with Whitney’s prescribed preactive approach. Beginning with thinking — with research — is in a user-centered designer’s blood; it helps them understand their audience and voice their messages appropriately. Further still, “preactivity” appears to be the only real way for designers to gain empathy. But most start-up environments run counter to this approach. Acting and then thinking usually leaves little room for the voice of research. Has Whitney encountered a start-up that tries to reconcile the two?
As luck would have it, she has. Whitney recently worked with an entrepreneur who marches to a different beat:
Campbell McKellar, founder of Loosecubes, is the first person to make me realize that there’s something even better than the Preactive Procedure — the Proactive Procedure.

By acting sooner, you are actually achieving more. You are creating the future instead of just predicting and accommodating for it. You are inventing a new reality, based half in what people need, and half in what you want them to have. You can observe behavior sooner and course-correct. It is the most transformative of all three procedures for both the subject and the object.
An entrepreneur at heart, I want to agree here, too. The proactive process appears to be a viable alternative to the unenviable tension between designers and developers at start-ups. But just because a group is humming along with a decision-based proactive process doesn’t mean that the organization’s designer understands its users any better. By UX standards, this process almost seems to disenfranchise them: it moves “thinking” — and here, I presume, research — all the way to the back of the bus.
In sum, it’s easy to envision scenarios at a start-up in which a given development process proves more valuable, more productive, than its alternative. Should the team think, act or decide? It depends. Regardless, as designers join start-ups, they’re very likely to find that design is secondary to the process unless, of course, their organization follows a preactive process. But for most start-ups, that’s simply not the case.
In order for an organization to learn more about its users, the design-minded members must advocate to that effect, changing the way that design is approached. Designers must stand up for their part of the process. As UX designer Joshua Porter attests, “The further a designer is from the people they’re designing for, the harder it is to design for them.”
Start-ups — or more specifically, the designers at start-ups — need to get as close to users as they can. Product development can’t rest in the entrepreneurs’ and/or the developers’ hands alone.
Why Design FailsWhen asked, most designers don’t take long to provide honest, valid reasons why the design process is important to developers and entrepreneurs alike. There is firm precedent to that end, and they are designers by choice, after all. But just because the truth and beauty of good design is evident to most designers doesn’t exactly mean that their colleagues share their sentiments.
If it isn’t making Dollars… (Image: Kristian Bjornard)
Start-ups — and more importantly, the individuals who comprise them — have a great number of mental hurdles standing in the way of their empathy with end users. The aforementioned quickened pace and changing processes aside, here are those hurdles:
Start-up teams have strong convictions. Anyone who believes strongly in a cause (be it an idea or a Web application… or both) will identify with it. If a designer questions the validity of an idea, then they are questioning the team. This is a difficult, integral part of the design process.Research doesn’t (immediately) sell. It doesn’t take weeks of research to sell a product to someone, and given enough time a good marketer can sell anyone almost anything — especially something beautiful. As a consequence, team members are likely to judge the design book by its cover. Research rarely affects their notion of beauty.Start-ups trust results they can measure (preferably in dollars). Web metrics are currently the bread and butter of today’s Web-savvy marketers. Saying that a design is good is one thing. Saying that a design has increased conversions by 200% is another. Attaching a number to something makes entrepreneurs (and, yes, designers, too) feel better about the problem being addressed. If the current process is measurable, should an up-front design process be allowed to slow that down?In sum, short-term, yes-or-no, go-or-no-go (Decide! Act!) thinking pervades the start-up space. The reality is that most agile start-ups favor a “design-less” process. While UX designers might trust that empathy (or understanding) is tantamount to a start-up’s success, their teammates won’t necessarily believe so. In order to effect change, designers must fight for the integrity of their design from the inside out.
Leading The Way With EmpathyTo be clear, good design doesn’t come about at start-ups just by studying the metrics generated from a prototype or by talking to users through a proxy — say, support emails. That isn’t to say that these things aren’t valuable — they certainly can (and often do) point to the consequences of prior decisions. But feedback, by definition, cannot determine the company’s next — or, more importantly, first — steps. There’s the rub. Unfortunately, that is the problem routinely faced by start-up designers.
Create Empathy and Inclusion. (Image: Kristian Bjornard)No one would argue that determining what’s “good” for a Web design is subjective, which makes it a frightening prospect. As D. Keith Robinson wrote on A List Apart all the way back in 2005:
Knowing what people want on the Web can be hard. You either need to have incredible empathy or have done fairly extensive research. This empathy I’m talking about, in my opinion, can really only be built up over time observing all kinds of people doing all kinds of things on all kinds of websites and applications. Even then, as you move from project to project, the people, problems and needs change.
With every new project comes a new target user, a new person to empathize with. And just as with meeting a new person, understanding what they like and don’t like takes time. If designers are to appeal to this new person, they first have to get to know them. As both Whitney Hess and Cennydd Bowles have asserted, focusing on a rapid proactive process — decide, act, think — gives most start-ups a solid plan of attack. Not only do teams get to test market viability first, they can then think about how they’ll differentiate the product shortly thereafter.
Yes, this process makes brand-conscious designers uneasy, and understandably so. In the beginning, though, without the context that a prototype creates, designers must lean towards the relatively “safe” side, where all interaction design begins: buttons look like buttons, drop-downs look like drop-downs and perhaps even the names of start-ups sound like start-ups. Robert Hoekman, Jr. calls this Designing the Obvious. I call it designing the boring bits.
Because what this approach makes up for in usability, it certainly lacks in propriety. To determine what’s appropriate (which is subjective), designers must conduct field research.
Hold Your Own ConvictionsPlenty of UX designers preach preactivity; they are the ones who want to understand — to empathize with — their audience and build something tailored to them. Moreover, these designers have the relative luxury of working within organizations. For them, Cennydd Bowles and James Box have written a lovely book, Undercover User Experience Design. If you’re at a company where design is ailing and you want to fix it, I suggest picking up a copy right away.
If you’re an independent consultant or a designer working with a start-up that’s out to craft the best possible experience, then I would suggest a couple of things, all centered on the same concept, which is to make listening a part of the company’s design process:
Create a design strategy. Articulate who you’ll be designing for (even if they’re only make-believe) and how they’ll use the website. I’ve written before how I do this. Regardless of how you do it, know who you’re trying to know.Have a solution. Work with a development team to generate a quick prototype that demonstrates your best (albeit uninformed) solution. Have at least two people use the prototype the way it is intended to be used. Befriend them, and see if they’ll contribute feedback as you refine your vision.See for yourself. Finally, and most importantly, see for yourself. Visit your users in their natural environment, and make sure their concerns are addressed. If you’re in a position to do this, ask them questions related to the problem your start-up addresses.In all cases, start-up designers should center their design process on listening to users. Instead of speaking to users by way of the design, converse with users to inform the design. Empathy, the human connection, makes or breaks an informed experience.
Because most of us work behind computers for hours, days or weeks at a time, gaining empathy is obviously easier said than done. However, empathy is the only way to turn a good business idea into a well-articulated design conversation. Respect is earned, a brand is born, when every interaction that an organization has with its users is open, earnest, honest and, most of all, appropriate.
Related ResourcesGetting Real About Agile Design, Cennydd Bowyles on A List ApartPersonas and the Advantage of Designing for Yourself, Joshua Porter on BokardoThe Complete Beginner’s Guide to Design Research, Andrew Maier on UX Booth Our Misguided Focus on Brand and User Experience, Jon KolkoEmpathy and Web Design, Janko JovanovicGiving Users Some Credit, Jeremy Girard on Design Informer“CopyCat Design” and “UX Won’t Save You,” 52 Weeks of UXAlan Cooper’s keynote, Agile 2008Usability Experts Are From Mars, Graphic Designers Are From Venus, Curt CloningerPersonas?, Ask 37signals5 Design Decision Styles. What’s Yours?, Jared Spool on UIE.com(al) (sp)
© Andrew Maier for Smashing Magazine, 2011. | Permalink | Post a comment | Smashing Shop | Smashing Network | About Us Post tags: usability, ux 

]]></description>
<dc:subject>Design usability ux</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:3a7b4a964159/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:ux"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.1stwebdesigner.com/design/tools-browser-compatibility-check/">
    <title>10 Useful Tools For Cross-Browser Compatibility Check</title>
    <dc:date>2011-02-17T10:00:57+00:00</dc:date>
    <link>http://www.1stwebdesigner.com/design/tools-browser-compatibility-check/</link>
    <dc:creator>alexhansford</dc:creator><description><![CDATA[Something that makes a website great  is when it is compatible in multiple browsers regardless of version. Technically this is referred to as cross-browser compatibility.

Wikipedia defines cross-browser as:

The ability for a website, web application, HTML construct or client-side script to support all the web browsers.

Now, you may be confused on what is the difference between cross-browser and multi-browser.

Multi-browser means a website will work in several web browsers like Safari, Chrome, Firefox, Internet Explorer. While cross-browser means a website works in any browser, and any version of the browser, being used.






Image by: lagiamd

This can be a struggle for developers throughout the creation of their websites. If a user cannot view your website properly, he will not blame the operating system or his browser…he will blame the website itself. The goal as developers is to avoid that. That’s why there are tools available for free, or purchase, to make your cross-browser checking easier.

In this article you will find ten useful tools that you can use for your cross-browser compatibility check.

1. BrowserShots
BrowserShots is a free cross-browser tool that captures screenshots of the website in different browsers. This is the best known and the oldest cross-browser tool used by developers.

The browsers it supports are:


Google Chrome
Dillo
ELinks
Epiphany
Mozilla Firefox
Galeon

and more…

The operating system it supports are:


Linux
Windows
Mac
BSD

 

 



I read some feedback on the site and there are two things that appear to need improvement. The interface could be better. Though you just have to tick the checkbox, it will still take a lot of time to check all the boxes for the browser and browser versions you want to view your website in. The other thing people don’t like  is that sometimes the tool is slow.

 

2. IE Tester
If you are a developer who is in need of a tool that just supports Internet Explorer, then this tool is for you.

IETester, a free web app that allows you to see the appearance of web pages by using Internet Explorer 5.5, 6, 7, 8 and 9. Its interface resembles the interface of MS Word 2007.



I tried using this software and I have found that it does not respond well and should be debugged. I think it might be because of the operating system I use, Windows 7. If you also encounter this problem, you can refer to this page.

3. DotMobi Virtual Developer Lab
Do you need a cross-browser tool dedicated to device testing? Then you should check out this tool.

DotMobi Virtual Developer Lab is a free web-based tool that lets you check your websites on real devices including iPhone with the use of remote access technology.



To use this service, you need to have a credit card. This is for the purpose of preventing abuse of the devices.

4. Adobe Browser Lab
Adobe Browser Lab is an online tool for cross-browser checking. It shows screenshots of the website when viewed in different web browsers. This simple tool lets you compare results by displaying screenshots of web pages in a simple way.



How does BrowserLab work?
When the BrowserLab testing page loads, you will be asked to enter the URL of your website. After that, it will automatically render the screenshot. If you are using Windows, the default browser it uses is Mozilla Firefox 3 – OSX. Its interface is great because it shows the percentage it has already loaded. You can instantly change the browser by choosing from the drop-down menu or from the list in the middle of the interface.

You can also choose how you’d like to view the webpage: 1-up View, 2-up View, Onion Skin. 1-up View is when you just want to render a screenshot in a single browser. 2-up View lets you get screenshots of two browsers, and Onion Skin gives a screenshot of overlapped images of two browsers. This way, you can see the differences between them.




Comparing this to other cross-browser tools, it lacks support for operating systems such as Linux and other web browsers. For a free tool, the interface and current features are useful for daily use.

5. CloudTesting
CloudTesting is a tool that enables web developers to view a website using any of  the web browsers listed below.

The browsers it supports are:


Internet Explorer 6, 7, 8
Mozilla Firefox 3, 3.5, 3.6
Apple Safari 3.2, 4.0, 5.0
Google Chrome Latest Version
Opera 9.6



Features:

For Web Developers and Testers

Find issues earlier. Test your current work in progress in multiple browsers at the same time, allowing you to find issues earlier in the development process.
Multi browser. Compare what the website looks like in multiple browsers side-by-side.
Comparison Tools. Compare how the same webpage displays in two browsers using an ‘Onion-skin’ overlay tool.
Automated. Tests can be scheduled to run at regular intervals, freeing you from the tedious task of manually running them and storing the results.
Repeatable. Tests are repeatable day after day to track changes made to the website.
Verify all areas. Verify areas of your site not available to standard cross browser testing tools, such as shopping carts and search results.
Full debug. Have access to historical component information and timings, including HTTP requests and response headers, just like you get in Firebug, but stored by CloudTesting.

For Website Managers

Compare in multiple real browsers. See how your e-commerce or transactional website will look in a variety of browsers at the same time.
SaaS. There is no need to deploy multiple servers or virtual machines for your cross browser testing.
No administration. Browser versions and Operating Systems are kept up-to-date by Cloud Testing.
Reduced development times. The ability for cross browser testing to be scheduled on a regular basis, drastically reduces web development life cycles.
Earlier fixes. A key time-saving feature is the ability to look back over time and see when a defect was introduced, meaning earlier fixes.
Pay for what you use. The PaYT (Pay as You Test) model gives you the ability to cope with peak demand whilst not paying for it during quiet times.
Peace of mind. Give yourself peace of mind by running a sanity check in multiple browsers before launching a new website.

For pricing, check this link.

6. Browser Photo
Browser Photo gives you actual photos of how your web pages will look in different web browsers and platforms.

Service Details:


Browser Photo helps avoid display differences by showing you actual photos – not emulations – of your pages taken on 12 different browser and computer configuration combinations!
It’s Affordable! Building a test laboratory to get the same information that Browser Photo provides would cost at least $4,500.
Catch Errors Made By Your HTML Editor. Often FrontPage HTML works with Internet Explorer, but not other browsers. Browser Photo spots these problems.
Web Designers, show your stuff. Print-friendly reports show clients or bosses what you’ve done! Check out the Web Designer packages.
Browser Photo is an automated, easy-to-use tool that requires no downloads or installation and is continually updated.
Online Access Anywhere, Anytime. Through an internet connection, you can test your Web pages 24 hours a day from anywhere around the world.

 

7. Browsera
Browsera is a tool that tests the cross-browser layout of your website. You will see the differences and errors on your site.

Features:

Discover Cross-Browser Layout Problems Automatically
This feature of Browsera gives you a notification of possible problems the tool finds while testing your website. Instead of checking each screenshot, you will get a report that gives details on which pages of your site have possible problems.





Locate JavaScript Errors
Browsera is also capable of helping you find problems caused by scripts on your site. We know that scripting errors are a big viewer turn-off and that’s what this feature wants to resolve. Every time a page is rendered, this tool checks if the browser encountered any errors. After checking, it will give you a report showing the results.





Easily Test Entire Sites
This tool tests your website. Not just a page at a time, but your entire website. This means it takes less time to test and find errors, and since it tests the entire site you don’t have to worry about missing a page during the testing process.





Test Pages Requiring a Login
Browsera lets you log in first before testing your site. Very secure, right? It supports both HTTP basic authentication and application based logins, as well.



 

No Installation Required
Yes, no installation required. Everything that Browsera needs to run comes from their server cluster. All you need to have is a web browser and an internet connection. Ideal for developers that work remotely.



 

Test Dynamic Pages
Browsera can work with dynamic pages so if you use technologies such as  AJAX and DHTML, this will not be an issue. Browsera will wait until pages are loaded prior to the testing process.



8. CrossBrowserTesting
CrossBrowserTesting is a tool that tests your website with a browser and remote VNC. With these tools, you can test your AJAX, JavaScript and Flash with any browser. You just have to provide the URL, select a browser then run the software.

To view their demo, click here.

The browsers it supports are:


Android Browser
Chrome Google 5 to 8
Dillo 0.8.6-i18n
Firefox 1.0 to 4 Beta
Internet Explorer 5.0 to 9 Beta
Mobile Safari
Mozilla 1.7
Opera

and more…

The operating system it supports are:


Android
iPad
iPhone 3GS
iPhone 4
Mac OSX 10.5.7
Mac OSX 10.5.8
Mac OSX 10.6
Ubuntu 8.10
Windows 7
Windows 98 SE
Windows XP SP2
Windows XP SP3
Windows Vista



This tool offers three plans to choose from and a free trial.

9. BrowserCam
An online paid service that allows developers to view web pages on different browsers and operating systems. It also supports mobile operating systems and browsers. This tool takes screenshots of your pages depending on your choice of browser and operating system.



Browsercam Browser Capture

The browsers it supports are:


Internet Explorer
Mozilla Firefox
Apple Safari
Google Chrome
Opera
Chrome NXS 2.3
Explorer 5.0 (RQVGA)
Opera 9.7b

and more…

The operating systems it supports are:


Mac OSX 10.3–10.5
Windows 98
Windows 2000 Professional
Windows XP
Windows Vista
Fedora Core 6
BlackBerry O 5
BlackBerry OS 6
Apple iOS
Google Android
Windows Mobile 5.0 (RQVGA)
Windows Mobile 6.0
Windows Mobile 6.5



BrowserCam Device Capture

With the device screen capture service, you can see how your site will look on PDA’s and other devices. You can capture the screen in portrait or landscape mode.



BrowserCam Remote Access

The remote access service lets you log into BrowserCam with the use of VNC. For example: you are using Windows XP and you need to access a Mac platform, you can use this Remote Access service to test it on a Mac right on your Windows PC.



When you visit the BrowserCam site, you will see a variety of plans offered. Though it’s expensive, it is worth the money.

10. Microsoft Expression Web SuperView
Microsoft SuperView is a new technology created to make the life of developers easier.



The standalone version of this software supports only IE web browsers, while the full version can support Mozilla Firefox and Apple Safari browsers.

Based on the feedback I have read, users are satisfied with its features. It gives them comfort in regards to its response time and it is user-friendly. Note that you cannot use this without having the Expression Web.

Share Your Thoughts!
These are some of the best tools you can use for cross-browser checking. I hope that you find some of these tools useful when designing and developing your next website.

Do you already use some of these tools? Please share your experience with any cross browser testing tools with us in the comment section.

]]></description>
<dc:subject>Tools Usability Web_Design compatibility Cross_Browser</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:2053ea8fa958/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Tools"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Web_Design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:compatibility"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Cross_Browser"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.pronetadvertising.com/articles/5-ways-to-building-a-better-blog.html">
    <title>5 ways to building a better blog</title>
    <dc:date>2006-09-15T21:08:17+00:00</dc:date>
    <link>http://www.pronetadvertising.com/articles/5-ways-to-building-a-better-blog.html</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks blog delicious-export howto tips usability writing</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:94381645d619/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:blog"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:howto"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:tips"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:writing"/>
</rdf:Bag></taxo:topics>
</item>
<item rdf:about="http://www.webstyleguide.com/">
    <title>Web Style Guide, 2nd Edition</title>
    <dc:date>2006-06-04T15:20:17+00:00</dc:date>
    <link>http://www.webstyleguide.com/</link>
    <dc:creator>alexhansford</dc:creator><dc:subject>Bookmarks Webmaster css delicious-export design reference style usability web webdesign</dc:subject>
<dc:identifier>https://pinboard.in/u:alexhansford/b:c7c9d7a51707/</dc:identifier>
<taxo:topics><rdf:Bag>	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Bookmarks"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:Webmaster"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:css"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:delicious-export"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:design"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:reference"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:style"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:usability"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:web"/>
	<rdf:li rdf:resource="https://pinboard.in/u:alexhansford/t:webdesign"/>
</rdf:Bag></taxo:topics>
</item>
</rdf:RDF>