見出し画像

どんな名前にしてる?|Webサイトデザインコーディング(備忘録・初心者向け)

ふとWebサイトの下層ページを作ろうと思った時に、他の会社ではどんな風にしているのか気になって調べてみることにしました。(ないとは思いますが)業界や会社の規模によって違いがあるのかなど、調べてみた結果を備忘録的にまとめておきたいと思います。

結論から言うと、日本語の場合

・トップページ: 会社名(サービス名)
・下層ページ: ページ名 | 会社名(サービス名)

が多く、英語の場合は上記の縦線「|」がハイフン「 - 」になっていたページが多かったです。

大企業(日本)

トヨタ

<!-- トップページ -->
<title>トヨタ自動車WEBサイト</title>

<!-- 企業情報 > 会社概要 > 会社案内 -->
<title>会社案内 | 会社概要 | 企業情報 | トヨタ自動車株式会社 公式企業サイト</title>

-----------------------------------

株式会社ユニクロ / UNIQLO CO., LTD.(オンラインストア)

<!-- トップページ -->
<title>ユニクロ公式オンラインストア | ユニクロ</title>

<!-- 会社概要 -->
<title>会社概要 | ユニクロ</title>

<!-- 店舗検索 -->
<title>店舗検索 - UNIQLO | ユニクロ店舗検索</title>

-----------------------------------

株式会社 ファーストリテイリング  FAST RETAILING CO., LTD.

<!-- トップページ -->
<title>株式会社 ファーストリテイリング</title>

<!-- 会社情報 -->
<title>会社情報 | FAST RETAILING CO., LTD.</title>

<!-- 会社情報 > 概況 -->
<title>概況 | FAST RETAILING CO., LTD.</title>

-----------------------------------
ANA

<!-- トップページ -->
<title>ANA|航空券 予約・空席照会・運賃案内・国内線</title>

<!-- ANAグループについて -->
<title>ANAグループについて | ANAグループ企業情報</title>

<!-- 会社概要 -->
<title>会社概要(ANAホールディングス株式会社) | ANAグループについて | ANAグループ企業情報</title>

-----------------------------------

日清

<!-- トップページ -->
<title>日清食品グループ</title>

<!-- トップページ > 日清食品ホールディングス > 会社概要 -->
<title>日清食品ホールディングス - 会社概要 | 日清食品グループ</title>

-----------------------------------

味の素 

<!-- トップページ -->
<title>味の素株式会社 ~Eat Well, Live Well. ~AJINOMOTO</title>

<!-- トップページ > 味の素グループについて > 会社概要 -->
<title>会社概要 | 会社データ | 味の素グループ</title>

-----------------------------------

日本経済新聞

<!-- トップページ -->
<title>日本経済新聞</title>

<!-- 会社概要 > 企業情報 -->
<title>会社概要 : 企業情報 | 日本経済新聞社</title>


中小企業(日本)

ドリームインキュベータ(コンサル)

<!-- トップページ -->
<title>ドリームインキュベータ | 戦略コンサルティングやインキュベーションなど独自の経営支援サービスを提供</title>

<!-- 会社概要 -->
<title>企業情報 | DI</title>

-----------------------------------

帝国書院

<!-- トップページ -->
<title>帝国書院</title>

<!-- 会社案内 > 事業内容 -->
<title>帝国書院 |会社案内 事業内容</title>

-----------------------------------

データ・アプリケーション(ソフトウェア)

<!-- トップページ -->
<title>EDIツール・データ連携システムならDAL(株式会社データ・アプリケーション)</title>

<!-- 会社情報 > 会社概要 -->
<title>DAL-データ・アプリケーション|会社案内|会社概要</title>


デザイン事務所・Web制作会社(日本)


株式会社日本デザインセンター Nippon Design Center, Inc.
無印良品のブランドデザインを手掛けた原研哉さんのデザイン事務所です。

- 会社名 | company
- 会社概要 | 日本デザインセンター

<!-- トップページ -->
<title>日本デザインセンター | Nippon Design Center, Inc.</title>

<!-- ABOUT -->
<title>会社概要 | 日本デザインセンター</title>

-----------------------------------

チームラボ

- 会社名 / company
- ページ名 | 会社名 / company

<!-- トップページ -->
<title>チームラボ / teamLab</title>

<!-- ABOUT -->
<title>About | チームラボ / teamLab</title>

-----------------------------------

good design company

- 会社名
- ページ名 | 会社名

<!-- トップページ -->
<title>good design company</title>

<!-- Profile -->
<title>Profile | good design company</title>

-----------------------------------

面白法人カヤック

- 会社名
- ページ名 | 会社名

<!-- トップページ -->
<title>面白法人カヤック</title>

<!-- About > 会社概要 -->
<title>会社概要 | 面白法人カヤック</title>

-----------------------------------

LIG

- 会社名|サービス説明
- ページ名 | 会社名

<!-- トップページ -->
<title>株式会社LIG|東京のWeb制作・システム開発・オフショア開発会社</title>

<!-- 会社概要 -->
<title>会社概要 | 株式会社LIG</title>


では、英語のサイトを作る時はどうしたら良いのでしょうか。海外の事例をいくつか調べてみました。

大企業(海外)

Apple

- company
- page name - company

<!-- top page -->
<title>Apple</title>

<!-- About Apple > Newsroom -->
<title>Newsroom - Apple</title>

-----------------------------------

Google(コーポレートサイト)

- 会社概要|サービス名
- サービス内容 | 会社名

<!-- トップページ -->
<title>google company profile - Google Search</title>

<!-- プロダクト -->
<title>Google のサービス - Google</title>

-----------------------------------

LG Electronics(US site)

- company products|company
- page name | company business

<!-- top page -->
<title>LG: Mobile Devices, Home Entertainment & Appliances | LG USA</title>

<!-- about -->
<title>LG Electronics Corporate Profile | LG USA Business</title>

-----------------------------------

TATA

- company name. CI
- page name | category | group name

<!-- top page -->
<title>The Tata group. Leadership with Trust.</title>

<!-- about > companies -->
<title>List of Companies | Investors | Tata group</title>


デザイン事務所・Web制作会社(海外)

MANUAL

- page name|company
- page name | company

<!-- top page -->
<title>Home | Manual</title>

<!-- profile -->
<title>Profile | Manual</title>

-----------------------------------

Stockholm Design Lab

- company
- page name - company

<!-- top page -->
<title>Stockholm Design Lab</title>

<!-- about -->
<title>About – Stockholm Design Lab</title>

-----------------------------------

studio fnt

- company
- page name - company

<!-- top page -->
<title>studio fnt</title>

<!-- about -->
<title>About - studio fnt</title>
​


以上、備忘録ではありますが有名企業やデザインエージェンシーなどのサイトで使用されている<title>タグをご紹介しました。迷った時は、この会社なら正解であろう…!という会社のタグを真似すれば良いのではないでしょうか。

サポートで得られたお金は寄付に使わせていただきます。