Web制作コース
【まずはここから🔰】ゼロから始めるWeb制作
入門レッスン
ウェブデザインの第一歩として、HTMLの基本を学びましょう。 テキストや画像を組み合わせてウェブページの基本的な構造を作成する方法を練習します。
入門レッスン
ウェブページに美しいスタイルを加えるためのCSSの書き方を練習します。 テキストのスタイルから背景色の設定まで、基礎的なスタイリングを習得します。
入門レッスン
実際のホームページ作成に使われるHTMLとCSSの応用技術を学んでいきます。 メタ情報の設定からブロックデザインまで、手を動かして実務に役立つ知識を身につけます...
入門レッスン
CSSにおけるセレクタの選択方法を詳しく学び、複雑なデザイン要件にも対応できるようになります。 タグから属性、似ていないセレクタまでを深く理解します。
【中級編💼】レイアウトとレスポンシブ対応を学ぼう
入門レッスン
レイアウトの構成に必要なCSSの知識を集中的に学び、Webページ制作の現場で求められるレイアウト技術を習得します。 カード型レイアウトなどの実践も含まれます。
入門レッスン
ページ構造を整理し、ユーザーにとってわかりやすいサイト構築に欠かせないセクショニングコンテンツについて学びます。 ヘッダーやフッターなどの要素を使いこなしましょ...
入門レッスン
Flexboxを活用したウェブレイアウトの技術を身につけます。 横並びから中央寄せまで、柔軟性の高いレイアウトを実現するために重要なプロパティを習得します。...
実践レッスン
実務で使えるプロフィールサイトの作成技術を、HTMLとCSSを使って学ぶコースです。 ファーストビューからフッターまで、ひととおりの構成要素を網羅します。
入門レッスン
「ブロック要素」と「インライン要素」の違いを学ぶコースです。これらの違いを学べば、HTMLのレイアウト設計がスムーズになります。まずは基本から理解しましょう。 ...
入門レッスン
レスポンシブデザインに必要なCSSのテクニックを学び、さまざまなデバイスに対応するウェブページ設計ができるようになります。 実践的なメディアクエリにも触れます。
入門レッスン
Flexboxを使用したさまざまなレイアウトパターンを実践的に学びます。 レスポンシブデザインにも対応した現代的なWebページ制作を目指します。
実践レッスン
「プロフィールサイトを実装しよう」で制作したサイトをレスポンシブに対応させ、スマートフォン用のレイアウトを作成します。 入門レッスンで学んだメディアクエリを活用...
ローカル開発
Webサイト制作がはじめての方を想定した、模写コーディング課題です。
ローカル開発
Webサイト制作の初心者の方を想定した、模写コーディング課題です。
【応用編📚】高度なCSSテクニックを習得しよう
入門レッスン
CSSのpositionプロパティを活用し、要素を任意の位置に固定するテクニックを習得します。 モーダルウィンドウや画像の重ね合わせなど、実用的なケースを学びま...
入門レッスン
CSSの擬似要素を用いた装飾とコンテンツ生成の方法を学ぶコースです。 タイトルやリストにユニークなデザインを加え、ユーザー体験を向上させます。
入門レッスン
CSS擬似クラスに焦点を当て、ユーザーのアクションに応じたスタイル変更を適用する方法を解説します。 詳細なセレクターや条件に基づくスタイリングが学べます。
入門レッスン
CSS Gridレイアウトによるウェブページの設計方法を学びます。 グリッドシステムを用いて整理されたカード型のレイアウトを作成し、現代のWebデザイン技術を習...
入門レッスン
中央揃えはウェブデザインの重要な要素です。 positionやflexプロパティの活用で、任意の要素を中央に配置するテクニックを身につけます。
入門レッスン
CSSを使用してなアニメーションが実装可能です。 transformやanimationプロパティの活用で、簡単なアニメーションを実装します。
入門レッスン
CSS Gridレイアウトによるウェブページの設計方法を学びます。 グリッドシステムを用いてさまざまな要素の配置を学習し、現代のWebデザイン技術を習得します。
【パーツ編📦】ウェブサイトの主要なセクションパーツを作成
実践レッスン
Webページ内でよく見るサービス紹介カードの実装を通して、具体的なデザインスキルを学びます。 テキストとボタンデザインに加え、ホバーエフェクトの追加も扱います。...
入門レッスン
表形式の料金プランを作成し、ウェブサイトへの導入方法を学びます。 明確でわかりやすい情報表示のためのテーブルデザイン技術を修得します。
入門レッスン
FAQセクションを作成する際の、dl, dt, ddタグの使い方を学ぶコースです。 ユーザーからよくある質問に答えるページの作成法を習得します。
入門レッスン
お問い合わせフォームの設計から入力エラー時のスタイリング、バリデーション実装までをカバー。ユーザーからの情報収集を効率化する方法を身につけます。
入門レッスン
iframeタグを使用してGoogleマップを埋め込み、レスポンシブ対応するテクニックを習得します。
実践レッスン
このレッスンでは、ウェブページにフッターセクションを作成し、ロゴ画像やメインメニューとサブメニュー、ボタンやSNSリンクの配置方法を学びます。 設置したコンテン...
【実践編💼】実案件を想定したサイト制作
実践レッスン
実務レベルのコーポレートサイト実装に必要なスキルを網羅。ヘッダーからフッターまで、プロフェッショナルなウェブサイト構築技法を修得します。
実践レッスン
Web制作会社を想定したサービス紹介サイトを制作します。 positionや疑似要素など、実務でよく出るスタイルの指定に挑戦しましょう。
【Sass編📝】効率的なスタイル管理と実践
入門レッスン
Sassを導入し、CSSのコーディングをより効率的に。変数やmixinなどの機能を利用し、記述をシンプルに保ちながらスタイルを強化します。
実践レッスン
Scssを使用するメリットを学び、効率的なコーディングスキルを身につけましょう。