今回はPodcast Episode 01ということで、Facebookのリブランドから考えるLetter Casingの使い分けについてご紹介していきたいと思います。
意外とわかっているようでわかっていないLetter Casingの話をニュアンスを交えてわかりやすく解説しました。
トランスクリプト
野村: みなさんこんにちわ。ホストの野村です。
今回はPodcast Episode 01ということで、Facebookのリブランドから考えるLetter Casingの使い分けについてご紹介していきたいと思います。
今週の月曜日、11月4日にFacebookが新たなブランド FACEBOOKへと生まれ変わると発表。声だと伝えわりにくいのですが、Facebookの文字を全て大文字に変更しました。
Messenger, Instagram, Whatsapp, Oculusなど、様々なサービスを束ねるコーポレートブランドとしてのFACEBOOK。SNSとしてのFacebookとコーポレートブランドとしてのFACEBOOKを分けたい狙いがあるようですが、これが少し不評・・・というかネタにされています。
その理由が、FACEBOOKの文字がAll-Capsつまり、全て大文字だからです。
今回は、この英語の小文字・大文字の使い分け、Letter Casingについて少しお話をしたいと思います。
日本語では存在しない概念なので、よくわからず使用している方が多いのではないでしょうか？なんとなく見栄えがいいからCapitalにするなどしていないでしょうか？
よく昔からある日本のブランドはAll-Capsで構成されていたり、メールの題名を全て大文字で構成しているものがありますが、これは是か非か？
ウェブサイトやプレゼンテーションでどのようなLetter Casingを運用すべきか？
今回のPodcastではあなたの、これらの問いに対するヒントが見つかるかもしれません。
ウェブサイト、ニュースレター、プレゼンテーションなど
英語のデザインをする上で、重要な要素の1つが大文字と小文字の使い分け。これを英語でLetter Casingと呼びます。
小文字は英語で Lowercase、大文字は ‘Uppercase’ もしくは ‘Capital’ と言います。CapsはCapitalの略です。
特によくみかける失敗としては、文言の強調のために大文字を多用するケース、しかし、これは強調どころか、逆効果なのでやめた方がいいかと思います。
まず、Letter Casingの種類をご紹介すると、Letter Casingには大きく3つ存在します。
A. All Capital (AC): 全て大文字
B. Title Case (TC): 各文字(word)の初めの文字が大文字。
C. Mixed Case (MC): 文章(sentence)の初めの文字のみ大文字。一般的な文章のLetter Casing
では一つ一つ順を追って見ていきましょう。
A. All Capitalは1-2文字程度のナビゲーションに使用
まず、All Capitalとは文字全てを大文字にすることを指し、”20% OFF LIMITED OFFER” のように全て大文字にすることで文言を強調するために使われます。
しかし、このAll Capitalはむやみやたらに多用しない方が良いです。
1つ目の理由は「スパムのように見える」ため。大文字は確かに目立ちますが、これを多用するとスパムっぽく見えます。
All Capitalのニュアンスを声にてわかりやすく伝えると、叫んでいるようなイメージを想像するとわかりやすいかもしれません。
冒頭のFacebookのリブランドの例で言うと、FacebookからFACEBOOK!!になった・・・と言うイメージです
他にも例えば、北米で人気の掲示板サイト, Redditにて感情的にポリティカルなテーマについて話をしているSub-redditではよく文章全体が大文字になっていたりします。
事実、大文字を使用すれば使用するほど、Emailのスパムフィルターに引っかかりやすくなります。大文字がスパマーに多用されているのがその理由です。
そのため、大文字の多用 = スパムっぽい印象を与えかねません。
そして、大文字を多用しない方が良い2つ目の理由は「可読性(Readability)が低い」ためです。特に文章をまるごとAll Capitalにするととても読み辛いものになります。
> “When text is set in all capital letters, reading speed is slowed about 13 to 20 percent (Breland & Breland, 1944). Reading speed is optimal when uppercase and lowercase letters are used (Poulton, 1967; Rickards & August, 1975). When extra emphasis is needed, bold has been found to be a better cue than uppercase (Coles & Foster, 1975).”
> 文章がAll Capitalの場合、読解スピードが13-20%遅くなる (Breland & Breland, 1944)。大文字・小文字を使用した方が、読解スピードが最適になる(Poulton, 1967; Rickards & August, 1975)。強調したい場合は太字の方が良い(Coles & Foster, 1975)
参照: Why letter casing is important to consider during design decisions
上記で提案されているように、強調する場合はBold (太字)や文字装飾で行うようにしましょう。
では、All Capitalは全く使用しない方がいいのかというと、そうではありません。
上記のMediumの記事で紹介されているように、ウェブサイトのナビゲーションに使用するのはokだと考えています。
ナビゲーションは他の要素と差別化したい + 1〜2ワードで構成されているためです。文字数が少なければ、可読性を阻害しません。
実際にナビゲーションにAll Capitalを使用している例はMediumやMcCANN NEW YORKのサイトがあります。
参照: Medium
※Mediumのホームページがリデザインされたようで、このスクリーンショットは以前のものになります。(2019年11月13日現在)
参照: McCANN NEW YORK
All Capitalを使用すべき場合:
– ウェブサイトのナビゲーションなど 1もしくは2ワードで構成される短いワード。
– 他の要素と差別化を図りたい場合
All Capitalを使用すべきでない場合:
– 1〜2ワード以上で構成されているフレーズや文章。
B. Title Caseは強調させたい見出しに使う
次にTitle Caseについて
Title Caseは文字の初めを強調することを指します。例えば、”We Are Making The World a Better Place”のように各ワードの初めの文字を大文字にします。
各文字の初めを大文字にすることで、文字の間に余白のようなものを生み、文字一つ一つを個別に認識させることができます。
イメージを掴んでもらうために、以下に具体例を示します。
1. “We are making the world a better place”
2. “We Are Making the World a Better Place”
これを無理やりTitle CaseとMixed Caseのパターンに分けて日本語風に直すと
1. 我々はこの世界をよりよい場所にしている
2. 我々は この世界を よりよい 場所に している
これは少し大げさなので、宇宙人っぽい感じになりますがイメージはこんな感じです。
文章のようにすらっと読み流して欲しくない箇所、例えばタイトル・バナーの文言など、注意を引きたいところに使用されています。
例えば、MediumのブログタイトルはこのTitle Caseを使用しています。
参照: Medium
※Mediumのホームページがリデザインされたようで、このスクリーンショットは以前のものになります。(2019年11月13日現在)
先ほど、ナビゲーションにAll Capitalを使用されている例をご紹介しましたが、Title Caseを使用しているケースもあります。
TechCrunchはその一つの例になります。
参照: TechCrunch
Title Capitalを使用する際、全ての文字を大文字にするわけではありません。大文字にしないワードは以下の通りとなります。
冠詞: the, a
前置詞: of, in, on, to, for, at など
接続詞: or, and など
ただし、実際の運用方法は確立されたものではないので、何が正解というものは存在せず、
人によってばらつきがあるのも事実です。上記はあくまで、一般的に大文字されないことが多いという認識程度でお考えください。
Title Capitalを使用すべき場合:
– 10文字前後の長めのタイトル・見出し
Title Capitalを使用すべきでない場合:
– 長文や本文
最後にMixed Caseは通常の文章で使用されているLetter Casingです。Sentence Caseとも言われます。先にご紹介したAll CapitalとTitle Case以外はこちらを使用するとお考えください。
— (Outro) —-
今回はLetter Casingについてお届けしました。いかがだったでしょうか？
私も英語を使い始めた当初、Letter Casingの部分は曖昧で、特にニュアンスやLetter Casingの使い分けに伴う影響などを考えずに使っていました。
Letter Casingを正しく使い、FACEBOOKみたいな失敗をしないようにしてください。
ではまた次回まで。さようならー。
の前に皆さんにお願いがあります。実はPodcastでは購読して頂いている方が何名いて、何名くらいがこのエピソードを聞いて頂いたのかわかりません。もし今回のエピソードが面白いと思った方はPodcastのレビューセクションから評価とコメントをいただけるとモチベーションにつながります。
また、このPodcastをまだ購読していない方はそちらも併せてお願いします。
では改めて、さようならー。
Photo by Matt Jones on Unsplash
