#2 ChatGPTに質問

Webデザイン初心者

現在、HTMCとCSSの本を読んで勉強しています。

読んでいる本はHTML&CSSとWebデザイン　入門講座をいう本です。

理解するのにまだまだ時間がかかりそうです。

今日はChatGPTに学習について相談しました。

ChatGPTからのアドバイスはこちら✨

HTMLとCSSを最短で学ぶためには、「基礎を押さえて、すぐに手を動かす」ことが最も効率的です。以下のステップで進めれば、初心者でも1〜2週間で基本的なWebページが作れるようになります。

✅ ステップ1：学習の全体像をつかむ（1日）

  • HTMLとは何か、CSSとは何かをざっくり理解
    • HTML：Webページの「骨組み」
    • CSS：その骨組みに「デザイン」を加えるもの
  • 【おすすめ動画・資料】

✅ ステップ2：基本構文を覚える（2〜3日）

💡 HTMLで覚えるタグ

  • <html>, <head>, <body>
  • <h1>〜<h6>：見出し
  • <p>：段落
  • <a href="">：リンク
  • <img src="">：画像
  • <ul>, <ol>, <li>：リスト
  • <div>, <span>：汎用ボックス

💡 CSSで覚えるプロパティ

  • color, font-size, background-color
  • width, height, margin, padding
  • border, text-align, display, flex

📌Progate（無料の範囲でOK）やドットインストールを使うと、手を動かしながら習得できます。

✅ ステップ3：実際にページを作ってみる（3〜5日）

🔨 作るとよい例

  • 自己紹介ページ
  • 好きな食べ物ランキングページ
  • 架空のお店（カフェ・花屋）の紹介ページ

👉 Visual Studio Code を使って、HTMLとCSSファイルを保存・編集し、ブラウザで表示確認。

✅ ステップ4：レスポンシブとGoogle Fontsなどの装飾（2〜3日）

  • スマホでも見やすくなる @media クエリの使い方
  • Google Fonts の読み込み方
  • flexbox レイアウトの導入

✅ ステップ5：ポートフォリオサイトをつくって完成（1日〜）

  • 今までの練習ページをまとめた「作品集ページ」を作ってみる
  • GitHub Pagesで公開することで、就職活動や実績にも使えます

🔁 補足：1日30分でも毎日続ける

とても参考になるアドバイスでした。

毎日Visual　Studio　Codeを動かしている勉強している所です。

ChatGPTは絵も描いてくれます。

勉強している絵を描いてもらいました✨

AIで作成した画像です✨

コメント

タイトルとURLをコピーしました