Below is an attempt to improve the appearance of, mainly, Josefin Sans:
I have reduced the line height of Josefin Sans to 25px, the same as the font size. This gives zero space between the lines, but owing to the increased height of ascenders over x-height it appears there is space between the lines of text. The only problem with this is if an ascender and descender fall in the same position of two lines of text they will be touching.
Let's see if we can further improve the appearance of Josefin Sans:
In the example above I have reduced letter spacing of Josefin Sans by -1.5px, and increased Armata to a line height of 25px to give the same depth of Josefin Sans.
That's about it for sans serif fonts, I hope this has given you some insight into how any font can be customized and adapted to suit your niche and the appearance of your site.
In Part 4 we'll look a different font combinations and some that may be suitable for certain niches.
Reply
I understand that WordPress is removing Google's 'Open Sans'
font option.
Would you know what that means for WP users? Web designers and coders don't seem to like this. Do you know why this is an issue for some people? ~Jude
Secondly, I'm not sure whether this applies to just the WP default Twenty series of themes or all themes. Below is a screenshot of a WordPress plugin that mentions removing fonts from default WP themes. I find it strange that WordPress has a plugin to remove these fonts when they are still named in the latest updated themes stylesheets.
I installed the Twenty Fifteen theme on a test site and changed the 'Noto Serif', serif to 'Open Sans', sans serif, with no problem, unless it would not appear as Open Sans on someone else's browser. As websites built at WA use the WP platform, maybe Kyle or Carson could clarify exactly what it means to WA members.
I have since learned that the removal of Open Sans is from the Admin area of WordPress. See discussion below if you are interested:
https://wptavern.com/wordpress-4-6-to-drop-open-sans-in-the-admin-in-favor-of-system-fonts
It makes more sense now.
I'd like to remove - fonts.googleapis link altogether from my theme. I get a message when speed testing that the CSS needs to be optimized. It must have been included as default by the theme creator because I don't knowingly use google fonts on my site. ~Jude
