Divの意味も知らないのにWeb担当に配置された私の3年間

マイナビクリエイター公式ブログ「クリエイティブ・ティップス」を御覧の皆様、ご機嫌麗しゅう。OZPAの表4の@OZPAです。

このコラムも第4回となりましたが、今回は毛色を買えて「Divの意味も知らないのにWeb担当に配置された私の3年間」をお送りしようと思います。衝撃的なタイトルですね。でも、恐ろしきかなこれは事実なのです。

元々は印刷畑→突然の通告

私は高校を卒業後、美容専門学校へ通い、「美容師」→「フリーター（焼肉店のバイトを2年間）」→「現在の会社の関連会社」という職歴でこの世界へ飛び込みました。我ながら異色の職歴です。こちらの会社は紙媒体のデザイン会社で、デザイン・DTPの基礎を学びつつ、お仕事をさせていただきました。

現在の会社に移ったのは約4年前。しばらくは前社と同じくグラフィックの作業をこなしておりましたが、ある時社長に呼び出されてこう告げられます。

「今まで別会社に全て任せていたWebサイト制作の仕事を、うちの会社でコーディングとかすることにした。OZPA君、Web、覚えて」

グループ会社で働くWebディレクター兼Webデザイナー兼Webコーダーだった方の負担を減らすため、配置転換で私にWebの業務をやるように、とのお達しでした。全米に衝撃が走りました。2012年春のことです。

苦手意識のあったHTML、CSSとにらめっこの日々

突如として訪れた転機。「やってやるぞ！」と、勢いごんではみたものの、当時の私はHTMLやCSSに関してずぶの素人。不安いっぱいな幕開けでした。最初の仕事は、200ページ弱のサイトのリニューアル作業。とはいえCSSはほとんどできており、ただ闇雲に原稿をHTMLに落とし込んでいく、というもの。

「なるほど、ここにこのclassが振ってあるからこうなるのか…」
「このスタイルが反映されないのはここでCSSが上書きされているからか…」

慣れないDreamweaverの画面とにらめっこしながら、仕組みを理解しつつ進んでいく作業。何とかこの仕事を終えた頃には、どうやってHTML、CSSを書くのかが何となく理解できておりました。

最初の仕事が一段落すると、一からサイト構築をする仕事がポツポツと舞い込んできました。Webディレクターから渡されるPSDをHTML、CSSに落としこんでいく作業。Photoshopのスライスをはじめ、何から何まではじめての経験。

つまずく度にGoogle先生に教えを請い、どうしてもわからない時にはSNSで助けを求めたり…、TwitterとFacebookが無ければ弊社のWebサイト制作今ほど進んでいなかったでしょう。

参考：インターネッツの光 | OZPAの表4

この頃に効率的なコーディングができるようになるために、Emmetを習得しました。

必要に迫られれば技術は覚える＆技術を覚えるのは結構楽しい

さて、なんとなくHTMLとCSSが書けるようになってきた頃、とあるWebサイトの案件でスライダーをカスタマイズしなければならなくなりました。そうです、jQueryとのご対面です。

JavaとJavaScriptの違いすら分かっていなかった私ですが、これも本を読んだり検索サイトに頼ったりしつつ作業を進めました。この頃から「くそ…なんで動かねえんだよ…！」と言った独り言が急激に増えました。

しかし、ディレクターの指示通りの動きが出来なければ納品できません。少ない知識をフル動員しながら仕事に臨む私。なんとかでき上がっていくサイト。ドーナツ本には何度お世話になったか知れません。

おかげさまでその数ヶ月後には、7つのサンプルでjQueryを学ぼう！「jQueryが全く分からない人のため」の超初級者向け入門講座なんて記事が書けるまでになりました。

この経験を経て私は、「必要に迫られれば技術は覚えられるんだなぁ」と言う一つの真理と、「新しい技術を覚えることって結構楽しいんだなぁ」と言う境地にたどり着くことができたのです。フロントエンドエンジニアとして一つのターニングポイントでした。

そうなると今度は「どうすれば効率的にサイト制作ができるようになるのか」に興味を持ち始めるのは自然な流れでしょう。

Sass、Compassと言ったメタ言語を習得し、タスクランナーのGruntを導入した頃にはようやく（なんとか）一人前といえるフロントエンドエンジニアとして圧倒的成長をすることができました。

参考：コピペが出来るなら誰でも出来る、Web制作タスク自動化ツール「Grunt」導入手順 | OZPAの表4

まとめ

とまぁ簡単ではございますが、Web担当として配置されてからの私の3年間を振り返ってみました。

今になって思うのは、「わからないながらも検索サイトなどを利用すればなんとかなる」というのと、「必要とあれば技術は追いついてくる」ということ。新しい技術に飛び込み、勉強をすることが楽しいと思える私は非常に幸運だったのでしょう。

このコラムをご覧になった皆様も、もし新たな技術や言語を覚えなければならない！といった自体に差し迫った時は「ピンチはチャンス」と言う使い古された言葉を思い出して、何も考えずに飛び込んでみてはいかがでしょうか？

意外と何とかなるぜ！私のように。