LASSIC Media らしくメディア
フロントエンドエンジニアの採用が難しい理由｜デザイナーとの線引き
監修・編集責任者：牛尾 昭昌（株式会社LASSIC 執行役員）
この記事の結論
- フロントエンドエンジニアは開発の側の職種にあたり、デザインの側よりも求人に対して求職者が少ない市場で探すことになります。
- 画面のデザインからHTMLとCSSの組み立て、画面の動きまでのどこを任せるかを決め、求人票でデザイナーとの線を引きます。
- ポートフォリオは見た目だけでなく本人の担当範囲と直した経緯を聞き、継続の改善は社員、期間の決まった開発は業務委託と分けます。
※ 本記事は2026年10月時点の公式情報（省庁・公的機関、および製品やサービスを提供する事業者が公開している資料）に基づきます。
「求人を出しても、フロントエンドの応募がほとんど来ない」「応募は来るが、画面のデザインが得意な人と、画面の動きを作る人が混ざっている」——。画面を作る人を探す開発マネージャや採用担当が、迷いやすい点です。フロントエンドエンジニアは、利用者が直接触れる画面の側の機能を作る技術者です。
IPA（情報処理推進機構）のデジタルスキル標準は、フロントエンドエンジニアを、ソフトウェアの機能のうち主にインターフェース（クライアントサイド）の機能の実現に主たる責任を持つ役割と定めています。*1 本記事では、この標準と厚生労働省の職業情報をもとに、採用が難しい理由、デザイナーとの線引き、ポートフォリオの見方、確保の方法を整理します。
なぜ採用が難しいのか
厚生労働省の職業情報提供サイト（job tag）には、フロントエンドエンジニアという名前の職業はありません。近いのは「システムエンジニア（Webサービス開発）」と「Webデザイナー（Web制作会社）」の2つです。ハローワークの令和7年度の有効求人倍率（求職者1人あたりの求人の数）は、前者が属する職業分類で2.54、後者で0.11です。*2*3 職業分類全体の値で、フロントエンドだけの数字ではありません。job tagは前者について、経験者の多くが都市部とその周辺で働き、開発の技術も日進月歩だと説明しています。*2
| 比べる点 | システムエンジニア（Webサービス開発） | Webデザイナー（Web制作会社） |
|---|---|---|
| 有効求人倍率（令和7年度） | 2.54 | 0.11 |
| 仕事の中心 | Webサービスをチームで設計し開発する | Webサイトの企画とデザイン |
| 働く場所 | 多くは都市部とその周辺。在宅で仕事をすることも多い | 制作会社や一般企業のWebサイト関連部門。テレワークが可能な会社が多い |
開発の側では求人が求職者の2倍を超え、デザインの側では求職者のほうがずっと多い状態です。画面を作る人に開発の力を求めるほど、採りにくい側の市場で探すことになります。フロントエンドエンジニアの採用が難しい理由は、次のように整理できます。
- 開発の側の人材は、求人の数に対して求職者が少ない
- 経験者の多くが都市部とその周辺で働いている
- 開発のための技術も日進月歩とされ、経験の年数だけでは力を測りにくい
- デザインと開発のどちらを求めるかが求人票で曖昧だと、合わない応募が混ざる
デザイナーとの違い
デジタルスキル標準は、UX/UIデザイナーを、製品やサービスの利用者の体験を設計し、情報の設計や機能と情報の配置、外観、動きのデザインを行う役割と定めています。*4 一方のフロントエンドエンジニアは、画面の機能を実際に動く形にする責任を持つ役割です。役割ごとのスキルの重要度を並べると、重心の違いが分かります。
| スキル項目 | フロントエンドエンジニア | UX/UIデザイナー |
|---|---|---|
| デジタルプロダクト設計 | b | a |
| デザイン制作実務 | c | b |
| フロントエンドシステム開発 | a | b |
| バックエンドシステム開発 | b | c |
ただし、現場の線引きは会社ごとに違います。job tagの調査では、Webデザイナーの80.0%がHTMLやCSSでWebサイトを制作し、Webサービス開発のシステムエンジニアの77.8%が画面デザインをデザイナーに依頼しています。*2*3 小さな企業ではすべての役割を少数または1人が担うこともあると、デジタルスキル標準も書いています。*1
求人票で決めておく担当範囲
画面づくりの仕事を分けてみると、デザイナーとフロントエンドエンジニアが重なるのは、HTMLとCSSで画面を組む部分です。
デジタルスキル標準は、フロントエンドの開発スキルとして、UI設計やレスポンシブデザイン（画面の幅に合わせて表示を変える作り）などを挙げています。*1 求人票を書く前に、次の点を決めておきます。
- 画面のデザインを自分で作るか、デザイナーが作ったものを組み立てるか
- スマートフォンでの見え方を誰が考え、誰が確かめるか
- 利用者に使ってもらって使い勝手を確かめるテストに加わるか
- サーバー側とのデータの受け渡しをどこまで担うか
Webサービス開発のシステムエンジニアでは、スマートフォン用のWebサイトを検討するタスクを77.8%、使い勝手を確かめるテストを80.0%が行っています。*2 技術名の書き方は求人票の技術スタックの書き方で扱っています。
ポートフォリオの見方
ポートフォリオ（過去の作品をまとめたもの）は、見た目の良さに目が行きがちです。job tagは、Webデザイナーを、利用者に支持されるサイトを作れるかという個人のスキルが問われる職業だと説明しています。*3 見た目はデザイナーを見る軸でもあるので、フロントエンドでは画面をどう動かし、どう直したかを聞きます。
デジタルスキル標準は、フロントエンドエンジニアの主な業務として、試作をしながら利用者の反応を踏まえて画面の機能を作ることと、運用中の利用者の声を踏まえて改良することを挙げています。*1 この2つを質問に置き換えると、次のようになります。
| 確かめる点 | 質問の例 |
|---|---|
| 本人の担当範囲 | デザインと実装のどこまでを自分で行いましたか |
| 試作と見直し | 試作を見せた後、どこを作り直しましたか |
| 公開後の改善 | 利用者の声を受けて、何を変えましたか |
| 画面の幅への対応 | スマートフォンで見たときの表示をどう作り分けましたか |
仕事で作った画面は公開できないことも多いので、そのときは説明で同じ点を確かめます。成果物の見方は面談の質問と過去の成果物の見方でも扱っています。
社員で採るか外部人材か
job tagは、Webサービス開発のシステムエンジニアについて、人材確保のため雇用形態は正社員が多く、フリーランスで業務委託契約を結んで開発に参加している人もいると説明しています。*2 長く続く仕事と期間の決まった仕事とで、確保の方法を分けます。
| 仕事 | 向いている方法 |
|---|---|
| 自社サービスの画面を続けて良くしていく | 社員採用 |
| 近くで経験者が見つからない | リモートワークの社員採用 |
| 画面の作り直しなど期間の決まった開発 | 業務委託の専門人材 |
画面の開発をまとめて外部の会社に頼む進め方はフロントエンドエンジニア不足を外注で補う進め方で扱っています。契約の細かい扱いは、契約書と専門家に確かめてください。
まとめ：フロントエンドの採用で確かめたい3つの点
フロントエンドエンジニアの採用で確かめておきたい点は3つです。第一に、この職種は求人に対して求職者が少ない開発の側の市場で探すと知っておくこと。第二に、画面のデザインから画面の動きまでのどこを任せるかを決め、求人票でデザイナーとの線を引くこと。第三に、ポートフォリオでは本人の担当範囲と直した経緯を聞き、長く続く仕事は社員、期間の決まった開発は業務委託と分けることです。この3点を押さえておけば、「デザインが得意な人ばかり応募してきた」という事態を避けやすくなります。採用の進め方に迷いがあれば、外部の手を借りるのも一つの選択肢です。
よくある質問
フロントエンドエンジニアにデザインも求めてよいですか
求めてよいものの、必須にする範囲は絞ります。デジタルスキル標準は、フロントエンドエンジニアにはデザインやプロダクトマネジメントに関するスキルも必要だとしています。*1 ただし両方を高い水準で必須にすると候補者が限られるので、片方は歓迎の要件に置けます。
経験の浅い人を採って育てることはできますか
できます。job tagは、Webサービス開発の新卒者は座学やOJT（職場で仕事をしながらの訓練）で開発のスキルを学んでいくと説明しており、職業訓練などを経て転職してくる人もいるとしています。*2 育てる間は、経験者が画面の設計を見る体制を用意しておきます。
地方の会社でもフロントエンドエンジニアを採れますか
通勤できる範囲だけで探すと難しくなりやすい職種です。経験者の多くは都市部とその周辺で働く一方、在宅で働くことも多いとされます。リモートワークを前提に、採用する地域を広げる方法があります。
画面を作る人材を相談
任せたい画面の仕事の範囲が分かっていれば、そのままご相談いただけます。社員で採るか、画面の作り直しの期間だけ業務委託で頼むかを決めきれていない段階でも構いません。
Remoguとリラシクなら、リモートワークで働く社員の候補者も、業務委託で開発に加わる専門人材も探せます。
Remoguは、リモート前提で全国から即戦力のITプロ人材を調達するサービスです。リラシクは、扱う求人がすべてリモートワークのITエンジニア専門転職エージェントです。どちらもLASSICが運営しています。
出典
- *1 参考：IPA「デジタルスキル標準 ver.2.0（分冊版：DX推進スキル標準 ソフトウェアエンジニア編）」（https://www.ipa.go.jp/jinzai/skill-standard/dss/rcu1hd000000j76k-att/sep_dss-p_swe.pdf）。出典：独立行政法人情報処理推進機構（IPA）「デジタルスキル標準 DSS-P 分冊版 ソフトウェアエンジニア編 ver.2.0」（2026年4月・PDF）。ロールの定義、共通スキルリストの全体像、スキルマッピングの考え方（重要度のつけ方）、ソフトウェアエンジニアのロール（ロールの分担について、フロントエンドエンジニアの責務・主な業務・スキル）を参照（確認日2026年10月17日）（2026年10月確認）
- *2 参考：厚生労働省 職業情報提供サイト（job tag）「システムエンジニア（Webサービス開発）」（https://shigoto.mhlw.go.jp/User/Occupation/Detail/314）。出典：厚生労働省 職業情報提供サイト（job tag）「システムエンジニア（Webサービス開発）」。どんな仕事？、タスク（実施率。厚生労働省が2023年度に実施した委託調査結果に基づく）、就業するには？、労働条件の特徴、ハローワーク求人統計データ（有効求人倍率・令和7年度。職業分類「ソフトウェア開発技術者（WEB・オープン系）」等）を参照（確認日2026年10月17日）（2026年10月確認）
- *3 参考：厚生労働省 職業情報提供サイト（job tag）「Webデザイナー（Web制作会社）」（https://shigoto.mhlw.go.jp/User/Occupation/Detail/326）。出典：厚生労働省 職業情報提供サイト（job tag）「Webデザイナー（Web制作会社）」。どんな仕事？、タスク（実施率）、就業するには？、労働条件の特徴、ハローワーク求人統計データ（有効求人倍率・令和7年度。職業分類「ウェブデザイナー」等）を参照（確認日2026年10月17日）（2026年10月確認）
- *4 参考：IPA「デジタルスキル標準 ver.2.0（分冊版：DX推進スキル標準 デザイナー編）」（https://www.ipa.go.jp/jinzai/skill-standard/dss/rcu1hd000000j76k-att/sep_dss-p_d.pdf）。出典：独立行政法人情報処理推進機構（IPA）「デジタルスキル標準 DSS-P 分冊版 デザイナー編 ver.2.0」（2026年4月・PDF）。ロールの定義、デザイナーのロール（UX/UIデザイナーの責務・主な業務・スキル）を参照（確認日2026年10月17日）（2026年10月確認）
