강의

멘토링

커뮤니티

BEST
Programming

/

Web Development

しっかり学ぶHTML CSS - by 얄코(Yalco)

コーディング初心者でもついてこられる親切でわかりやすい講座! 現役開発者をHTML & CSSの達人にしてくれる最終兵器講座!

難易度 入門

受講期間 無制限

  • yalco
HTML/CSS
HTML/CSS
HTML/CSS
HTML/CSS

学習した受講者のレビュー

学習した受講者のレビュー

4.9

5.0

Hansh

100% 受講後に作成

CourseraでJohns Hopkins html / css / jsの講義を聞き、一日を越えてきました。 1. 最初に講義を評価する時、内容の総時間を見るが、時間が短い講義は深く掘り下げられないことがあるので、この講義は12時間で、html/cssだけカバーするのにかなり長い時間だと信じていた。講演者も素早く講義を進めて、事実上1時間30時間を圧縮させたと見られる。 2. 2つ目は講演者の内容伝達力だが、この講義は内容をとても効率的ですっきりとした方法で伝えると感じた。簡単に理解するために多くの努力をしたようです。 3. 3番目はここでしか聞こえないコーディング環境の設定方法と、様々なヒント、そして一人でどのようにさらに進んで勉強できるのかを教えてくれた。 Coursera、Udemyで有名であり、都合のない講義だけを聞いたが、肝臓に失速している講義を見てよかった。

5.0

하정원

31% 受講後に作成

詳しく教えてくれて一つ一つ見てくれてよかったです。すべての勉強がそうだが、自分だけの方法を探して勉強するので、はるかに集中が良かったんです。私のような場合には、ソースコードを先に自分で解釈してみて講義を聞いたのですが、この場合に私が解釈したのが正しいか、または分からない文法はどんなことを意味するのかを考え、講義に取り組んでみるともっと頭の中に残りました!

5.0

HDK

83% 受講後に作成

Youtubeの購読者としてGit講義を頑張り、html/css講義も引き続き購入しました。ヤルコ様の講義の強みは、きちんとしたカリキュラムと伝達力が良く、内容が耳にすっぽり詰まっているという点です。講義を聞くのですが、まるで話を聞くかのように私も知らなくなって聞くことになります。このように講義に従うと、ある瞬間の内容を理解し、習得した自分を見ることができるようになります。お金が全く惜しくない講義だと思われます。悩んでいるなら購入することを強くお勧めします。

受講後に得られること

  • HTMLとCSSの基礎から応用まで

  • EmmetでHTMLを簡単にコーディング

  • ウェブ標準に準拠したパブリッシング

  • ポジション、各種レイアウト、セレクターなど、CSS の難しい概念

  • 継承とリセット、ベンダープレフィックス、フォーカスビジブルなど、複雑な概念

  • 変数、ウェブフォント、フィルター、アニメーションなどの高度な機能活用法

  • レスポンシブデザインでモバイル環境に対応する

  • アクセシビリティ - 様々なユーザーに配慮したウェブサイト作り

  • セマンティックタグとBEMを活用した適切なサイト構成

  • ファイナルプロジェクトを通じた実践知識

⭐️大学のメールアカウントをお持ちですか?
🎓大学生半額クーポンを取得する(クリック)👉


これらのことを学びます! 📚

  • HTMLとCSS 初心者のための基礎から、現業開発者のための高度な活用法や実践のヒント、理解しにくかった理論まで簡単に学びます。
  • 視覚的にのみページを実装することを超えて、より多くの人々に配慮し、他の開発者ともコラボレーションする良い「良い」ウェブサイトを作成する方法を学びます。

「きちんと売る」講義を作った理由⛏️

コーディングを初めて始めた方が、最初のコーディング経験から始められるシリーズを作りたかったのです。
その第一歩で、コムボールの知識がなくても相対的に学びやすいHTML&CSSを最初のテーマに選びました。

一方、進入障壁が低いHTML&CSSですが、これを深く勉強して「きちんと」活用する開発者たちは一般的ではありません。それで、難しい概念や細かい属性まで掘り下げて、現業開発者やパブリッシャーにも大いに役立つ講座にしたいと思いました。

本当に素敵で有益な講義を作ってみようという目標で、長く調査して準備した末にこの講義を制作することになりました。


誰がこの講義を
聞くといいですか?
👨‍💻

プログラミングが初めての方

パブリッシングをしたいWebデザイナー

HTML/CSSをうまくやりたい開発者

  • 🍼コーディングを学び始める人
  • 🎨パブリッシングを自分でやりたいWebデザイナー
  • 🎓 HTML、CSSをよりよく扱いたい開発者
  • ⛏️ HTMLとCSSの深い理論まで勉強してみたい開発者
  • 💖標準に準拠し、アクセシビリティの高いWeb開発をしたい開発者


本としても
リリースされました! 📙

image

講義の内容を手でも確認いただけるようにすっきり押し込めました。
(ℹ️この本はJavaScriptは基礎部分だけ、そして軽くだけ扱います。)

🛒本を買いに行く


ヤルコ講義だけ
特別なポイント✨

迅速かつ簡単
ビデオ講義🚀

さりげなく涼しい進行であなたの大切な時間を節約します。 (受講者によって馬が早く感じられる点ご了承ください。ぜひ無料パート川を聞いてみて受講してください!

ツーマッチの説明
詳細な講義🎙️

各タグと属性の機能だけでなく、これらの多様な活用度やウェブ標準に合った使い方、理論的原理まで詳細に説明し、できるだけ多くを学べるように準備しました。

Webページ経由
便利な練習🖥️

各川ごとに映像の主なポイントと、貼り付け可能な実習命令とコードがウェブページにまとめられており、これに沿って応用し、手軽に実習を進めることができます。

基礎内容
無料公開😎

学生の方も気軽に勉強できるよう、最初の5時間分量をプレビューを通じて無料で公開します。


ヤルコは誰ですか? 😀

YouTube チャンネル ヤルパクなコーディング辞典を放送するYouTubeであり、 IT書籍を執筆する作家です。フルスタック開発者として働いてきた経験を活かし、難しいプログラミング概念を初心者が理解しやすくするためのたとえ話と簡単な例、時にはアニメーションで説明するコンテンツを作っています。

🎬 YouTube ヤルパクコーディング辞書チャンネル(クリック!)
📕ヤルコの本を見に行く(クリック!)


講義のために特別制作
⭐️プレイグラウンド⭐️

  • 講義用Webページには、CSSの学習と復習を容易にするために作成したプレイグラウンドがテーマ別に以下のように用意されています。

  • 各プロパティの値を調整して、それらがWeb上の要素にどのように反映されるかを直接確認できます。

  • どのタイプの値を使用できるかを調べて、そのCSSプロパティを利用するさまざまな例を学ぶことができます。

この講義を聞くと
何が変わりますか? 💪

  • 入門者や非専攻者は、コーディングに対する恐れがなくなります。
  • どんなウェブサイトでもパブリッシングできる自信を得ます。
  • 私は知っていた概念、よく知らずに使用していた機能を明確に理解します。
  • ウェブサイトを「正しく」、「優しく」、「思慮深く」する方法を学びます。

どんな内容
学びますか? 📚

セクション1:HTMLベースのHTMLタグとそれぞれの適切な使用法

  • テキストコンテンツ、リスト、画像、表、リンク、入力など、さまざまなWebコンポーネント
  • Web標準と推奨事項に合わせてコーディングする
  • Emmetによる高速コーディング

セクション2:CSSの基礎

  • CSSのさまざまな適用方法と基本セレクタ
  • テキスト要素、リスト、色、背景など、さまざまな要素のスタイリング
  • インライン/ブロック、ボックスモデル、ポジションなどCSSの中核概念
  • フレックスレイアウトを活用したWebページ構造

セクション3: HTMLの深化

  • ヘッダー内のメタ情報、ビューポート、オープングラフなどのページ設定
  • セマンティックタグとBEMでページを体系的に整理する
  • 多様なユーザーに配慮するアクセシビリティを整える
  • SVG、映像などその他のメディア活用法

セクション4:CSSの深化

  • インポートと変数、リセット、ベンダープレフィックスなどの実務コンセプト
  • フローティングとグリッドを活用したレイアウト
  • トランジション、アニメーション、フィルタ、その他のさまざまなCSS機能
  • レスポンシブでウェブサイトを作る
  • Webフォント、アイコン、フレームワークなどの外部要素の活用法

✅セクション5:ファイナルプロジェクト

  • 上記のようなWebページをレスポンシブで、JavaScriptを使わずにHTMLとCSSだけで作る実習を進めます。

よくある質問
確認してください💬

Q. プログラミングに初めて接するのに授業を聞くことはできますか?

A. HTMLとCSSは、入門者が始めるのに最適なトピックです。コーディングが初めての人もフォローできるように、最初の環境設定からコーディングツールの使用まで詳しく説明し、実習もできる簡単な用語を使って進めます。

Q. すでにWeb開発をどの程度行うのにどれくらい役に立ちますか?

A. Web開発者がよく知って使用していると思う基本的なHTMLタグやCSS属性も、深く勉強してみると、これまで知らないことが多かったことに気付くことになります。これまで適当にだけ知って活用してきた要素や機能をより適切に使えるようになり、外観だけでなく内部と構造上でも美しいサイトを作るための有用な知識を学ぶことができるようになります。

Q. 講義速度が速くて難しくないでしょうか?

A. 映像の進行は速いですが、各川ごとに講義ページがリンクされており、映像の内容を楽に復習して実習できるようにしておきました。ページのあちこちの例とプレイグラウンドを活用して、あなたの時間効率を最大限に活用する学習を進めることができるでしょう!

こんな方に
おすすめです

学習対象は
誰でしょう?

  • 初めてコーディングを学ぶ人

  • パブリッシングを自分でやりたいウェブデザイナー

  • HTML、CSSをもっと上手になりたい開発者

  • HTMLとCSSの深い理論まで勉強してみたいエンジニア

  • 標準に準拠し、アクセシビリティ高くウェブ開発をしたい開発者

こんにちは
です。

33,155

受講生

1,810

受講レビュー

95

回答

4.9

講座評価

17

講座

YouTubeチャンネル 浅いコーディング辞書を運営するYouTuberであり、IT書籍を執筆する作家です。フルスタックエンジニアとして働いてきた経験を活かし、難しいプログラミングの概念を初心者でも理解しやすいよう、比喩や簡単な例、時にはアニメーションを用いて解説するコンテンツを制作しています。

🎬 YouTube 浅いコーディング辞書 チャンネル (クリック!)
📕 ヤルコの本を見に行く (クリック!)

カリキュラム

全体

54件 ∙ (11時間 16分)

講座掲載日: 
最終更新日: 

受講レビュー

全体

139件

4.9

139件の受講レビュー

  • closhu님의 프로필 이미지
    closhu

    受講レビュー 1

    平均評価 5.0

    5

    100% 受講後に作成

    CourseraでJohns Hopkins html / css / jsの講義を聞き、一日を越えてきました。 1. 最初に講義を評価する時、内容の総時間を見るが、時間が短い講義は深く掘り下げられないことがあるので、この講義は12時間で、html/cssだけカバーするのにかなり長い時間だと信じていた。講演者も素早く講義を進めて、事実上1時間30時間を圧縮させたと見られる。 2. 2つ目は講演者の内容伝達力だが、この講義は内容をとても効率的ですっきりとした方法で伝えると感じた。簡単に理解するために多くの努力をしたようです。 3. 3番目はここでしか聞こえないコーディング環境の設定方法と、様々なヒント、そして一人でどのようにさらに進んで勉強できるのかを教えてくれた。 Coursera、Udemyで有名であり、都合のない講義だけを聞いたが、肝臓に失速している講義を見てよかった。

    • yalco
      知識共有者

      一生懸命準備したほど大きなやりがいを感じさせていただきありがとうございます。 足りない頭を持った人として、どうやって講義すれば、他人がよく理解するか多くの悩みをしながら作りましたが、それだけの助けになってくれたのは本当に嬉しいです。 これからもより良い講義でお返しします。 受講していただきありがとうございます!

  • hajeongwon775011님의 프로필 이미지
    hajeongwon775011

    受講レビュー 1

    平均評価 5.0

    5

    31% 受講後に作成

    詳しく教えてくれて一つ一つ見てくれてよかったです。すべての勉強がそうだが、自分だけの方法を探して勉強するので、はるかに集中が良かったんです。私のような場合には、ソースコードを先に自分で解釈してみて講義を聞いたのですが、この場合に私が解釈したのが正しいか、または分からない文法はどんなことを意味するのかを考え、講義に取り組んでみるともっと頭の中に残りました!

    • rlarhkr811588님의 프로필 이미지
      rlarhkr811588

      受講レビュー 6

      平均評価 5.0

      5

      83% 受講後に作成

      Youtubeの購読者としてGit講義を頑張り、html/css講義も引き続き購入しました。ヤルコ様の講義の強みは、きちんとしたカリキュラムと伝達力が良く、内容が耳にすっぽり詰まっているという点です。講義を聞くのですが、まるで話を聞くかのように私も知らなくなって聞くことになります。このように講義に従うと、ある瞬間の内容を理解し、習得した自分を見ることができるようになります。お金が全く惜しくない講義だと思われます。悩んでいるなら購入することを強くお勧めします。

      • fourier님의 프로필 이미지
        fourier

        受講レビュー 11

        平均評価 5.0

        5

        100% 受講後に作成

        結論から申し上げてとても素敵な講義です。

        • skyj님의 프로필 이미지
          skyj

          受講レビュー 5

          平均評価 5.0

          5

          100% 受講後に作成

          バックエンド側だけでフロント側デザインするのにあまり詰まらない部分が多くて購入して聞くようになりました。初めて講義を全部見た時は、アルソット・ダルソットが分かるような状態でデザイン作業をしていますが、ふと講義で聞いたようなのですが、正確には知らずに書いていますか?する度に、その分また訪れて、また聞いてから初めて聞く時とは違って、再び明確に理解して書くようになりました。もっと深刻な内容があれば決済して聞くようです。 (23-02-23) 今開発しながら何ができなかったときに問題点を探して欲しいのに命令を入れると、ちょうど変わる姿がとても楽しいです。 / TMIかもしれませんが、私は初めて講義を聞いたときに速度も速すぎると思い、ホームページで操作しながら教えてくれるのを見ながら理解はできても残ることはないようですが、2回読んだとき真価を発揮します。他の方もぜひ1回読んでデザインしてみると2回毒の時は精読してはいけない部分カテゴリー訪れてまた見てみると本物....真国ではない蒸し国です。 //少し時間が経つと、FitHub、JavaScriptコースを聴く必要があります。

          • yalco
            知識共有者

            実務にお役に立てて嬉しいですㅠㅠ受講していただきありがとうございます!

        ¥5,404

        yalcoの他の講座

        知識共有者の他の講座を見てみましょう!

        似ている講座

        同じ分野の他の講座を見てみましょう!