Chapter 1: The Shift in Twitter's Typography

Recently, Twitter has made a significant change to its font, sparking considerable backlash among its users. While any alteration on social media often meets resistance, the platform's subtle rebranding has notably disturbed many individuals. The reduction in vibrant colors has rendered the interface more challenging for users to navigate. However, the core issue lies in the new proprietary typeface, Chirp, which Twitter has introduced.

This typeface was purportedly designed to enhance accessibility, yet its structure has led to various readability challenges. While the change may seem minor compared to the previous typeface, the specific design choices, such as the lowercase "g," contribute to significant readability concerns.

If you've noticed discomfort or difficulty focusing on Twitter since the update, it’s likely due to the uneven baseline of the font. Upon closer inspection, you may observe that certain letters appear to float above others, particularly in rounded characters like A, O, and E.

In typography, we often adjust certain characters to achieve visual alignment—this is known as overshoot. It allows characters to dip below the baseline, creating a cohesive appearance. While this is a subtle aspect of print design, it becomes crucial in digital formats.

The method of designing type as outlines has its advantages, particularly in achieving sharp visuals in high-resolution settings, such as print media. However, when converting these outlines for screens with 72–96 dpi, they are turned into pixels. To facilitate this transition, fonts are equipped with hinting—guidelines that fine-tune how characters align within the pixel grid of contemporary displays.

Historically, web designers have been constrained to a limited selection of fonts due to the intricacies involved when hinting is overlooked. For instance, Verdana underwent numerous redesigns across various sizes to ensure both responsiveness and readability. Despite its common usage, Verdana stands as one of the most labor-intensive fonts ever created.

Chirp's absence of hinting is evident, as pointed out by Twitter user @kureshii_. Without hinting, the font lacks guidance for aligning characters, leading to visual distortions where curves that should align now appear misaligned. This results in an uncomfortable experience, causing symptoms like nausea and headaches.

The design flaws of Chirp present a serious challenge for readability and accessibility, especially for users with dyslexia. Even those without such complications find reading on the platform to be an unsettling endeavor.

Different browsers handle these rendering issues differently, meaning that the problems with Chirp may be more noticeable on Chrome compared to Safari or Internet Explorer. Given Twitter's aim for consistent cross-platform functionality, this lack of attention to detail in the font's design is concerning.

Ultimately, this situation underscores the necessity for a holistic approach to design, where accessibility is a fundamental consideration. If accessibility had been prioritized, such glaring mistakes would have likely been avoided. It’s apparent that while Chirp may have looked impressive on high-resolution displays, the practical implications of typography should have been thoroughly evaluated before implementation.

Geoffrey Bunting is a writer and book designer. His work has been featured in various publications including History Today, Modus, Super Jump Magazine, UX Collective, and more. You can find him at geoffreybunting.co.uk.

Chapter 2: Exploring Font Adjustments

To understand the impact of font style on platforms like Twitter, consider the following resources:

This video titled "Change font style and colour on Twitter" delves into how altering font styles can affect user experience and engagement.

Another insightful video, "Why you should use an ugly font like Comic Sans," challenges traditional typography norms and explores the importance of font choice in design.