⬇︎質問し放題で悩みが一切なくなる！
【1位】TechAcademy：詳細・割引
⬇︎ありえない低価格でプロから学べる！
【2位】 Udemy：詳細
⬇︎初心者に完璧な対応！社長はマコなりさん！
【3位】テックキャンプ
⬇︎プログラミングスクールを実際に無料体験してみた！
大学生におすすめのプログラミングスクール3選【体験済み】
本日は僕と共に「webの仕組み」について学んでいきましょう！
まずプログラミングを始める人の多くが最初に挑戦するのがHTMLだと思います。
このHTMLをしっかりと理解しないで学習している方が非常に多いと思います。
そこで今回はまず一緒にHTMLについて細かく学習していきましょう！
ひこHTMLとは：分かりやすく言うと、HTMLはWebページの構造と内容について書かれているという風に言われる事が多い。
HTMLの方にもWebページの構成要素は色々なもので出来ています。
Webページの構成要素は基本的にはHTML（画像を含め）、CSS、JavaScriptなどで出来ている事が非常に多いです。（もちろんそれ以外の要素で出来ているページも豊富にあります）
今回紹介するHTML（ハイパーテキストマークアップラングエージ）はWebページの骨組みを作るものとして最も大事な役割を果たしています。
しっかりと理解しておく事が重要ですね。
[toc]
webページはHTMLでできている！
皆さんは何か文章を書いた事があるでしょうか？
しっかりとした文章を書いた人ならわかると思いますが、文書を書くときに見出しというのを書いた事がある人や文字の大きさを変更した人も多いと思います。
HTMLではこの見出しや文字の変化などを「タグ」という物を使って表していきます。
タグの要素例を出してみます。
- 見出し要素：<h1><h2><h3><h4><h5>
- 段落要素 ：<p>
- 改行要素 ：<br>
ほとんどのWebページはこれらのタグ要素というものでできています。
例えば、この記事のタイトルである「HTMLでWebページが出来る仕組み」というのは
<h1>HTMLでWebページが出来る仕組み</h1>
という風に書かれています。
HTML文書のh1タグというのは基本的に一番大きい見出し書くときに使用します。
上の例で説明をし忘れてしまったのですがタグ要素は基本的には<要素>文字</要素>という感じで書きます。
要素のところに先ほどのh1やpを入れて、文字のところには実際にWebページに表示したい文章を書きます。
タグを書いて文章を書いてタグを閉じるというのがHTML内で記述してWebページに表示させる基本的なやり方です。覚えておいてください。
HTMLでWEB内で別のリンクへ
HTMLではwebの中で別のWebページに行く事ができます。
例えば下記のようなものが挙げられます。（文字をタップしてみてください）
上の文字をタップしてみると別のページに行ってしまったと思います。
これがHTML内で他のページのリンク先に飛ぶ事ができる方法です。
これはHTML内で
<a href="URL">僕のブログのトップページに飛びます</a>
という風に書いています。
ここでお気づきになった方も多いかもしれませんが、この<a>というのは先ほどお伝えしたタグ要素の1つです。
href=""という所にURLやそのWebページが書かれている場所を書けばリンク先へ行く事ができます。
ひこaタグについて：このaタグのように別の記事に飛ぶ事ができるのは、本当に素晴らしい事なんだ。昔はこれを沢山の情報の中から自分で探さなければならなかったのに対して、今はaタグをクリックするだけで飛ぶ事ができるからね…。
HTMLだけではカッコよくならない…
これだけ見ると、HTMLできればWebページ作れるんじゃね？という風に感じると思います。
もちろんこれだけでもWebページを作成することはできますが、皆さんのよく知っているカッコいいサイトはできません。。。
その理由は主に下記にあります。
- 色がつかない：基本的にHTMLだけでは色をつけることはできません。＊
- 静的なサイトで終わってしまう：ただwebページを閲覧、またはリンクを探すだけのサイトで終わってしまう。
＊実際にはつける事はできますがあまりよろしくありません。
てな感じです。
ひこ静的なサイトとは：アクセスしても毎回同じものが表示されているwebページの事を言います。
HTMLで出来ない事をできるようにしてくれるプログラミング言語は沢山ありますが、有名なものだと以下のようなものが挙げられます。
- CSS ：HTMLに色をつける事ができるようになる
- JavaScript ：HTMLと連携して動的なサイトを作る事ができるようになる
- PHP ：データベースと連携して情報を保存する事ができるようになる
ひこ動的なサイトとは：アクセスしたときの状況に応じて異なる内容が表示されるWebページの事を言います
HTMLで骨組みを作りそれに色々な物を付け加えてカッコよくしていくイメージですね。
ただ動的なページを作るにしてもWebページを制作するためにはHTMLの知識は必要不可欠だと思うので少なからず学習する事をおすすめします。
初心者でもかっこいいwebページを制作したい！
この記事を読んでくださっている多くの方は
HTMLを学んで急いでWebページを作りたい！
と思っている方が多いのではないでしょうか？
ただもしWebページを作成したいのであれば最低限以下のプログラミング言語をHTML学習後に学んでおく事をおすすめします。
- CSS（できればSaSSも）
- Bootstrap
- jQery
いや…何を言っているのか分からん。
という方も多いと思います。確かにこれらは独学ではかなり難しい内容だと思います。（jQueryは僕もあまり出来ません）
なのでもし急いでWebページを作りたいのであれば、僕が通っていたプログラミングスクールのTechAcademy [テックアカデミー]で、フロントエンドコースを受ける事を強くおすすめします。
ひこフロントエンドとは：ユーザーから見えるところでデータのやり取りをする部分。基本的に人が見える部分を作るところです。
テックアカデミーのフロントエンドコースでは先ほど紹介したプログラミング言語はもちろんのこと。
Web APIというものやVue.jsと呼ばれる高度なことまで学ぶ事ができます。
ひこWeb APIとは：簡単にいうと、他の有名なサービス（Amazonなど）と連携する事ができるもの。分かりやすくいうと外部から色々な物を呼び出す事ができる優れものです。
HTMLの部分はテックアカデミーのどのコースでもやることになりますが、実際にバカな僕が体験しても約3時間くらいで簡単な部分は使えるようになりました。
スピードを出してHTMLや他の言語を学びWeb制作をしたい人にはおすすめできます。
僕が体験した感想を書いている記事もあるので参考にしてみてください。
裏ワザ!?
TechAcademyの最新紹介者割引を適応したい方はこちら…
【最新版】TechAcademyの1万円紹介者割引きの受け方を伝授！
初心者にも分かるwebの仕組み：まとめ
いかがでしたか？HTMLに少し興味を持つきっかけになりましたか？
HTMLでWebページが出来る仕組みというのはこれで簡単に分かったと思います。
HTMLの知識はこれからプログラミングを学ぶ人も学ばない人もどちらの人にも役出すことなので忘れないように復習してください。
なお記事の途中でTechAcademy [テックアカデミー]
のことについて紹介いたしましたが、HTMLだけすぐに出来るようになりたいのであれば、プログラミングスクールに受講する前のTechAcademy 無料体験
を受ければ、十分にHTMLのことについて理解できると思います。
プログラミングスクールはなかなか高額なので、HTMLや先ほど紹介したCSSについてだけ学びたい方はTechAcademy 無料体験のみで大丈夫ですよ！
ぜひ試してみてください！
最後までご覧いただきありがとうございました！
他にも大学生がプログラミングなどの勉強に関する記事をたくさん書いています！よければ下記のボタンから気になる記事を探してみてください！
プログラミン言語の記事
