瞬間と永遠.com 自分を探し自分を知るブログ@愛知県豊田市・名古屋市 > つたえる > コーダーさんは読むといいかも「XHTML&CSS超高速コーディング術」 > マークアップ

コーダーさんは読むといいかも「XHTML&CSS超高速コーディング術」

選択されているタグ

買ってからだいぶ経つけどとてもいい本なので
紹介しておこうと思います。

気になるところや、すぐ使えそうなことが多く
高校生のとき以来、本にアンダーラインを引いたという。
それくらい実用的です。

蛇足ですが、牧野工房という社名がなんかいいですね。
ITっぽくないけど、職人気質が感じられる社名で。

コーディング時間を短縮させるには?

前半では、コーディング時間を短縮させるために
どれだけ「手戻り」を減らせるかが大切と訴えていました。

とはいえ、今自分の環境だと、
仕事の進め方、社内の体制を含めて考えても
なかなか現実的に難しい状況です。

むしろ、「手戻りはある」と意識して、
どんな無茶ぶりにも耐えられる柔軟なコーディングが
必要なんじゃないかと感じました。
遠回りではあるだろうけど、今はそれが最善ではないかと。

でも環境も少しずつ整えることも大切。
あと、シャドーコーディングで手戻りを減らす
っていうのは、個人の問題なので実践できますね。

ためになったこといろいろ

技術的な内容で、自分がためになったことの
一部を書いておきます。

ブログからソースを拾ってきて、
意味もわからず使っているような CSS も
説明を読んで納得できたものがいくつかありました。

CSSスプライト

これは説明不要でしょうか。
わかりやすかったです。

body に id と class

import.css ですべての HTML ファイルに CSS を適用。
そのときに body に id と class をふってセレクタがかぶるのを防ぐ。
というもの。

機械的につけていると、後々 CSS が触りやすくなります。

ネガティブマージンの使いどころ

崩れるのがこわくてあまり使ってなかったんですが、
けっこう大胆に使ってもいいことが判明。

デザインの幅が広がったり、無駄な div 無駄な float を
減らせます。

width と border を同時に使ってもだいじょうぶな方法

width と border の同時指定はダメ、と覚えていたのですが
ちゃんと理解していれば使えます。

CSS のファイル名とその役割

参考ファイルがダウンロードできるのですが、
そのサンプルの CSS ファイルがすごく参考になります。
これを自分用にカスタマイズして使ってます。

上下マージンの相殺

恥ずかしながら、知りませんでした。
なんか変だなくらいの理解でしたが、よくわかりました。

各ブラウザでテーブルをぴったりに

そこまで厳密にすることってあまりないですが、
1pxもずらさずに、ボーダーを設定できます。

HTMLを見通しよく → <!-- /#wrapper --></div>

これはコーダーさんの共通ルールにしてもいいんじゃないか
というほどのもの。

<div> の閉じタグの前にコメントを入れる。

id であれば、<!-- /#wrapper --></div>
class であれば、<!-- /.section --></div>

を必ずつける。

Dreamweaver の拡張機能で、このコメントを簡単に入れられるものを
作ってくれた人がいるみたいですが、どうやらぼくの環境だと
うまく動作してくれないみたいで、TextExpander でやってます。

参考:コメントを生成して挿入するDreamweaver用拡張機能を作成しました | Topics | DB - KAYAC Designer's Blog (カヤック デザイナーブログ)

少し古い技術を一番効率のいい方法でやる

どこにでてきたか忘れてしまったのでうろ覚えですが、
こんな言葉があったと思います。

少し冷たいような気もしてしまいますが、
実際のビジネスではその通りなんでしょうね。

CSS3 や HTML5 がコーポレートサイトに必要か
と言われれば、まだ ie6 も幅をきかせている時代では
必要ないでしょうし。

といっても、iPhone、ipad もあることだし、
ちゃんとやらなきゃと思いつつ、後回しに・・・

まとめ

初〜中級くらいでコードを書いている人には
とてもためになる内容ではないでしょうか?

また、手戻りを減らすためのファイル管理とか
ディレクターさんにもためになる内容かも知れませんね。

あと、ある程度コーディングをしたことがあって、
用語を知っていると純粋に楽しいと思います。

ぼくの場合だと、ストーリーものを読んでるみたいに
入りこんで読めました。


--

※この記事を書いた人、ミズノケイスケに興味を持っていただけましたら、リンクツリーをどうぞ。

この記事に関連する記事

コメント

ミズノケイスケ 2010-08-28 (土) 12:48
>ミルミルさん
ウェブのお仕事されているんですね〜。
すごくおすすめの一冊です。
閉じたタグ前のコメントは、ほんとみんなやったらいいと思うくらい
わかりやすくなります。

>いつの間にかバージョンアップした世間から取り残されてしまいます

これわかります〜。
どんどん進化していくので、追いつけないですね。
お金もかかるし、大変な業界です。
でも、それだけにおもしろい部分もありますね。
ミルミル 2010-08-24 (火) 23:53
「超高速コーディング術」というのが興味をひきました。WEBデザインでドリームウィーバーがない会社や使えないところではHTML(&CSS)の入力で作成していました。
の閉じタグの前にコメントを入れる。」←分かりやすそう!
WEBでもDTP系のデザインでも、会社によってPCやソフトの環境がすべて違うので、転職組としては合わせるのが大変ですね。
同じ環境になかなか出会えなかったり、同じ環境に慣れてやりやすくなるほどいつの間にかバージョンアップした世間から取り残されてしまいます。
投稿
名前
 
メールアドレス
 
URL
 
タイトル
コメント
パスワード
Cookieに保存

瞬間と永遠.com 自分を探し自分を知るブログ@愛知県豊田市・名古屋市 > つたえる > コーダーさんは読むといいかも「XHTML&CSS超高速コーディング術」 > マークアップ

RSS 購読
リンク
  • track feed 瞬間と永遠.com

↑PAGE TOP