I’m obsessed with the idea of duly respecting those who read my work. Other people, with their own lives and deadlines and priorities, investing some time – and focus – in my words. There are endless other things they could be doing, yet briefly, they’re here.
The same is true for the people who read your work. I’d like to talk about some of the ways you can design your site to give readers the respect they deserve.
I have a list of metrics that I automatically – even subconsciously – use when visiting a web site, to determine whether it’s worth my focus. Am I just a pair of eyeballs, or is this author really speaking to me? Have they given due thought to showing their work in the best light, or just thrown it up there? You can tell a lot about how a site’s author, or owning company, feels about you by how they balance the various tensions of design, content, monetisation, functionality, audience retention, and more.
I think there are three main ways that you can duly acknowledge the reader’s investment in your work. Let’s talk about those one by one.
For me, the most valuable thing a reader chooses to give you is their attention, for however long they’re reading your site. We like to say that time is the most precious commodity, but the reason that time is precious is that we have a limited period in which to experience the world. It’s not the time per se, but rather the opportunity cost of focus.
Reading is an immersive, focused activity that consumes the bulk of our attention. That’s a significant investment, and a responsibility.
The first rule is: the work has to be good. As good as you can make it. We can recognise work that has inherent worth, and we can equally recognise disposable dreck that has no unique value of its own.
Endlessly duplicated tech news pieces, all interchangeably reporting the same meagre information, often second- or third-hand? Worthless. Extremely thin link-posts, with no commentary? Probably not worth your time. List articles? Almost always skippable.
Original thought, no matter the length, though, has value. Reflections. Reviews. Opinions. Those are all things that are shared by the author, for the reader – not just reprocessed and regurgitated.
The most fundamental way to respect the reader is to create unique work.
Second, make it readable. The best content in the world will be skipped immediately if it’s presented in a careless, uncomfortable, or outright hostile way. Life’s too short for that.
I’m not a designer. I have no formal education in that area, and I’m just doing the best I can here, using my judgement, and periodically tweaking things. I don’t have a strong visual sense, but I do know when I have an emotional reaction to a design, or a layout. I know what feels clean and inviting, and what feels cluttered and intimidating. On this site, I’ve just spent the last twelve years trying things out, and keeping what seems to work.
At time of writing, this site was last redesigned in 2014, with minor changes since then. I have a style sample for common content elements, but there are essentially three styles of articles I publish here.
- Regular articles: These make up the vast majority of the site’s content, and can be on any topic. There’s no average length. I don’t tend to write fewer than 500 words at a time, and sometimes much more, but in any case, the presentation is the same. Regular articles look like this:
I love whitespace, breathable layouts, serif typefaces, sensible line-lengths, and plenty of line-spacing. I was also looking for a headline-like quality to article titles, and a sense of a masthead for the site’s branding and global navigation. I’ve stripped it back as much as possible, so that the eye is drawn immediately to the article’s title, and then down into the content. I continuously try to make it better.
- Banner articles: These are occasional articles in the style of editorial pieces or columns, befitting a visual enhancement for mood. They usually take around five minutes to read. Banners are a way for me to flag a piece as being particularly “from the desk of Matt Gemmell”, if you like.
Banner articles look like this:
An example is Sultans, where I play with interspersed retrospective and narrative elements to tell the story of a song that’s accompanied me through life.
- Cover articles: These are special, and rare. They’re magazine-style pieces with their own self-contained narrative, like a multi-page feature article in print. They usually take five to ten minutes, or more, to read. Covers are glossy-magazine pieces that can stand alone, beyond the context of the site itself.
Cover articles look like this:
Technically, there’s also a fourth style based on regular pieces: multipage, with navigation between the individual sections of a lengthy piece. It’s strictly used for categorisation, and improving the reading experience – not to gain more pageviews (they don’t count towards anything here) or ad-impressions (I don’t have any ads).
I naturally offer a collated version of multipage articles, so you can read the entire piece on a single page, if you prefer. I wrote a plugin for the blogging system I use, Jekyll, to make it easy to write multipage articles; an example is my guide to Windows Phone for iPhone users. Here’s what a multipage article looks like, with sub-heading and in-page navigation:
All of these styles are still recognisably part of this site, and they all try to put the words front and centre, and the reader first.
An important aspect of good content is respectful meta elements. I use meta elements to refer to ancillary aspects of content, presentation, categorisation, and functionality. Here are some of my guidelines:
Titles: Make them as to-the-point as possible. Maybe that means descriptive, or maybe it means punchy and mood-setting, but in any case make them as short as you reasonably can, and ideally memorable.
Permalinks: Get rid of date-based cruft. I wrote an article about this.
Synopses: These might be actual summaries, or teasers, but the key point is that you should write them yourself, and not rely on either an automated system, or (generally) an initial extract from the piece itself. Synopses go in your feature sections, feeds, and archives. See them as the IMDB plot summary for your piece, but constrained to one sentence and about a hundred characters.
Categories: Use as few as possible. I use one in most cases, and a maximum of two. Make them as general as you can. You want more readers in each category, not fewer. Let search do the heavy lifting with regard to retrieval. I also flag potentially-sensitive topics, such as politics and religion, for example in my piece on Nationalism. There’s a debate to be had on that practice, but ultimately I chose to let the reader decide.
Social sharing: My position is that social media use is so ubiquitous now that omitting sharing links can be seen as inconveniencing the reader. However, there’s a fine line between offering a sharing feature, and pushing it. I no doubt lose many potential shares of my articles because of this choice, but I’ve put my social sharing links only at the end of each piece, in the hope that it’ll be shared by those who have read it in its entirety.
Now, a dose of reality: content has a cost. Hosting and bandwidth are dirt cheap these days, but creativity isn’t. Writing takes time, and there’s a natural tension between the desire to create and share, and the opportunity cost of doing so. In most scenarios beyond the hobbyist blogger, sites have to think about monetisation.
I have no problem with the idea of making a site support itself; I do that very thing here. There are lots of ways to do it, but for me, the key concern is to monetise considerately.
I’ve tried ads in the past, and they worked fine, but the constraints on placement for the purpose of pageviews were at odds with respecting the reader. They limited my layout choices, and ultimately I decided to get rid of them because I felt that they intruded on the simplicity of the design, and drew the reader’s eye away from the content – as indeed they’re designed to. If you use ads, you’re faced with a very difficult task: finding a considerate placement and format, whilst still providing ad impressions. I don’t like that trade-off very much.
I use two different ad-like constructs on this site instead: sponsorship, and promo banners.
You can read about how sponsorship works here, but in a nutshell:
There’s one sponsor per week, and they get one sponsored article that goes up at the beginning of the week (on the site and in the feed). It stays at the top of the homepage for the first 24 hours, then flows naturally in the chronological index. Sponsored articles stay up for the entire week.
I personally approve each sponsor before the weekly slot is sold. I also personally approve all content. I reject anything that implies personal endorsement from me, and I rewrite content that seems like it’s written in my own voice. All links within those articles are marked as
rel=nofollow, to avoid conferring pagerank on sponsors’ sites.
Sponsored content is clearly marked as such, in a variety of ways: the article title is prefixed with “Sponsor:”, the article is in the “sponsor” category, and there’s a paragraph indicating the sponsorship both before and after the sponsored content. Sponsored articles also have a distinct, subdued appearance on index pages, as shown below.
I also thank sponsors on social media, once at the beginning and then again at the end of the week. In each case, I use the
#sponsor hashtag. Finally, the current sponsor is linked from every article on the site, in the footer after the article’s content.
I’ve tried to be as clear, open, and respectful as I possibly can about this whole process, because I know that there’s something vaguely uncomfortable about sponsorship. It can be taken too far – like advertorials – and the thought of abusing the reader’s trust makes me queasy.
If you’re interested, you can read the letter that sponsors receive when they book a slot.
Next, promo banners. These are strictly for my own books. I don’t put any third-party products or information there, ever. Writing is my only income, and I want my readers to know when I have a new book out. I also need to try to drive sales of my books in order to pay my bills each month, so the promo banners are necessary. Here’s what they look like:
I admit that I’m still slightly uncomfortable with them, in principle, because I genuinely worry about the reader’s experience here.
I also offer site membership, where readers can subscribe for a monthly fee (as little as $1 per month), and receive various benefits – in particular, a weekly members-only newsletter with original content, access to an invitation-only writers’ discussion group, a sponsorship-free RSS feed, and periodic exclusive goodies; for example, my members have already read the prologue of my upcoming novel, Changer.
I think I’ve found a good balance between content-focus and promotional material. I’m always looking to improve. I also acknowledge that it’s a privilege to have site membership as a viable option – but I think you can create that privilege by putting the reader first for long enough.
The most fundamental investment that the reader makes with you is their attention, but raw time is pretty important too. There are three relevant periods: loading time, interaction time, and consumption time. The latter two are interrelated. You want the first two to be as low as possible, and the last to be no longer than necessary.
Regarding loading time, the advice is obvious:
Keep pages as small and lightweight as possible. Try for 100 KB maximum, excluding images. This site’s article pages, on average, are around 90-95 KB. This article you’re reading is quite image-heavy, and in total (with images) it’s about 500KB.
Spend enough on your hosting, and/or eliminate any non-essential server-side stuff. You want pages to load in half a second. This article, being image-heavy, will take longer than half a second to load, but not dramatically so – here, it takes about three-quarters of a second. This site has no server-side scripting or such. No databases, PHP, or any of that stuff. I don’t even have them installed.
Minimise bulky resources. Keep images to a minimum, and ideally get rid of non-content images. Use imagery to illustrate and carry mood, not to pad. Oh, and web fonts are pretty, but they’re enormous, particularly if you consider italic and boldface variants.
Regarding interaction time, carefully balance beautifying features like parallax scrolling, fades, annotations and such with loading speed, and the smoothness of the scrolling and reading experience. A lot of sites I visit are horrible at this. Two different media are mashed up together, creating content that’s somewhere between an article and a demo reel, or a title sequence. It’s distracting, and it’s often used to cover up sparse actual content. It’s too loud, and intrusive, and it’s a big problem. Please don’t do that. Make the words hold up the site, not the other way around.
Lastly, consumption time is how long it takes the reader to actually experience your work; usually, that means reading it. Using trick features like parallax, scroll-hijacking, page-boundaries, and gratuitous multi-page organisation all lengthen consumption time without providing meaningful additional content. That’s as disrespectful as you can get – it’s even worse than distraction.
If the reader gives you a minute of their time, give them a minute of actual content. It’s not a difficult rule. I also like to tell the reader up-front (just below the article’s title) how long it’ll probably take them to read through an article. An estimated reading time in minutes – using the average reading speed of 250 words per minute – is far more useful than a word-count, or a table of contents.
Everyone’s different, and the web is a flexible, universal medium. Most sites ignore that. Your readers have their own wants and needs, and catering to those individual preferences is pretty much what respect (as a verb) means. Otherwise, you’re just acknowledging, or paying lip-service.
Here’s the minimum you should be doing:
- Be great on mobile: It’s incredible to me that some popular sites still don’t work well on portrait-format mobile devices, in 2015. Those devices account for a huge percentage of visits, and they’re what we want to use. It’s the height of arrogance to expect someone to get to a regular computer just to have a comfortable reading experience. It’s also a cop-out to just lean on readability services. I’m forever tweaking how my site looks on phones, but I’ve got it to a form that I’m fairly happy with.
Be responsive: Everyone has a different orientation, and device, and window size. Different browsers, different settings. It’s a headache, but nowhere near as painful as it used to be. This site is just one site, no matter whether you’re using a huge browser window on a desktop monitor, a tiny window on an ultrabook, or either of the orientations on a tablet or mobile phone. CSS media queries can work wonders.
Support browser zoom: This is something to think about from the start, because it’s going to have a direct impact on your design, and indeed the CSS. A surprising number of people habitually use their browser’s text-zoom feature – whether it’s to enlarge or reduce the size of content. Make sure your site doesn’t break apart when they do so. For this site, I did some browser testing for that functionality.
Consider accessibility: This usually just means using semantic markup, sensible headings, and nothing horrible like pop-over content, or opaque plug-in media. Assistive technology is very good these days; all you need to do is not actively work against it. Get someone to test your site, and listen to the feedback. You might want to think about keyboard navigation too.
It’s clear that sites are more than just content. They’re our mouthpieces, our portfolios, and perhaps even our living. They cost money to run, they cost time to update, and if they’re our personal online presence, they carry fragile ego, hope, and despair along for the ride.
For the reader, though, the value of a site is whether or not the content was enjoyed – and that enjoyment is a symbiosis of the work itself, and the experience of reading it.
There are also many purposes to writing. Catharsis, exploration, teaching, healing, and hopefully also scratching the itch of that innate need to make something. Those are all valid and laudable goals.
For the reader, though, the purpose of your writing is to be read. That should really be your ultimate purpose for it, too, even though it’s sometimes convenient to pretend otherwise. When you really strip it down, and think, that’s the simple truth: your writing’s worth is in the reading.
Reality brings competing concerns, and corresponding compromises like maximising pageviews and ad impressions, audience-building, balancing functionality against performance and cleanliness, and a host of other things – but for the reader, it’s still simple.
If you fail to produce something worth reading, you have nothing. But if you’ve created words worthy of the reader’s time, and then sabotaged them with too little consideration, or too many compromises of the wrong kind, then in many ways you’ve done something worse – something tragic. It’s a missed opportunity, and that’s possibly the saddest of all things.
Words are for reading. Creations are to be experienced. By all means do what you need to do to make your work viable, but try to make your first priority be respect for the reader.