This tutorial features the Feast Plugin, which contains theme enhancements.
The Convert text to fractions setting fixes a significant accessibility issue with recipe sites, by replacing text such as 1/4 with a proper fraction, like ¼.
This is because screen readers read text literally, so a measurement like
- "1/4 tablespoon salt" is read out loud as "one slash four tablespoon salt"
- "¼ tablespoon salt" is read correctly as "one fourth tablespoon salt"
Using text instead of fractions is vague and confusing to those using screen readers, leaving them wondering if they should be using 1 or 4 tablespoons of salt, instead of ¼.
That's 4 or 16 times the actual amount!
Using proper fractions instead of text-based methods demonstrates that effort was made to present things professionally.
Just like you'd never publish a cookbook without proper formatting, your website shouldn't publish recipes without proper formatting.
Solving this for hundreds of recipes is as simple as checking off the option in the Feast Plugin:
This isn't just better for visually impaired users, it presents a much more professional recipe, like those found in professional publishing sites:
We've included all the common fractions for recipe sites:
- 1/2 = ½
- 1/3 = ⅓
- 2/3 = ⅔
- 1/4 = ¼
- 3/4= ¾
- 1/5 = ⅕
- 2/5 = ⅖
- 3/5 = ⅗
- 4/5 = ⅘
- 1/6 = ⅙
- 5/6 = ⅚
- 1/8 = ⅛
- 3/8 = ⅜
- 5/8 = ⅝
- 7/8 = ⅞
This has been tested with WPRM's serving adjustment feature and works fine. When scaling a recipe up or down, WPRM automatically converts fractions to decimals.
This means that if ¼ of salt is used for 1 serving, and the user scales the recipe to 2 servings, the output becomes 0.5, rather than ½. This is fine.
- This does not change the contents of the recipe card, only what is output to the screen on posts
- This converts all text-based fractions in both the post content and the recipe card, on your posts
- This does not convert the output of the recipe card's "print" screen
- If you've set some third-party custom font for your post content or recipe card, the fractions may not be output in a legible way
- Because the fraction character is half the size of the text, you'll want to make sure you're using a body font size that's large enough for mobile devices (18 and above for most fonts)
- We haven't included sevenths because there is no character equivalents for this unusual measurement
- After enabling this, we recommend visiting your top 8 recipes to make sure the units make sense
- You may need to clear your cache for this to show up for non-logged-in users
Special shout out to WP Recipe Maker, which actually does have these fractions available for people to use, though we never seen them actually used in practice:
While you could go through all your recipes and manually replace these units in the WPRM recipe card, it still leaves unedited fractions in the actual post content.