DEV Community

Cover image for Text Based Logo
Colin McDermott
Colin McDermott

Posted on • Updated on

Text Based Logo

This week on Search Candy we are testing a text/font based logo, not using an image.

https://www.searchcandy.uk/

On hover the logo is given a CSS colour gradient.

There are a few pros of a text/font based logo as opposed to using an image:

  • Faster load time / less resources on the page #webperf
  • Can change the logo, apply CSS and effects on the fly #style
  • Crystal clear rendering of the font at sizes from small to large #style

Cons:

  • Reliant on the font being installed or downloaded #webperf
  • Could potentially lead to multiple words being split across lines #style

We made use of the Roboto font - which is already cached on pretty much every computer in the world due to being used extensively by Google.

We also added a non-breaking space (nbsp) HTML character entity instead of generic space - which prevents the two words in our logo from being split.

Top comments (0)