
iWebでページタイトルを設定する方法(1)
ここでご紹介しているTipsは、iWeb’08をご利用の場合のTipsです。 iWebで制作したホームページでは、ページタイトルはページインスペクタで設定したペ […]
- 2016/5/4
- 2008/10/17
ここでご紹介しているTipsは、iWeb’08をご利用の場合のTipsです。
iWebで制作したホームページでは、ページタイトルはページインスペクタで設定したページ名になってしまいます。その為、ページタイトルを日本語にすると、ファイル名まで日本語になってしまい、一部のブラウザやサーバで正しく表示されないなどの問題を引き起こします。
しかし、iWebのブログテンプレートを活用すれば、ページタイトルを日本語のタイトルに設定して、かつファイル名は英数字にする事が可能です。
このTipsはMobileMeはもちろん、「フォルダに公開…」機能を使って出力したHTMLにも有効です。
サンプル
まずこのページでご紹介するTipsを使ったページのサンプルをご紹介しましょう。
下の写真をご覧いただければ分かりますが、URLは「http://banner-pic.com/banner-pic/goods/goods.html」となっており、ページタイトルは「雑貨などの写真 | バナー素材写真 | 無料ダウンロード | Banner Photo BOX」となっています。
このページはiWebだけで設定しており、テキストエディターで書き換えたりと一切の手は加えていません。最終的にこのようなページを制作する方法をご紹介します。
ページはすべて「ブログ」でまとめる
iWebでは、ページを制作する際に、写真や動画などの用途別にテンプレートを選ぶ事ができます。
しかし、サンプルで挙げたサイトでは、すべてのコンテンツにおいて「ブログテンプレート」を使用して、ページを制作していきます。
実際のiWebでどのようになっているのかは、下の写真をご覧ください。
ページのタイトルを入力するテキストボックスを活用する
ブログテンプレートには「ページのタイトルを入力するテキストボックス」と「ページの主文を入力する」テキストボックスがあります。
ページの主文を入力するテキストボックスは、それほど重要ではありませんが、ページのタイトルを入力するテキストボックスは重要です。なぜなら、このテキストボックスに入力された文字が、ブラウザ上でのページタイトルになるからです。
サンプルとして挙げたサイトのように、「ページタイトルらしい言葉」を入力する場合は、テキストボックスの位置に気をつけなくてはいけません。そのページの見出しのように振る舞ってしまっては、何とも不格好になってしまうからです。
そこで、サンプルのサイトでは、この「ページのタイトルを入力するテキストボックス」をヘッダー部分に移動して、ページの見出しは新規テキストボックスを作成して設定しました。
ページの最上部にある白地のテキストが、iWeb上の「ページタイトル」にあたります。
iWebでページタイトルを設定する方法(2) では実際にページを制作する手順を解説したいと思います。
iWebについて
iWebは2011年7月に公開されたバージョン3.0.4以降、アップデートされておらず、最新のOSX環境で正常に動作するか分かりません。
そのため、MacでWebサイトの作成をする場合は、有料で販売されているソフトか、WordPressなどのCMSを利用されることをお勧めします。
WordPressの導入から基本的な使い方、プラグインの活用、テーマのカスタマイズまで、WordPressの使い方全般をまとめています。
無料で利用できるホームページ作成ソフトには、オープンソースのKompozerもありますが、こちらのソフトも2011年以降バージョンアップしておらず、最新環境で正常に動作するか分かりません。