より早くcssやhtmlのコーディングが行えそうな情報いろいろ

Ads

Web制作を少しでも効率化しよう
と思って(今更)いろいろ便利そう
な情報を探しました。既に使って
いる情報の方が多かったのです
が、折角調べたのでシェアしたい
と思ってエントリーです。

コーディングをもっと円滑に、という旨の情報です。順不同。あんまり多いと逆効果なので量は絞りました。一応これでも絞りました。絞ったつもり。

zen-coding

話題になったzen-coding。だいぶ慣れて来た方もいらっしゃるのでは。

  1. zen-coding(本家)
  2. HTMLコーディングが3倍速くなる?「Zen-Coding」
  3. 秀丸Zen- Codingマクロ
  4. コーディングの効率化を図るZen codingをDreamweaver cs4に入れる方法
  5. WP Zen-Codingが凄く便利

初期設定とかTipsとか

制作前に知っておくと便利なコードとかTipsいろいろ。

css書く前にチェック。

  1. もう、class名やid名で悩まないんだからっ!!※めっちゃ便利
  2. CSS(スタイルシート)でbodyに設定しておくと便利な5つのポイント
  3. ブラウザのスタイルを初期化するスタイルシートのサンプル集
  4. ブラウザのスタイルをリセットするスタイルシート集
  5. Web制作にあると便利な10の日本語版各種チートシート
  6. スタイルシート設計のベースになる12のCSSのフレームワーク

tipsとか。

  1. 都道府県選択するやつ。
  2. CSSハック一覧
  3. IE6でよく遭遇するCSSのバグとその解決方法
  4. IEでのCSSのバグを回避するhasLayout
  5. 今よりコーディングのスピードを上げるには
  6. cssの情報・まとめ / 手前味噌。情報いっぱい。

拡張

ブラウザで使えるやついろいろ。拡張(アドオン、エクステンション)とか、ブックマークレットとか。というかコーディングの早さにあんまり関係ない気もする。修正する時にこれがあれば早い、という事で入れてます。

  1. xray / Web制作者にオススメの素敵ブックマークレット。
  2. ウェブサイトの制作・検証に役立つブックマークレット集 / まとめ
  3. Firebug Firefox addons
  4. Firebug Chromeエクステ / Chromeのエクステンション
  5. Firebug Lite / IE、safari、Opera向け
  6. WEB制作のために使ってるFirefoxアドオン9個まとめ
  7. Web Developer / Chomeエクステ。高機能です。
  8. Pendule / Chromeエクステ。マークアップのバリデーションとか出来る
  9. CSS Tester / 実は地味に便利。詳細はリンク先で。

グリッド関連

これもあると便利ですね。多いのでまとめ記事を。

  1. 960pxのグリッドシステムを使用する際に役立つサイト集
  2. グリッドデザインに使えるツールいろいろ

リファレンス

ググる手間を省く用

  1. HTMLクイックリファレンス
  2. スタイルシートリファレンス
  3. WEB色見本 原色大辞典

あまり多くしたく無いのでこれくらいで。これらの情報から更に抜粋して自分用のチートシートでも作ろうかと思っています。