HTMLとCSSでホームページを作る方法を完全解説【Web制作初心者向け】

[@shiranoyukisan1699]

未経験で今はスクールにも通えないので、とてもありがたいです。
1つの動画を見終わってやってみると自信につながります。

[@web5096]

コメントありがとうございます！
ぜひご活用ください！

[@yoshikihomma2896]

IT未経験で勉強始めたばかりです。プログラミング言語についての入門動画をいくつかみてきましたが、実際どう使うのかが想像しづらく、このような実践的な動画はとても嬉しい！！
ゆっくりしてほしいとのコメントも見られますが、止めたりスローにすれば問題なく、最後までやり切ることができました！楽しかったので続けられそうです！ありがとうございました！

[@web5096]

コメントありがとうございます！
参考にしていただけたみたいで嬉しいです🙌
ぜひ楽しく続けてくださいね！

[@hyuma3357]

HTMLとCSSがなかなか難しくてつまづいていましたが、この動画に巡り会えて良かったです！

[@2011yosshi]

最近ProgateでHTML & CSS 初級編をやったばかりの者ですが、ホームページ制作のイメージがなんとなく湧いてきました。

[@みる-u1i]

最近プログラミング始めようと思い立って初級編やったのですが今yosshiさんってプログラミング続けられてますか？

[@nfujimoto1454]

有料級神動画ですね😳
今まで色んな方の動画見ましたが、ダントツ1番わかりやすいです🔥
お忙しいとは思いますが、JS(jQuery)編、PHP編も出していただけると非常にありがたいです。なにとぞ検討のほどよろしくお願いいたします🙇‍♂️

[@chatnoir167]

とても分かりやすかったです。実際に一緒に記入しながら作成が出来、ホントに理解できました。ありがとうございました！

[@web5096]

コメントありがとうございます！
手を動かしながらやっていただいたんですね！

[@浦野翼-k5b]

本当に神動画です。🙇‍♂️

[@ryunosukematsuura7664]

最近Webデザインにチャレンジしたく、いろいろと動画を見ていましたが、
実際のコーディングに近い流れでご説明をされていてとても分かりやすかったです！

[@櫻井雅人-w4y]

ありがとうございます！
リセットcssの使い方理解できました。
構造もわかりました、

[@yukari2365]

初コメントです。すごくわかりやすいです！！動画をよく見返しています。
ありがとうございます！！

[@web5096]

ありがとうございます！

[@minimini-times]

綺麗に出来ました！ありがとうございます

[@splritz7544]

ハッキリと喋ってくれているので早口でも聞き取りやすいです。
説明が理解しやすいので難なく作成する事が出来ました。
ただ、今までの過程で置いてきた画像等のURLを張って下さると幸いです。

[@りんごくん隊長]

今更ですがどうが拝見させていただきました。まともにコーディングしたことなかったけどこの動画で全体像は掴めました。これからまだまだ学ぶので学んでから聞けよって話しだとは思いますがリンク先のページからこのページに戻る場合のこととかも考えるとメニュー部分まではどのページにも入ることになるんですかね？

[@luceveritiero1980]

完成されてるHTML/cssを読むことは出来るようになったんですけど、無から書くのに苦闘してます
CSSが特に上から順番に完成されてるのは、作成過程がわからないのでこの動画は順番に作ってることが分かって嬉しい😃です
この動画何度も見て参考になります
でもまずブロック毎の写経が全くやり足りてないとは自覚してます

[@きのさん-l1v]

わかりやすいです！！ありがとうございます🥹😭😢
自分用メモです
20:33
25:52
26:46

[@sangoshou]

とてもわかりやすい内容をありがとうございました！！

[@OoruneoO64]

素敵な動画をありがとうございます！
私好みのホームページを作ってみたいけど作り方微塵も分からん🥲って状態から
この動画を見ながら真似たら2日で、初めてサイトのコーディング？？を完成させられました！
まだ用語覚えきれてなかったり、訳分かってないまま真似したところも多かったのでこれからも参考にさせていただきます！🙌
とても分かりやすかったです。！

[@web5096]

それは僕も嬉しいです！
コメントありがとうございます！

[@maruimonozuki5906]

めちゃくちゃわかりやすくてありがたいです…スクールの動画よりわかりやすいです…！

[@web5096]

ありがとうございます！

[@legoek5837]

とても分かりやすい内容でした！！！この動画で使っているリセットcssを教えてもらえるとありがたいです。

[@notfadeaway6617]

tailwind cssを使ったtutorialも良ければお願いします。

[@niconicohahaha7]

とても分かりやすかったです！！ありがとうございます！！
一緒にコーディングで勉強させていただきましたが、早送りではなく、初心者向けなのでもう少しゆっくりだと助かります(>_

[@web5096]

ありがとうございます！
ご意見もとても嬉しいです！

[@noahmorita5872]

すごいこの動画に助けられています！ありがとうございます！
ウェブサイトのレイアウトが最初に製作されていたと思うのですが、あれはどんなソフトウェアで製作してますか？？
そこら辺もぜひ教えていただけると嬉しいです！

[@akeemsk8130]

XDです

[@misora6727]

とてもわかりやすかったです！
このくらいの難易度からコーディングしていけばで出来そうな自信がつきました！
ただ、headerタグやnavタグは最初からつけてコーディングしてほしかったです；
divだけでやっていくこともあるのかぁと思いながら一緒にコーディングしてました😅
あとコードを売っていく部分も早送りでなくゆっくりだと非常に助かります。
他の動画も拝見させていただきます！

[@pancake56]

これめっちゃ分かりやすい。

[@امیرجاودانفرد]

‏‪0:00‬‏

[@hikkymama]

アキユキさん、いつもわかりやすく役立つ動画をありがとうございます！ちゃんとウェブページがHTML/CSSで作れてうれしいです！
質問ですが、個人事業主（インストラクター、飲食店、フリーランサーなど）を対象にウェブ制作をする場合、HTMLでの構築とノーコードツールを使うのとどちらが良いでしょうか？　
このままコーディングやワードプレスの学習を続けるのか、Photoshopなどのデザインに時間をかけてノーコードで制作する方向にいくのか、これからの学習方法に迷っています。

[@web5096]

ありがとうございます！
僕は開発するならコードは書けた方ができることの幅も広がりますし、単価もあがって良いと思います。一概にどうすればいいというのは、その方が目指しているものにもよりますし、ここでコメントできる範囲では明言しづらいですが。
もしノーコードでやられている方の意見を聞ける機会があればぜひ聞いてみてくださいね。

[@hikkymama]

@@web5096 回答ありがとうございます💗

[@yuubbb]

初めまして。htmlの勉強をしようと思ってたどり着きました。reset.cssのテンプレってのはどこから引っ張ってきたものでしょうか？

[@What-ef8ji]

勉強になりました！
超初心者なのですが、Index cssとReset cssの違いは何ですか？
どちらもが必ず必要なのでしょうか？

[@ハッピーハムハム]

同じこと思いました😭

[@たかと-v1n]

使ってるリセットcssなんていう名前のものですか？

[@tamama1111]

参考になります！ちょっと長いので後ほどじっくり隅から隅まで拝見させていただきます^^

[@伊藤裕希-y8n]

こちらreset cssファイルの中身がなくても作成できるのでしょうか？

[@ganbaru77]

とても分かりやすかったです！ちなみに質問なんですがreset.cssはどれを使用していたのでしょうか？教えていただければ幸いです

[@web5096]

ありがとうございます！
html5doctorのreset.cssです（中身は多少書き換えていたかもしれません）

[@ganbaru77]

@@web5096 ありがとうございます！参考にさせていただきます

[@techitechi003]

めちゃくちゃ為になりました！分かりやすくて理解しやすかったです！

[@web5096]

ありがとうございます🙌

[@user-minri]

お世話になります。HTML/CSSの勉強中です。非常に判りやすかったのですが、フッターの個人情報保護方針が、どうしても右側に行きません。text-align: right;がきいていません？

[@ジェリビン-q7l]

ヘッダーの下の画像がdisplay inline blockにするとテキストアラインセンターで中央にできるのは何故ですか？

[@chinchilla3538]

勉強になります。

[@ripton91]

全体的に左寄りになってしまい右に余白ができてしまうのですがなぜでしょうか

[@_kuroneko-]

divタグで要素をまとめれます！！
center:ページの中央
left:左寄せ
right:右寄せ
などですかね...間違ってたらすみません！

[@mtza7143]

この動画は初心者がなんとか自分で1カラムのページを作り終えた後に見て学べるレベルの動画。
それ以下の理解度の入門者には難しいかも

[@gonchaka]

0:40 ここの、表示する「index.html」はどうやって作るのですか？

[@everybodyhappywithearth]

参考になります！クソどうでもいいことですがアキユキさんは左側にCSSを配置する派なんですね。自分は左側でHTML書いて右でsass書いてます。

[@_caramel-vi4dw]

style.cssより前にreset.cssを置いているのですが反映されません。どうすればいいでしょうか

[@candrawahyu26]

兄さん、でもモバイルで開くと反応しないんですよね？

[@ooky9623]

20:30の所をコードを入力しても横並びにもならず、隙間も開きません。
何故だかわかる人いますでしょうか？

[@kakkoiinippon]

🇯🇵🇯🇵🇯🇵いいですね

[@BOUNETHONE]

Good

[@やるやん-g5u]

使用する画像とかは自分で準備しろってこと？

[@片桐-v3k]

仕事だったらデザイン上がってくる
自前のサイトならデザインする

[@aog0999]

ロゴの下の文字が移動してくれない…。

[@aog0999]

reset.cssの方のtext-align:left;を消したらできました。

[@ゆゆ-q7x9e]

22:37
メモ

[@リーズナブルデュエマチャンネル]

コピーするときなどに、今作ったものを３つ用意しなくてはならないので、ここからここの範囲をコピーして貼り付けます。などの説明を入れて欲しいです。流れで理解できる人もいると思いますが、初心者向けとしているのであれば理解できない人に合わせた方が良いかと思います。真似して作るだけでも精一杯という人は、ただのコピペであっても、急に画面が変わればビビります。
長文失礼しました。

[@こんどう-b3d]

ヘッダーのロゴがでかすぎて困ってます助けてください、、、

[@wahaaaayde]

私も困っています、、、、どなたか教えて頂けると助かります。
.header_img {
text-align: center;
}
この中に入れる感じでしょうか？

[@user-ds3tjfh]

15:58

[@امیرجاودانفرد]

‏‪0:00‬‏

[@あぎゃ-u3u]

いや、分かりにくいですよ
途中、修正とか機能とか言わないで1回完成させてくださいよ

[@デカ盛りキング]

初心者向けにしては説明が速すぎやし、あと最初から全部divで解説する意味がわかりません。