【WEB制作チーム】コーダー編

はじめに

こんにちは。
早いもので入社してから6か月ほど経ちました。

その間に、ディレクターやデザイナーが入社してきて
チームの中でなぜか古株になってしまった山下です。

山下については以下の記事をご覧ください!
(恥ずかしいので見た後は、内容には触れずに優しく接してほしいです。)
最近初めてマックフルーリーを食べました。
かなり美味しかったので、「好きなもの」に追加しようか迷ってます。

制作会社からFIXERに来ました!

さて、チームとして動き出してからまだまだ日が浅いWeb制作チーム。
社内外に「私たちこんなお仕事してますよー!」というアピールのために始まったブログもとうとう3人目…私の番になりました。
この記事を書く随分前に「こういう企画やるから内容考えておいてね!」というお達しがユマさんやモーリーから来ました。
恥ずかしいので何とか書かずに済む(逃げる)方法を考えましたが、とうとう逃げられないということを悟ったので今回は観念して筆を執ります。

ここからは真面目にお仕事のお話をします。 

私が担当しているのはWeb制作の中の「コーディング」という部分です。
コーディングとは、デザイナー(弊社ではモーリー)がデザインしたWebサイトのデザインをブラウザでHTMLやCSS等を使って表示できるようにするお仕事です。
複雑な動きをする場合はJavaScriptを使ったり、必要に応じてWordPress等のCMSを利用することもあります。
また、ディレクションやデザインの段階から「これできる?」と聞かれることもあるので「できる」「できない」を返答します。(できない場合は代替案を提示できるとベスト)


コーディングする時にはいろいろ考えながら作業します。
今回は私がコーディングする時に気を付けていること(気にしていること)を書いていきます。

各デバイスやブラウザで同様の表示ができるようにする 

Webサイトを閲覧する時、色々な状況で閲覧すると思います。
PCで見たりスマホで見たり…そのデバイス(WindowsやMacとか)やブラウザ(Chromeとか)によって同じコードを書いても表示が崩れたりしてしまうことがあります。
崩れてしまった場合、なるべく同じような表示ができるようにCSSやJavaScriptの書き方を変えたり調整したりします。
(場合によっては、ほぼ書き直しになることもあります。悲しいけれど仕方ない…)

修正しやすいコードを書く 

こちらは、チームで作業する場合は重要になると思います。
例えば、「ここのテキスト変えたいんだよねー」と言われて作業する場合、
ルールも統一されず、書いた人のマイルールで書かれていてコメントもない…
そんな状況になると、たった一つテキストを変えるだけでも膨大な時間がかかります。
(コードを確認して、解読して、該当箇所を探して、修正して反映されるか確認してテストして…ね?聞くだけで大変そうでしょ?)

どこに何が書いてあるか、どういう構造になっているのかを他の人が修正する場合でもわかりやすいように書いておくと、コードを解読する時間が短くなって修正に必要な時間も少なくなります。
社内でコーディングルールを作っておくとそれに則って作えれば大体の構造は同じになるかなと思います。
(人によって書き方の癖が違うのでその辺は解読する必要がありますが)

SEOを意識する 

コーディングにもルールがあります。
そのルールを無視して作るとGoogleからの評価が下がり、検索順位でなかなか上の方に表示されません。

ルールはGoogleさんが決めて頻繁に更新されているので、調べて最新の情報をゲットしてそのルールに則ったコーディングが求められます。

SEOのコーディング作業でできる部分を内部施策と言います。
外部施策としてはマーケティングの要素が多いのでここでは割愛します。
内部施策だけではできることは限られますが、外部施策も併せて行うことで
初めて検索順位が亀の歩みのようにジリジリ上がってきます。

自分の作ったサイトの検索順位が少しでも上がってくると嬉しいもので、内部施策の部分だけでもできることはしていきたいと思います。

終わりに 

長々とお付き合いありがとうございました。
ここまで3名分Web制作チームのブログを投稿しましたが、いかがでしたか?
ひとまずWeb制作チームのお仕事内容のブログは今回でおしまいです。
(また続編とかあるかもしれませんが…)

社内外の人に私たちの仕事が少しでも伝わったら嬉しいです!

FIXER Inc. 山下
  • FIXER Inc. 山下
  • 早く仕事を覚えて貢献できるように頑張ります!