Webサイトの制作／運用の効率化を図る 「ガイドライン策定」のすすめ（前編）（1/4）：CodeZine
Web標準に従うことは、SEO効果、ユーザービリティ、メンテナンス性の向上など、Webサイトの利用者と制作者の双方にさまざまなメリットをもたらします。しかし、実際にWeb標準の仕様書に従ってWebサイトを制作しようとすると、制作者の頭を悩ませる多くの問題が待っています。本連載では、Web標準のメリットを最大限に生かすことをテーマに、仕様書には書かれていない部分を中心に取り上げ、実際のWeb制作現場で起こり得る問題について、解決の糸口をたらしていきたいと思います。 はじめに Web標準に従うことは、SEO効果、アクセシビリティ、ユーザービリティ、相互運用性、互換性、メンテナンス性の向上など、Webサイトの利用者と制作者の双方にさまざまなメリットをもたらします。しかし、実際にWeb標準の仕様書に従って「正しい（X）HTML+CSS」でWebサイトを制作しようとすると、制作者の頭を悩ませる多くの
もう、class名やid名で悩まないんだからっ！！｜CSS HappyLife
class名やid名って付ける時悩みませんか？ 今でもボクは結構悩むんですが、そんな悩みを解決する為に、人さまのソース覗きまくってよくあるclass名とid名を拾ってきました。 これで、チョットだけ作業効率アップ！？ 2010年6月10日追記： この記事自体、2007年 1月15日に書かれてるんでかなり古いです。 あくまでも参考程度に留めてもらうのが良いかと思います。 今だったら、html5の要素を参考にしたりして付けるのが、今後の事を考えると良いのかなーと思います。 また、善し悪しの判断はせずに公開しているものですが、位置に関するのは仕様変更に弱くなるのでオススメはしません。 全体に使えそうな感じ wrap wrapper top-wrapper wrapperAll frame mframe all-frame container page pagetop all allContent
【CSS】CSS のコメントの書き方 | バシャログ。
CSS コーディングのキモは「設計」にあります。 ただ漫然とコーディングしてしまうと、コードが肥大化してしまって本来 CSS のメリットであるはずの汎用性・メンテナンス性が著しく低くなってしまいます。 CSS のコーディングでは「コメント」を活用すると、全体の見通しが良くなって「設計」がしやすくなります。 いきなりセレクタとかプロパティとかを記述する前に、あらかじめサイトの構成（エリア）を CSS コメントで区切っておくと、その後のコーディングがとても楽になるのでお勧めです。 シーブレインで採用している CSS コメントにはレベル（階層）があります。コメントに階層を設けることによって、より設計しやすくしてやろうという魂胆です。 以下がその例です。 /* ========================================================= Level 1 ===
class名のつけ方 | Takazudo Clipping*
デカいサイトでのclass名のつけ方って、すごい難しいと思う。 だけど、CSSいじったりし始めたりした人は、その、すごい難しいってことに気付かないと思う。 別にCSSだけの話じゃなくて、プログラム書くときの関数名とか構造も同じだと思うんだけれど。 ベストなclass名のつけ方は、完全にサイトの構造を把握してないと無理だと思う。 そして、そのサイトに要素が追加されたときにも柔軟に対応できるルールを持ったclass名のネーミングルールが必要だ。 破綻が起きて、CSSが混沌になってしまわないように。 今自分がこれがイケテルーと思うのは、こんなかんじ。 まず、ページで使われる要素を、モジュール化する。 （みんなやっていることだとは思うが） このモジュールの中で使われるclass名は放っておくとして、この、モジュール単位のクラス名が超重要。具体的には、見出しとかリストとか、ナビのリス
TOP | CCG - CSS Coding Guideline -
セットの記述方法 { インデントは半角スペースを4つ。 閉じ カッコ のインデントは書き出し位置に合わせる。 1プロパティは1行で管理する。行の終わり必ずセミコロン ( ; ) } セレクタの記述方法 { 各IDとclassが適用されているタグを必ず明記。 継承を見やすく、かぶりが起こるのを防ぐために親セレクタも記述する。 自然とピラミッド型になるようにマークアップを行う。 } プロパティの記述順序 { ボックスモデル (Box model) 視覚整形モデル (Visual formatting model) 視覚整形モデル詳細 (Visual formatting model details) 視覚効果 (Visual effects) 生成 内容, 自動番号付け及びリスト (Generated content, automatic numbering, and lists) ページ関連
CSS Nite Vol.7: Web制作現場の対立を解消する！ XHTML CSSガイドライン作り [1]
このスライドは誰でもアクセスできます スライドのURL http://www.cybergarden.net/cssnite07/ スライドシステム (モダンブラウザ向け) W3C® HTML Slidy (XHTML+CSS+JavaScript) 自己紹介 (1) 益子 貴寛 (Takahiro Mashiko) サイバーガーデン代表。Webプロデューサー。 大学院在学中の1999年5月に「CYBER@GARDEN」を立ち上げる。一般企業に勤務後、2003年5月に独立。 自己紹介 (2) 著書 『Web標準の教科書─XHTMLとCSSで作る“正しい”Webサイト』 『伝わるWeb文章デザイン100の鉄則』 『XHTML+CSSスタートアップガイド (仮)』 が毎日コミュニケーションズから7月出版予定 (現在、執筆中) 矢野りんさんとの共著がMdNから出版予定 (現在、執筆中)
新規サイト制作セット（CSSライブラリ＋基本フォルダ構造＋HTMLテンプレート）、一式zipでダウンロードできるようにしました
Account Suspended This Account has been suspended. Contact your hosting provider for more information.
wside.org : side L | blog » Blog Archive » コーディングガイドライン
会社でコーディングガイドラインを作りました。 ほとんど自分のコーディングに関する個人的ルールと、もう一人のコーダーさんとのルールをつき合わせただけのものですが、それを元に改めて自分個人としてのルールを書き留めておこうと思います。 ディレクトリ構成・管理 ディレクトリ構成 ルート直下には index.html（トップページHTML） 各カテゴリ名を付けたディレクトリ shared（共有ファイルディレクトリ） sharedの中は、以下のようにディレクトリを切る。 css（CSS） images（画像） js（Javascript） 各カテゴリのディレクトリ内でも、必要に応じてディレクトリを切る。 画像を格納するディレクトリの名前は“images”とし、HTMLファイルが存在するディレクトリ毎に作成する。 バックアップについて バックアップはファイル名の拡張子の後に.（日付8桁）.bakをつける
HTMLとCSSのコーディング規約がまとめられているサイトを教えてください。…
HTMLとCSSのコーディング規約がまとめられているサイトを教えてください。 (タグの仕様とかではなくメンテしやすいコードを書くためのガイドラインとして) PHPであればhttp://framework.zend.com/manual/ja/coding-standard.htmlのような、複数人でコーディングするときの指針を探しています。 贅沢を言えば、CSSのID名・クラス名・外部ファイル名の命名規則、外部ファイルのディレクトリ構造などが決められているものであれば幸せです。 ちなみに、HTMLのDOCTYPEは4.01 Transitionalで、一応IE5.5以上、FireFox1以上、Safari、Opera9以上がサポート対象です。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
(X)HTML・CSSコーディングマニュアル