記事検索:
qa_006
HTMLにはフレームという、HTMLページ内に別のHTMLページを表示する機能があります。しかし、iWebではフレームセットを使用した一般的なフレームを利用する事は出来ません。
しかしiWebでフレームに相当する機能が使えないかというと、そうではありません。
フレームの一種ですが、インラインフレームという機能を使えば、フレームで実現しようとする事の大半は実現できます。
そこで、このページではインラインフレームを使ったページの作成方法について少し解説します。
2008/10/28
フレームを使う一番の目的は、コンテンツのメニュー部分とコンテンツ内容を切り離す事だと思います。メニューと内容を切り離してしまえば、メニューを変更する時に全部のページを変更しなくても済むからです。
当サイトを例にすると、下の写真の赤い部分がメニュー、緑の部分がコンテンツとして切り離す事が出来そうです。当サイトはサイト全体で100ページほどになりますが、メニューはフレームを使用していない為、少しの修正があっても全ページを修正する必要があります。なぜ当サイトでフレームを使用していないのかは後述します。
上の写真の赤い部分、メニューの部分をiWebで切り離す為には、HTMLスニペットを使います。HTMLスニペット自体も別ファイルとなっており、独立している形ですが、さらに「インラインフレーム」を使ってメニューのHTMLを独立させるのです。
全体の流れは下のイメージ図をご覧ください。
まず独立させる共通部分のメニューの書かれたHTML「menu.html」を準備します。テキストエディタや他のHTML作成ソフトでHTMLファイルを作成してください。
HTMLファイルを作成したら、サーバーの任意の場所にアップロードします。
menu.htmlを作成しサーバーにアップロードします
メニュー部分にHTMLスニペットを配置して、HTMLスニペットのウィンドウに以下のようにHTMLを書きます。
HTMLスニペットでmenu.htmlを呼び出すHTMLを書きます
<IFRAME SRC="http://ドメイン名/フォルダ名/menu.html" name="メニュー" frameborder="no" scrolling="no" marginwidth="0" marginheight="0" width="160" height="800"></IFRAME>
赤字の部分には、先ほどサーバーにアップロードしたmenu.htmlのURLを入力し、青字の部分にはメニューの幅、緑の字の部分にはメニューの高さを設定します。
これで、先ほどのイメージ図の通りにメニュー部分を独立・切り離す事ができます。
前述の通り、当サイトではこの方法でメニュー部分を構築しておりませんので、メニューに変更があった場合は100ページを全部修正する必要があります。それでも使わない訳は、内部リンク対策です。
メニューを独立させなかった場合、メニュー部分でリンクをしているページには、自分以外の99ページからリンクを貼られています。サイト全体のページ数が増えれば増えるほど、リンク元になるページ数も増えます。
しかし、独立させてしまうと見た目は別のページでも、内部的には「menu.html」からしかリンクは貼られていませんので、ページ数が増えても内部リンクまで増えないのです。
メニューに掲載しているページは、各コンテンツのトップページなどの重要なページが多いので、面倒でもすべてのページにメニューを設置しているという訳です。
参考リンク:内部リンクを増やそう
内部リンクはGoogleなどのロボットが効率よくサイト全体を読み込む為に必要な考え方ですが、ページのメンテナンスにかかる時間と天秤にかけて、良い方を選択すると良いでしょう。
私は150ページを超えたら、この方法でメニューを構築しようと考えています。
qa_005
2008/06/28
iWebでフレームを設定する事はできますか?
フレームの使い道について
iWebでメニュー部分を独立・切り離す方法
当サイトでこの方法を使用しない訳
このサイトはApple iWeb を使用して作成しています。
ご意見などはお問い合わせフォームからお願いいたします。
当サイトは、Yahoo!カテゴリ(Macintosh > アプリケーションソフト)掲載サイトです。