WP-LOAD

WP LOAD / LEARNING ROUTE

Webサイトを作って
公開するところまで

Webの基本から始めて、LPとWordPressサイトを実際にサーバーへ公開する教材です。
この教材を学ぶことで、Web制作のスキルを身につけることができます。

学習工程
5ステップ
料金
無料
対象
初心者

FIVE STOPS

Web制作の学習ルート

  1. STEP 01 0 / 17

    Webサイトが表示される仕組みから始め、HTML・CSS・JavaScript、検証、Gitまでを順番に学びます。

    進捗 0%

    このステップの教材

    CHAPTER 01

    Webサイトの仕組みと制作準備

    ブラウザにページが届く仕組みを理解し、Web制作に必要な環境とファイル構成を準備します。

    1. 01 Webサイトが表示される仕組み 15分
    2. 02 Web制作の環境を準備する 20分
    3. 03 Web制作で使うファイルとフォルダー 30分

    CHAPTER 02

    HTMLで内容と構造を作る

    HTMLで文章、リンク、画像を配置し、内容の意味と読む順番が伝わる文書構造を作ります。

    1. 01 HTMLで文書の構造を作る 45分
    2. 02 文章・リンク・画像をHTMLで配置する 45分
    3. 03 入力しやすいHTMLフォームを作る 60分

    CHAPTER 03

    CSSで見た目とレイアウトを作る

    CSSの優先順位、ボックスモデル、Flexbox・Grid、レスポンシブ対応を順番に学びます。

    1. 01 CSSの基本と優先順位を理解する 50分
    2. 02 ボックスモデルとレイアウトを学ぶ 60分
    3. 03 レスポンシブ対応の基本を学ぶ 50分

    CHAPTER 04

    JavaScriptで処理と動きを作る

    JavaScriptの基本文法、DOM操作、イベント処理を学び、3つの言語を組み合わせます。

    1. 01 JavaScriptの基本文法を学ぶ 60分
    2. 02 DOM操作とイベント処理を学ぶ 60分
    3. 03 オブジェクトと非同期通信を学ぶ 75分
    4. 04 HTML・CSS・JavaScriptでミニサイトを作る 60分

    CHAPTER 05

    制作・検証・履歴管理

    DevToolsとGitを使って制作物を確認・保存し、最初のWebページを完成させます。

    1. 01 開発者ツールで表示とエラーを確認する 30分
    2. 02 Gitで最初の制作履歴を保存する 40分
    3. 03 ブランチを使ってGitHubへ共有する 60分
    4. 04 制作課題：最初の自己紹介ページを完成させる 120分
  2. STEP 02 0 / 12

    完成見本の画像を分析し、HTML・CSS・JavaScriptでレスポンシブなLPを一から制作します。

    進捗 0%
  3. STEP 03 0 / 5

    制作したLPをサーバーへアップロードし、独自URLから安全に閲覧できる状態にします。

    進捗 0%
  4. STEP 04 0 / 17

    ローカル環境へWordPressを構築し、更新できるオリジナルサイトを制作します。

    進捗 0%
  5. STEP 05 0 / 7

    ローカルで制作したWordPressサイトを本番環境へ移行し、更新・バックアップ・復元ができる状態にします。

    進捗 0%

進捗はこのブラウザのCookieへ1年間保存します。別の端末には引き継がれません。