未経験からマークアップエンジニアになるには?求人例や他職種との違いを紹介

最終更新日:2025年3月4日

マークアップエンジニアは、HTML/CSSやJavaScriptを用いてWebサイトのユーザーインターフェース(UI)を構築するエンジニアです。サイトの入口であるUIの開発という重要な役割を担います。また、フレームワークを扱うスキルなど、以前よりも求められるスキルの幅が広がってきています。

この記事ではWeb系のエンジニアとしてキャリアを築きたいと考えている未経験者に向け、マークアップエンジニアの仕事内容やコーダーやフロントエンドエンジニアとの違い、必要なスキルなど未経験から目指す方法について解説します。

レバテックキャリアで転職した3人に2人が年収70万円UPを実現

※2023年1月~2024年3月実績

この記事のまとめ

  • マークアップエンジニアは未経験でも挑戦しやすい職業
  • 未経験者は最低限のHTML/CSSを身につける
  • マークアップエンジニアはキャリアパスが複数ある

この記事の監修者

レバテックキャリア編集部

レバテックキャリアは、IT/Web業界のエンジニア・クリエイター向けに特化した転職エージェントです。当メディアでは、エンジニア・クリエイターの転職に役立つノウハウから、日々のスキルアップや業務に活かせる情報まで、幅広いコンテンツを発信しています。

マークアップエンジニアの
求人を紹介してもらう

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

マークアップエンジニアとは、マークアップ言語を使用してWebページを作成する職種です。マークアップ言語とは、HTMLやCSSなどWebサイトの表面を作成する言語です。ここでは以下の内容について解説していきます。
 

マークアップエンジニアの仕事内容

マークアップエンジニアの仕事内容は以下です。

業務 概要
コーディング HTMLやCSSを用いてコードを書く
バグの修正 ツールなどを用いてバグを探し、
見つかったら修正する
CMSテンプレートの
設計、構築
CMS(コンテンツ管理システム)の
テンプレートの設計、構築
SEO対策 検索エンジンに対して最適化を行い、上位表示を狙う

CMSやSEOに関する仕事はマークアップエンジニアの担当でない場合もありますが、担当する場合もあるのでスキルを身につけておくと仕事の幅が広がります。

マークアップエンジニアの年収

マークアップエンジニアの年収を他職種と比較して紹介します。平均年収と中央値を把握しておくと、年収相場をイメージしやすいでしょう。

職種 平均年収 中央値
マークアップ
エンジニア
4,098,039円 3,500,000円
Webデザイナー 4,259,819円 4,500,000円
フロントエンド
エンジニア
5,061,026円 4,500,000円

※レバテックキャリア独自のデータから算出

マークアップエンジニアの年収相場は、他のIT関連職種と比較すると低めであることがわかります。年収アップを目指したい人は、スキル習得後、他職種へのキャリアアップを検討するのもおすすめです。

マークアップエンジニアと他職種の違い

マークアップエンジニアと他職種の違いについて解説します。他職種について把握しておくことで、そもそもマークアップエンジニアを目指すべきなのか、マークアップエンジニアになった後にどのようなキャリアパスを目指すのか、などの判断に役立つでしょう。

コーダーとの違い

コーダーはHTML/CSSを使用してWebページの外観を作成します。複数ブラウザやスマートフォンなど様々な画面サイズへの対応なども考慮しながら、仕様書に沿ってコーディングを行います。Web系エンジニアの入門的な職種で、JavaScriptのスキルやUX、SEOなどの知識を身につけることで、マークアップエンジニアやフロントエンドエンジニアを目指せます。

フロントエンドエンジニアとの違い

フロントエンドエンジニアはマークアップエンジニアの仕事に加えてJavaScriptのライブラリやフレームワークを利用しながら、より高度なUIを構築する職種です。モダンなWebアプリケーション開発では、ReactやAngular、VueといったJavaScriptのライブラリ・フレームワークを用いて、ユーザー認証、ルーティング、データ処理などを実装します。高度で複雑な開発を支えるため、ソースコードのバージョン管理やパッケージ管理、テストなども行います。

関連記事:フロントエンドエンジニアとは?仕事内容や年収、必要なスキルも解説

Webデザイナーとの違い

Webデザイナーはマークアップエンジニアより上流工程の作業も担います。具体的には、顧客と打ち合わせをして要件を汲み取り設計を行う工程です。コーディングはマークアップエンジニアに流す場合もあれば、Webデザイナー自身が行う場合もあります。

また、プログラミングによるデザインだけでなく、Photoshop®やIllustrator®を使用したグラフィックデザインも業務範囲です。Webデザイナーといっても在籍している企業やプロジェクトによって、WebサイトのUI制作からグラフィック制作まで幅が広いということです。

マークアップエンジニアの場合はコーディングがメインなので、このような差異はあまり生まれません。

関連記事:Webデザイナーとは?仕事内容や他職種との違い、未経験からの目指し方も紹介

マークアップエンジニアの
求人を紹介してもらう

未経験からマークアップエンジニアになるには

未経験からマークアップエンジニアになるために必須のスキルや資格はありませんが、一定のプログラミングスキルや資格を取得しておいたほうが客観的なスキルの証明に繋がります。未経験からマークアップエンジニアになるためには、以下のステップをたどるのがおすすめです。
 

ステップ1:プログラミングスキルの習得する

まずは基本的なプログラミングスキルを習得してください。特にHTML、CSSのスキルは必須です。マークアップエンジニアの仕事の中心はHTML、CSSによるプログラミングだからです。プログラミングスキルを身につける方法は複数あり、具体的には以下が挙げられます。

  • ・スクールに通う

    ・書籍で学習する

    ・学習サイトを活用する

環境やその人の能力などによってベストな方法は変わってくるので、自身に合う方法を選択してください。

ステップ2:ポートフォリオを作成

一定のプログラミングスキルが身についたら、ポートフォリオを作成してください。ポートフォリオとは、経歴などの基本情報や成果物をまとめたものです。エンジニアはポートフォリオによって実力が評価される場合が多いため、マークアップエンジニアにとってもポートフォリオは重要になります。

以下はフロントエンドエンジニアのポートフォリオ作りに関する記事ですが、マークアップエンジニアでもやるべきことは概ね同じです。ぜひご確認ください。

関連記事:フロントエンドエンジニアにポートフォリオは必須?作り方も解説

ステップ3:コーディングの経験を積む

スキルにある程度自信がついたら、クラウドソーシングで受注したり個人的なWebサイトの作成に携わり、実務での経験を積んでください。勉強したスキルだけではカバーできない部分も出てくるので、その都度調べながら進めていくことが重要です。この経験により、実戦的なコーディングスキルが身につくでしょう。

ステップ4:エージェントを活用して転職活動をおこなう

転職エージェントは未経験者でも応募可能な求人を多数保有しているため、未経験からマークアップエンジニアに転職を目指す場合、非常に有効な手段です。たとえば、個人では見つけにくい企業やポテンシャルを重視して採用する企業を紹介してもらえます。

未経験で転職活動の進め方に迷っている場合は特に、転職エージェントの利用がおすすめです。

マークアップエンジニアの
求人を紹介してもらう

未経験可のマークアップエンジニアの求人例

レバテックキャリアの求人から、未経験可のマークアップエンジニアの求人例を紹介します。2025年2月時点で実際に募集されているものです。

【年収】400~650万円

【仕事概要】
・自社運用メディアの作成・修正
・クライアントのコーポレートサイト、ECサイトの新規作成やリニューアル

【必須条件】
・HTMLを用いた開発経験
・CSSを用いた開発経験
・Wordpress もしくは Java Scriptを用いた開発経験

【歓迎要件】
・WEBサイト作成の実務経験(目安最低5サイト以上または1年以上)

上記の案件ではHTMLやCSSの経験自体は求められますが、開発現場での実務経験は必須条件には含まれていません。一定のスキルを身につけたら積極的に企業に応募し、就職して実戦経験を積むのがおすすめです。

マークアップエンジニアの
求人を紹介してもらう

マークアップエンジニアで活躍するために必要なスキル

マークアップエンジニアで活躍するために必要なスキルは以下です。
 

プログラミングスキル

マークアップエンジニアは、まずはHTML・CSSでコーディングができることが重要です。またそこから付加価値を出すためには、JavaScriptを一定レベルで理解してjQueryを使いこなせると良いでしょう。HTML、CSSでWebサイトの表面を作成し、JavaScriptで動きを付けられると開発の幅が広がるからです。またフロントエンドエンジニアなど別職種へのキャリアアップにも繋がるでしょう。

コミュニケーションスキル

マークアップエンジニアは、同じマークアップエンジニアやほかの職種のメンバーとチームで制作にあたります。そのため、チームメンバー間でコミュニケーションを取って認識を合わせていく必要があります。

役割分担があるのですが、連携がうまくできていないと互いの作業成果物を組み合わせたときに全体成果物として成立しません。全体の成果物をきちんと納品できる形にするためには、細かいコミュニケーションが求められます

ユーザビリティ・アクセシビリティの知識

より良いサイトを構築するには、ユーザーの視点で考えることが大切です。どうすればユーザーが使いやすく、アクセスしやすいサイトになるかを検討しながらサイトを構築する力が求められます。

レスポンシブデザインの実装スキル

PCよりもスマートフォンからのアクセスが多くなっているため、スマートフォンに対応したサイトを構築することは必須となっています。サイトを多様な大きさのデバイスに対応させるレスポンシブデザインを実装するスキルが必要です。

フレームワーク・ツールの操作スキル

CSS、JavaScriptのフレームワーク、Gitによるソースコード管理、npmによるパッケージ管理などのスキルがあると実際の開発プロジェクトで役に立ちます。開発ではコードを書くことよりも、いかにコードを書かずにフレームワークやツールを活用するかが重要な面もあります。開発を効率化するためには、フレームワークやツールの活用が欠かせません。

マークアップエンジニアの
求人を紹介してもらう

マークアップエンジニアになるためにおすすめ資格

マークアップエンジニアになるために必須の資格はありませんが、以下の資格を取得することでスキルアップや評価アップに役立ちます。
 


それぞれの資格についてより詳しく解説していきます。

基本情報技術者試験

基本情報技術者試験とは、経済産業省に属する独立行政法人情報処理推進機構が主催する国家試験です。エンジニアに必要な最低限の知識を網羅的に学べるため、非常に人気の高い認定試験となっています。

主な出題範囲は、コンピュータのハードウェアやソフトウェア、ネットワーク、データベース、プログラミング言語などに関する知識です。また、科目A・科目B(午前試験・午後試験)に分かれています。試験概要は以下の通りです。

受験料 7500円
受験資格 無し
出題数 科目A:60問、
科目B:20問
回答形式 多肢選択式

HTML5プロフェッショナル認定試験

HTML5プロフェッショナル認定試験とは、HTMLのプロフェッショナルとしてのスキルを証明できる資格です。試験はレベル1とレベル2に分かれています。レベル1ではWebの基礎知識、CSS、HTMLの基礎文法などが問われ、レベル2ではアニメーション、マルチメディア、通信などについて問われます。

合格率は非公開ですが、動的なサイトやリッチユーザーインターフェースの開発方法などについても問われるため、実務経験者向けの資格といえるでしょう。

試験概要については以下の通りです。

資格試験 レベル1 レベル2
受験料 16,500円
受験資格 無し
出題数 約60問 40~45問
回答形式 CBT方式 CBT方式

Webクリエイター能力検定試験

Webクリエイター能力検定試験とは、サーティファイが実施しているHTMLとCSSのコーディングスキルを認定する試験です。試験はスタンダードとエキスパートの2つのレベルで実施されています。スタンダードは実技問題のみ、エキスパートは実技問題と知識問題の両方が出題されます。

実技試験では実際にエディタを操作してHTMLやCSSを記述するスキルが問われます。マークアップエンジニアの業務に直結した内容であるため、受験する方はエキスパート試験までチャレンジすると良いでしょう。以下は試験概要です。

資格試験 スタンダード エキスパート
受験料 6,100円 7,700円
受験資格 無し
試験時間 テキストエディターの場合:70分
Webページ作成:ワープロの場合:60分
知識問題:20分
実技問題:テキストエディターの場合 110分、
Webページ作成:ワープロの場合 90分
回答形式 実技問題のみ 知識問題(多肢選択式)と実技問題
合格ライン 実技問題において 65%以上 知識問題と実技問題において 65%以上

※本資格のテキストエディタはWindowsの「メモ帳」とmacOSの「テキストエディット」のみを指している

ウェブデザイン技能検定

ウェブデザイン技能検定とは、ウェブデザインに関する知識や技能、実務能力を認定する国家資格です。試験は3級から1級まで実施されており、それぞれ学科試験と実技試験の両方を受験しますが、片方のみ合格した場合、2年間は受験を免除されて、不合格だったほうの試験の合格だけで、それぞれの級の試験の合格と見なされます。

Web制作に関する資格としては唯一の国家資格であり、試験内容も実務で活かせる内容が多いので、積極的にチャレンジしたいところです。2級と1級には受験資格として実務経験などの条件が求められますので、未経験でマークアップエンジニアを目指している方は、まず3級から受験することになります。

以下は試験概要です。

資格試験 3級 2級 1級
受験料 学科:6,000円
実技:8,000円
※23歳未満の
在職者は4,000円
※23歳未満の
在職者以外 は
6,000円
学科:7,000円
実技:16,000円
学科:8,000円
実技:25,000円
受験資格 ・ウェブの作成や
運営に関する業務に
従事している者及び
従事しようとしている者
・2年以上の実務経験を
有する者
・職業高校、短大、高専、
高校専攻科、専修学校、
各種学校卒業又は
普通職業訓練修了した者
・大学を卒業した者
・高度職業訓練を
修了した者
・3級の技能検定に
合格した者
【実技試験】
・1級の技能検定において、
学科試験に合格した者
【学科試験】
・7年以上の実務経験を有する者
・職業高校、短大、高専、
高校専攻科、専修学校、各種学校卒業
又は普通職業訓練修了後、
5年以上の実務経験を有する者
・大学卒業後、3年以上の実務経験
を有する者
・高度職業訓練修了後、
1年以上の実務経験を有する者
・2級の技能検定に合格した者であって、
その後2年以上の実務経験を有する者
試験時間 学科45分
実技60分
学科60分
実技120分
学科90分
実技180分
ペーパー実技60分
出題形式 学科:100点満点中70点以上
実技:100点満点中70点以上 かつ
試験要項に示された各分類において60%以上

マークアップエンジニアの
求人を紹介してもらう

まとめ

この記事ではマークアップエンジニアの仕事内容や必要なスキル、未経験から目指す方法について解説しました。マークアップエンジニアは求められるスキルの習得難易度がほかのエンジニア職に比べて低く、未経験者でも目指しやすい職種です。

一方で近年はマークアップエンジニアの募集は少なくなっており、より高度なスキルが求められるフロントエンドエンジニアの求人が増えています。そのためマークアップエンジニアのスキルだけでなく、フロントエンドエンジニアに必要なスキルを身につけることでキャリアアップを図り続ける必要があります。

さらにサーバーサイドのスキルも身につけ、フルスタックエンジニアを目指せるとより良いです。マークアップエンジニアのキャリアパスにはエンジニア以外のIT職種もあるので、幅広い視野を持つことをおすすめします。

ITエンジニアの転職ならレバテックキャリア

レバテックキャリアはIT・Web業界のエンジニア職を専門とする転職エージェントです。最新の技術情報や業界動向に精通したキャリアアドバイザーが、年収・技術志向・今後のキャリアパス・ワークライフバランスなど、一人ひとりの希望に寄り添いながら転職活動をサポートします。一般公開されていない大手企業や優良企業の非公開求人も多数保有していますので、まずは一度カウンセリングでお話してみませんか?(オンラインでも可能です)

転職支援サービスに申し込む

また、「初めての転職で、何から始めていいかわからない」「まだ転職するかどうか迷っている」など、転職活動に何らかの不安を抱えている方には、無料の個別相談会も実施しています。キャリアアドバイザーが一対一で、これからのあなたのキャリアを一緒に考えます。お気軽にご相談ください。

「個別相談会」に申し込む

レバテックキャリアのサービスについて

採用担当者1000名に聞いたIT人材白書2025 無料でダウンロードする

プロのアドバイザーがあなたのお悩みや疑問にお答えします

- 転職個別相談会開催中 -

相談内容を選択してください

※転職活動や求人への応募を強制することはありません

関連する記事

マークアップエンジニアの求人・転職一覧

×
×

年収アップをご希望の方へ

簡単!年収診断

現在の市場価値や
年収UPの実現方法がわかる!

現在の職種はどちらですか?