sacss20100327
TRANSCRIPT
コーディングの効率化を考えるコーディングの効率化を考える
SaCSSコーディング勉強会2010.3.37(Sat)
新人のコーダー
コーディングに割ける時間は業務経験に応じて短くなっていく
ディレクターディベロッパー
コーディングは比較的効率化が可能な業務
制作スピードの向上を常に考えなければならない
話題のZenCording
話題のZenCording
構造を書くと自動的にHTMLが出力されます
便利+面白い!
…でも
毎回いちいち構造書くの?
コーディングのスタイルは業務経験に応じて
過去のリソースの流用が中心になっていく
新規
コピペ
コピペ
コピペコピペ
理想は書かないコーディング
書かないコーディングを実現するためには
どんな工夫が必要なのか?
1. 汎用性の高いHTML作り
汎用性の高いHTML作り
一般的な企業ウェブサイトのレイアウトパターンは大体決まっている
・左右段組/ブロック追加を想定した構造 ・検索・置換で使い回せるような class / id 命名
汎用性の高いHTML作り
<div class=”hoge”>
<div class=”hoge-header”>
<p>ああああああ</p>
<!-- /.hoge-header --></div>
<div class=”hoge-content”>
<p>ああああああ</p>
<!-- /.hoge-content --></div>
<!-- /.hoge --></div>
“hoge”を置換すればいろいろ使える
2. 過去案件の整理
過去案件の整理
・フォルダ構成に共通の法則性を持たせる・案件進行中から 役立ちそうなものは都度コピペで別保存・スプレッドシートによる作業ファイルの管理
また必要になったときにすぐ探して取り出せる体制づくり
3. ツールの活用
ツールの活用
Ex1.
Dreamweaverのスニペット
メリット・経験が浅いコーダーでも扱いやすい・対応しているCMSもある (MovableType / a-blog cmsなど)
デメリット・多いと探しにくい・他のアプリでは使えない
ツールの活用
Ex2.
Texter
ツールの活用
Ex2.
Texter
メリット・最低限のアクションで書ける・HTML/定型文では最速かも!
デメリット・出力コマンドを覚えなければならない・他のアプリと衝突しやすい・衝突回避を考えると登録が手間
ツールの活用
Ex3.
スニペットがあるクリップボード
Win: CLCL
Mac: ClipMenu
メリット・ツールを問わない・Win/Mac共通の操作感
デメリット・出力までのアクションがやや多い・自分にあったカスタマイズが必要
まとめ
コーディングは正確さを保ったまま速度を上げる工夫が大切
ベストプラクティスはコーダーそれぞれ、業態によって違う
・基本はクリップボードから取得・タグ追加、微調整はTexter
・複雑な箇所は過去案件から掘り出す
うぇびんのベストプラクティス
・PHPによる共有部管理は既に必須
PHP+HTMLでさらに効率化
CSV
tmpl HTML
CSVから流し込みができるようにしたい. . .
15年前のRPG作成ソフトのガイドブックで、
ライターのスタパ斉藤氏がこんなこと言ってました
このゲーム全般に言えることですが、
できるだけ手抜きをする方向で考えてみると案外いいアイデアが出るものです。
ありがとうございました v_v