Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[create-next-app] Revert application of font antialiasing, set thinner font weight #72558

Open
wants to merge 4 commits into
base: canary
Choose a base branch
from

Conversation

vandorsx
Copy link

This PR presents the argument that applying font antialiasing is a bad web design practice.

As Dmitry Fadeyev explains:

Disabling subpixel rendering [makes] text look different, more slender and without any hint of subpixel discoloration. Because of this, at first glance, antialiased text appears to look better than its subpixel sibling.

But upon closer inspection, antialiased text is always blurrier than subpixel rendered text. This is not a matter of opinion, it’s just how the rendering works.

[...]

The antialiasing mode is not a “fix” for subpixel rendering – in most cases it’s a handicap. Subpixel rendering is technically superior, clearer, and more readable than antialiasing because by utilizing every one of the subpixels it increases its effective resolution used for font smoothing by three times. Antialiasing is useful for certain circumstances, such as for light on dark text, but it is absolutely not a replacement for subpixel rendering, and certainly not a “fix”.

https://usabilitypost.com/2012/11/05/stop-fixing-font-smoothing/

This PR removes the application of font aliasing across the create-next-app templates, reverting the changes made in #67425. Recognizing the attractive slender effect antialiasing provides to text, this PR also sets a non-standard variable font weight, mimicking the effect without the downsides of antialiasing.

A very minor issue, I know — I just happened to notice antialiasing being applied when creating a new Next project today :)

Antialiased 325 font weight
antialiased 325

Geist is a variable font, allowing the use of a thinner font weight that matches the appeal of font antialiasing
@ijjk ijjk added the create-next-app Related to our CLI tool for quickly starting a new Next.js application. label Nov 10, 2024
@ijjk
Copy link
Member

ijjk commented Nov 10, 2024

Allow CI Workflow Run

  • approve CI run for commit: 8fd1b10

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
create-next-app Related to our CLI tool for quickly starting a new Next.js application.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants