コーディング初心者でもついてこられる親切でわかりやすい講座！ 現役開発者をHTML & CSSの達人にしてくれる最終兵器講座！
HTMLとCSSの基礎から応用まで
EmmetでHTMLを簡単にコーディング
ウェブ標準に準拠したパブリッシング
ポジション、各種レイアウト、セレクターなど、CSS の難しい概念
継承とリセット、ベンダープレフィックス、フォーカスビジブルなど、複雑な概念
変数、ウェブフォント、フィルター、アニメーションなどの高度な機能活用法
レスポンシブデザインでモバイル環境に対応する
アクセシビリティ - 様々なユーザーに配慮したウェブサイト作り
セマンティックタグとBEMを活用した適切なサイト構成
ファイナルプロジェクトを通じた実践知識
コーディングを初めて始めた方が、最初のコーディング経験から始められるシリーズを作りたかったのです。
その第一歩で、コムボールの知識がなくても相対的に学びやすいHTML＆CSSを最初のテーマに選びました。
一方、進入障壁が低いHTML＆CSSですが、これを深く勉強して「きちんと」活用する開発者たちは一般的ではありません。それで、難しい概念や細かい属性まで掘り下げて、現業開発者やパブリッシャーにも大いに役立つ講座にしたいと思いました。
本当に素敵で有益な講義を作ってみようという目標で、長く調査して準備した末にこの講義を制作することになりました。
プログラミングが初めての方
パブリッシングをしたいWebデザイナー
HTML/CSSをうまくやりたい開発者
講義の内容を手でも確認いただけるようにすっきり押し込めました。
（ℹ️この本はJavaScriptは基礎部分だけ、そして軽くだけ扱います。）
さりげなく涼しい進行であなたの大切な時間を節約します。 （受講者によって馬が早く感じられる点ご了承ください。ぜひ無料パート川を聞いてみて受講してください！ ）
各タグと属性の機能だけでなく、これらの多様な活用度やウェブ標準に合った使い方、理論的原理まで詳細に説明し、できるだけ多くを学べるように準備しました。
各川ごとに映像の主なポイントと、貼り付け可能な実習命令とコードがウェブページにまとめられており、これに沿って応用し、手軽に実習を進めることができます。
学生の方も気軽に勉強できるよう、最初の5時間分量をプレビューを通じて無料で公開します。
YouTube チャンネル ヤルパクなコーディング辞典を放送するYouTubeであり、 IT書籍を執筆する作家です。フルスタック開発者として働いてきた経験を活かし、難しいプログラミング概念を初心者が理解しやすくするためのたとえ話と簡単な例、時にはアニメーションで説明するコンテンツを作っています。
✅セクション1：HTMLベースのHTMLタグとそれぞれの適切な使用法
✅セクション2：CSSの基礎
✅セクション3： HTMLの深化
✅セクション4：CSSの深化
 |  |
✅セクション5：ファイナルプロジェクト
Q. プログラミングに初めて接するのに授業を聞くことはできますか？
A. HTMLとCSSは、入門者が始めるのに最適なトピックです。コーディングが初めての人もフォローできるように、最初の環境設定からコーディングツールの使用まで詳しく説明し、実習もできる簡単な用語を使って進めます。
Q. すでにWeb開発をどの程度行うのにどれくらい役に立ちますか？
A. Web開発者がよく知って使用していると思う基本的なHTMLタグやCSS属性も、深く勉強してみると、これまで知らないことが多かったことに気付くことになります。これまで適当にだけ知って活用してきた要素や機能をより適切に使えるようになり、外観だけでなく内部と構造上でも美しいサイトを作るための有用な知識を学ぶことができるようになります。
Q. 講義速度が速くて難しくないでしょうか？
A. 映像の進行は速いですが、各川ごとに講義ページがリンクされており、映像の内容を楽に復習して実習できるようにしておきました。ページのあちこちの例とプレイグラウンドを活用して、あなたの時間効率を最大限に活用する学習を進めることができるでしょう！
学習対象は
誰でしょう？
初めてコーディングを学ぶ人
パブリッシングを自分でやりたいウェブデザイナー
HTML、CSSをもっと上手になりたい開発者
HTMLとCSSの深い理論まで勉強してみたいエンジニア
標準に準拠し、アクセシビリティ高くウェブ開発をしたい開発者
30,671
受講生
1,600
受講レビュー
92
回答
4.9
講座評価
17
講座
유튜브 채널 얄팍한 코딩사전을 방송하는 유튜버이자, IT서적들을 집필하는 작가입니다. 풀스택 개발자로 일해 온 경험을 살려, 어려운 프로그래밍 개념들을 초보자들이 이해하기 쉽도록 비유와 쉬운 예제, 때로는 애니메이션으로 설명하는 컨텐츠들을 만들고 있습니다.
🎬 YouTube 얄팍한 코딩사전 채널 (클릭!)
📕 얄코의 책들 보러가기 (클릭!)
全体
54件 ∙ (11時間 16分)
1. 講座紹介
01:39
2. ⭐️ 講義の聞き方
05:14
4. 受講のための環境設定
09:35
6. タイトルと本文
20:50
7. 種類と重要度に応じたタグ
09:41
8. 引用されたコンテンツ
11:40
9. 列挙される要素群
08:45
10. 画像を挿入
11:53
11. 表の使い方
11:04
12. 他の場所へのリンク
09:24
13. ユーザーからの入力受け取り 1
06:34
14. ユーザーから入力受け取り 2
20:27
15. ユーザーからの入力受け取り 3
15:04
16. CSSに移る前に
09:06
18. フォントとテキストスタイル
22:06
19. 段落とリストのスタイル
09:29
20. 色の表現
10:46
21. インライン要素とブロック要素
13:29
22. ボックスモデル 1
18:37
23. ボックスモデル 2
14:28
24. 背景設定
14:08
25. ポジショニング
13:49
26. 要素を隠す方法
07:51
27. Flex レイアウト
22:34
全体
122件
5.0
122件の受講レビュー
受講レビュー 1
∙
平均評価 5.0
5
I was listening to Johns Hopkins HTML/CSS/JS lectures on Coursera and I fell for it. Even though Johns Hopkins is a prestigious university, the lectures were poor. However, this lecture was different. 1. First, when evaluating a lecture, I look at the total time of the content. I don't look at lectures that are short because I don't dig deep. However, this lecture was 12 hours long, and it was quite long because it only covered HTML/CSS, so I believed it. The lecturer also proceeded quickly, so it was practically 30 hours compressed. 2. Second, the lecturer's ability to convey the content. I felt that this lecture conveyed the content in a very efficient and clean way. I also liked the flow of the lecture. And it covered not only the core parts, but also the parts that were good to know. It seemed like a lot of effort was put into making it easy to understand. 3. Third, I liked the coding environment setting method that can only be heard here, various tips, and how to study further on your own. After taking only famous but poorly written lectures on Coursera and Udemy, it was nice to finally see a lecture with substance. It made me realize that there is no clear correlation between fame and teaching ability.
Thank you for giving me a great sense of accomplishment as much as I prepared hard. ㅠㅠ In fact, the smarter the professors are, the more they excel and know so much, that their lectures often don't convey well to beginners. As a person with a limited brain, I put a lot of thought into how to lecture so that others can understand well, and I'm really happy that it was of help to you. I will repay you with better lectures in the future. Thank you for taking the class!!
受講レビュー 1
∙
平均評価 5.0
5
It was good that you taught me in detail and went through everything. As with all studies, I found my own way to study and I was able to concentrate much better. In my case, I interpreted the source code myself first and then listened to the lecture. In this case, I thought about whether my interpretation was correct or what the grammar I didn't know meant and went into the lecture, so it stayed in my head longer!
受講レビュー 6
∙
平均評価 5.0
5
As a YouTube subscriber, I completed the Git lecture and purchased the HTML/CSS lecture. The strength of Yalko's lecture is that the curriculum is clean and the delivery is good, so the content is easy to understand. Although I am listening to the lecture, I am absorbed in it as if I am listening to a story. If you follow the lecture like this, you will see yourself understanding and acquiring the content at some point. I think it is a lecture that is worth the money. If you are thinking about it, I strongly recommend purchasing it.
受講レビュー 5
∙
平均評価 5.0
5
I only did backend, but there were so many parts that I was stuck on when designing the front end, so I bought it and listened to it. When I first watched the lecture, I was working on the design in a state of vague understanding, but then I suddenly thought, "I heard something in the lecture, but I don't know exactly what I'm using?" Every time I went back and listened to it again, I was able to understand and use it clearly again, unlike when I first listened to it. If there was more in-depth content, I would pay to listen to it. (23-02-23) When something doesn't work while developing, I find the problem and put in the command I want, and it's so fun to see it change exactly. / This may be TMI, but when I first listened to the lecture, I thought the speed was too fast, and I thought I would understand it but not learn anything while watching the instructions on the homepage, but it really shows its value when I read it twice. I recommend that others read it once and try designing, and when you read it twice, don't read it thoroughly, but go to the category of parts that don't work and look at them again. It's really... not a real country, but a real country. // When I have some time, I should take a look at GitHub and JavaScript courses.
I'm glad it was helpful for your work. Thank you for taking the class!!!
受講レビュー 11
∙
平均評価 5.0
期間限定セール、あと1日日で終了
￥26
22%
￥5,310
知識共有者の他の講座を見てみましょう！
同じ分野の他の講座を見てみましょう！
![[2025 Exam Criteria] Web Design Technician Practical Exam Complete GuideCourse Thumbnail](https://cdn.inflearn.com/public/courses/324878/course_cover/12211037-e74b-46b3-8942-46d465b81bba/webdesign-cover-02.png?f=avif&w=420)