-
-
【研修対象者】
- ・Webデザイナー
- ・Webマーケター
- ・Webエンジニア
-
【解決できるお悩み・ニーズ】
- ・PCやスマートフォンサイト向けにCSSのコーディングスキルを身に着けたい
- ・サイト改善のためのUIパーツを制作できるようになりたい
-
研修内容
この研修パッケージでは、Webサイトやスマートフォンサイトのコーディングに使えるMediaQueryを使ったCSSのコーデイングテクニックやUIパーツの作成方法について学ぶことができます。HTMLやCSSの基礎知識を身に着け、さらに実践的な内容を学びたいと考えているWebエンジニアやWebデザイナー、Webマーケター向けの研修パッケージとなっています。
研修のゴール
- ・レスポンシブコーディングの概要を理解できる
- ・MediaQueryを用いたCSSのコーディングができる
- ・PCサイトやスマートフォンサイトのデザインパターンとコーディングができる
-
-
研修プログラム
-
-
レスポンシブコーディング入門 -MediaQueryを実装する-
- ・レスポンシブデザインの概要と.htaccessの違いについて
- ・ブレイクポイントの概要とBootstrapのブレイクポイントについて
- ・MmediaQueryの実装方法について
-
レスポンシブコーディング入門 -ブレイクポイントを増やす-
- ・タッチデバイスの幅などデバイスプレビュー
- ・ブレイクポイント毎のCSS
-
レスポンシブコーディング入門 -ブレイクポイントごとのCSS完成-
- ・仕上げのCSSの記載方法
- ・崩れたUIの修正方法
- ・実機での検証について
-
-
-
デザインパターン基礎 -Web制作におけるデザインの全体像をつかむ-
- ・WEB制作におけるデザインの意義
- ・一般的に言われているデザインと本来のデザインの違いについて
- ・WEB制作の流れを理解する
- ・フロントエンドにおけるWEBデザインの意義を学ぼう
- ・PC・スマートフォンデザインの違いと特徴
- ・フラットデザイン・マテリアルデザインといった昨今のWEBデザインにおけるトレンド
-
デザインパターン基礎 -CSSのみで実装できるデザインテクニック-
- ・CSSとHTMLの関係性について
- ・代表的なプロパティについて
- ・効果をつけるときに使用するCSSの紹介
- ・アクションボタンの作成方法
-
デザインパターン基礎 -CSSとjQueryを使ったハンバーガーメニューの実装-
- ・ハンバーガーボタンのCSS設計とレスポンシブ対応について
- ・jQueryを導入したボタンの実装と動作確認
-
デザインパターン基礎 -CSSとjQueryを使ったプルダウンの実装-
- ・プルダウンの構造理解とCSS設計方法
- ・jQueryを導入したプルダウンの実装と動作確認
-
デザインパターン基礎 -カルーセルスライダーslickを用いたスライドの実装-
- ・jQueryのプラグインslickについての理解とダウンロード
- ・slickを用いたスライドの実装
-
デザインパターン基礎 -動作に合わせてデザインを変化させるパララックス（視差効果）の実装-
- ・パララックス全体の説明
- ・背景固定の作り方とその際のHTML・CSSの実装
- ・時間差で降ってくる雪の作り方
- ・一定のスクロール量で現れる要素の作り方
-
デザインパターン基礎 -スクロール時にTOPを固定させる実装-
- ・トップ固定の実装の説明とメリット
- ・jQueryの実装方法の理解
- ・デザインパターン基礎 -情報量が多い時に役立つ切り替えタブの実装-
-
切り替えタブの理解と実装について
- ・切り替えタブにおけるHTML,CSS,jQueryの理解
-
-
-
受講者の評価
評価
4.1/5.0
研修概要
時間 11時間(60分×11コマ)
料金 1,500円 / ID(最少20ID～)
※定額制で全ての動画が受け放題
※ボリュームディスカウントあり
開催場所 WEB
※オンライン受講のみのサービスです
-
-
取引実績
-
-
関連する研修カリキュラム
-
《関連テーマの研修カリキュラム》
-
《関連職種の研修カリキュラム》
-
-
よくあるご質問
- 1. 資料請求/お問い合わせ
お問い合わせ後、弊社担当よりご連絡いたします。ご利用用途や対象者などをお教えください。
2. ヒアリング/運用イメージのご提案
現在の研修状況や計画などをヒアリングし、最適な研修内容のご提案とお見積もりをいたします。
3.ご契約
お申し込みいただきご契約となります。 - 20IDからご契約が可能です。
料金についてはご契約のID数によって異なりますので、お気軽にお問い合わせください。 - 国内最大級となる7,000本以上の動画数でビジネススキルから政治・経済・金融・デザイン、プログラミング、 DX、AIまで全21カテゴリの幅広い領域を網羅しています。 社員研修から自律学習まで幅広くご活用いただけます。
また年間600本の動画が更新されるので、最新のトレンドや環境に合わせた研修や学習が可能です。 - Schoo for Businessは法人でご契約いただき、各社員に視聴権限(ID)を割り振って受講いただくプランです。
一方、プレミアムプランは個人でご契約いただく有料のプランです。
そのため、管理機能・研修機能はSchoo for Business(法人でのご契約)のみでご利用いただくことが可能です。
-
受講者コメント
とても分かりやすいです。今までCSSを中途半端に理解したままでした。CSSの意味（個性）を知ることで理解を深めることができました。ありがとございます。
受講者コメント
ぼんやりと理解していた要素の違いが明確になりました。先生のトークも面白く、楽しみながら理解が深まりました！