HTMLでタイトルを設定する方法

皆さんはWebサイトで公開するページにタイトルを付けていますでしょうか？WordPressなどのCMSでは、自動で設定してくれたり、付け忘れていたらプラグインなどが警告文などで知らせてくれます。

しかし、CMSなどを利用せず1から作成する場合タイトルタグを付け忘れるとSEO対策漏れで上位検索にヒットしない可能性があります。これはとても勿体ないことなので、必ずタイトルを付けましょう。

本記事では、HTMLでタイトルを付ける方法について解説しています。

ITエンジニア特化の転職サイト！
自社内開発求人に強い【クラウドリンク】

先輩くん

年収、休日数、労働環境等クラウドリンクが審査し、これらを通過した優良求人情報のみ紹介しているよ！

後輩ちゃん

100％自社内開発の求人だから、SESのように職場環境が変わらないのがいいね！

簡単30秒で無料登録！

HTML/CSSの学習におすすめ参考書
1冊ですべて身につくHTML&CSSとWebデザイン入門講座

本書情報
著者	Mana
発売日	2019/3/16
ページ数	280ページ
Kindle版	○
レビュー (Amazon)	(1,654件)

１冊ですべて身につくＨＴＭＬ＆ＣＳＳとＷｅｂデザイン入門講座 /ＳＢクリエイティブ/Ｍａｎａ

posted with カエレバ

楽天市場

Amazon

Yahooショッピング

Contents

1 タイトルを設定する方法
2 タイトルが正しく設定されているか確認する方法

タイトルを設定する方法

タイトルを設定する方法はとても簡単で、<head>タグ内に下記のコードを追加することで設定が完了します。

<title>ここにタイトルを記述</title>

タイトルの文字数は30文字以内が推奨されています。

タイトルが正しく設定されているか確認する方法

タイトルを設定してみたけど、正しく設定できているか分からなくて不安。。という方ご安心ください。タイトルが正しく設定されているかを確認をする方法を解説します。

確認するサンプルコードは以下のとおりです。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>タイトルだよー！！</title>
</head>
<body>
</body>
</html>

タイトル確認したいhtmlファイルをブラウザで開き、タブに記載されている文字を確認します。この文字がタイトルと同じであれば、正しく設定されています。