Block Font Sizes and Fluid typography

Back in August, 2020 a Gutenberg issue proposed the following enhancementenhancement Enhancements are simple improvements to WordPress, such as the addition of a hook, a new feature, or an improvement to an existing feature.:

It’d be nice to allow to have fluid typography option so that design would look good on all viewports. This would open the door for designers to make a more bold visual expression that’s difficult to do with fixed font size.

An experimental pull request (PR), Block supports: add fluid typography #39529, puts forward a way to realize this enhancement by allowing theme authors to enable fluid typography across their site.

This post is to raise awareness of the issue and ongoing work in the area, and to request feedback on the PR‘s proposed approach.

What is fluid typography?

Fluid typography is a fancy way of describing font properties, such as size or line height, that scale fluidly according to the size of the viewport.

Taking font size as an example, when a site’s font sizes are fluid they will adapt to every change in screen size, for example, by growing larger as the viewport width increases, or smaller as it decreases.

Contrast that idea with properties that respond to specific viewport sizes, such as those defined by media queries, but do nothing in between. 

About the proposed approach

Theme authors can already insert their own fluid font size values in theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.. The TwentyTwentyTwo theme, for example, employs clamp() values for several font sizes.

However, it’s still necessary to create a fluid font size value for every font size in order to achieve a uniform effect across a site.

The PR attempts to generate fluid font size values dynamically so that theme authors don’t have to worry about implementation details.

In order to achieve this, it add several new properties to theme.json font size presets:

"settings": {
    ....
    "typography": {
        "fluid": {
            "min": "768px",
            "max": "1600px"
        },
        "fontSizes": [
            {
                "size": "2rem",
                "fluidSize": {
                    "min": "1.8rem",
                    "max": "2.5rem"
                },
                "slug": "medium",
                "name": "Medium"
            }
        }
}

Note typography.fluid and typography.fontSizes[].fluidSize, both of which contain the following properties:

  1. min – In fluid, the minimum viewport width, In fluidSize, the minimum font size.
  2. max – In fluid, the maximum viewport width. In fluidSize, the maximum font size.

Using these properties, GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ will construct a unique clamp() formula for every font size and output the value in the font size preset CSSCSS Cascading Style Sheets. var. For example:

--wp--preset--font-size--medium: clamp(1.8rem, calc(1.8rem + ((1vw - 0.48rem) * 1.346)), 2.5rem);

The formula controls how a font scales between minimum and maximum values, relative to the viewport width.

If values required to reliably construct a clamp() formula are missing, such as a minimum or maximum font size, an alternative font size value using CSS max() or min() is returned accordingly.

Fluid font size example in Gutenberg

I encourage you to inspect the PR for further details, and play around with different designs.

Feedback

Initially, I’d expect to release the changes to theme authors via the theme.json interface only.

The intention is to garner feedback on design, functionality and APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. before diving into UIUI User interface controls and, beyond that, introducing fluidity to other properties such as spacing.

On that note, I invite folks to check out the branch and leave their thoughts in the PR comments. If you can spare the time to test the changes, I’d appreciate input on:

  • Whether the new theme.json  properties are easy to understand.
  • Usage across themes and potential backwards compatibility issues.
  • AccessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility). For example, supporting (and ultimately recommending) the use of relative sizes such as rem.
  • Possible alternatives.

All feedback is welcome and will be rewarded with healthy doses of digital kudos.

Thank you!

#gutenberg, #request-for-comment, #typography

Proposal: Dropping support for old PHP versions via a fixed schedule

While most people here will probably mostly know me as a (PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher) developer, I actually have a background in business studies, so when Matt Mullenweg reached out to me to continue the conversation about WordPress dropping support for older PHP versions in an in-person call, I decided to put my business acumen to use and see if I could come up with a proposal which would make sense from a business point of view for all parties involved, be it the amazing contributors to the WordPress project, the web hosts, the pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party and theme builders, the web agencies and the users who often run their business via their WordPress website.

In short, I’m proposing a fixed schedule in which every PHP version is supported for five years. Additionally each WordPress release will receive security updates for four years. In effect, this means that users, at a stretch, would be able to run on one specific PHP version for nine years.

A fixed schedule will make this whole process transparent and will allow all parties to plan for the version drops accordingly.

With Matt’s blessing, I’m posting this proposal here on Make to gauge the reactions of the wider community to my idea.

Please feel very invited to leave a comment whether you agree with the proposal or not.
Mentioning what your involvement is with WordPress and how this proposal will impact you in a positive or negative way, would be very valuable input for further discussions on this.

Chicken vs egg

The situation we are currently in, is basically one of “Which came first, the chicken or the egg ?”.

Current situation: Classic Chicken vs Egg


WordPress doesn’t drop support for older PHP versions until enough users have moved over to newer PHP versions and a significant enough share of the WP users don’t upgrade their PHP version until they really have to because WordPress drops support for the version.

This is circular logic, which as most developers know, never ends well as you end up in an infinite loopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. where, in the end, neither moves forward.

So who are these users who don’t upgrade ?

Well, while we can’t know for sure, if we look at the figures, we can see some patterns:

Pie chart with the statistics for which version of WordPress is used by which percentage of users.
In the chart it is highlighted that there are 3.7% of users still on WP 5.1 (PHP stragglers), a whopping 10.6%on WP 4.9 (Gutenberg dislikers) and a similar percentage of users on WP versions older than WP 4.9, a  lot of which may be zombie-sites.

Take note of the fact that the percentage of users on WP 5.1 who didn’t upgrade yet is relatively small and only part of that can be attributed to the PHP < 5.6 version drop in WP 5.2.

So let’s look at some likely personas for users who don’t upgrade:

Image showing four persona's:
1. The zombie thinking "Huh, what notice ? what website ?"
2. The overwhelmed person thinking "Admin notices are so noisy, I just ignore them all".
3. The laid-back person thinking "No rush, I'll do it later (when it's needed)".
4. The business person thinking "We'll take the costs last minute and not a minute before".

We have the “zombie” persona, sites which are still online, but are not actively updated anymore.
These can be, for instance, sites which were linked to a specific event or other date-related topic which are still online for historical reasons, aggregate sites which automatically re-post from other sites without adminadmin (and super admin) involvement, or spam sites etc.

We have the “overwhelmed” persona, who blatantly ignores all admin notices. We all know why and how this happens. The multitude of notices in the admin area once a site has a few plugins and a theme installed trained this user to ignore them.

Then there is the “laid-back” persona, who has seen the notices, but doesn’t feel any urgency until they can’t update their site anymore.

And lastly, the “business” persona, often with a custom theme and a number of custom build plugins who’d rather move the costs of upgrading those to the next accounting year.

As for the user who feels out of their depth – amazing work has been done by the #site-health team to help those out.
For those users, I like to use the car analogy:

A website is something users will generally use regularly and expect to “just work”. So let’s make the comparison with something else a lot of people use regularly and expect to “just work”.

Say a car. Similar to WP, when one gets themselves a car, you need to familiarize yourself a little with how it works (interface/admin), but then it just runs. You put in petrol regularly (WP updates) to keep it running. Then once in a while, it needs a proper service. Now you have a choice: either you learn how to service a car yourself (read the site health materials and follow them up) or you go to a garage (hire a specialist) to do it for you.
And if you really don’t want to be bothered with all that, you lease a car instead (managed WP hosting solution).

Along the same lines: if you ignore the warning lights in a car (site health admin notices), you can’t pretend to be surprised that at some point it will break down (gets hackedhacked /can’t upgrade anymore). If was your responsibility as a user to act on them after all.

But Juliette, get to the point: how do you think we can get out of this situation ?

Ok, so here goes: I propose a fixed (rolling) schedule for dropping support for older PHP versions.

A fixed schedule means that such version bumps become predictable and with them becoming predictable, they become manageable and plannable.

These last two qualities are extremely important as all parties involved will know well in advance what they need to do and when it should be ready.

The current uncertainty over what WordPress will do leads to inaction, as we saw with two of the example personas, and we can counter that with becoming predictable and reliable with regards to the PHP version bumps.

So I propose that, as of now, we start dropping support for the PHP minor which is more than five years old each December, or if there is no release in December, in the WordPress release which is being worked on at that time.

That would currently look something like this, with the numbers at the top being the version of the WordPress release that December and the numbers at the bottom being the new minimum supported PHP version.

Timeline from December 2016 to December 2024 showing the WordPress version released that December and the minimum supported PHP version as of that WordPress version.
WordPress 5.6 in December 2020 would get a minimum of PHP 7.1.
WordPress 5.9 in December 2021 would get a minimum of PHP 7.2, etc
Below the timeline it shows for each PHP version when it was released and until when it will be supported by WordPress.

Keep in mind that, per the currently proposed schedule, the new minimum supported PHP version would always already be a version which is no longer actively supported by the PHP project, nor does it have security support anymore at the time it becomes the new minimum supported version for WordPress.

For example, PHP 7.1 was released in December 2016. Active support for PHP 7.1 stopped beginning of December 2018 and security support stopped on December 1, 2019. And based on the current proposal WordPress would still support it until December 2021.

But all those users on old WordPress versions…

Well, WordPress has always had a very liberal policy for backporting security fixes, so as part of this proposal, I’d like to suggest that the WordPress project makes a hard commitment to continuing to backportbackport A port is when code from one branch (or trunk) is merged into another branch or trunk. Some changes in WordPress point releases are the result of backporting code from trunk to the release branch. security fixes for WordPress versions up to four years back.

Timeline from December 2016 to December 2024 showing that during the lifetime of the upcoming WordPress 5.6 release, the 5.6 release would get active support, but that WordPress 4.7 (released December 2016) up to WordPress 5.5 (released this month) would get security releases (if needed).

What that would come down to in practice, is that if a user would always want to use the latest and greatest version of WordPress with the minimum of effort, they would need to ensure their PHP version is updated once every five years.

Slide: Example: user on PHP 7.4
* WordPress will offer 5 years of support for the PHP version.
* WordPress will offer 4 more years of security updates for WP versions before the version bump dropping PHP 7.4.
* In total this adds up to 9 years of support.

And if they don’t mind lagging behind a little in their WordPress version, they could even get away with only updating their PHP version once every nine years and still have their website running on a secure version of WordPress.

Now how does that sound ? Is that a liberal enough policy ?

Note: security fixes are currently back-ported as far back as WordPress 3.7. With this proposal, the minimum version of WordPress still receiving security fixes would not longer be a fixed version, but would change to a rolling number.

But what about the users currently on old WordPress versions ?

To solidify the commitment to making this as transparent as possible for the users, I propose we backport the PHP admin notice from the site-health project to the older, still currently security supported, WordPress versions, so that those users will be informed when they log in to their website.

Alongside of that we could ramp up the site-health notices based on this fixed schedule of version drops and committed security fix support.

Slide showing an "Urgency nudges" proposal:
* For websites running on a PHP versions no longer actively supported, an admin notice will be shown.
* As of six months before the planned drop of a PHP version, the admin notice on those sites would change colour to draw more attention to it.
* After the PHP version drop, the proposal is to show a big pop-up on admin login for the first and second year after. The notice is dismissable but will come back once a month.
* For the third and fourth year after support for the PHP version has been dropped, this pop-up will show every time an admin logs into the website.

So… what do you think ? I eagerly await the reactions of you all!

Props to @sergeybiryukov, @joostdevalk and @matt for looking this article over before publication.

#core, #core-php, #php, #request-for-comment

Request for Input: Consent Preferences for Logged In Users (Consent API)

The coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.-privacy team are currently working on three modular, but complementary initiatives, with the aim of merging into 5.6.
These are: The Consent APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. (website visitor level privacy); the Disclosures Tab (site-level privacy) and collaborating with the core-media team on the Local AvatarAvatar An avatar is an image or illustration that specifically refers to a character that represents an online user. It’s usually a square box that appears next to the user’s name. Project.

The Consent API in its current form does not distinguish between consent preferences for users who are registered and logged in, vs. those who are either not registered, or registered, but not logged in.
This means that all consent preferences are currently saved in cookies.

This means that there are two approaches available to the team. Either we can use the wp_set_consent() function from the user’s profile page to allow them to manage their preferences and prevent unnecessary API calls (proposal 1 – status quo), or we can let the database be the ultimate source of truth to provide a more robust API, rather than an interface for an analytics opt-out (proposal 2).

There has been a lot of discussion in the channel lately. I will post a separate P2P2 A free theme for WordPress, known for front-end posting, used by WordPress for development updates and project management. See our main development blog and other workgroup blogs. post for discussions such as prompting logged in users who previously opted in for consent again if new cookies are added – or at the very least least providing the necessary hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same. and filters for plugins to do so. Those are concerns can be realistically and effectively addressed in the UIUI User interface design requirements.

This is a fundamental design choice and while the window is wide open now, it will not remain so for long, as 5.6. approaches.
For purposes of this discussion, we please need input on the following, so that we can take the matter to dev chat:
1. Should consent preferences for registered users (applicable when logged in) be saved in cookies, or should they be saved in the database?
If consent preferences are saved in cookies, these could be displayed (and updated) in the user profile, but the choice would be transient and would effectively need to revert to site defaults every time the cookie is cleared.
2. If they are saved in the database, should the REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think “phone app” or “website”) can communicate with the data store (think “database” or “file system”) https://developer.wordpress.org/rest-api/. be used to expose the logged in user’s consent preference on the front end?
3. If the REST API is used, should a new REST endpoint be created, or should register_meta() be used instead?
4. Should the consent preference be exposed on the front end using wp.data? The trade-off being that this provides nicer abstraction and makes it easier to move towards object-oriented, rather than event-orientated programming, but adds a few KB to the front-end?
5. If wp.data is used, should only this be used, or should the consent preference still be exposed to the front end by a method in point 3?

Thank you for everyone who has participated in this discussion on SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. so far. I intentionally did not include who made which proposals for this P2 post, in order to focus on the merits of the alternative solutions, but will credit participants in tickets if those need to be created.
Participants in the Slack discussion are of course very welcome to express their opinions here! 😀

Your inputs are appreciated!

#consent-preferences, #consent-api, #core-privacy, #privacy, #request-for-comment