Writing for the Web: 3 Useful Guidelines

First, two quick reasons lists are so popular (you can find a whole slew of lists that explain why lists are so popular) and then one reason why you want to use them as a small business owner.

They’re easy to read and comprehend

You’ve probably heard it by now, if not from me by someone else, that users rarely read word-for-word and rather scan the page. Their eyes search for highlighted keywords, meaningful subheadings, bulleted lists, and will potentially speed-read your introduction or conclusion paragraph if you’re lucky. There are nearly countless accounts outlining this phenomenon from Nielsen to Steve Krugg. This fits nicely into why those Buzzfeed-esque articles are so wildly popular on the Internet today—we love scanning. Take a moment to think, have you taken the time to read the contextual paragraphs underneath the lists or do you just read the headlines and move on?

People enjoy having their suspicions proven

While this reason is a bit more anecdotal, social media seems to prove this point on a daily basis. Surf through your feed on Facebook and Twitter and you’ll undoubtedly come across a shared list from a friend who thinks “reason #4 is eerily accurate.” When one succumbs to lure of these clickbait lists, isn’t it always to see if our preconceived item is on that list and we’re either ecstatic that it aligns with our suspicions or dismiss the credibility of the author and walk away frustrated because it doesn’t align with our bias.

Lists drive people to your site

Without a doubt. Aren’t you here now? Lists are popular in our culture today. We enjoy the quick satisfaction of having our biases affirmed and we love being able to quickly and effectively skim large amounts of information. So, why aren’t you creating your content for easy consumption? No one would encourage you to remove all of your meat and potatoes from your website. That’s bad; however, there is something to be said about this trend (a trend that has been fairly steady throughout the history of the Internet).

1. Use bulleted lists when possible

Eye tracking and usability studies have proven that people who use websites are drawn to bulleted lists. Use them when you can to draw users to important information about your business and services. It will help people scan large sections of information and know whether or not the information is relevant to what they are looking for.

2. Link or bold key words

If you visited the previous Nielsen Norman Group article, you’ll notice that they practice all three of these suggestions. It’s not by accident. They link and bold keywords throughout their articles. This helps scanning and enables users to quickly find relevant bits of information. Rarely will people read the entire article; they will, however, scan it for information they themselves believe is pertinent.

3. Use descriptive and meaningful headings

You should be using headings on all of your pages. Not only does it help readers find what they want to spend time on, but it always lets Google and other search engines know what your page is about. Using proper headings and injecting your keywords will help users find your information organically and through search engine searches.

Good Example of How to Create a Webpage
You’ll notice that they use bulleted lists, bold key words, and use headings to help users find the information they’re searching for.

Usability Problems Confirmed with Form Placeholders

Today Nielsen Norman Group released an article confirming my fears for placeholders. Katie Sherwin addresses seven issues as to why placeholders are not optimal for usability.

  1. Replaced text reeks havoc on users’ short-term memory
  2. Reviewing completed forms (without traditional labels) becomes impossible
  3. With no labels, errors become increasing hard to fixespecially with fields with similar content
  4. Keyboard interactions can become problematic
  5. Fields with content in them are less noticeable
  6. Users can consider placeholders as auto-filled data
  7. Poor implementations can require additional work for users

Even if you use placeholders in conjunction with normal form labels, as I had in the past, you can’t get over the fact that during testing users’ eyes were drawn to empty fields.

“At the minimum, users will spend more time locating a non-empty field–a nusiance. At the worst, they will overlook the field completely–a potential business-killing disaster.”

With usability at the forefront of my mind when developing web forms, adding cognitive load and additional time to users’ tasks is unacceptable. Adding placeholders in order to save room or make my design cleaner at the cost of ruining the user experience is unacceptable.

Possible Solutions

There’s a new design pattern that has been gaining some traction within the design community that has been lovingly titled Float Labels. In this pattern, the placeholder is both visually and semantically the label for the form. This provides clear context for the user when filling out the form, but produces additional issues.

  • Small labels may cause trouble for users with visual impairments
  • Poor implementation may break the semantic label use rendering this approach useless for accessibility
  • Users may still mistake placeholder data for auto-filled data
  • Users are still drawn to empty fields
  • Doesn’t solve the issue of providing additional information for a field as you are now using the placeholder just as a label, not an example or additional instructions

As always, it is necessary to consider each implementation for every project you do. There may be a time where good implementation of the float label design pattern will benefit you more than hurt you. Here are some resources if you’re interested in learning more about this new pattern that attempts to solve this usability issue.