WordPress / twentytwentythree

Twenty Twenty-Three, the default WordPress theme sporting many styles that will launch with WordPress 6.1.
123 stars 65 forks source link

Fluid Typography Question #158

Closed hiyascout closed 2 years ago

hiyascout commented 2 years ago

(First issue / pull request ever — please forgive me if this has already been discussed in this way! I know there have been threads on some of these changes, but couldn't find a bigger-picture discussion of it.)

Here's my reference PR: Make all font presets fluid, make h1-6 use var()

The question:

Is there a reason that in theme.json (lines 249-283 and 599-633) that variables and built-in fluidity aren't being consistently used? (See before/after GIF for what I'm seeing—looks like only h2 visibly features fluidity.)

Thoughts:

My opinion is that it would be good--both for code simplicity and general community values--to use variable presets, the scale feature, and Gutenberg's fluidity settings wherever possible, even if rems and clamps allow more design control and precision.

-the shipped themes are great entry points to coding in WordPress, and committing to the new best practices will be a better educational tool for developers -fluidity is the most exciting at the largest sizes, and if it's being touted as one of the key features of the theme, it should be default -using variables instead of units in "styles": will make creating variations and other customizations simpler and more consistent

Those are my two cents, and thanks for reading!

fluid-twentytwentythree

carolinan commented 2 years ago

In my opinion fluid sizes should be used when it is needed. Above, I think example one is easier for me to read. I did not understand why the heading needs to be larger at this width. I understand it is an example, but really all it does is force me to scroll more..

pbking commented 2 years ago

In my opinion fluid sizes should be used when it is needed.

I agree with @carolinan in that and also that the BEFORE is easier for me to read.

I love the power of fluid typography, however I also don't believe that it should just be enabled by default. It's usage (and the details of it) are important design decisions that should be made carefully.

In the case of TwentyTwentyThree I hope that many variations take advantage of fluid typography in unique ways, but believe that they should do so starting from the default state of static sizing.

That also goes for the existing clamp values of the header; I would argue the default state should be leveraging presets so-as to take advantage of the native fluidity (when enabled in the variations) rather than clamp calculations.

hiyascout commented 2 years ago

@pbking and @carolinan thank you for these! I understand your viewpoint re: the fluidity — my instinct is always SPECTACLE EVERYWHERE (yes, my middle school website used liberally), so it's good to hear a bit more sobriety.

My hope is that somewhere obvious we can let the non-coding user know which headings are fluid (if we continue to highlight that feature).

colorful-tones commented 2 years ago

@hiyascout - thanks for generating this discussion. It seems the conclusion is to leave the existing fluid typography implementation. If you're satisfied with this, please close this issue for the sake and sanity of the project maintainers.

(Note: conversation can continue after it is closed.)

hiyascout commented 2 years ago

@colorful-tones Thanks for the procedural tip here. I think nobody was swayed by my fluid typography opinion, but it seems like there might be more interest in adopting the using-more-presets part of this discussion.

Pull Request 159 has some now-committed changes from @mikachan that that I think omit the fluid type changes but use more presets. Would the appropriate thing to do be to close this now while that other one is in review?

Sorry, still getting used to how this whole operation operates.

colorful-tones commented 2 years ago

Sorry, still getting used to how this whole operation operates.

No problem-o! Thanks for pointing out the related #159 . I missed that 🤦

I'll defer to @mikachan guidance.

Thanks @hiyascout 👍

mikachan commented 2 years ago

Thanks, both, for pushing this forward!