キャンペーン終了まで

割引情報をチェック!

すべての動画をフルで見よう!

現役MBA講師や活躍中の経営者から
ビジネススキルを学べる動画17,800本以上が見放題!

いまどきのHTML/CSS(前編:HTML)

会員限定

50分

「AI・テクノベート」の関連動画 一覧を見る

動画説明

今回はウェブサイト作成に必須の「HTML」と「CSS」について、その関係性や歴史、構成の考え方を前後編にわたって解説します。(生配信を動画化したものですので、途中コメントを読み上げるシーンがございます。ご了承ください)
次の入門編コースを予めご視聴いただくと、より理解が深まります。
・HTML/CSS入門 HTML Living Standardを1時間で学ぼう
・HTML/CSS入門 CSS3を1時間で学ぼう

本コースはYouTubeで配信されている「ともすたCHANNEL」たにぐちまこと氏とのコラボレーションコンテンツです。皆さんに役立つITに関するスキルについての学びをお伝えいただきます。

※各ツールの画面配置や挙動は撮影時点のものです。ツールのアップデートにより変更されている場合があります。

※動画内で紹介した著書
・『これからはじめる人のJavaScript/Vue.jsの教科書』(マイナビ刊)
・『よくわかるPHPの教科書 【PHP5.5対応版】』(マイナビ刊)
・『マンガでマスター 「プログラミング教室」』(ポプラ社刊)
  監修/たにぐち まこと
  漫画/落合 ヒロカズ

※動画内で紹介したチャンネル
・「理屈っぽいHTML5入門」
https://www.youtube.com/playlist?list=PLh6V6_7fbbo_PozNmATrDTJclM9u12ErY

※本動画は、公開時点の情報に基づき作成したものです(2022年9月公開)

講師プロフィール

ともすたCHANNEL:https://www.youtube.com/channel/UCphTq6mefx_15CjD35qgXgA

谷口 允(たにぐち まこと) ともすた/H2O space 代表取締役
富士ゼロックス、ソニーネットワークコミュニケーションズなどでウェブエンジニアとして勤務ののち、2002年に独立。株式会社エイチツーオー・スペースを設立。
メンテナンスしやすいウェブサイトを手ごろな価格で提供することで、大小問わずさまざまな業界のクライアントを応援している。
また、ウェブ業界を豊かで厚みのあるものにするべく、ウェブ制作・プログラム開発の知見をもとに、各種講演や執筆を通じ、学習コンテンツを展開。
近年は講座動画配信プラットフォームUdemyやYouTubeを通じた映像講義配信を手がけ、それぞれで数万人規模の受講者・登録者のプログラミングやウェブ構築に関する学習を支援。
Slackコミュニティを主催することで業界全体のスキルアップを図っている。

主な著書に『6さいからつかえるパソコン』(技術評論社刊)、『よくわかるPHPの教科書』(マイナビ刊)など。

より理解を深め、他のユーザーとつながりましょう。

コメント50件

  • kfujimu_0630

    HTMLの生い立ちや現在地がよく分かりました。プログラミングの専門用語はやっていないので分かりませんでしたが、プログラマーと会話できるレベルくらいにはなりたいと思いました。ありがとうございました。

    2022-09-03
  • myosin_344

    HTMLの変遷の概要が理解できました。私が使っている某アプリはXHTMLが使われているのですが、なぜXHTMLが使われたのか、そして近日サポートが終わろうとしているのですがそれがなぜなのかなんとなく想いを馳せることができるようになりました。

    2023-03-15
  • raphaela

    マークアップに関してはニコリ資料作りのときにも活かせると思った

    2025-01-03
  • iso_ken

    emmetは強力なツールなので理解して効率化していきたい

    2024-01-19
  • sbsconts

    今回はEmmetという未知の手法を知ることができました。現状HTMLを中心に複数の受講をしていますが、この受講を通じ、未知の領域に触れ、知らないことを知り、自己の知見の広がりを感じています。引き続き受講を通じ、次の実践へのステップにつなげていければよいかと思います。

    2024-03-11
  • ojiken

    業務で使う場面はありませんが、これからの時代、個人で情報発信できることも大切かと思い、HPとか作成したいと思い、受講しました。
    まだ、HTML、CSSで作成するかWord Pressでやるかわかりませんが、HTMLに作成する際にEmmetということも知ることができたので、今後チャレンジする際には活用したいです。

    2024-03-23
  • naike_jpn

    Emmetを試してみたいと思いました。

    2024-04-05
  • okuoku2

    なかなか難しいです。

    2024-04-05
  • iidukatakako

    仕事上でいまだにHTML言語が大文字で指示されているものがあり、なぜなのか不明でしたが、経緯を学ぶことができて、なんとなく理解ができました。
    Emmet、初めてしりましたが、使えるとスピーディーに作業を進めていけると感じました。

    2024-07-21
  • m_yuuki02

    進化を感じるムービーで勉強になった

    2024-09-03
  • minamt

    Emmett は初です

    2024-10-24
  • akiko_saito

    最初に触れたころからだいぶ変わっていると感じました。
    まずは、基本を覚えてからエディタなどを活用しようと思います。

    2024-10-31
  • kyo1227

    HTMLの生い立ちや現在地がよく分かりました。プログラミングの専門用語はやっていないので分かりませんでしたが、プログラマーと会話できるレベルくらいにはなりたいと思いました。

    2024-12-25
  • oknmkcti

    歴史や経緯を知ることはそれ自体の知識が役に立つことは少なくても、知っていることで理解度が格段に上がります。

    2024-12-25
  • matshy

    HTML自体をよくわかっていなかったが、知識の蓄えができた。

    2023-12-29
  • st90570

    HTMLの過去の歴史が分かりやすく説明されており、Emmetという記述方法を知ることが出来て、とても有意義だった。

    2025-01-19
  • stonewhite

    HTMLの始まり、そして変遷を知ることができました。まだ初心者なのでテキストエディタでベタ打ちばかりですが、ツール群を使うことも検討してみようと思いました。

    2025-01-27
  • tarutaru1201

    久しぶりにHTMLを勉強してみようと思ったんですが、進化が凄いな~と
    まだついていけない感じですが、ちょっとずつ理解していこうと思います。

    2025-03-18
  • kirinosuke-1st

    普段から見ていたのに、そんな移り変わりがあったとは知らずに過ごしてきました。これからweb見る目が変わりそうです。

    2025-05-07
  • everest

    モダンでユーザビリティの高いWebコンテンツを効率的に構築・改善したい。

    2025-06-02
  • mmarcy

    HTMLの歴史を知ることができました。

    2025-07-15
  • west_kkc

    大変勉強になりました。

    2025-10-02
  • kudaranasubi

    わからなかった用語がよくわかりました。Emmetも使っていきたいです。

    2025-11-17
  • dx_choco

    やり方だけを知るよりも、なぜそうなったのかも知ることでルールを守ったり、基本に立ち返ったりできるので有用だと思いました。

    2026-02-01
  • s_ho

    HTMLは趣味で知っていたけどEMMETは知らなかったので勉強になりました。

    2026-03-03
  • tsucchi-

    HTMLは奥が深いと思いました。

    2022-10-10
  • sphsph

    難しいですが、何とか。
    繰り返します。

    2022-09-03
  • shun8710

    業務でエンジニアの採用する際に役立ちそう

    2022-09-04
  • sasakikousuke

    これは面白い。難しいけど良い。

    2022-09-05
  • sgfamaym2020

    全然経験してこなかった世界で、難しいです…

    2022-09-05
  • miyawaki-kenshi

    めちゃめちゃためになりました。

    2022-09-14
  • kaz_2021

    HTMLも言語なのが分かりました。流行る・流行らないで生き残りが決まり、皆さんが使い良いものは残る点など。

    2022-09-20
  • mynanon

    マークアップ言語は、例えばNotionのように意識せずにMarkdown言語が可視化できるものもあります。裏で動いているものにどれだけ認知できるかが、これから何をしようとしているのかの基盤になるようでとてもワクワクしました。

    2022-09-21
  • shusuke-yamada

    インターネットを使っているだけではHTMLやライバルたちの仕様がわからない状態です。仕様やプラットフォームの争いはかつてのビデオテープやビデオゲームの本体を連想することが出来ます。
    使い勝手がいいソフトウェアが残るということが出来ます。

    2022-09-22
  • smurakami

    後輩などにHTMLの変遷を伝える時に役に立ちそう

    2022-09-26
  • sato777

    内容が専門的な所もあったので後で見返してみようと思います。

    2022-09-26
  • shimodash

    emmetは便利だと思いました。

    2022-10-09
  • sathashi

    HTMLの歴史がよくわかりました。EMMETの重要性、その他今のLiving Standardでの細かいルールがXHTMLから来ていることを学びました。

    2024-01-07
  • t-notchy

    HTMLに紆余曲折がっとことを知らずかった。

    2022-11-01
  • hrkawaguchi

    HTMLを作る側の意図や歴史などを勉強したのは初めてだったので、大変面白かった。

    2022-11-09
  • koudai51

    HTMLの基礎を理解できました

    2022-11-19
  • ksu

    知っていて損はない。今後は使用することもある。

    2022-12-11
  • wata-1201

    今後のWebアプリ作成の学習に生かしたいと思います。

    2023-05-24
  • shunmorisako

    Visual Studio Codeは独学で勉強しながら使っており、機能を完全には把握していなかったため、今回学んだEmmetとい拡張機能は大変有用で、今後のコード記入の時間を短くしてくることを期待しています

    2023-06-21
  • takuan0507

    HTML言語の成り立ちがよくわかりました

    2023-09-25
  • koji_kunii

    HTMLの歴史が理解できました

    2023-11-30
  • reverend

    現在のHTML5に至るまでのおおきな流れを知ることができました。これまで言葉にすることなく不思議に思っていた小さな疑問の数々が、納得できました。例えば、HTMLとCSSのファイルを分ける理由、タグを小文字で書くこと、などです。引き続き習得に努めたいと思います。

    2023-12-18
  • yokotashinji

    基本的な内容でしたが知識の振り返りのと過去のHTMLの変遷を知ることが来ました。

    2023-12-27
  • iider

    HTML5も規格としては終了してますが、、、、

    2022-09-02

学習コースの機能を
すべて使おう

有料プランでは、動画学習ごとに設定されたクイズやテスト、学習資料などを見ることができます。

新登場

学びエージェント (AI)

「この用語はどういう意味?」などをAIとチャットできます

詳細を見る

クイズ

動画一つひとつの内容を確認するために、1問1答形式のクイズを受けられます

理解度確認テスト

動画を全て見終わった後、理解度を確認するテストが受けられます

資料を見る

理解度確認テストを全問正解すると、動画で使用した教材を閲覧できます

後で見る

後で見たい動画を保存し、いつでも見返しやすくする機能です

コメントする

動画に対して振り返りのコメントを記載することができます

いますぐ無料体験へ詳細を見る

おすすめの学習動画