ウェブデザイナーがよく使うゴシック体
見習いデザイナーが先輩に遠慮なく疑問をぶつける社内のデザイン勉強会。5回目のテーマは「ウェブデザイナーがよく使うフォント〜ゴシック体編〜」です。
大事な情報が読みやすいフォント
みなさんはウェブデザインでよく使うフォント（書体）ってありますか？
フォントかー、ヲタク的に好きなデザイナーは多いからね
みなさんもフォントヲタなんですか？
ヲタクとまではいかずとも好きなデザイナーは多いよね
私はフォントヲタといっても過言ではないぐらい好きですが
あ、じゃあ今回ゴシック体（サンセリフ）で、事例付きで見たいです！
ゴシック体かー、結構絞られたな
ヲタクは好きなことになると話が膨みやすいので
このフォントはウェイト（書体の太さ）のバリエーションが多いですよね
このサイトを制作した時に使ったよ
https://www.hyuga-daiichihotel.com/
ポップな感じがしますね
だけど可愛い過ぎず、シンプルで使いやすいんだよね。単純に文字のデザインも好きだし。あとは、数字がいい感じなんだよ
数字が見やすいことも重要ですよね
そう！特に電話番号などは大事な情報だから、可読性の高いフォントを使うように心がけてる
セリフっぽいけどサンセリフ？
えっ、これゴシックですか？先が細くなっているしセリフかディスプレイ系っぽいですけど・・・
Google Fontsでサンセリフにカテゴライズされてたからサンセリフらしいよ。世界のGoogleがそう言ってます！
なるほど、Google先生がそう言うなら・・・
ちなみにこのサイトで使ってるやつね
https://www.shoen.co.jp/
セリフっぽいけどサンセリフなところが、日本語の明朝体ともゴシック体とも合わせやすそうですね
ちょっと丸くてぽてっとしているのが親しみやすくてかわいいんだよね
ぽてっと・・・
ぽてっとしているけど上品さと柔らかい印象も出せて使いやすいのも選ぶ理由のひとつかな
植物がちょっと風でなびいてるっぽい感じなのもかわいいですね
ライニング数字とオールドスタイル数字
よく使ってるのはJosefin Sans（Google Fonts）です
おしゃれな雰囲気のフォントですね
このサイトで使いました
https://www.hotel-newgreen.com/nagaoka/
可読性もありつつおしゃれな雰囲気もあり、って感じですね
Helveticaが主流ですが、それだとちょっと違うなというときに使います。あと、数字が見やすいことが重要という話がありましたが、それがフォントを選ぶポイントになっていますね
具体的に数字を選ぶ時のポイントとかありますか？
アラビア数字には天地の高さが揃っている『ライニング数字』と、天地が揃っていない『オールドスタイル数字』の2種類があります。
『オールドスタイル数字』はたまに見かけますね
それも古典的なおしゃれがあり個人的に好きなのですが、宿泊施設のサイトでは基本的に「ライニング数字」のフォントを選ぶように気をつけています
雰囲気を優先して可読性が低くならないよう、バランスに注意しないといけませんね
日本語との相性で選ぶ欧文フォント
LATO（Google Fonts）が日本語の明朝と相性が良くて好きかな
他のフォントもそうですけど、細いフォント、太いフォント、イタリック体で結構印象変わりますね
一つのフォントのいろんなスタイルを使って、サイトの中で表現できるのがいいよね。LATOはこのサイトで使用したよ
https://genji-koh.kaiei-ryokans.com/
確かに。サンセリフだけど、明朝体との相性が良いんですね
別のフォントでRoboto Condensed（Google Fonts）も好きなんだけど、こっちは日本語のゴシック体と相性がいいなと思う
同じサンセリフの欧文フォントでも、日本語の明朝体、ゴシック体それぞれ相性の良さがあるんですね
まとめ
ちなみに私はこちらのサイトで使用した、
https://www.hachiyon-ph.com/
Questrial（Google Fonts）が好きです。曲線が緩やかで丸い形がかわいいなと思いました。
いろんなサイトを制作した中で、みなさん好きなフォントがあるようでした。雰囲気だけじゃなく、情報を伝える上で読みやすいフォントを選ぶことがポイントなんですね。勉強になります
制作部
制作部所属の見習いデザイナーです。見習いの特権をフル活用して、わからないことを先輩方に厚かましく質問する勉強の日々です。