20 websites with brilliant typography

11. Royal Drawing School

Different font styles separate different page elements visually

Different font styles separate different page elements visually

The innovative font of their slogan establishes the Royal Drawing School as an artistic institution. Notice how the italics in the ghost buttons set them apart from roman links in the top navigation bar.

12. Mister French

This fashion brand has fun with alternating serif and sans serif text

This fashion brand has fun with alternating serif and sans serif text

The clothing line Mister French has fun with typography, as you can see by the alternating serif and sans serif text, and the vivacious logo.

13. Cienne NY

Minimalist type puts the focus on the image

Minimalist type puts the focus on the image

The simple and mainly lower-cased sans-serif typeface complements the site's minimalist design and puts focus (usually) on the photography.

14. Le Printemps du Polar: La Femme Fatale

This stylistic font creates a noirish mood

This stylistic font creates a noirish mood

The stylistic font works in conjunction with the picture to create a noirish mood, and remains unchanged when it's resized for different breakpoints.

15. Sassi Holford

Subtle colours and elegant type strike the right note

Subtle colours and elegant type strike the right note

Sassi Holford's use of white, and grey — not black — against white backgrounds, furthers the elegant identity of the wedding photograph.

16. Tomas Bata University in Zlín

Weird type signifies an uncertain future

Weird type signifies an uncertain future

The bizarre font for the heading of the Tomas Bata University's home page enhances the mysterious future-predicting theme, but the site switches to something more legible for the important links.

17. Thankful

The lines of the typography work well with the hero image

The lines of the typography work well with the hero image

The line strokes of the superimposed title share — rather than steal — the photograph's attention.

18. Aquatilis Expedition

Here wildly varying type styles work surprisingly well together

Here wildly varying type styles work surprisingly well together

Aquatilis Expedition wildly varies the use of its typography, with a customized brand logo, loud header, and coloured body content that makes full use of the black background.

19. Two Arms Inc.

A great use of an old type trick

A great use of an old type trick

Aside from using interesting typography in general, Two Arms Inc. uses an old comic book trick to make the words "never run" visually suggest running.

20. Drexel University: Get Going

This site's typography works on multiple levels

This site's typography works on multiple levels

We'll end with Drexel University, whose typography seems simple but actually works on different levels. The site uses both the text's size and composition to create a visual hierarchy, gently guiding the user's eyes through the words and onto the call-to-action.

Conclusion

Since vision is our dominant sense, how a word looks is just as impactful as what it means. It might seem easy to neglect typography in favor of gorgeous background images or flashy animations, but doing so is neglecting an advantageous opportunity.

To start designing websites that are as visually stunning as the ones shown, feel free to start prototyping in UXPin. Once you start a free trial, the collaborative design app comes loaded with hundreds of typefaces, 1000+ custom elements, and dozens of rich UI libraries. No code required.

Words: Jerry Cao

Jerry Cao is a content strategist at UXPin — the wireframing and prototyping app — where he develops in-app and online content for the wireframing and prototyping platform.

Like this? Try these…

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

The Creative Bloq team is made up of a group of design fans, and has changed and evolved since Creative Bloq began back in 2012. The current website team consists of seven full-time members of staff: Editor Georgia Coggan, Deputy Editor Rosie Hilder, Deals Editor Beren Neale, Senior News Editor Daniel Piper, Digital Arts and Design Editor Ian Dean, Tech Reviews Editor Erlingur Einarsson and Ecommerce Writer Abi Le Guilcher, as well as a roster of freelancers from around the world. The 3D World and ImagineFX magazine teams also pitch in, ensuring that content from 3D World and ImagineFX is represented on Creative Bloq.