The Feel of Quality Online

Discuss the feature articles on the Tech Home Page.
User avatar
McDanielCA
Member
Posts: 486
Joined: Wed Jul 18, 2007 4:38 pm
Location: Salt Lake City, Utah

The Feel of Quality Online

#1

Post by McDanielCA »

The Feel of Quality Online was originally posted on the main page of LDSTech. It was written by Chris Mayfield.

----------------------------------------

When you shut the door of a new BMW, you hear a gratifyingly solid-sounding thump. It feels good to pick up a small, unassuming digital camera, only to find that it is surprisingly sturdy and heavy. Many companies who make physical objects use fine materials and many other techniques to give their products a sense of quality and craftsmanship.

In a world of cheap plastic and sloppy details, I’ve noticed that the feel of a nicely handcrafted object brings me much gratification—and sometimes even endears an object to me. This realization has made me wonder, “What is the Web equivalent?”

The Web’s expansion has exploded. In fact, over the last ten years, the number of Web sites has grown from a few million to somewhere around 150 million. With so many new Web sites being created daily, it becomes difficult for people who are involved in creating Web sites to find and identify a quality Web experience. It’s easy for our Web experience expectations to become low.


Even though a Web site isn’t something you can pick up and feel, there are many effective ways you can create the feeling of quality. The following attributes are just a few of the tips and tricks that I have found that work together to give a Web site that feeling of quality.

Sticky Stories

It’s common to read short bullets online. I have heard countless times that people don’t read online. Yet Wikipedia is all about reading and is tremendously successful! When Web sites use stories, they improve the experience and begin to create a tangible, even long-lasting impression.

Companies like Nike, Apple, and Adidas create stories around their products all the time. In a recent campaign, Nike created a story around one of their basketball shoes that suggests the shoe is so good that it will break the ankles of opponents. This memorable parody uses imagery from your existing knowledge as a basketball fan, which makes the story simple to tell. A picture and a headline or two are all it took to communicate an otherwise exhausting amount of bullet points.

Stories often rely on imagery to paint a more vivid and memorable picture for the user. However, if Web sites aren’t wise with their use of photography, the opposite can occur. Pictures that don’t make sense, poor-quality photography, complicated imagery, or images that take a long time to load can all lead to a very disappointing experience.

Great Typography

Great typography can quickly bring a feeling of quality to your Web site and can solve many interaction problems. Typography can also compensate for visuals when having a photograph or illustration doesn’t fit.

Hierarchy, choice of type (however limited it may be), line height, and color all work together to the detailed typographer to turn letters into beautiful communication. I have found that fine tuning typography details has been a labor of love rather than a skill I picked up after a reading good book on typography.

A few months ago, I asked readers of northtemple what quality feels like online, and many of the comments referred to type. Jared Christensen said it like this: “Nothing says quality like a Web page that treats type like a first-class citizen."

Humanistic Experience

Most Web experiences have difficult requirements. For example, can you think of a Web project you have worked on where there wasn’t a tight budget, a database, or a difficult framework to work within? In addition to technology, most Web projects have various team members with differing opinions, all trying to work together to create something wonderful. When the technology and the organization that support the Web site are completely invisible, it becomes a more human experience. Consider this analogy:[INDENT]You’re driving down a long, curvy road. The top is down and the weather is perfect. It’s just you, the road, and your favorite song bringing a smile to your face. Why should you be bothered by all of the magic going on between the gas pedal and the wheels? Who cares what great achievements the designers and engineers of the car made? When you find a car that drives well, the mechanical details are not important.
[/INDENT]Similarly, when Web sites have technical requirements and constraints that work well and fit together as a whole, it also brings a smile to my face.

I have also found that when you create aesthetics that feel organic and natural, the whole experience feels more humanistic. Emmy Southworth, a fellow design manager at the Church of Jesus Christ of Latter-day Saints, said, “It goes beyond [my needs being anticipated] for me, in making the entire page a gratifying experience – the buttons, navigation, interactions, colors, composition, flow, typography, content. When everything works together seamlessly so that I don’t realize there is a machine and code working behind the scenes, I can experience something human and beautiful. To me, that is quality.”

Intuitive Interactions

Ever spend several minutes trying to find an available user name for a Web application? You type in your user name, only to find out after a while that your clever name is taken. Then you try again—and again. Finally you are left with a user name like “chris9402.” At that point, you really don’t care about a user name and password that you will never remember because you probably won’t revisit the site.

Contrast that with the way some Web sites and applications now check your user name and password as you type. That kind of simple interaction clues me in to the attention to detail the creators had for the site and for my experience. Even the simple details like placing the cursor in the first box when you are filling out information just helps things become more intuitive.

Empathy for Your Customer

Creating experiences that use all of the elements that can create long-lasting appeal and loyalty to your product takes a lot of empathy. Many details might seem trivial, but when they are added up at the end, the sum of the parts creates a lasting impression. Pete Lasko, another fellow design manager, put it best when he said, “Quality is expressed by the care you take in all aspects of your site. People who are serious about making good Web sites care about markup and CSS. Each little pixel gets consideration. We care about the flow, the interaction, the emotional content of our pages.”

In the end, quality online means being focused on the people who are going to use your Web site. Sometimes it means staying out of their way. You become invisible. Other times it means creating an experience that brings loyalty beyond reason. Whatever project you’re working on, put your passion into your work and pay attention to the details.

Chris Mayfield is a design manager for the Church.
rmrichesjr
Community Moderators
Posts: 3827
Joined: Thu Jan 25, 2007 11:32 am
Location: Dundee, Oregon, USA

#2

Post by rmrichesjr »

McDanielCA wrote:...
Contrast that with the way some Web sites and applications now check your user name and password as you type. That kind of simple interaction clues me in to the attention to detail the creators had for the site and for my experience. Even the simple details like placing the cursor in the first box when you are filling out information just helps things become more intuitive.
...
The article has many good points about quality and user interaction. Two contrary nits in the quoted paragraph caught my eye:

A web site that checked my password one character at a time while I typed it would raise the hair on the back of my neck, because that would indicate a high likelihood that the password was stored internally in plain text, not hashed. Plain-text storage of passwords is a serious security problem. A site that did that would have to be essential to my survival for me to go back to that site.

While placing the cursor and focus in the first box makes sense on a page whose primary purpose is a form to fill out and submit, it can cause problems if done on a page that is more likely to be read by scrolling or paging, because it can inhibit the usual scrolling or paging mechanisms. Some news stories do that, and I don't bother reading them. If I can't readily see the second and any later pages of a story, the story must not be worth reading.

Back on the subject of web quality, I am very impressed with the visual appeal and generally high quality interaction on lds.org and the new FamilySearch system.
User avatar
mkmurray
Senior Member
Posts: 3266
Joined: Tue Jan 23, 2007 9:56 pm
Location: Utah
Contact:

#3

Post by mkmurray »

rmrichesjr wrote:A web site that checked my password one character at a time while I typed it would raise the hair on the back of my neck, because that would indicate a high likelihood that the password was stored internally in plain text, not hashed. Plain-text storage of passwords is a serious security problem. A site that did that would have to be essential to my survival for me to go back to that site.
That's not the whole of it either. If there was immediate feedback on whether the currently typed characters are correctly matching the first few characters of your password, then it would take mere minutes (or even seconds if programmatic) to guess anyone's password just by brute force. The beauty of a rejected password on typical sites is that they don't tell you how close you are to being authenticated, even if you are just one character off. That unknown is a form of security.

But, as I reread the author's comments, I don't actually share the same interpretation of his statements as you did. I think the author was talking about usernames and passwords being checked as you type upon registration, not login. I gather this from the way those two pieces of identity were talked about in the previous paragraph, speaking of the frustration of finding an unused username. I personally believe the author meant how as you type your username is checked for uniqueness and also how your password is checked for strength (and that the "retyped" password matches the first) before you even have to hit the Submit button.
rmrichesjr
Community Moderators
Posts: 3827
Joined: Thu Jan 25, 2007 11:32 am
Location: Dundee, Oregon, USA

#4

Post by rmrichesjr »

Two very good catches. If the password was checked a character at a time when logging in, that would allow a brute-force attack in linear time rather than exponential--very bad. I hope you're right that the author meant the per-character checking was done during registration rather than during login.
russellhltn
Community Administrator
Posts: 34417
Joined: Sat Jan 20, 2007 2:53 pm
Location: U.S.

#5

Post by russellhltn »

I remember seeing a site that evaluated the strength of the password I was creating in real-time.
Have you searched the Help Center? Try doing a Google search and adding "site:churchofjesuschrist.org/help" to the search criteria.

So we can better help you, please edit your Profile to include your general location.
User avatar
Mikerowaved
Community Moderators
Posts: 4734
Joined: Sun Dec 23, 2007 12:56 am
Location: Layton, UT

#6

Post by Mikerowaved »

rmrichesjr wrote:If the password was checked a character at a time when logging in, that would allow a brute-force attack in linear time rather than exponential--very bad.
It's still an exponential number, unless the attacker could receive some sort of confirmation after each character and I doubt any site would do that. Think of the way WHOPPER found the launch codes in War Games. It just doesn't work that way.
RussellHltn wrote:I remember seeing a site that evaluated the strength of the password I was creating in real-time.
There are a lot of major sites doing that now.
So we can better help you, please edit your Profile to include your general location.
User avatar
mkmurray
Senior Member
Posts: 3266
Joined: Tue Jan 23, 2007 9:56 pm
Location: Utah
Contact:

#7

Post by mkmurray »

Mikerowaved wrote:It's still an exponential number, unless the attacker could receive some sort of confirmation after each character and I doubt any site would do that.
Indeed, we were talking about that "unless" case. However, I still think the original author of the article meant real-time password checking on registration and not during login.
kennethjorgensen
Community Moderators
Posts: 427
Joined: Mon Sep 10, 2007 1:29 am
Location: Alnwick, UK

#8

Post by kennethjorgensen »

rmrichesjr wrote:Back on the subject of web quality, I am very impressed with the visual appeal and generally high quality interaction on lds.org and the new FamilySearch system.
I agree 100%.

Does anyone know why the font on the menu on the left (top level - "About the church....etc") look different to the rest (like the second level or the top menu)?

Or is it just me?
rmrichesjr
Community Moderators
Posts: 3827
Joined: Thu Jan 25, 2007 11:32 am
Location: Dundee, Oregon, USA

#9

Post by rmrichesjr »

dkjorgi wrote:I agree 100%.

Does anyone know why the font on the menu on the left (top level - "About the church....etc") look different to the rest (like the second level or the top menu)?

Or is it just me?
It's not just you. When I view the top page at lds.org, the top-level menu in the upper left uses a serif typeface while the second-level menu and the group of links on the very top of the page use a sans-serif typeface. (See http://en.wikipedia.org/wiki/Serif for more about serifs.) I have read serifs increase reading speed.

I haven't looked at page source to see any more detail. I hadn't noticed that difference until you mentioned it. I don't know whether the difference is deliberate or accidental.
MayfieldCK
New Member
Posts: 2
Joined: Mon Dec 18, 2006 9:38 am

#10

Post by MayfieldCK »

Yes that would totally be creepy if it stored your password. That was written incorrectly. I meant that it only would search the username you were trying to create not the passoword.
Locked

Return to “Featured Article Discussions”