このところ、Googleの日本語Webフォントの新顔をザッピングして遊んでいた。
あれこれ試してみた結果、M PLUSファミリーに新たに追加されたM PLUS 2にお世話になることにした。
なんと、バリアブルフォントだぜ！
M PLUS 2
Our long-running Japanese font Mplus by @coz now has whole new additional families👏 Modern and soft Mplus 1, Classic but new Mplus 2, monospaced coding font Mplus Code Latin, and Mplus 1 Code which adds Kana to Mplus Code Latin. 🐕 https://t.co/SZutchSOqg pic.twitter.com/xBPEk30hYo
— Google Fonts (@googlefonts) May 27, 2022
M PLUS 2
With the somewhat classic letterforms, this font pursues new standard of classic modern.
ちょっとだけクラシックな雰囲気を残したデザインは、モダンになりすぎず、かといって従来的なデザインとも異なる、新たなスタンダード書体を目標としました。
情報源: M+ FONTS
永遠の素人としては、バリアブルフォントの説明なんてできないけれど、新しいものはいいはずだ。
Windows環境でチラホラ報告されていたシャギー問題も、解決されているようだ。
GoogleフォントのM PLUS、VariableフォントのほうはWindows機でジャミジャミしないのか👀 pic.twitter.com/9IRJxdkpkl
— みらる🖖CSS面白い (@miral_kashiwagi) March 12, 2022
以前、M PLUS Rounded 1cにお世話になっていたときは、レギュラーウェイトが醸し出す柔らかい雰囲気が好きだった。
M PLUS 2では太いウェイトのニュアンスが特徴的で気に入っている。
だから結局は、バリアブルフォントかどうかなんかではなく、純粋にデザインの好みで決めたわけだ。
WordPressで使う方法
1.ウェイトを選択する
2.外観＞追加CSSに追記
このUkuというテーマで、あてる範囲をピックアップするとCSSは下記の通り。
@import url(‘https://fonts.googleapis.com/css2?family=M+PLUS+2:wght@400;500&display=swap’);
body,
.single-post .entry-content p, .page .entry-content p, .page .entry-content, .entry-content ol, .entry-content ul, .blog.blog-classic .blog-wrap .entry-content ,
h1.site-title a,
p.site-title a,
.entry-summary,
.widget,
.title-footer,
.entry-header p.intro,
.entry-content,
.entry-content p,
.entry-content table,
.entry-content dl,
.entry-content ul,
.entry-content ol,
p.section-about-text,
p.text-big,
p.text-small,
#secondary h2.widget-title,
#sidebar-page h2.widget-title,
.entry-content blockquote p,
.entry-content p span.uppercase,
.section-about-column-two .social-nav ul li a,
.section-about-column-one p cite,
.widget_mc4wp_form_widget input[type=”email”],
.widget_mc4wp_form_widget input[type=”submit”],
.jetpack_subscription_widget #subscribe-email input[type=”email”],
.jetpack_subscription_widget #subscribe-submit input[type=”submit”],
.contact-form input[type=”submit”],
input,
textarea,
.site-content div.wpcf7 input,
.site-content div.wpcf7 textarea,
.site-content div.wpcf7 p,
a.standard-btn,
div.sharedaddy h3.sd-title,
.widget h2.widget-title,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.big-instagram-wrap .clear,
.single-product .entry-summary h1,
.uku-standard.blog-classic .more-link
{
font-family: ‘M PLUS 2’, sans-serif;
}
これが正しいかどうかの裏も取れないまま、もう何年もこのやり方を続けてる。
But it works.
動いてるなら、いいよね。
フォントが人の感情を左右するという研究を知って以来、ブログに表示するフォントは環境に左右されないWebフォントを使うことに確信を持っている。
僕が見ているものと、あなたが見ているものが、フォントの違いで別物になってしまうのは悲しいことだよね。
もっとも、僕は誰かに何かを伝えるためにブログを書いてるわけではないけれど。
Webフォントのことを調べるうちに、フォントいうものが、いかに時間と労力をかけて作られているのかを初めて知ることになる。
心の広い開発者とGoogle Fontsのおかげで、そんなものが無償で幅広く行き渡る世の中になっている。
セカイは思ったよりも、いい方向に進化しているのかもしれないね。
その足取りは、相当にノロマではあるけれど…
