タイトル

タイトルとは

タイトルとは、ページの先頭に書く見出しのテキストのことです。タイトルの目的は、ユーザーが行うべきアクションを伝えることです。

タイトルはページに1つだけで、情報階層の一番上位にあります。多くの場合、htmlタグでいうh1で表現されますがh1で表現されずにspanやh2以下で表現されることもあります。

このガイドラインで触れるタイトルの概念は、そのページが何のページであるかを一言で示すものです。デザイン上の大小は関係ありません。

タイトルの種類

タイトルは、ページの内容によって、一般型・アクション型・固有名詞型の3種類に分けることができます。このガイドラインでは、メインアクションが一つしかないページのタイトルをアクションタイトル、メッセージ画面などで個人名などがタイトルにくるページを固有名詞型、それ以外の通常のページを一般型と定義します。

1. 一般型タイトルとは

一般型タイトルとは、サービスの一般的なページにつけるタイトルです。たとえば「プロフィール編集」「すべてのメール」「カート」「メッセージ」「通知」「連絡先」などが一般型タイトルにあたります。

一般型タイトルの書き方

一般型タイトルはそのページの機能をあらわす名称を、名詞でできるだけ短く書きます。たとえばこれまでの支払い履歴を確認できる機能をもつページのタイトルには「お支払い」と書きます。「〜について」や「〜を確認する」などの言葉は必要ありません。「ユーザーがそのページにいて正しいと感じられるように、ページでできることを総称して名詞で表現します。

adobeのプロフィール画面
タイトルに「プロフィール」と表記している。

出典：adobeサイト

googleのメニュー画面
タイトルに「情報共有と連絡先」と表記している。

出典：google

一般型タイトルの例外的な書き方

例外として動詞を含む文章で表現するケースも見られます。この場合は、ユーザーがそのページで取り得る選択肢、アクションの総称をつけます。たとえばプロフィールのプレビュー画面において「How you look（このように表示されます）」のような使い方をします。英語では見られることがありますが日本語ではあまり見ることはありません。

2. アクションタイトルとは

アクションタイトルとは、ユーザーを誘導するページにおいて、取るべきメインアクションが1つのページにつけるタイトルです。たとえば「依頼する」「ログイン」「決済する」などがアクションタイトルです。

アクションタイトルには、「ユーザー主導型」と「サービス主導型」があります。ユーザーが意思を持って動作を行うページなのか、サービス提供者がユーザーに動作を行わせるページなのかという観点で使い分けます。

ユーザー主導型アクションタイトルとは

ユーザー主導型アクションタイトルとは、ユーザーが意思を持って動作を行う、かつ取るべきアクションが1つのページにつけるタイトルです。たとえばユーザーが決済を行うページにつける「決済する」などがユーザー主導型アクションタイトルです。

ユーザー主導型アクションタイトルの書き方

ユーザー主導型アクションタイトルは、動詞の形でメインアクションの内容を端的に記載します。たとえば「依頼する」「注文内容を確定する」「確認して支払う」などです。ページ内で行動する必要があることを明確に伝えるために「依頼」「決済」などの名詞ではなく「依頼する」「決済する」といった動詞で表記します。アクションを明確にするために、余計な情報は極力省いて短く記載します。

airbnbの予約画面
タイトルには「確認して支払う」と記載されている。

出典：airbnb

Amazonのプロフィール画面
タイトルには「名前を変更」と記載されている。

出典：amazon

ユーザー主導型アクションタイトルのテクニック（「する」の省略）

ユーザー主導型アクションタイトルは極力短く書くために語尾の「する」を省いて書くことがあります。たとえは「ログインする」ではなく「ログイン」、「アカウントをアップグレードする」ではなく「アカウントをアップグレード」のように「する」がなくても意味が十分に通じて違和感がない場合には「する」を省略します。

Amazonのプロフィール
タイトルには「クレジットカードまたはデビットカードを追加」と記載されている。「追加する」の「する」は省略されているが特に違和感はない。

出典：amazon

サービス主導型アクションタイトルとは

サービス主導型アクションタイトルとは、サービス側がユーザーをリードして情報を入力させるページで使用するタイトルです。ユーザーが自ら動作を行いたいわけではなく、サービス側の都合で操作を行ってもらっているシーンで用います。

たとえば、初期にプロフィール情報を登録してもらうページのタイトルに「所在地を入力してください」と記載してもおかしくありません。一方、このようなページに「所在地を入力する」と記載すると違和感があります。これは「所在地を入力」してほしいのはサービス提供者であり、ユーザー自身が主体的にやりたいことではないためです。

サービス主導型アクションタイトルの書き方

サービス主導型アクションタイトルは、サービス提供者が主語となり、依頼文や疑問文のような形式で書きます。たとえば「プロフィールを登録してください」のようなイメージです。タイトルを通して、ユーザーをリードしてアクションを起こしてもらうことを目指します。

書き方はトーンによって使い分けます。各サービスであらかじめ設定しているトーンをもとに、場面に応じてニュートラル・丁寧・カジュアルなどのパターンから使用することができます。

ニュートラルなトーン

丁寧なトーン

カジュアルなトーン

励ましのトーン

3. 固有名詞型タイトルとは

固有名詞型タイトルは、人名などの固有名詞をタイトルにそのまま記載するものです。たとえば、メッセージ画面や、ブログの個別記事などでは固有名詞型タイトルを用います。

3. 固有名詞型タイトルの書き方

固有名詞型タイトルには、固有名詞をそのまま記載します。「〜について」などの冗長な言葉を加える必要はありません。たとえば、メッセージをやりとりする画面では「山田太郎とのメッセージ」ではなく「山田太郎」といった固有名詞を書きます。

Behanceの個人ページ
個人名がタイトルにそのまま記載されている。冗長な言葉はついていない。

出典：Behance

【補足】キャッチコピー型タイトル

LPや製品説明ページなどではキャッチコピー型のタイトルが用いられることがあります。たとえば「自分らしく過ごせる第三の場所」などです。しかしこれはシステムのUXライティングとは分けて考えるべきです。システムの場合は機能的な名称をタイトルに書きますが、LPの場合には、例えば会社名や製品名などタイトルがあきらかな場合には省略し、キャッチコピーだけを書くことがあります。

Adobeの製品LP
製品名が省略され、キャッチコピーがタイトルとして用いられている。

Appleの製品LP
製品名であるiPhoneSEがタイトルとして記載されているが、キャッチコピーがより全面にでている。