web制作

マークアップエンジニアの生存戦略と将来性【自分に付加価値をつける】

マークアップエンジニア
本ページにはプロモーションが含まれています。

こんにちは、現在web系エンジニア(マークアップエンジニア)として活動しているしょーご(@samuraibrass)です。

マークアップエンジニアとしてフリーランス活動を初めてしばらく経ちますが、最近はこの先のキャリア戦略を考えています。

  • 技術の進歩によるデザインカンプからのコーディングの自動化
  • コーダー、マークアップエンジニアの増加による能力のコモディティ化

などなどは現在マークアップエンジニアのみなさんも脅威として認識しているのではないでしょうか。

私自身もまだこの先のキャリアをしっかり決められているわけではありませんが、

マークアップエンジニアがこの先生き残る現実的な手段をいくつか考えてみました。

それではみていきましょう。

\現役エンジニアのレビュー付き/

実践レベルのコーディング課題公開中

デザインカンプからのコーディング練習課題【オリジナルポートフォリオを準備できるようになりました】
販売ページはこちら
  • デザインカンプからのコーディングを経験したい
  • 現役エンジニアのレビューを受けてみたい
  • 即戦力級のポートフォリオを用意したい

2024年にデザインを完全リニューアルしています!

コーディングに自身をつけるにはプロからのレビューを貰うのが必須なため、制作会社も利用するレビューツールで添削をしています。

しょーごログ-コーディング課題のレビュー
レビューの様子

Web制作学習ロードマップにも取り入れているため、学習終了まで迷わず進むことが可能です。コーディングを本気で仕事したい方はぜひご活用ください!

無料の入門編から本格企業サイトまで/

そもそもマークアップエンジニアとは

コーダーとの違い

一般的にマークアップエンジニアはコーダーの上位職と見なされています。

コーダーはデザインカンプ(psdデータ)を元にHTML,CSS,jQueryでの実装が可能。

マークアップエンジニアはSEOに準じたより正確なコーディングや設計思想、CMS(wordpressなど)の実装までこなす。

ちなみに私のスキルは以下のような感じです。

  • 設計思想(BEMやSMACSS)に基づいたコーディング
  • CSSプリプロセッサ(Sass)やタスクランナー(gulp)を用いたコーディング
  • jQueryプラグインによる動きの付与
  • wordpress実装

まんまマークアップエンジニアといった感じです。

次にこのようなマークアップエンジニアが次に取るべきキャリアプランはどういったものがあるのかみていきましょう。

選択肢その1:フロントエンドエンジニアになる

1つ目はプログラミング方面のスキルを深めてフロントエンドエンジニアになるということです。

フロントエンドの中途採用条件をみていると、マークアップエンジニアのスキルにプラスして

  • gitなどのバージョン管理ツールを使用してチーム開発を行える
  • JavaScriptのフレームワーク(ReactやAngular、Vueなど)を用いてwebアプリケーションを作れる
  • OAuthやAJAXについての知識があり, サーバサイドのAPIを考慮した実装ができる
  • PHPやMySQLの知識、実装
  • AWSのサービスを用いたインフラの構築やWeb APIの作成

などなど、様々必要なようです。

webマーケティング系の会社や地方の会社だと、フロントエンドへのマスト条件が上記のマークアップエンジニアレベルだったりもするので、一概には言えないです。

パッとみた感じ、かなり難しそうといった印象を受けます。

ちなみに私はフロントエンド方面へ進む予定ですが、どこかで行き詰まりを感じた時点でいったん就職、またはインターンも考えています。

もともと、フリーになったり会社員としてモダンなスキルをバリバリ習得したりといった、行き交いの出来る柔軟な働き方に憧れてこの業界に入った部分もあるので、割と前向きに考えています。

選択肢その2:webデザイナーになる

2つ目はデザイナーを目指す道です。

皆さんはすでにマークアップエンジニアとしてコーディング能力は身につけているので、デザイナーとしての力をつければ全てを一貫したweb制作が行えるようになり、単価アップはまちがいないです。

デザイナーに必要なスキルは

  • photoshopを用いた画像加工、編集
  • illustratorを使用したロゴ、バナー作り
  • XDやsketchを利用したデザインカンプ、プロトタイプの作成
  • UXに配慮したロジカルなデザイン

などがあげられると思います。

僕を含めた多くのマークアップエンジニアは正直そんなに得意ではないと思いますが、

誰かに師事してデザインをみてもらいつつ案件でブラッシュアップしていけば、独学でもスキルを高めることは不可能ではないと思います。

またコーディングもwebデザイナーの職務範囲に入っていることが多いので、コーディングとデザイン、両方のスキルを高められる可能性もあると思います。

この状態になると、コーダー、デザイナー両方の立場でものが見れるので、webディレクターの道もひらけてくるかもしれません(チームを取りまとめるディレクターの方が収入は高いです)

選択肢その3:webマーケターになる

マーケターと聞いて、全然違う職種だとお思いでしょうか。

実際はこれまでのエンジニア、デザイナーがコンテンツの実装者だとすれば、マーケターはコンテンツの運用者という位置付けになります。

つまりマークアップエンジニア→webマーケターへの転職は

コンテンツ作成者→運用者へ

ということになり、むしろ深い相関関係にあると言えます。

webマーケターに必要なスキルは

  • 数値管理や分析の経験(googleアナリティクスを用いたPDCA)
  • LPの運用、最適化
  • SNS広告最適化
  • コンテンツ企画
  • 少しHTML、CSSの知識

などがあげられます。

作って終わりでいいのかという問題

web制作をなぜ行うのか、それは顧客の売り上げ、知名度アップなど様々なマーケティング上の目的があり、webサイトの制作はその中継点であるにすぎません。

作って終わりではなく、作って運用して初めて意味が生まれるのです。

僕らがよく作る、リスティング広告に使われるLPが良い例でしょう。

僕の周りにも運用が好きだと気づき、マークアップエンジニアからwebマーケターに転職した人がいますが、とても楽しそうに働いています。

個人的にも結構興味があるので、将来はwebマーケターの道に進むことも選択肢には入れています。

マークアップエンジニアはオワコン化するのか?

そもそも僕がマークアップエンジニアとしてのキャリアを再考し始めたのは、最初にもあげた通り技術の進歩により、取って食われる可能性を否定できないというところにあります。

wordpressサイトは増えている

しかし、今後数年の話をするならマークアップエンジニアは全然稼げるとも思っています。

最近ニュースになりましたが、今や世界のサイトの3分の1がwordpressになっているようです。

つまり、今後数年はむしろwordpressで実装できるマークアップエンジニアは重宝されると思われます。

なので、僕が考えたこの記事の主題である『マークアップエンジニアの生存戦略』は

マークアップエンジニアとしての技術が陳腐化する前に稼ぎつつ、次のステップに向け日々努力する

ここに尽きるのではと思います。

ちなみに僕は今集中していることは

javascript、およびフレームワーク(Vue.js)を利用した小規模アプリケーションの開発

で、なんとかオブジェクト指向などと格闘しています。

2019年5月の連休中にToDoアプリあたりを作ろうと思ってます。

自分に付加価値をつける

マークアップエンジニアの先は人によってまちまちだと思います。

何れにしても、今の技術+何か付加価値を掛け合わせることで、自分の市場価値はかなり伸びる(マーケティングのできるエンジニア、デザインから作れるエンジニアなど)ので、

今の先を見据えるマークアップエンジニアの方々、一緒に頑張りましょう!

2020年12月追記:周辺業務へ漕ぎ出せ

この記事執筆より一年半、現在でもマークアップエンジニアは周辺業務にも手をつけるのが良いと思います。

私や周りの具体例をお教えします。

  • フロントエンドのマークアップ 部分を担当(Nuxtなど)
  • Railsサービスのフロントマークアップ担当(Rails&Gitの基礎は知ってる必要あり)
  • ディレクターとしてデザイナーコーダーをまとめてプロジェクトを進める

このあたりは実現可能性が高いです。マークアップ嫌いなサーバーサイドエンジニアは多いですし、コーダーとしての経験はディレクターとしても生きてきます。

そして、コーダーとして様々な企業と一年ぐらい働いていると、

取引先

〜さんって、この業務もいけたりします?できればぜひ〜さんにお願いしたいです…!!

という話がきたりします。

気付けば「マークアップエンジニア」という肩書きを超えた職域になっているでしょう。なので、あまり心配しなくても大丈夫です。

2023年追記

この記事を書いたのは2019年あたりですが、状況はあまり変わっていないように見えます。

多くの同期がWeb制作を辞めるか、プログラマーになるか、ディレクターになるか、マーケターになるかしています。

私自身は未だにコーディングをしていますが、最近WixやSTUDIOの進化がやっとまともになってきたので、まだまだ業界の波乗りチャンスはありそうだと思ってみています。

コーディングできてこそ、これらのNoCodeツールは真に有用に使えるわけですね。

Web制作を辞めてしまった人の特徴を以下で述べているので、備えたい人へ、詳しくは以下の記事に書きました。

まずWeb制作会社で経験を積むのがおすすめ

現実は厳しく、スキルアップの機会に恵まれない駆け出しフリーランスも多いです。

フリーランスでマークアップエンジニアになった人の多くが、実はスキルアップに限界を感じて就職転職をしていくケースが大変多いです。

なので、個人的には「まず制作会社に就職転職してからフリーランスを目指す」ほうが再現性が高いかなと思っています。

以下の記事で詳しく解説しているので、ぜひ参考にしてください。

コーディング案件の探し方

即戦力になれるコーディング課題

HTML初心者からWordPress実案件レベルまでのコーディング演習課題を「専用ページ」にて公開しています。

デザインカンプからのコーディング練習課題【オリジナルポートフォリオを準備できるようになりました】
  1. Figma,Photoshopデザインからのコーディング
  2. サーバーアップロードでサイト公開
  3. プロによる最大3回の表示確認特典
  4. レビュー返しは爆速
  5. 2024年にデザイン刷新!被らないポートフォリオ

初級編」は初めてデザインからコーディングする方向け
中級編」はJavaScriptやjQueryの練習
上級編」はWordPressの実案件を模擬体験できるレベル感にしています。

中級者の方には高難易度課題を詰め合わせた「即戦力セット」も出しています。

全課題で「実務レベルの、プロの厳しいレビュー」を受けられるようにしています。

また、2024年には随時デザインの刷新をしており、完全リニューアル!!

他者と差をつけられるポートフォリオが準備できます!

コーディング課題 中級 中級Ex
しょーご

制作会社も使用する専用レビューツールで分かりやすく添削していきます!

基本的に「まとめて購入」していただくとかなりお得になります↓

コーディング課題
まとめて購入

全部盛りこちらから
中級以上こちらから
即戦力編こちらから

コーディングは書籍だけではなかなか実力がつかないので、実務レベルのレビューを受けて自身をつけたい人は是非挑戦してみてください!

しょーごログ-コーディング課題のレビュー
レビューの様子

\課題の購入はこちらから/

応援して頂ける方へ

ご寄付を頂けると今後の更新の励みになります!

🍺 ビールをプレゼントする

});