Use nbsp!

Again a little thing that makes our pages a bit more perfect. After you’ve created the design, written the XHTML and styled it up using CSS you have to concentrate on something else. Typography. At least, you put some ” instead of " in there and that’s it.

I’ve found out another thing that’s important. They even use it in the “real” world (newspapers, magazines). The non-breaking-space. Sure, everyone knows about it. But do you use it? As it’s meant to be?

So we’ve got normal text and its lines will break like this:

(first example)

Taking the car in New York is –
especially in summer – not good.

Looks fine? No. Insert a  .

<p>Taking the car in New York is -&nbsp;especially in summer - not good.</p>

Result looks like:

Taking the car in New York is
– especially in summer – not good.

(second example)

Order them now for just 99
US$ and you’ll get one free!

<p>Order them now for just 99&nbsp;US$ and you'll get one free!</p>

Order them now for just
99 US$ and you’ll get one free!

(third example)

It would be kind of you to visit my home
page
now. If not, I’ll become angry.

<p>It would be kind of you to visit my
<a href="http://example.com/">home&nbsp;page</a> now. If not, I'll become angry.</p>

It would be kind of you to visit my
home page now. If not, I’ll become angry.

I hope you see that the result looks more professional. You don’t need to browse all your articles and add non-breaking-spaces, but just have a thought of them when writing new things. Especially on the front page of a website it makes a better impression to use them. Just in case a line breaks where you don’t want it to.

Published by

Julian Bez

Julian Bez

Julian Bez is a software engineer and former startup founder from Berlin, Germany.

  • http://www.snook.ca/jonathan/ Jonathan Snook

    That’s some pretty solid advice. It’s something I do when I remember it but usually only when I see the side effects when working on a project. It’s something that people coming from a print background tend to notice more. “it’s the little things that matter most”

  • http://www.456bereastreet.com/ Roger Johansson

    Yeah it can add a nice touch, and reveals that you pay attention to details. Just make sure to use & #160; instead of &nbsp; when you serve XHTML as application/xhtml+xml, or some browsers will not render it as expected.

  • http://www.petrosdimitriadis.com petros

    I have been using nbsp for a long time but do you know if there is any problem with speech readers?