MASHの「ホームページのススメ (Windows版)」


MASHのお友達Katzeさんのサイトです。===>

KatzenGaruten
評価ポイント:ネコ関連素材が豊富でかわいい。


ホームページを今すぐ作ってみよう!「テキスト・エディター編(その11)」

どうしても、お金を掛けずに自分でホームページ(以降 HPと呼ぶ)を作ってみたい人は、テキスト・エディターを使ってトライしてみよう。テキスト・エディターっていうのは、テキストが書けるソフトなどを指す。(フリーウエアも一杯ある)例としては、Windowsにオマケで付いている「メモ帳」などである。

以前、MASHもフレームを使ったHPを作ったり、いじったりしていました。それなりに工夫すれば、ステキなものになるのですが、やはり、コンテンツ数がある程度多くないと、空き地だらけになったり、同じコンテンツが異なるフレームにダブってたりと、フレームの必要性を感じなくなってきました。でも、それは、あくまで、MASHの問題であり、前述の通り、うまく使えばいいわけですので、MASHの苦い経験と合わせて解説させていただきます。

注)事前に拡張子が見える設定になっていないと付けたつもりの拡張子がファイル名の一部として誤認される。だから、エクスプローラー →メニュー「表示」→ フォルダーオプション→タブ「表示」→「登録されているファイルの拡張子は表示しない」にチェック(v)が入っていたら、外すこと。
フレームをいくつにしようか?
2〜4個のフレーム構成が 一般的と思われる。それ以上だと、重たくなる可能性が高い。
下の<html>〜</html>の間を全て、コピーして、メモ帳へペーストしたら、cursol.html という名前でファイルしてみよう。他の名前でもOKだけど、拡張子は、html,またはhtmであること!

<html>

<head>

<!--
左側にメニュー枠、右側の上にお知らせ枠、右側の下にメイン枠 という
レイアウトを作ります。

左のメニューにあたるページ名を、ここでは、sidemenu.html

右上のお知らせにあたるページ名を、ここでは、inform.html

右下のメイン・ページ名を、ここでは、maincontents.html

とします。これら3つのページを先に作成しておいて下さい。
-->

<title>フレーム自由自在</title>

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

<!--

のcolsは、ひとつのページをタテ割りにして左右に二つのフレームを並べるという意味。

数字の170は、170ピクセルの幅でsidemenu.htmlを表示し、残りのピクセルでinform.htmlと

maincontents.htmlを表示するという意味。frame nameは、適当に名前をつけて良いが、

そのframeがどの部分に相当するか判るような名前が望ましい。 frameborderは、frame間の境界線の幅を

示す。ここに数字を入れると線幅が設定される。

-->

<frameset cols="170,*" frameborder="NO">

<frame name="leftName" src="sidemenu.html">

<!--

のrowsは、ひとつのページをヨコ割りにして上下に二つのフレームを並べるという意味。

数字の100は、100ピクセルの高さでinform.htmlを表示し、残りのピクセルで

maincontents.htmlを表示するという意味

-->

<frameset rows="100,*" frameborder="NO">

<frame name="topFrame" src="inform.html">

<frame name="rightFrame" src="maincontents.html">

</frameset>

<!--

冒頭に、3つのページを予め作るようにお願いしたが、その内のメニューページから各コンテンツへジャンプ

する設定時、各ページをHP全体で見せるのか、右下のメイン・ページのみで見せるのかなどを

よく考えておきましょう。タグは、target="rightFrame"で、右下に、また、target="_top"で

HP全体に、ジャンプ先ページを開く指定を行う。少なくとも、メニューから左のメニュー自体のところに

開かないように、target="_self"は避けること。詳しくは、下の枠外に、3つのページをバラバラにアップしておくので、

それらのソースを覗いてみて欲しい。

noframesのタグは、フレーム未対応ブラウザーでアクセスしてきた場合に、所定のメッセージを

表現できるタグ。最近では、フレーム未対応ブラウザーを利用する人が、どの程度、おられるか判らないが・・・

-->

<noframes><body bgcolor="#FFFFFF">

フレーム対応ブラウザーでご覧下さい。

</body></noframes>

</html>

結果として、このようになります。 
更に、sidemenu.html inform.html maincontents.html も個々にご紹介。

FLASHについて:
ブロードバンド普及の昨今、FLASHも多少、重いものでも快適に表現できるようになってきた。
余計なダイエット処理をしなくても良いというのは、ある意味、Creativeな人たちからは歓迎される要素だろう。
ただ、周りの人全てがそうでないということもお忘れなく。ビジターのネット環境を限定してでも見せたいものがあれば、
それもひとつのアプローチと言えるので、否定はできない。しかし、アクセスアップ優先の場合は、やはり、軽くすることが
必須要件になるのも事実。ここら辺のジレンマで、最後は、個々のスキルと忍耐で結論が出るのかもしれない。

有名・強力壁紙関連サイトへのリンク MASH厳選 素材リンク集

次回 「テキスト・エディター編(その12)」 をお楽しみに!

MASHのHPへ