人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

ホームーページ更新についての質問です。ある雑誌に「ナビゲーション部をCSS化すると更新がしやすい」という記載があったのですが、具体的にどうしやすくなるのでしょうか?記述方法などもあわせて教えてください。

●質問者: ウーロン茶
●カテゴリ:ウェブ制作
✍キーワード:CSS ムー 更新 記述 雑誌
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● moonstones
●24ポイント

http://allabout.co.jp/computer/hpcreate/closeup/CU20050108A/

HTMLデザインからスタイルシートデザインへ修正 (1) ナビゲーションバーをCSSで装飾 - [ホームページ作成]All About

AllAboutJapanの記事で「ナビゲーションバーをCSSで装飾」

そのままずばり載ってます。

1ページ目から5ページ目まで読めば簡単に理解できると思います。

◎質問者からの返答

ありがとうございます。

確かにhtmlソースがわかりやすくなり、htmlを直接編集するのであれば「更新がしやすい」ということになると思います。

しかし、ホームページ作成ソフトを利用している場合、htmlの記述がスッキリわかりやすいというのは全く関係ないと思います。「更新がしやすい」というのはhtmlを直接編集する場合ということなんですね。htmlを直接編集すること自体が「更新しにくい」と思います。


2 ● hnd_info
●23ポイント

http://www.tagindex.com/stylesheet/basic/pattern1.html

スタイルシート[CSS]/スタイルシートの基本/外部ファイルにまとめて設定する - TAG index

<LINK REL=”stylesheet” TYPE=”text/css” HREF=”sample.css”>

のように、サイト全体の基本デザインを1つのファイルにまとめておくと、何かデザインの変更が発生しても、この1つのファイルを修正するだけで済みます。

ホームページ作成ソフトは、そのソフトが持っている機能の制限があるので、必ずしも簡単で便利とは言い難い面もあると思います。

◎質問者からの返答

ありがとうございます。


3 ● ikegam
●23ポイント

http://sourcemania.jpn.org/

sourcemania

上の回答者への疑問の回答となりますが


HTMLのソースを編集して更新する事が更新しにくい事と言われていますがそれはその通りです


一般的にグラフィカルなエディタで

メニューを作ろうと思えば

テーブルを使ってしまうと思います

ここで、例えば階層構造の有るメニューをテーブルでインデントさせていくとします(いわいるツリー表示をさせます)

例としてExplorerのC-Programfiles-といった階層構造が有る物だとします

するとテーブルでは

C が一列目 一行目に入ったとするなら

Programfiles は 二列目 二行目に入れますよね

一列目 二行目はおくゆきをもたせるために空白を入れます


この後、この階層構造をツリー表示ではなくて

スタートメニューのようにマウスカーソルがあたったらその中身を表示する ようにしたいと考えるとします


でグラフィカルなエディタでこれを実現する場合

一般的にjavascriptを利用します

ここでこの移行がとても面倒になりますよね?

まずレイアウトだけ揃えた後にメニューの内容を移動してと


しかしスタイルシートを利用すると

デザインと文章を切り離す事が可能なため

メニューのような階層構造だけHTMLで dd dt などで表現しておき

スタイルシート側で見た目の設定をしておけばHTML側はまったく触る必要がありません

逆にメニュー内容を編集する時もデザインを気にする必要なくHTMLを簡単に編集すれば終わりです


ここで叩き台としてグラフィカルなエディタと挙げましたが

最近のグラフィカルなエディタではこれらが考慮されている物も有り

知っていればスタイルシートを使う事が可能なソフトも有ります。


他にも良い点は色々と用例は有りますが結論を出してしまうと

(雑誌の ”CSS化” と言う表現に疑問を感じますが言いたい事はこういう事だと思います)


HTML文章の多くの内容は階層構造を持つのにもかかわらず

今迄のHTML文章は見掛けだけ階層構造を持ったような形にしただけで、実は平面構造であったため

デザインをスタイルシートに内容をHTMLにと分離する事によって、HTML側を文章として自然な体裁に整える事ができそれにより更新がしやすくなる

とそういう訳かと思います

実際にこのルールに従って制作されたHTMLは

グラフィカルなエディタに入れても非常にみやすく編集しやすいと思います。


これらを考慮したHTMLをかかれた方のウェブサイトを一つあげておきます

◎質問者からの返答

ありがとうございました

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ