3

I am trying to position the text in the website header, I ended up with something like this:

The text "Simply and efficiently" has a mixed "software and IT products" inside. I was wondering if it's a good practice. I like how it looks but then I randomly watched this Youtube video with crappy design: https://www.youtube.com/watch?v=QeXs5NyX5WI and it made me wonder about the design above because their first example of crappy design is something like this (which is an obviously unreadable text) - I realised how bad such fonts / text mixing can end:

Does this kind of mixing fonts and sizes affect the readability in a negative way always? Woud it be better to leave it like this:

4
  • 5
    The fact that the image background makes the word efficiently almost illegible and invisible has a much bigger negative impact on legibility of the whole, I’d say. Apr 27, 2018 at 18:58
  • 1
    As a side effect of swapping the second and third line, the word "efficiently" becomes easier to read because the amount of static noise (due to the blue/red mixture especially in the first three letters) is greatly reduced in the background image. Accordingly, the second version is hands-down better on all accounts.
    – Llewellyn
    Apr 27, 2018 at 21:04
  • If I am not mistaken, the use of the FFL ligature is not correct, because “efficiently” can be hyphenated between the two Fs. At least in German that would be the case. Could someone with better typographic knowledge of the English language clarify?
    – Philipp
    May 1, 2018 at 9:25
  • Edit: I was mistaken. I couldn’t find any such restriction in “Elements of typographic style”. However, in “Detailtypographie” (p 194), Friedrich Forssman states that ligatures can be applied without any restrictions in foreign languages (the book is in German). For the German language, a handful of rules apply.
    – Philipp
    May 1, 2018 at 9:44

2 Answers 2

4

Positioning, size, weight, color and font style are all used to drive the viewers attention, i.e. make them read it in a certain order.

Higher up, bigger, brighter and to the left (in English) are aspects which draw attention and elevate an elements importance and place in the hierarchy.

The first example is not successful in having "software and IT products" be read at the end.

1 because its too bright (1 white element demands primary attention) and 2 because it comes above the first line.

Appearing above does not always mean its perceived first. If "software and IT products" was in grey it might be noticed after the first line is read.

You're on the right path and there are many creative solutions for re-ordering type. Try varying the weight between tagline and descriptor.

1
  • 1
    In short... beware of "style over content" ;)
    – Tetsujin
    Apr 27, 2018 at 17:57
2

The whole design is missing an important consideration. Impact. I looked at the words and the background graphic took my attention immediately away from the text. The way the text chopped up image brought my focus on that, and not the text of your main question. 1) If you must use that image, don't integrate it into the text. 2) Image C is your best. 3) Keep the main color(or similar gradient) you've used on the largest text. 4) As mentioned by Webster, the white text is too much of a contrast. And 5) I'm lost if this is an attempt at creating an image branding campaign, or a logo styling. 'Simply and efficiently' followed by 'software and IT products' do not connect here. Play with it by taking it apart and putting it back together. Impact is the quality of being immediately intriguing and recognizable. You've usually only have 1.5 seconds to make that impact for banners and campaign ads. Make it snap.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.