デバイスフォント + 約物半角専用のWebフォント「Yaku Han JP」の組見本

  -  2styles Yaku Han JP
Yaku Han JP無し
Yaku Han JP
34px
32px
30px
28px
26px
24px
22px
20px
18px
16px
15px
14px
13px
12px
11px
10px
9px

書体について

QRANOKOさんによる「約物半角専用のWebフォント」。Web業界では相当有名なWebフォントです。Webフォントの文字組は制限が多いなか画期的なWebフォントが開発されています。
行頭に括弧がきたりすると空いていて不格好に見える問題をWebフォント「Yaku Han JP」が解決してくれます!

Webテキストの日本語に含まれる約物を半角にすることができます。例えば「かっこ」や『二重かっこ』、【バッジに使いそうなかっこ】などを半角にできます。ウェイトは全部で7種類。Noto Sans Japaneseに沿っています。

基本的には
、。!?〈〉《》「」『』【】〔〕・():;[]{}
が半角に置き換わるので前後のアキがなくなります。

※左上の「例文・EXAMPLE」のプルダウンメニューから「イベントの案内」を選択して確認してください。

使用フォントに注意!

「Yaku Han JP」は、Noto Sans Japaneseに準じてデザインされているので、他の日本語フォントと組み合わせて使用する際は太すぎたり、大きすぎたりする場合がでてくるので検証が必要になります。

句読点まで詰めるかどうか?

Webフォント「Yaku Han JP」を使用するポイントは「句読点まで詰めるかどうか?」、上のプレビューの組見本では句読点も半角に置き換えて詰めていますが、本文だと読みづらくなるので「句読点」を詰めない設定がオススメです!見出しの場合はデザインによって詰めてもいいのですが、本文は句読点の後ろは空いていた方が読みやすくなります。

コーディング時の設定で「括弧のみ」半角に置き換えて詰めることができるので、デザイナーさんがコーダーさんにコーディングを依頼する際は注意してください。詳細はこちらから確認できます。

CSSの設定

cssのフォント指定は以下になります。
font-family: YakuHanJP, ‘Hiragino Sans’, ‘Hiragino Kaku Gothic ProN’, ‘Noto Sans JP’, Meiryo, sans-serif;
font-weight:400;
font-style:normal;

書体提供・販売

書体制作・デザイン

TAG

よりよりサイトを目指してWikipediaのように「フォントを愛する方、詳しい方から」の情報提供や修正依頼を募集しています!
「原稿をこうして欲しい! 修正して欲しい! リンクの修正依頼・ご意見等」ございましたら、
お手数ですがこちらの改善依頼フォームからご連絡願います!