高度なタグ
- 0 名前： 中級者 ： 2003/10/21 13:06
- ソニーエリクソン(http://www.sonyericsson.co.jp/index_j.html)
のサイトで見つけたんですが、ソースを見ると
<!-- Begin Global Navigation Header -->
等のタグが随所にありました。
これはどういうタグなのでしょうか？
ページの作り方を参考にしようと思ったのですが、恐らく上記の
タグ等がキーポイントな気がします。
Googleで調べたのですが、なかなかいい情報が見つかりませんでした。
解説サイトや詳しい情報があるサイトを知っている方がいれば
教えて下さいませ。
よろしくお願いします。
- 1 名前： mar ： 2003/10/21 15:54
- > <!-- Begin Global Navigation Header -->
これはただのコメントタグですのでページ作りの上では関係ありませんね。
コメントタグについてはこちらです。
http://www.tagindex.com/html_tag/text_font/comment.html
上記サイトでは、緑の枠の中がメインコンテンツですから
「その上の部分(What'sNewや製品紹介など)がヘッダー、下の部分(コピーライトやSiteMapなど)がフッターですよ」ということを
ソースを見た時にわかりやすくしてるだけのものです。
目を引く演出をしているのは、embedタグで埋め込んであるFlashファイル(ココではroot.swf)によるものですね。
メインコンテンツである緑枠の中は全て1つのFlashファイルになっています。
- 2 名前： 中級者 ： 2003/10/21 18:05
- >>marさん
レスありがとうございます。
あ、コメントタグだったんですね(^^；
あと少し説明が足りなかったみたいですいませんでした。
実は一番気になったのが、左側のテーブルと右側のテーブルが
連動していて、フォントサイズを変更してもデザインが崩れなく
なっていることでした。
両方のテーブルの一番下部に
<!-- #BeginLibraryItem "/Library/main_frame_footer.lbi" -->
から始まる別ファイルが読み込まれているみたいです。
こういった、一歩つっこんだWEBページ作りを解説するサイト、書籍
等ご存知ですか？
- 3 名前： mar ： 2003/10/21 18:37
- topページのことではない様ですね。
具体的にどのページのどの部分か教えて頂けると助かります。
宜しくお願いします。
- 4 名前： 中級者 ： 2003/10/22 10:33
- たとえば、
http://www.sonyericsson.co.jp/product/au/a1301s/smart.html
http://www.sonyericsson.co.jp/company/press/20030829_manual_award.html
等の、左がナビゲーション・右がコンテンツといったページを作ると、
文字サイズを固定しないと左右どちらかが出っ張ってしまいますよね。
しかし、上記のページの作りだと外部ファイルのようなものを読み込んで
文字サイズを自由に変更しても、概観が変わらない作りになっていました。
この辺の技というかテクニックを盗みたいなと思った次第です(^^;
- 5 名前： mar ： 2003/10/22 12:48
- 中級者さんの環境では上記ページで文字サイズの変更ができましたか？
私が見た限りでは文字サイズの変更はできませんでした。
あくまでも私の環境で見た限りでの私見ですが、
まず、
>左がナビゲーション
こちらは全て画像で構成されている様ですね。
ですので、文字サイズ変更をしても段組が崩れることはありません。
>右がコンテンツ
こちらもほとんどが画像ですが、文字の部分はスタイルシートを使っている様ですね。
スタイルシートで色やサイズを指定しているので、こちらもブラウザ上で文字サイズ変更をしても
サイズが変わりません。なのでレイアウトが崩れることもありません。
ということになっていると思います。
外部ファイルとしてはJavaScriptをいくつか参照してる様ですが、
そのうちの最初のファイル(init.js)でこのスタイルシートの定義をしてますね。
閲覧者のOSをチェックしてMacとWinそれぞれで適するサイズ指定をしています。
ご丁寧なことです(笑)。
具体的にお薦めできる書籍などは私はわからないのですが、
>文字サイズを固定
→スタイルシートを会得する
ブラウザをチェックして処理を変える・スクリプトファイルを外部参照にする
→JavaScriptを会得する
という観点でweb上を探していけば、詳しい情報や解説に辿り着けると思います。
頑張ってみてください！
- 6 名前： ico ： 2003/10/22 23:26
- <!-- #BeginLibraryItem "/Library/main_frame_footer.lbi" -->
や
<!-- #EndLibraryItem -->
はSSIというものです。
CGIスクリプト配布サイト（カウンタ）などでよく見かけますね。
私は詳しくは知らないのですが、
外部JavaScriptのような使い方が出来るそうです。
例えば、いくつものページに同じものを表示できたりなど…。
長いコンテンツメニューなどを全ページにいちいちタグ打ちしなくても、
<!-- #... --> のようなたった１行で表示可能なのです。
＞しかし、上記のページの作りだと外部ファイルのようなものを読み込んで
＞文字サイズを自由に変更しても、概観が変わらない作りになっていました。
これらについては、mar さんのおっしゃられる通り
画像を使ったり、スタイルシートで文字サイズを固定しているから外見が変化しないものだと思います。
- 7 名前： 中級者 ： 2003/10/23 10:28
- >>marさん
>>icoさん
お返事ありがとうございます。
どうやら会社のPCでは文字のCSSが効かないようで、自宅から見たところ
文字サイズを変更できませんでした。原因は分かりませんが、ブラウザは
Sleipneirというタブブラウザを使用しています。
>SSIというものです。
なるほど！SSIにはこういった使い方があったんですね！！
確かに外部ファイル化すればページ数が多いほど、修正作業が簡略化されます
しね。
大手のポータルサイト等のソースを覗いてみたところ、SSIを使用している所が
沢山あって驚きました。扱い方がjavascriptとさほど変わらないようなので、
早速色々実験してみます(^^
(その前にSSI対応のレンタルサーバーを契約しないと。。)
非常に有用な情報を手に入れました。
お二方、本当にありがとうございました。
