IT系女子ログ

Webデザイナー目線のあれこれ話。デザインもコーディングも勉強中。

実務経験3年すぎた現役Webデザイナーのリアル【コーディングスキル編】

f:id:tosssaurus:20170702163854j:plain

ホントのところ、"実務経験3年"のWebデザイナーってどのくらいできるようになるのかを、ちょうど3年たった私がまとめています。

今回はコーディングスキルについてまとめました。

 

できるようになったこと

レスポンシブのコーディングができるようになった

1年目のころはPC用1ページ作るのにもすごく時間がかかっていて、到底実務レベルではなかったのですが、今ではレスポンシブのコーディングもできるようになりました。コーディングのスピードは社内で1番だと自信があります。

とはいえ、共通部分などテンプレートの構造はとっかかりの時にじっくり考えて作りたいので、時間がかかってしまいます。ただ、構造のパターンは限られていると思うので、余裕のあるときに代表的なものを洗い出してみたいです。

 

最近ではレスポンシブも普通の技術になってきて、環境の変化のスピードには驚きます。もっといろんなコーディングを経験しないとなぁと思っています。

 

アクセシビリティを意識したコーディングを心がけている

本当に基本ですが、要素のかたまりやタイトルやリストなど意味を考えてマークアップしたり、なるべく画像を使わずに実装できないか考えたり、基本を大切にしています。

しかし、アクセシビリティが基本中の基本のことなんだと理解したのはつい最近になってからなんです。

それまでは「アクセシビリティって何?ユーザビリティと何が違うの?」というぼんやりした認識で、情報を集めるもののすぐには理解できなかったです。

 

最近やっと自分なりに理解できて、少しずつコーディングにも取り入れています。

 

クロスブラウザ対応の知識が少しある

IEでこれが効かない」とか、「Macのだとフォントの見え方が違う」とか、少しずつですが知識をつけることができつつあります。

ネットで見たり耳にしたりはするものの、こういうことってクライアントさんからのお声があったりとか、自分でウンウン悩んで経験しないと、なかなか身につけられないなぁと思います。

経験できなかったみんなへどう共有していけるかが今後の課題です。

 

バグ潰しがある程度できる

自分や他人のソースを見て、表示の調整ができるようになってきました。

 

社内ではプログラマーがいるので、基本は社内で動きまで実装します。

プログラムを這わせた後の表示崩れだったり、仕様にはない条件の時にもきれいに表示されるようできる限り整えたり、細かい調整を社内でできる機会があるのがとても大きいです。

バグ潰しをすることで、汎用性のあるコードだったり、ブラウザごとに際の少ない記述の仕方を覚えていけるので、作りっぱなしではなく納品前のクオリティチェックは本当に大切ですね。

当たり前のことですが、当たり前のことを自然にできるようになりたいです。

 

フレームワークのJSの微調整ができる

スライドやページトップなどの代表的なものは難なく実装できるようになりました。

でも、使ったことのないJSは避けてしまいます。まだまだ苦手意識があります。

 

EC CUBEの構造をある程度理解している

1年ほど社内でEC CUBE構築をメインにしていたので、既存ページがどれだけあって、カートの遷移がこんな感じで、デフォルト画像の格納先はここ、みたいな最低限の知識は身につけることができました。

今年からWordPressを始めたのですが、EC CUBEをガッツリやってたおかげか、すんなりオリジナルテーマ作成までできたように思います。

 

WPのオリジナルテーマ作成経験が2案件ある

やっぱり興味のあるWordPress

縁あって2案件テーマ作成をさせていただいて、もっともっとカスタマイズしてみたい!と思っています。

就活の時にポートフォリオを作ったきり放置していたので、新たに制作しようと思っているのですが、WordPressでどこまで工夫して作れるか実験しようと計画しています。

 

Bootstrapでのコーディング経験が30ページほどある

Bootstrapはあまり導入の機会がなく、1度触ったきりですが、本当に便利ですね…。

テンプレートも豊富で、いろいろ触ってみるだけでも勉強になります。

 

できるようになりたいこと

  • ブレのないセマンティックなコーディングを高速にできるようになりたい
  • レスポンシブのコーディングを当然のようにできるようになりたい
  • アクセシブルなコーディングを当然のようにできるようになりたい
  • クロスブラウザの知識をつけたい
  • 効率のよいCMS組み込み管理を考えたい
  • JSを書けるようになりたい
  • canvasやanimationを活用して動きも実装できるようになりたい

 

まだまだコードを書く時に悩んでしまいます。コードストック出来ていないので、いろんなソースから勉強させてもらっているのですが、いざ現場ではイチから書いてしまうので、うまく業務フローに組み込みたいなぁというのが課題です。

あとは、動きをうまく実装できるようになりたいです。

 

まとめ

デザインを勉強しながらコーディングをしてきたので、コーディングでのデザインを限りなく実現するにはどうしたらいいか、労力を考えてどこは細かい調整を諦めるべきかの折り合いをつけられるようになってきました。

いつも、コーディングの時にデザインの最終調整をしています。 

 

Webに適していないデザインだな、と感じたら都度調整できるのは、デザインもコーディングも経験してきたことが大きいと思います。

 

ただ、3年やってきましたがJSはまだまだ書けないです。

最近ではCSSで動きを実装できるようになってきましたが、JSで思い通りの動きを実装できるようになりたいです。

 

主な使用ツール

 

1年目のときの記事

新人Webデザイナーの私が、1年目で指摘されたことを振り返る[コーディング編] - IT系女子ログ