ワンキャリア
  • 企業検索
  • 選考・イベント
    • 本選考
    • インターン
    • 説明会・セミナー
    • 合説・座談会
  • ES・体験談
    • ES・体験談を探す
    • クチコミを探す
    • ESの達人(自動作成ツール)
    • 投稿する(謝礼あり)
  • 就活準備
    • 就活記事
    • 企業動画
    • 就活対策ガイド
  • 就活支援サービス
  • 適性検査
    ログイン / 会員登録
    採用担当者様はこちら
    マイページ
    スカウト
    お知らせ
    申込済み...
    就活支援...

    ワンキャリアforエンジニア
    ワンキャリア転職
    キーワード検索
      • 業界から企業をさがす
      • クチコミからさがす
      就活サイトトップ就活記事タイプ別の就活法【入門】HTMLとはどんな言語?できることや学習方法、...

      【入門】HTMLとはどんな言語?できることや学習方法、新卒採用している企業の探し方などを解説!

      プログラミング エンジニア
      2024年1月5日(金) | 5,278 views

      HTMLは、これからプログラミング学習を始めたい方の初めの第一歩として強くおすすめできる言語です。なぜなら、他の言語のような環境構築や、複雑なロジックは不要だからです。HTMLをやってみることで、「プログラミングって案外簡単なのでは?」と思えるはずです。

      本格的なプログラミングではプログラムを書いて実行することというよりは全体設計が難しいのですが、HTMLを学習することで、プログラムを書いて実行すること自体は非常に簡単ということが分かるはずです。

      このページでは、HTMLでできること、学習方法、仕事内容などについて解説していきます。

      <目次>
      ●HTMLってどんな言語?
      ●HTMLの特徴は?
       ・HTMLのメリット
       ・HTMLで開発されたサービスの事例
       ・HTMLのデメリット
      ●他言語との違いは?
       ・Javaとの違い
       ・PHPとの違い
       ・相性の良い他言語
      ●HTMLを使ってどんな仕事ができる?
       ・職種の例
       ・仕事内容の例
      ●HTMLを学びたい! まずは何をすればいい?
       ・学習の大まかな流れ
       ・HTML学習におすすめの書籍、サイト
       ・ライブラリ/フレームワークとは
      ●HTMLで就職できる企業を探すには?
       ・HTMLで就職できる企業の探し方
      ●この記事のまとめ
      ●先輩エンジニアの選考体験談が見られる! ONE CAREER for Engineerのご紹介
       ・ONE CAREER for Engineerではどんなことができる?

      HTMLってどんな言語?

      HTMLは、Hyper Text Markup Language(ハイパーテキスト・マークアップ・ランゲージ)の略です。名前から何となくイメージできる通り、見出し、段落、表、リンクなどウェブページの表面、特に文章パーツを作る言語です。どのウェブページも開くと文章が書かれていますが、この文字はHTMLです。

      HTMLにはタグという概念があるのですが、このタグで文章を囲うことでページ表面に出力しています。タグの例をご紹介すると、以下のようなイメージです。

      <p>サンプル</p>

      上記のように、文章の前後にタグを書くとHTMLになります。ちなみに、<p></p>は通常のテキストという意味です。

      HTMLの特徴は?

      HTMLの概要は上でご紹介した通りです。次に、HTMLの特徴について簡単にご紹介します。


      HTMLのメリット

      まずはHTMLのメリットをご紹介します。


      学習の難易度が低い


      HTMLは多言語と比較すると、とにかく学習の難易度が低いです。上でも触れましたが文字を記述したい場合はタグで囲むだけなので、タグさえ把握していればHTMLを記述できます。

      また、タグを覚える必要はありません。ざっくりと把握していればその都度調べることが可能で、よく使うタグはいつの間にか覚えているはずです。よく使うタグは辞書登録しておいて、簡易的に入力できるようにしておくのもいいかもしれません。

      開発向きのエディタを使用するのもいいのですが、例えばメモ帳にべた書きして拡張子だけ変えてもすぐにHTMLファイルを作成できます。ちなみに、拡張子は「.txt」から「.html」に書き換えるとHTMLファイルになります。HTMLファイルはダブルクリックすると自動的にウェブブラウザーで表示されます。


      使い道が多い


      HTMLの役割は、ウェブページ表面の実装です。つまり、ウェブサイト、ウェブアプリ、ウェブシステムであればほとんどHTMLが使われているということです。ウェブ開発において、HTMLは基本スキルです。


      HTMLで開発されたサービスの事例

      HTMLで開発されたサービスは挙げきれないほどあります。Amazonや楽天市場のような通販サイト、ファーストリテイリングや良品計画(無印良品)のようなメーカーのサイト、ニュースサイトなどでもHTMLが使われています。

      ただし、最近はCMS(Contents Management System)などが充実しているのでHTMLなしでもウェブサイト、ECサイトを作ることが可能です。CMSとは、ウェブサイト制作の土台のようなものです。もともと土台があるので、ノンプログラミングでサイト制作ができます。ちなみに、CMSは実際の開発現場でもよく使われています。


      HTMLのデメリット

      次に、HTMLのデメリットを挙げていきます。


      アルゴリズムを学べない


      HTMLはハードルが低く、プログラミング初心者が取っつきやすい言語ということでした。しかし、取っつきやすい反面、プログラミングに重要なアルゴリズムを学べないという欠点があります。

      アルゴリズムとは、ざっくり言えばどのように処理していくかの設計のようなものです。大枠の設計ではないのですが、プログラミングにはいくつか代表的な処理の流れがあります。

      例えば、データを入力して、ループで回してデータを照合して、最終的に出力する、といった流れを指します。HTMLにはこのようなアルゴリズムの概念がないので、他の言語に移行した際に難しく感じる可能性があります。とはいえ、HTMLの後に学習していけば問題ないでしょう。


      HTML単体で使うことは少ない


      HTMLはCSS(Cascading Style Sheet)やJavaScript(ジャバスクリプト)といった言語とセットで使われることが多いです。CSSは、HTMLで作成した文章を配置したりデザインしたりする言語です。JavaScriptはウェブページに動きを付ける言語です。例えば、ポップアップを表示したり、カーソルを当てたらオブジェクトが大きくなったりするイメージです。

      ウェブサイトのフロントエンドはだいたい上記3つの言語で作られているので、HTMLを学習した後にCSSとJavaScriptを学習するのが一般的です。

      他言語との違いは?

      HTMLはCSS、JavaScriptとセットで使われることが多いということでした。では、他の言語と比較するとどのような違いがあるのでしょうか。ご紹介していきます。


      Javaとの違い

      プログラミング言語の中で知名度が高いものにJava(ジャバ)があります。プログラミングに関心がない人でも、耳にしたことはあるかと思います。Javaはサーバーサイドの実装で使用されることの多い言語で、上でも触れた大規模な設計やアルゴリズムが必要です。HTMLとJavaは難易度が大幅に異なるので、HTMLを学習した後に本格的な学習が必要です。


      PHPとの違い

      PHP(PHP:Hypertext Preprocessor)は簡易的なアプリケーション開発で使用されることが多いですが、簡易的といってもHTMLのような簡単さがあるわけではありません。Java同様サーバーサイドの開発で使用されることが多く、アルゴリズムや設計の知識も必要です。


      相性の良い他言語

      HTMLと相性の良い言語は、上でも触れた通りCSSとJavaScriptです。これら3つのスキルがあれば、フロントエンドの実装ができます。そして、上で挙げたJavaやPHPのスキルが加われば、サーバーサイドの実装もできるのでシステムとして完結します。

      CSSはHTMLと近いので、HTMLの次のステップアップとしてちょうどいいでしょう。JavaScriptは比較的簡易に扱える言語ですが、JavaやPHP同様アルゴリズムや設計の概念はあります。

      つまり、HTML→CSS→JavaScript→PHPといった流れで学習していけばスキルアップがスムーズです。

      HTMLを使ってどんな仕事ができる?

      HTMLを使えばウェブページ表面に文章を作れるということでしたが、職種や具体的な仕事内容としてどのようなものがあるのか、ご紹介していきます。


      職種の例

      HTMLを使う職種の例として、フロントエンドエンジニアやアプリケーションエンジニアが挙げられます。ただし、上でもご説明した通りHTML単体では難しいです。CSSとJavaScriptは最低限、身に付けている必要があるでしょう。


      仕事内容の例

      HTMLのスキルがあれば、ウェブ開発、システム開発、ゲーム開発などに生かせます。ただし、いずれもHTML単体でできるわけではありません。HTMLにできるのはあくまでも表面の文章のみなので、内部のロジックなどは別の言語が必要です。

      HTMLを学びたい! まずは何をすればいい?

      HTMLの学習方法をご紹介します。


      学習の大まかな流れ

      HTMLを含めて、プログラミングを学習するにはインプットとアウトプットの両方を行う必要があります。しかし、アウトプットと言っても何をプログラミングすればいいのか分からないでしょう。

      そこでおすすめの方法は、書籍やサイトで学習しつつ、そこで出てくるプログラムを書いて実行していくことです。学習した内容を実際に手を動かして確認する流れです。


      HTML学習におすすめの書籍、サイト

      HTML学習に向いている書籍は多数あります。そして、どれで学んでもおおむね必要なスキルは身に付くでしょう。好みで選んで問題ありませんが、ここでは代表的なものをご紹介します。

      ・『1冊ですべて身につくHTML & CSSとWebデザイン入門講座』(SBクリエイティブ、2019年)


      ・『これだけで基本がしっかり身につく HTML/CSS&Webデザイン1冊目の本』(翔泳社、2021年)

      サイトについても、有名どころのサイトで基本を学習すれば間違いないです。代表的なサイトは以下です。

      ・ドットインストール

      ・Progate


      ライブラリ/フレームワークとは

      プログラミングには、ライブラリやフレームワークという概念があります。ライブラリは便利な機能の集まりで、フレームワークはプログラミングを行う土台かつ便利な機能を引用できる仕組みのことです。

      ライブラリやフレームワーク自体もプログラミングによって作られていて、そこから機能を借りることにより自分でプログラムを書かなくても機能を使えるイメージです。

      ライブラリやフレームワークは利便性の高いものですが、HTML単体では用意されていません。HTMLには複雑な機能はないからです。今後JavaScriptやサーバーサイドの言語を学ぶ際に詳しく学んでいくのがおすすめです。

      HTMLで就職できる企業を探すには?

      HTMLのスキルを身に付けることで、企業に就職することはできるのでしょうか。


      HTMLで就職できる企業の探し方

      HTMLのスキルで就職できる企業を探すには、「HTML 新卒」で検索をかける、もしくは気になる企業の募集要項より、「求めるスキル」をチェックするといいです。ただし、HTMLのスキル単体で企業に就職するのは難しいかもしれません。

      →スキルを生かして就職する場合、最低でもCSSとJavaScriptのスキルは必要だと思われます。サーバーサイドの言語が扱えるとよりいいです。また、年齢が若い場合はポテンシャル採用などで、スキルゼロの状態から就職できる可能性もあります。

      この記事のまとめ

      HTMLはウェブページなどの表面に出力される文章を作成する言語です。HTMLは他の言語と比べて難易度が低く、最初に学習する言語としておすすめです。HTMLのスキルを身に付けた後には、CSS、JavaScriptのスキルをセットで身に付けるのがおすすめです。

      フロントエンドの言語が身に付いたら、サーバーサイドの言語もあわせて学習することでスキルの幅が広がり、需要のあるエンジニアに成長できます。

      先輩エンジニアの選考体験談が見られる! ONE CAREER for Engineerのご紹介

      エンジニア就活をこれから始める、今まさに選考を受けている皆様へ、このような悩みはないでしょうか?

      「総合職やビジネス職ばかりで、エンジニア職の体験談が見つからない」「内定を獲得した先輩が、どんな開発経験を積んでいたのか/どんな対策をしていたのか知りたい」

      こういった悩みをお持ちの方に向けて、エンジニア職特化の就活サイト、「ONE CAREER for Engineer」をリリースいたしました!

      ▼ONE CAREER for Engineer
      エンジニアや技術職の就活・選考体験談を探す
      ※選考体験談の閲覧には、別途会員登録が必要です。


      ONE CAREER for Engineerではどんなことができる?


      1. エンジニア特化の選考体験談が見られる!


      エンジニア人気企業を中心に、先輩のESや選考体験談を公開中です。

      エンジニア就活ならではといえる、「コーディングテスト」の体験談も多数公開しています!


      2. 登録いただいたプロフィール情報をもとにポートフォリオを自動生成!


      「ご自身の技術経験を企業へどう伝えよう……」とお悩みの方は、こちらの機能をご活用ください!


      3. エンジニア職の選考体験談投稿で謝礼(Amazon ギフト券)をもらえる!


      ご自身の選考の体験談をご登録いただくことで、謝礼(Amazonギフト券)をプレゼントしております!

      エンジニア就活をこれから始める方、選考対策にお困りの方は、ぜひこの機会にご登録をお待ちしております!

      (Photo:BAIVECTOR/Shutterstock.com)

      ーページトップへ戻るー

      この記事が気に入ったら
      いいね!しよう
      ワンキャリアの人気記事をお届けします。
      Facebook X
      ONE CAREER for Engineer
      ONE CAREER for Engineer

      ITエンジニアを目指す学生向けに「はじめてのエンジニアのキャリアを選ぶ」際にお役立ていただけるコンテンツを発信してまいります。
       
      ◆ エンジニア就活 ◆ より詳細な体験談に基づく選考対策が可能!
      エンジニア就活特化型サービス『ONE CAREER for Engineer』へのご登録/ご利用はこちらから
      https://onecareer.jp/engineer/contents/experiences
       
      ▼ 主な機能
      ・選考体験談:エンジニア職の面接やES、コーディングテストなどの内容や対策方法
      ・ポートフォリオ作成機能(数分の入力で自動作成)

      この記事に関連する就活記事を読む

      • 2024/01/05
        ONE CAREER for Engineer

        【入門】Kotlinとはどんな言語?できることや学習方法、新卒採用している企業の探し方などを解説!

        Kotlinは2011年に開発されたオブジェクト指向型言語で、Javaを改良する形で作られました。ではKotlinはどのような言語仕様で、どのような開発に用いられるのか、解説していきます。 <目...
      • 2024/01/05
        ONE CAREER for Engineer

        【入門】C#とはどんな言語?できることや学習方法、新卒採用をしている企業の探し方などを解説!

        IT業界を目指している方やプログラミングに興味がある方なら、「C#」というプログラミング言語について一度は耳にしたことがあると思います。 こちらの記事では、C#とはどのような言語か、C#を使った...
      • 2022/11/21
        アーサー

        最新のテクノロジーは使わない?意外と地味なITコンサルタントの実態

        皆さんはじめまして、アーサーと申します。私は、大学卒業後、総合系コンサルティングファームに就職し、入社3年目を迎えたITコンサルタントです。ITコンサルタントというと、ここ最近学生からの人気が上...
      • 2024/01/05
        ONE CAREER for Engineer

        フロントエンドエンジニアって実際どうなの?キャリアパスや将来性を実際の採用事例から解説!

        IT関連に就職しようと思っているけど、ネットで調べてもいろいろな職種が出てくるから分かりづらいと思ってませんか。こちらの記事では、IT関連の職種であるフロントエンドエンジニアについて解説します。...
      • 2024/01/05
        ONE CAREER for Engineer

        【入門】TypeScriptはどんな言語?できることや学習方法、仕事内容などを解説!

        こんにちは! ONE CAREER for Engineerです! こちらの記事では、具体的にTypeScriptはどんな言語なのか、何ができるのか、どのように学習すれば良いのか、どのような仕事...
      ONE CAREER for Engineer
      ONE CAREER for Engineer
      トップに戻る

      業界別の企業

      • コンサル・シンクタンクの企業
      • 金融の企業
      • メーカーの企業
      • 商社の企業
      • IT・通信の企業
      • 広告・マスコミの企業
      • 人材・教育の企業
      • インフラ・交通の企業
      • 不動産・建設の企業
      • 旅行・観光の企業
      • ブライダル・美容・くらしの企業
      • 医療・福祉の企業
      • 小売・流通の企業
      • 公務員・団体職員の企業
      • その他の企業

      業界別のエントリーシート(ES)

      • コンサル・シンクタンクのエントリーシート(ES)
      • 金融のエントリーシート(ES)
      • メーカーのエントリーシート(ES)
      • 商社のエントリーシート(ES)
      • IT・通信のエントリーシート(ES)
      • 広告・マスコミのエントリーシート(ES)
      • 人材・教育のエントリーシート(ES)
      • インフラ・交通のエントリーシート(ES)
      • 不動産・建設のエントリーシート(ES)
      • 旅行・観光のエントリーシート(ES)
      • ブライダル・美容・くらしのエントリーシート(ES)
      • 医療・福祉のエントリーシート(ES)
      • 小売・流通のエントリーシート(ES)
      • 公務員・団体職員のエントリーシート(ES)
      • その他のエントリーシート(ES)

      業界別の体験談

      • コンサル・シンクタンクの体験談
      • 金融の体験談
      • メーカーの体験談
      • 商社の体験談
      • IT・通信の体験談
      • 広告・マスコミの体験談
      • 人材・教育の体験談
      • インフラ・交通の体験談
      • 不動産・建設の体験談
      • 旅行・観光の体験談
      • ブライダル・美容・くらしの体験談
      • 医療・福祉の体験談
      • 小売・流通の体験談
      • 公務員・団体職員の体験談
      • その他の体験談
      • はじめての方へ
      • 運営会社
      • 編集部
      • 利用規約
      • 個人情報の取り扱いについて
      • プライバシーポリシー
      • 電気通信事業法に係る情報公開
      • サイトポリシー
      • コンテンツポリシー
      • クチコミガイドライン
      • よくあるご質問
      • 採用担当者はこちら
      • ワンキャリアID 利用規約
      • ワンキャリアID 個人情報の取り扱いについて
      ⓒ2009-2026 ONE CAREER Inc. All Rights Reserved.
      会員登録してすべてのコンテンツを見る
      会員登録(無料)
      アカウント情報

      メールアドレスを変更してもワンキャリアIDや別サービスのメールアドレスは変更されません

      確認メールが届いていない方はこちら
      ログインはこちら
      ログイン
      パスワードを忘れた方はこちら
      30万件のクチコミ・就活体験談が読み放題!
      新規会員登録(無料)はこちら