ホーム > スポンサー広告 > スポンサーサイト> XHTML+CSS > オープンソースCMSとXHTML+CSSとの関係

スポンサーサイト

--年--月--日

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
関連タグ:
ソーシャルブックマークに追加: Google Bookmarks に追加 はてなブックマークに登録する Yahoo!ブックマークに登録する Buzzurlにブックマーク登録する FC2ブックマークに登録する livedoorクリップに登録する newsingブックマークに登録する イザ!ブックマークに登録する del.icio.usブックマークに登録する
【--/--/-- --:--】 | スポンサー広告 | page top↑

オープンソースCMSとXHTML+CSSとの関係

2008年01月30日

オープンソースCMSのデザインをオリジナルで制作する場合、必須の知識としてXHTML+CSSが基本になります。現在のオープンソースCMSのほとんどが、XHTML+CSSでレイアウト・デザインされているからです。


XHTMLとHTMLはどう違うの?と思う人がいるかもしれませんが、HTML4の規格を XMLベースで再形式化したものであり、基本は同じなので、HTMLの知識があれば問題ありません。


簡単に説明すると、XHTMLは、HTMLよりも正確に記述しなければいけない次世代マークアップ言語です。たとえば、HTMLでは省略できるpなどの終了タグは省略できない、brのような空要素にも <br />スラッシュを付けて閉じなければいけない、大文字と小文字を区別する等々。

まあ、Dreamweaverを使えば簡単にHTMLからXHTMLに変換できますが、オープンソースCMSをオリジナルでデザインするにはやはり、基本的なことは勉強しておいたほうが良いでしょう。


XHTMLと同様に重要なのがCSSです。オープンソースCMSに限ったことではなく、現在のWEB2.0の主流になっていて、デザインとHTMLを分離して管理ができるというメリットがあります。大げさに言えば、ウェブサイトのデザインをリニューアルしたい場合は、CSSだけを修正すればデザインが変わるのです。実際に、XHTMLやHTMLのソース内にしっかりとした、CSSの記述をしておけば可能になります。


現在のCSSの使われ方の傾向として、正しいマークアップがされるようになってきています。少し前までは、divを多用し格子状に使い、見た目だけを意識してタグの持つ本来の意味を無視した使われ方でした。しかし最近では、HTML(XHTML)がよりシンプルになり、タグが持つ論理構造を定義する意味を理解した上で、見出しやリストなどが効果的に使われるようになってきています。


CSSのIDやクラスに名前を付ける時も、視覚的なright、left、center、red、blackなどではなく、navigation、menu、contentsのように中身が何なのか分かるように付ける事が推奨されています。例えば、class名がredのものを後から修正が必要になり、文字の色を青にした場合、class名redでは、おかしいですよね?


HTML(XHTML)を正しくマークアップし、CSSでデザインをコントロールすることで、検索エンジンにも人間(訪問者)にも適切に情報が伝わるようになります。XHTML+CSSは、SEO的非常に相性が良く検索エンジンに引っかかりやすい構造になっていますので、習得しても損はないと思います。


XHTML+CSSの無料テンプレートサイト




↓ブログランキングに参加中!読み終わったらクリックお願いします↓
にほんブログ村 IT技術ブログへ 人気ブログランキング FC2 Blog Ranking
関連タグ:オープンソース CMS XHTML CSS SEO
テーマ:WEBデザイン - ジャンル:コンピュータ
ソーシャルブックマークに追加: Google Bookmarks に追加 はてなブックマークに登録する Yahoo!ブックマークに登録する Buzzurlにブックマーク登録する FC2ブックマークに登録する livedoorクリップに登録する newsingブックマークに登録する イザ!ブックマークに登録する del.icio.usブックマークに登録する
【2008/01/30 20:19】 | XHTML+CSS | トラックバック(0) | コメント(0) | page top↑
<<Joomla!最新バージョン1.5.x系の安定版がリリース | ホーム | MODx(モドエックス)について>>
コメント
コメントの投稿














管理者にだけ表示を許可する

トラックバック
トラックバックURL
→http://opensourcecms.blog122.fc2.com/tb.php/20-134eae89
この記事にトラックバックする(FC2ブログユーザー)
| ホーム |
ブログパーツ
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。