Tag Archives: web design

Mind the Attention Economy . . .

. . . Some Ideas for Effective Portfolio Pages

Imagine the following five visitors to the pages on your professional portfolio.

  1. The Viewer: This visitor only “looks” at the contents of the page–like a shopper at the bookstore looks at the cover of a book. On the landing page, he looks at the title and subtitle at of the site if any, then notices the overall layout and design of the page, and perhaps any widgets and navigational or design functions or features in the margins; if he doesn’t close the window/tab but goes to any other page, his attention span may increase–especially based on how well your site tries to convert this visitor into Type 2 below–but there’s no guarantee. For this visitor, the amount of content on the page he’s looking at and the number of pages/subpages on your site are like the thickness of a book he picks up or looks at without even taking it off the shelf. So, remember that especially if you rely on the quantity and quality of content alone–that is, if you don’t use the overall design/layout of the page to make a professional first impression, if you don’t chunk/organize the text so it’s inviting to read, utilize visual elements such as headings and vertical/horizontal space to make the content accessible, etc–this visitor may exit from whatever he’s looking at. Like it or not, this visitor is likely to represent 70-80% of total traffic on your portfolio.
  2. The Skipper: Especially if you make the site impressive and its content accessible, this visitor may spend a little more time and skip from one section/feature to another in order to get a sense of what those sections/features are about. She may decide to stop at certain parts and read a sentence or two more carefully, but don’t expect her to read full paragraphs.
  3. The Skimmer: Other than getting a sense of what the site is about from the above types of attention, and besides reading the headings/ subheadings if any, this visitor may also read the first lines of your paragraphs, shorter bullet points or visually highlighted texts. Their objective may not be to understand all of what you say but to get the main idea. Foregrounding is critical if you want to help this kind of visitor, who may represent 5-10% of visitors on your portfolio.
  4. The Scanner: Beyond looking around and getting a visual impression, and beyond skipping and skimming through the content of the page, this visitor may actually try to find specific information on the page. You can assume that this person is interested in you, but he will not read everything line by line, word by word.
  5. The Reader: Especially if you have designed the page and organized the content to engage the visitor, you can now imagine a minority of visitors who will go from #1 to 2 to 3 to 4 and be someone who finds the time and interest to read the all or most of the content of your page. But remember that even this person is more likely to read the content if the content is organized and accessible. Contrast, font type and size (though this is determined as much on the visitor’s side as on the writer/designer’s), and such other elements will also influence the visitor’s engagement with the page.

You can also imagine that the above are the levels of engagement through which the same visitor may go through on your site. But DO NOT assume that in the attention economy of the web, the default reader is one who will read what you write.

A lot of students who are used to writing for the teacher (who will not only read the entire text but also often read rough draft, provide comment, etc) tend to not realize what happens when the reader is a “visitor” on the web.

Often “good writers” in college are those who used to read (and often continue to read) a lot of fiction, and many of these writers seem to approach both academic writing and writing on the web as if they are established writers. They tend to play creative “tricks” on the reader, saving up the punch line for the end of paragraphs and the juiciest idea for the end of the essay–expecting readers to read all the details, to follow their train of thought, to hold on to disjointed pieces of information, to make the connection, etc. They seem to not realize that readers for what they write on the web are not the same as people who have decided to read a novel, found the time, and probably put away other things that would demand their attention.

So, instead, I tell students to imagine the following. Say it is 9pm and the person who is about to read your professional portfolio also has three projects whose deadlines are looming. She hasn’t had enough sleep for several days,  and she lacks the energy to focus on anything. Because she wants to be updated on people and projects, she has a Facebook app/tab on her computer. She also has the habit of occasionally picking her phone to see if she has new mail or text. And it is on that computer that the “visitor” of your professional portfolio may be reading what you write. This visitor may be a potential employer, or it could be someone who is trying to learn more about you.

Now, how much you write, what you include, and how you organize the information on your pages should depend on how you imagine readers like the above will engage with your writing.

Given the attention economy of the web, you should let the visitor know what your site is about (with a title and subtitle), directly speak to them where appropriate, provide visual cues, organize text and use vertical/horizontal space in order to make it highly accessible, foreground the main points, and use toggle or link to new pages as necessary. Do not ask/expect the visitor to visit your sub-pages if you can effectively present your information within the same page. Make sure that the visitor knows how they’ve been navigating the site. Provide references and links where appropriate.