不細工なソースでいいのなら、いくらでも組めますが、お仕事ではきれいなソースで組まなきゃいけない。
そうなると、やっぱりずっと終わりのない勉強をし続けなきゃいけないかなぁと思うんです。

私の思う『きれいなソースコード』

今までもう数えきれないくらいコーディングしてきましたが、いまいち『もう私はhtml、cssは完ぺき！！』とはなかなか言える自信が出ないです…
（html5やcss3など新しく学ぶべき技術が増えていくってのももちろんですが…）
いかにきれいなソースを書けるか、と考えだしたら、デザインしてる時と同じように、終わりがない気がして(・・；)
デザインって答えは一つでなくて、いろんなアプローチで人それぞれいろんな表現法がありますよね。
そう考えると、コーディングも算数のように『答えは一つ！』ではなく、人によって色んな考え方やアプローチ法があって不器用なソースや回りくどいの、雑なの、適当なの、いろいろだと思うんです。

具体的に『きれいなソース』って、、、

• 1,　更新しやすい。
• 2,　誰でも見やすいシンプルソース、素敵なネーミング、最低限のタグ。
• 3,　SEO意識している

結局、全部同じこと言ってますね…
最低限のタグでシンプルに書ければ更新時に見やすいしSEOの観点でもよいソースなはず。

ソースを書いて、対象ブラウザで確認して、レイアウト崩れなし、はい、終わりっ！じゃないわけで、
いつ、なんどき、誰がそのソースを更新、修正するかわかりません。
お恥ずかしいショボいソースじゃ、面目ないし、何よりお仕事ですから、チーム内でスピードと正確さがいつでも出せる状態にしとかなきゃいけないわけですよね。

私がこれまでに出会ったこんなソースはいやだっ‼についてまとめました。

ことごとくテーブル組み。テーブルでネストしまくり。

以前勤めていた制作会社で『ミラクルソース』と言われていたサイトがありました。
全部で50～80ページくらいのボリュームがあり、かつ最低でも週に一度は更新コンテンツがあるというサイトなのですが（更新するのは決められた担当者がいるわけではなくその都度、出番にあたっちゃった人が更新していくシステム）、そのサイトが皆を『ミラクル』と言わしめた理由が、

• レイアウトが全テーブル組み
• テーブルの中にテーブル中のにテーブル中のにテーブル…とネストしまくり
• インデント位置がバラバラでガタガタetc…

それが膨大なファイル量だったため、誰もきれいにお掃除する気にならず、更新するたびに、さて、どのタグ内に入れるのかしら、と目を凝らして更新ファイル＆更新位置を探す、という、最低なソースで、あれだけ綱渡り状態で更新が続いているのになぜかレイアウト崩れを起こしていないミラクルソースだったんですね。
いや、どっか崩れてたのかもしれないけどファイルが多いのでよくわからないｗ
その社内ではコーディングルールというのもあまりなく、個々の技術にお任せだったんですね。
なので、更新するたびにそれぞれ組み方がバラバラ…

ただひたすらリニューアルされるのを祈っていたのですが、リニューアル担当が自分に当たらないようにも祈る日々。
だって、これ、仕様ひきつぐの大変ｗ

cssハックだらけなソース

あと、出会ったイヤなソースはcssハックだらけなソース。
こんだけハック使わなきゃいけないんなら、そもそも構造が悪いんじゃないかと…
そのときのコーダーの作業はハック使ったほうが楽だとしても、更新の可能性がある場合は他の人がかなりめんどくさい作業でウンザリします。
たぶん当の本人も『これ、なんだっけ？』とよくわからんはず。

やたらとpositionで組んでるソース。

これは、仕事ではたまにしかなかったのですが、スクールで習った組み方が、positionでくむのが多かったんですよね…
知識としてpositionはたまに使うし、とても重要なプロパティだし、一生絶対に更新も修正もしませんっっ！ってサイトならありなのかもしれませんが、
最近のサイトはどんどん更新できる動的なページばかりですので、めったにposition使わなくなりました。
お仕事としてサイトを作る際にpositionでがちがちに固めちゃうと更新しづらくて実用的じゃありません。

コメントアウトがふざけてるソース。

「ここからコンテンツだお（・ω・)」
…ふざけんな、と思います。
忙しいときいじるソースだと、イラッときます。

ちなみに築地本願寺のコメントアウト、おもしろいですよｗ

結局、勉強なんだろな。。。

ちょっと前まで当たり前のように組んでいたコーディングのやり方。
たとえば画像をtext-indentの-9999pxでとばしちゃうとかありましたが、SEO意識してやってたけどこれって逆にスパムじゃないの？とかでだんだん減ってたり、html書くにもいろいろ周りの意見や動向を気にして勉強しながら、色んな環境下で一番素敵なシンプルソースを書けるよう努力してかなけりゃいけません。

デザインも大事ですよね。
ここをh1にして…と頭でマークアップしながらデザインしていく。

スライスに入る前にもう一度、じっっっっと見つめてどのやり方が最適か組み立てます。

可能であれば全ページのデザインが出来上がって、全ページの構造見た上でコーディング入った方が全ページ統一のとれたソースがかけます。

新しい情報がどんどん出てきてめまいがしそうですが、
何とか一生懸命ついてこ、と思う今日この頃。
私なんかはほとんど自分しか自分のソースに手を入れることはないですが、
自己満足かな（？）美しいソースが書けるようになりたいんですよねぇ～