Writing for the web by drafting with the web
Prototypes over documents

Over the past year or so, I took on several projects that were focused on web content, and I took the decision to share my early drafts not as Word or Google documents, but as web pages.

Drafting not with Word, but with the web.

Doing it this way makes a real difference because the client sees the words in the right context from the start, and responds to them in a different way.

Enabling better feedback

Anyone who works with words-in-documents will know that when you share a document with people, the first thing most of them will do is start editing it, or commenting on it.

Sometimes, that’s helpful – but not always. Sometimes, it’s much more helpful to get higher-level feedback: are these words heading in the right sort of direction? Are they roughly what needs to be said? Just answer that for now, and we can worry about detailed points later.

Sharing early drafts as HTML pages helps clients answer questions like that in their heads.

This technique also helps me (as a writer) to “show the thing”. In most cases, I’ve spent some time earlier in the work saying to clients that they need to “focus on the work” and “break the messages up into chunks” and “make one page about one thing”. Sharing as linked, linkable HTML makes this much easier.

Making HTML happen

Of course I’m not a developer or a designer, so I go to great lengths to make clear to my clients that what I’m sharing isn’t a proposed website. It’s a proposed way of communicating on the web. If they want to turn the words I help them create into actual web pages, they’ll have to get an actual web professional to make that happen.

I’ve tried a variety of techniques to create these content mockups – I started out by writing HTML by hand, like the good old days, and that works but it’s time-consuming.

More recently I’ve made liberal use of classless CSS styles like new.css (also used for this website), basic.css, and water.css.

I’ve also experimented with instant website-in-a-box options like Notion, Squarespace, John Doe and Tiddlywiki.

Just like making products

This is, of course, exactly what product teams do. They build an early prototype and share it with stakeholders by sharing a URL: “Here, click this. Tell us what you think about what you see.”

I’ve been working closely with teams like that for a few years now. About time I learned a thing or two from them.

Filed under: work
(4 February 2021)