クライアントがめっちゃ喜ぶ！コーディングで気をつけていること

f:id:webbibouroku:20160112163106j:plain

私がコーディングで気をつけていることを紹介します。どれもむっちゃ簡単です。それもたった3つです。実際にクライアントにめっさ感動していただいたことのある、コーディング方法です。

要素ごとであったり、区切りのいいところで改行をします。基準は、見やすいかどうかです。基本的には、1行に1要素としていますが、開始タグ直後で改行することもあります。

[html] <img src="" /> <p>あああああ</p> <p> ああああああ<br /> あああああ </p> [/html]

みたいな感じです。 1行を贅沢に使い、とにかく見やすくを心がけます。

タグが入れ子になるごとにひとつタブを入れます。

[html] <div> <p> あああああ<br /> </p> </div> <div> <img src="" /> </div> [/html]

みたいな感じです。これによって、どの開始タグが、どの閉じタグと対応しているのかがわかりやすくなります。どこからどこまでがひとつの要素なのか、その中には何が入っているのかも一目瞭然です。

一通りコーディングが終わったら、コメントを入れます。コメントの内容は、そこが何の要素なのか、です。

[html]  <div> <p> あああああ </p> </div>  <div>  <img src="" /> </div> [/html]

みたいな感じです。

あとで修正が発生したときも、これがあればすぐに該当箇所を見つけることができます。

ECサイト制作のときでした。外注にECのシステムを組んでもらうことになっていて、私はその外注に渡すコーディングデータを作成しました。上記のことを気にしながら、組みました。

コーディングデータを外注に渡して数日、思いのほか早くECのシステムが組まれて納品されました。

その時、「コーディングデータが美しかったおかげで、予定より早くシステムを組み上げることができました。いやー、あんなに綺麗なコーディングデータは初めてです。」と言われました。

ひとつひとつは些細なことなんですが、その些細なことを気にするかしないかで、納品物のクオリティは大きく変わるのだと実感しました。

私が気をつけていたのは、後で見返したときに見やすいように、自分の為でした。将来の自分への気遣いが、今回は外注に渡ったときに、その外注への気遣いへとなったようです。

そんなちょっとしたことで、相手の印象は大きく変わります。

そんなことよりも、喜んでもらえてばりごっさ嬉しかったんです。

ウェブ屋の備忘録