Розмір відео: 1280 X 720853 X 480640 X 360
Показувати елементи керування програвачем
Автоматичне відтворення
Автоповтор
はじめまして！いつも動画を参考にさせていただいております！私自身、最近、Web制作を学び始めたのですが、数多くある解説動画の中でも群を抜いて、爆速様の内容がわかりやすく、非常に助かっております！爆速様の声の質、トーン、スピード、言葉のニュアンス、言い回し、表現方法、取り組み方の良い加減、具合、どれをとっても実に心地好く、もはや、勉強を抜きにして、動画を観ているだけでも癒されます！また、デザイン自体のクオリティやセンスも素晴らしく、すべてにおいて、感銘を受けております！是非、今後も参考にさせていただきたいので、引き続き、動画の更新や我々、初学者に対する御教示をどうか、よろしくお願い申し上げます！私からも爆速様の動画がもっとたくさんの人に目に留まるよう、チャンネル登録等も増えるよう、広めてまいります！改めまして、いつも本当にありがとうございます！
最高です！いままでWPのテーマ使ってましたが頑張れば自分でも独学でHTML、CSSでサイト制作いけるかも、とこの動画見て感じれました。
ゆっくりと丁寧な解説で、初心者のわたしでもform タグの使い方がよくわかり、見本とおりにできました😃
新しい動画、とても嬉しいです！また後でゆっくり勉強させていただきます！
デザインカンプからのコーディング風景を見てみたいです。
1日かけて全部いけた！
こんにちは！初回の動画から見させて頂いてます！こちらの動画を参考にし、自分なりにアレンジしたものを就活のポートフォリオとして使用したいのですがよろしいでしょうか？
もちろんいいですよ！就活がんばってください！
また新しい動画上がってて嬉しいです！また勉強させて頂きますm(__)m
爆速先生の動画、とても楽しみにしてます。一つお伺いしたいのですが、html,cssとかJavascriptで出来ているWEBサイトって、実際多いのでしょうか？今はWordpressにしてからアップロードする、とか、Wordpressはもう流行らない、とか、色々言われているようですが、実際のところ、どうなんでしょうか？私個人としては、html,css,Javascriptのコピペで作るWEBサイトが好きなんですが。教えてください。
ありがとうございます！html,css,jsサイト多いですよ！WordPressも確かに一世を風靡した時ほどではないですが、定番化して普通に沢山使われてます。他にも最近だとノーコードツールなども流行っていますが、好きなのを選んでいいと思います。htmlやcssが分かれば他のもとっつきやすいはずです！
ありがとうございます。安心しました！
いつも大変勉強になってます。ありがとうございます。完全に初心者からの質問ですが。ロゴの部分を事前に作った手書きの画像を貼りたいのですが、どのようにしたらいいでしょうか…?
aタグの中にimgタグを入れればOKです。見本ではaタグの中にITcomというテキストが入っていますが、こちらをimgタグに差し替えれば画像のロゴを表示できます。手書きの画像ロゴは、imagesフォルダに入れてください。表示されたロゴのサイズが大きすぎる場合は、画像自体のサイズを調整するか、CSSでサイズ指定します。widthで横幅指定か、heightで縦幅指定したりしてもいいです。
@@bakusokuwなにもかも解決しました！ありがとうございます😭今年も楽しみにしてます！数ページを扱うWebサイトを繋げる作業も見てみたいです！
新しい動画ありがとうございます❗️質問なのですがこのサイトは技術レベル的にはどの程度ですか？
脱初心者くらいです！とはいえ、中級者も上級者も普通に使います。
@@bakusokuw 返信ありがとうございます😊確かに中級者や上級者も同じタグ使いますもんね！ 次の動画も楽しみにしています^_^
とても勉強になりました。ありがとうございました。質問ですが、今回のwebサイトだと、大体いくらくらいの案件となりますか？1万円くらいでしょうか？これまでの経験をふまえて、だいたいでよいので教えてください。
脱初心者の方が受注すると仮定すると、肌感5万円〜10万円くらいかなと思います。デザイン支給でコーディングのみ担当だと1〜3万円くらいな気がします。金額は受注者の営業力や信用・実績、発注者や案件によって大きく変動します。なので、何となくそんな感じか程度で考えてください！
display: flex;とz-indexを指定しない状態のsection1のcontainerのposition: relative;ですが、なぜheaderのcontainerの位置に来るのでしょうか？headerの下にsection1があるのでheaderの下に来るような気がするのですが・・・
内容がよくわからなかったので違うこと答えているかもなのですが、headerにposition:absolute;がついてるからかもです。正確にはsection1の1番上端と同じ位置にheaderが浮いて重なってます。奥側にsection1があって、手前側にheaderがある感じです。headerのpositionを試しに消してみると違いがわかりやすいかもです。
@@bakusokuw ありがとうございます。headerがabsoluteで浮いているからですね。ちなみに仮にすべてを浮かした場合は、邪魔するものが無ければ、画面の左上端にパーツは来ますか？left:0 top:0 でしょうか？
そうです！全て浮かしたら左上（top:0;left:0）にきます。簡単なので試しにやってみたらわかりやすいと思います
@@bakusokuw ありがとうございました。理解できました。
これってWordpressで作るのとはなにか違うのですか？素人なので教えてほしいです。
【管理画面だけで作るWP】マウス操作で作れる自由度が低い【自分でコードを書いて作るWP】自由度が高いWPの機能が自由に使えるHTML + CSS + PHPを使って作る【この動画のサイト】自由度が高いHTML + CSSを使って作るこの動画のサイトもWPを導入すれば、WPサイトになります。
1:28:34 にてメディアクエリですが、.section1 h1 { font-size: 27px ;} と入力しても結果が反映されません。しかし、.section .container h1 { font-size: 27px ;} と入力すると反映されます。sassを使用していますがそのせいでしょうか？ しかし、コンパイル後もcssファイルも確認しておかしな部分は無いのですが。他の場合でも親要素をきちんと指定しないと、クラスだけで反映する時と反映されない時があるのですが、どのようなことが考えられますでしょうか？
html： TechSolutions 未来をつくるテクノロジーソリューション Shaping the Future with Innovative Technology Solutions Contact sass：@media screen and (max-width: 767px) { .section1 { h1 { font-size: 27px; } }}コンパイル後のcss：@media screen and (max-width: 767px) { .section1 h1 { font-size: 27px; }}このように記述しております。
Sassを使ってもコンパイルされるのはCSSなので特に違う点はないです。メディアクエリ外のh1を見せてもらうことはできますか？CSSには優先度がありまして、より特定的に書いた方が優先されます。.sectino1 .container h1 {color:red;}.section1 h1 {color:blue;}上記だと、後に書いている方が優先されてh1は青になりそうですが、実際は赤色になります。理由は.containerが付いていてより特定的に書いているからです。下記であれば、後に書いた方が優先されてh1は青色になります。.sectino1 h1 {color:red;}.section1 h1 {color:blue;}Sassの書き方によっては特定的になるよう書いている可能性があるかなと思って聞いてみました。メディアクエリ外で特定的にコンパイルされていて、メディアクエリ内では普通にコンパイルされているかもみたいな感じです。実際のコードをみたら原因が全然これじゃない可能性もあります笑
@@bakusokuw ありがとうございます。その通りで、フルサイズの方で.section1 { background-image: url(../image/image1.jpg); background-position: center bottom; background-size: cover; width: 100%; height: 100vh; display: flex; align-items: center; text-align: center; .container { z-index: 3; .headline { color: $gColor; font-weight: 700; margin-bottom: 40px; } h1 { font-size: 48px; font-weight: 700; margin-bottom: 40px; }としておりました。本当に感謝しております。
@@bakusokuw ありがとうございます。まさにPCサイズの方でそのように指定していました。優先度について理解度が増しました。
コピペ用サイトが消えましたどう代用すればよいですか
サイトリニューアルしたので前とURLが違いますが、新しいURLが概要欄にあります！
ポートフォリオの参考程度に使っても良いでしょうか？流石全部丸パクリはしません。一部
もちろんいいですよ！応援してます！
@@bakusokuw 転職に向けて頑張ります。ありがとうございます。
はじめまして！
いつも動画を参考にさせていただいております！
私自身、最近、Web制作を学び始めたのですが、数多くある解説動画の中でも群を抜いて、爆速様の内容がわかりやすく、非常に助かっております！
爆速様の声の質、トーン、スピード、言葉のニュアンス、言い回し、表現方法、取り組み方の良い加減、具合、どれをとっても実に心地好く、もはや、勉強を抜きにして、動画を観ているだけでも癒されます！
また、デザイン自体のクオリティやセンスも素晴らしく、すべてにおいて、感銘を受けております！
是非、今後も参考にさせていただきたいので、引き続き、動画の更新や我々、初学者に対する御教示をどうか、よろしくお願い申し上げます！
私からも爆速様の動画がもっとたくさんの人に目に留まるよう、チャンネル登録等も増えるよう、広めてまいります！
改めまして、いつも本当にありがとうございます！
最高です！いままでWPのテーマ使ってましたが頑張れば自分でも独学でHTML、CSSでサイト制作いけるかも、とこの動画見て感じれました。
ゆっくりと丁寧な解説で、初心者のわたしでもform タグの使い方がよくわかり、見本とおりにできました😃
新しい動画、とても嬉しいです！また後でゆっくり勉強させていただきます！
デザインカンプからのコーディング風景を見てみたいです。
1日かけて全部いけた！
こんにちは！
初回の動画から見させて頂いてます！
こちらの動画を参考にし、自分なりにアレンジしたものを就活のポートフォリオとして使用したいのですがよろしいでしょうか？
もちろんいいですよ！
就活がんばってください！
また新しい動画上がってて嬉しいです！
また勉強させて頂きますm(__)m
爆速先生の動画、とても楽しみにしてます。一つお伺いしたいのですが、html,cssとかJavascriptで出来ているWEBサイトって、実際多いのでしょうか？今はWordpressにしてからアップロードする、とか、Wordpressはもう流行らない、とか、色々言われているようですが、実際のところ、どうなんでしょうか？私個人としては、html,css,Javascriptのコピペで作るWEBサイトが好きなんですが。教えてください。
ありがとうございます！
html,css,jsサイト多いですよ！
WordPressも確かに一世を風靡した時ほどではないですが、定番化して普通に沢山使われてます。
他にも最近だとノーコードツールなども流行っていますが、好きなのを選んでいいと思います。
htmlやcssが分かれば他のもとっつきやすいはずです！
ありがとうございます。安心しました！
いつも大変勉強になってます。
ありがとうございます。
完全に初心者からの質問ですが。
ロゴの部分を事前に作った手書きの画像を貼りたいのですが、どのようにしたらいいでしょうか…?
aタグの中にimgタグを入れればOKです。
見本ではaタグの中にITcomというテキストが入っていますが、こちらをimgタグに差し替えれば画像のロゴを表示できます。
手書きの画像ロゴは、imagesフォルダに入れてください。
表示されたロゴのサイズが大きすぎる場合は、画像自体のサイズを調整するか、CSSでサイズ指定します。
widthで横幅指定か、heightで縦幅指定したりしてもいいです。
@@bakusokuwなにもかも解決しました！ありがとうございます😭
今年も楽しみにしてます！
数ページを扱うWebサイトを繋げる作業も見てみたいです！
新しい動画ありがとうございます❗️
質問なのですがこのサイトは技術レベル的にはどの程度ですか？
脱初心者くらいです！
とはいえ、中級者も上級者も普通に使います。
@@bakusokuw 返信ありがとうございます😊
確かに中級者や上級者も同じタグ使いますもんね！ 次の動画も楽しみにしています^_^
とても勉強になりました。ありがとうございました。質問ですが、今回のwebサイトだと、大体いくらくらいの案件となりますか？1万円くらいでしょうか？これまでの経験をふまえて、だいたいでよいので教えてください。
脱初心者の方が受注すると仮定すると、肌感5万円〜10万円くらいかなと思います。
デザイン支給でコーディングのみ担当だと1〜3万円くらいな気がします。
金額は受注者の営業力や信用・実績、発注者や案件によって大きく変動します。
なので、何となくそんな感じか程度で考えてください！
display: flex;とz-indexを指定しない状態のsection1のcontainerのposition: relative;ですが、なぜheaderのcontainerの位置に来るのでしょうか？headerの下にsection1があるのでheaderの下に来るような気がするのですが・・・
内容がよくわからなかったので違うこと答えているかもなのですが、headerにposition:absolute;がついてるからかもです。
正確にはsection1の1番上端と同じ位置にheaderが浮いて重なってます。
奥側にsection1があって、手前側にheaderがある感じです。
headerのpositionを試しに消してみると違いがわかりやすいかもです。
@@bakusokuw ありがとうございます。headerがabsoluteで浮いているからですね。ちなみに仮にすべてを浮かした場合は、邪魔するものが無ければ、画面の左上端にパーツは来ますか？left:0 top:0 でしょうか？
そうです！
全て浮かしたら左上（top:0;left:0）にきます。
簡単なので試しにやってみたらわかりやすいと思います
@@bakusokuw ありがとうございました。理解できました。
これってWordpressで作るのとはなにか違うのですか？
素人なので教えてほしいです。
【管理画面だけで作るWP】
マウス操作で作れる
自由度が低い
【自分でコードを書いて作るWP】
自由度が高い
WPの機能が自由に使える
HTML + CSS + PHPを使って作る
【この動画のサイト】
自由度が高い
HTML + CSSを使って作る
この動画のサイトもWPを導入すれば、WPサイトになります。
1:28:34 にてメディアクエリですが、.section1 h1 { font-size: 27px ;} と入力しても結果が反映されません。しかし、.section .container h1 { font-size: 27px ;} と入力すると反映されます。sassを使用していますがそのせいでしょうか？ しかし、コンパイル後もcssファイルも確認しておかしな部分は無いのですが。他の場合でも親要素をきちんと指定しないと、クラスだけで反映する時と反映されない時があるのですが、どのようなことが考えられますでしょうか？
html：
TechSolutions
未来をつくるテクノロジーソリューション
Shaping the Future with Innovative Technology Solutions
Contact
sass：
@media screen and (max-width: 767px) {
.section1 {
h1 {
font-size: 27px;
}
}
}
コンパイル後のcss：
@media screen and (max-width: 767px) {
.section1 h1 {
font-size: 27px;
}
}
このように記述しております。
Sassを使ってもコンパイルされるのはCSSなので特に違う点はないです。
メディアクエリ外のh1を見せてもらうことはできますか？
CSSには優先度がありまして、より特定的に書いた方が優先されます。
.sectino1 .container h1 {color:red;}
.section1 h1 {color:blue;}
上記だと、後に書いている方が優先されてh1は青になりそうですが、実際は赤色になります。
理由は.containerが付いていてより特定的に書いているからです。
下記であれば、後に書いた方が優先されてh1は青色になります。
.sectino1 h1 {color:red;}
.section1 h1 {color:blue;}
Sassの書き方によっては特定的になるよう書いている可能性があるかなと思って聞いてみました。
メディアクエリ外で特定的にコンパイルされていて、メディアクエリ内では普通にコンパイルされているかもみたいな感じです。
実際のコードをみたら原因が全然これじゃない可能性もあります笑
@@bakusokuw ありがとうございます。その通りで、フルサイズの方で
.section1 {
background-image: url(../image/image1.jpg);
background-position: center bottom;
background-size: cover;
width: 100%;
height: 100vh;
display: flex;
align-items: center;
text-align: center;
.container {
z-index: 3;
.headline {
color: $gColor;
font-weight: 700;
margin-bottom: 40px;
}
h1 {
font-size: 48px;
font-weight: 700;
margin-bottom: 40px;
}
としておりました。本当に感謝しております。
@@bakusokuw ありがとうございます。まさにPCサイズの方でそのように指定していました。優先度について理解度が増しました。
コピペ用サイトが消えましたどう代用すればよいですか
サイトリニューアルしたので前とURLが違いますが、新しいURLが概要欄にあります！
ポートフォリオの参考程度に使っても良いでしょうか？流石全部丸パクリはしません。一部
もちろんいいですよ！応援してます！
@@bakusokuw 転職に向けて頑張ります。ありがとうございます。