1. コーディングの効率化を考える SaCSS コーディング勉強会 2010.3.37(Sat)

2. 新人のコーダー コーディングに割ける時間は 業務経験に応じて短くなっていく ディレクター ディベロッパー

3. コーディングは比較的 効率化が可能な業務 制作スピードの向上を 常に考えなければならない

4. 話題の ZenCording

5. 話題の ZenCording 構造を書くと 自動的に HTML が 出力されます

6. 便利＋面白い！ でも… 毎回いちいち構造書くの？

7. コーディングのスタイルは 業務経験に応じて 過去のリソースの流用が中心になっていく 新規 コピペ コピペ コピペ コピペ

8. 理想は 書かないコーディング 書かないコーディングを 実現するためには どんな工夫が必要なのか？

9. 1. 汎用性の高い HTML 作り

10. 汎用性の高い HTML 作り 一般的な企業ウェブサイトの レイアウトパターンは大体決まっている ・左右段組／ブロック追加を想定した構造 ・検索・置換で使い回せるような class / id 命名

11. 汎用性の高い 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” を 置換すれば いろいろ使える

12. 2. 過去案件の整理

13. 過去案件の整理 ・フォルダ構成に共通の法則性を持たせる ・案件進行中から 役立ちそうなものは都度コピペで別保存 ・スプレッドシートによる作業ファイルの管理 また必要になったときに すぐ探して取り出せる体制づくり

14. 3. ツールの活用

15. ツールの活用 Ex1. Dreamweaver の スニペット

16. メリット ・経験が浅いコーダーでも扱いやすい ・対応している CMS もある （ MovableType / a-blog cms など） デメリット ・多いと探しにくい ・他のアプリでは使えない

17. ツールの活用 Ex2. Texter

18. ツールの活用 Ex2. Texter

19. メリット ・最低限のアクションで書ける ・ HTML ／定型文では最速かも！ デメリット ・出力コマンドを覚えなければならない ・他のアプリと衝突しやすい ・衝突回避を考えると登録が手間

20. ツールの活用 Ex3. スニペットがある クリップボード Win: CLCL Mac: ClipMenu

21. メリット ・ツールを問わない ・ Win/Mac 共通の操作感 デメリット ・出力までのアクションがやや多い ・自分にあったカスタマイズが必要

22. まとめ

23. コーディングは 正確さを保ったまま 速度を上げる工夫が大切 ベストプラクティスは コーダーそれぞれ、業態によって違う

24. ・基本はクリップボードから取得 ・タグ追加、微調整は Texter ・複雑な箇所は過去案件から掘り出す うぇびんのベストプラクティス

25. ・ PHP による共有部管理は既に必須 PHP ＋ HTML でさらに効率化 CSV tmpl HTML CSV から流し込みが できるようにしたい ...

26. 15 年前の RPG 作成ソフトの ガイドブックで、 ライターの スタパ斉藤 氏が こんなこと言ってました

27. このゲーム全般に 言えることですが、 できるだけ手抜きをする 方向で考えてみる と 案外いいアイデアが 出るものです。

28. ありがとうございました v_v