Here at Pumpkin Web Design Manchester, we are Manchester’s leading web design and web marketing experts. We work with companies and businesses across the North West, from Southport to Wigan, to provide effective, and successful web design solutions. As a result, we have produced this guide to everything you should know about the important considerations for obscured typography in web design.
What is obscured typography in web design?
Obscured typography is a specific typography style that involves laying different elements over the title or heading text, above the fold, so that some of the letters are partially covered. This could involve overlaying part of the background, or an image or illustration, so that it is clear the text is still there, but it is underneath a layer of content.
What are the important considerations for obscured typography in web design?
To get the most from your obscured typography in web design, you should consider:
- Responsive design- responsive design is crucial for obscured typography. Your website cannot look professional, or effective on a small screen size where the title or heading text is impossible to read. And when using obscured typography this means optimizing all of the different elements to display at the perfect size, and not just the typography itself. For example, when a mobile phone screen is rotated, the overlaying layers obscuring the text to resize and move, blocking all of the text from view. This will create a negative user experience, and can lead to a loss in customers.
- Colour schemes- the colour of the text, the background, and the overlaying layers will need to be seriously considered. You need your text to really stand out and contrast with the rest of the screen, so that the shape of the letters, and the letters themselves, are easy to see and read even when partially obscured. You also need to make sure that each layer blends well with the other, for a professional result.
- The font style- the style of the font itself is also an important considerations when opting for obscured typography. Because part of the letters or words will be obscured, it is essential that you use a strong, bold font with clear individual letters. Calligraphy or handwriting font will become impossible to read, even with just a small amount of obscuring. Bold, sans-serif fonts on the other hand can still be easy to read, even when your potential customers cannot see every part of each individual letter.
- The background style- the background itself is another important consideration when using obscured title text. This is because if the background is too patterned, or too visually overwhelming, it can make the text even more difficult to read.
For more information or for professional web design support, get in touch with the experts today, here at Pumpkin Web Design Manchester.

