Why we don’t worry about line breaks or orphan words – and you shouldn’t either

On embracing the unpredictability of user settings and maintaining the design integrity of copy on websites
Words by
Rob Morrisby

In the Hallowed Halls of Print Media, the designer is king. But here in the Wild Wild West of the World Wide Web, there is something of a power struggle taking place.

You have designed the perfect site. Every colour, every shape, every word has been carefully considered and positioned and it is finally just right and ready for visitors to come, to marvel, to benefit from your great design.

But those pesky users are coming to court with their own ideas: maybe they like text to be massive, or tiny, maybe they’re visiting from their 4K screen or their banged up iPhone X, maybe they’re on their laptop in a cafe right now and they’ve had to half minimise the window so they can appear present and engaged on a Zoom call* – who knows?!

But they’re on your site and it is your job to make sure they can find what they’re looking for and the last thing you should be worrying about is a rogue line break or an orphan word here or there.

A users’ text size settings, zoom levels and screen size will all impact how a site appears – words will move from one line to the next to work within the parameters the user has set. This is unavoidable! It can feel uncomfortable, because there’s a dynamism there that simply doesn’t apply to static printed media, like magazines, brochures or billboards. And breaking a cardinal “rule” of design, like ignoring a runt word, may feel sloppy. But there is a way to maintain the brand vision you know is critical and allow users their little setting quirks. A ceasefire, if you like.

3 top tips to maintain design integrity of copy while accounting for the unpredictability of users’ settings

Nail the copy

Don’t be tempted to edit copy in pursuit of the perfect fit, it’ll sit differently on every screen so just let the words do the talking

Did you know that Jambi has its own in-house copywriter? We do! You can find her on kat@jambi.digital

Consistency is key

Create a style bank of all the common text elements eg headings 1-6, bullet lists, paragraphs, hyperlinks for use across the whole site

We love the archetype app for this – check it out here

Keep formatting styles out of the edit page

Don’t manually add line breaks or other styles into text fields when adding or editing content via the CMS dashboard

It may look better on your screen but it’ll look odd on someone else’s

Of course there are some copy elements you can maintain tight control over – a company logo, brand mark or strapline can be uploaded as an .svg file so that it remains consistent in every setting. But for body copy, that’s not really practical.

Apart from making sure your site looks its best – however it’s being accessed – following these tips will also make your site much more accessible. Something we wrote about here.

So don’t sweat the small stuff! One persons’ orphan is the next persons’ perfect alignment. Embrace the inconsistencies and enjoy a peaceful, digital reign.

If you’d like to chat about web dev or copywriting requirements for your next project, we’d love to hear from you. Get in touch with Rob or Kat today.

*a totally fictional example. No Zoom calls were ignored in the writing of this blog

Related articles
The latest from jambi insights
View all articles