Top Design 未経験からプロのWebデザイナーに! 450レッスン完全マスターコース
PRO COURSE

未経験からプロのWebデザイナーに! 450レッスン完全マスターコース

Webデザイナーを目指す方の為の、Photoshop、Webデザイン、HTML、CSS、コーディングの5講座が全てセットになったコースです。全ての講座に実際に使用するデータ付き。

合計40時間以上のレッスンで必要な知識を全て網羅
超実践的Webデザイナー養成講座

最近よく耳にする、WebデザイナーやWeb制作、コーディングといった仕事。

これからの時代、まだまだWeb関連の仕事は耐えることはなく、スキルと経験を積めばフリーランスで活躍することも可能です。

興味はあるけれど、プログラミングやWebの知識が全くない。
未経験からでも始められるのかな?

このコースは、そんな方々へ向けてWeb制作に必要なこと全てを基礎からレクチャー。そして段階ごとに課題をこなしていただき、最終的には1つのWebサイトを一緒に作っていただきます。
「学びながら作れる」ので、受講が終わった頃にはすぐに実践で使えるスキルが身に付きます!

Web制作に必要な全てを、“初めの一歩”から始められます

このコースでは、デザインに使用するソフトであるPhotoshop、そして実際のWebデザインの仕方、技術面であるHTML、CSS、コーディングの5つが全てセットになっています。

もちろん全て基礎知識やインストール方法の説明から入り、徐々に操作方法の解説、作り方へ進めていくので、全く初心者の方でも無理なく続けていただけます。

動画内で使う素材は全て付属、短い動画で無理せず学べる!

各セクションごとに使用する素材データが付いているので、ダウンロードしてお使いいただけます。

ただ見て聞くだけではなく、実際に画像加工やデザイン、Webページ等の制作を行いながら学んでいただけるので、楽しみながら学べます。

全ての動画は10分前後に収めていますので、初心者の方にも無理なく、ご自身のペースで少しずつ進められます。
分からなくなったりつまずいたところはすぐに戻って復習可能。自分のレベルや進捗が確実に分かるので、確実にスキルアップできます!


「Webデザイナーを目指したいので、デザインもコーディングも必要な技術は全部身に付けたい!」

「Web制作の勉強をしたいけど、何から学んだら良いのか分からない」

「どれも少しは触れるけれど、ちゃんと勉強し直してスキルを上げたい」

など、全くの初心者の方から一定の知識をお持ちの方まで、Web業界を目指す方・携わる方にぜひ受講していただきたいコースです。


このコースで学べること

未経験からプロレベルを目指そう! 実践Photoshop講座

まずはPhotoshopの基本を全体的に学び、その後は各機能ごとに詳しい応用方法を紹介していきます。

単なる機能や操作の説明だけにとどまらず、写真加工、バナー作成、フライヤー制作、Webページなど、実際の制作を行なっていくので、初心者の方でも一気に中級までスキルアップすることができます。

  • Photoshop基礎知識、基本操作全般
  • 選択範囲の操作や画像の加工
  • レイヤーの扱い方
  • ブラシ・シェイプ・グラデーション等のペイント操作
  • 文字の入力・編集・変形など
  • マスクの機能と使い方
  • 色調補正とレタッチで画像を修正する

など


Photoshopでの実践Webデザイン講座

Photoshopを使用したWebデザインの方法をレクチャーします。

Webデザインの準備段階となるワイヤーフレームの制作から始めて、デザインテクニックの基礎を習得した後は、仮のWebサイトを初級・中級・上級の3段階に分けて初めから制作していきます。

基礎から学び、最終的には実際のWebサイトのデザインまで行えるようになるのが目標です。

  • ワイヤーフレームの作り方とWebサイトのパーツの名称
  • Web制作のためのヒアリングのコツ
  • 初心者のためのウェブデザインテクニック(パンくずリスト、ボタン、バナー、メインビジュアル、ナビゲーション、デザインベース制作)
  • 【初級】クリニックのWebサイトのトップページをデザインする
  • 【中級】美容院のWebサイトをデザインする
  • 【上級】Webマガジンサイトをデザインする
  • 【チャレンジ】実際のWebサイトをデザインする

など


基礎から学べる!HTML5完全マスター講座

Webページを作成するために開発された言語、HTML。Web制作技術として必要不可欠な、そのHTMLの正しい記述方法を学んでいきます。

初めてHTMLを学ぶ方へ向けて、まずは基本の書き方・ツールの使い方・構造を解説します。
その後はレイアウト組みやボタン作成、ソフトの起動、動画の貼り付けなど実践的な内容に進み、実際に簡単なWebサイトを制作していきます。

  • HTML基本知識、構造、記述方法
  • フォーム形成に必要な書き方
  • テーブルタグで表組みを作成する
  • 様々な文字に関するHTML
  • リンクを貼る、画像・動画・オーディオを表示させる
  • メールソフト起動、ファイルダウンロード等のHTMLテクニック
  • 要素のセクショニング

など


基礎から学べる!CSS/CSS3マスター講座

CSSの基本的な書き方から実際のWebサイトのレイアウト、上級者向けセレクタの記述まで、初心者の方でも実際にマークアップできるまでのスキルを身に付けます。

  • CSS基本記述方法
  • テキストのスタイルを設定する
  • 幅や余白を調整する、ボックスのスタイル
  • 背景に色や画像を適応させたり影をつける
  • リストのアイコンを画像にする
  • レイアウトを組むための記述
  • セレクタの書き方
  • セレクタを応用する

など


サイトを作りながら学ぼう! 実践Webサイトコーディング講座

HTMLとCSSの基礎を習得したら、最後は実践的なWebサイトコーディングを学びます。

3つの種類のWebサイトを初級・中級・上級と段階を踏んで制作していくので、実際の制作への自信やスキルへつなげることができます。

  • 【初心者向け】クリニックサイトのマークアップ
  • シンプルなデザインながらも、画像タグを利用してメイン画像を表示させる、floatを駆使してボックスを横並びにするなど、幅広くHTMLとCSSを利用していきます。

  • 【中級者向け】美容院のWebサイトのマークアップ
  • マウスホバーでリンクに下線をつける、トップページのファイルを複製して下層ページをマークアップする、inputタグを利用した、お問い合わせフォームを作成する等、少し複雑なスタイルや操作性を意識したマークアップ方法・覚えておくと便利なマークアップ方法などを利用して、中級レベルのスキルを身に付けます。

  • 【上級者向け】Webマガジンサイトのマークアップ
  • デザインをそのまま反映させるようなマークアップ方法、なるべくページの読み込み速度が早くなるようなマークアップ方法、ページネーションやフッターの作成など、コンテンツ量の多いサイトをマークアップしていきます。

  • 【チャレンジ】実際のWebサイトのマークアップ
  • 理解度チェックとして、講師運営スクールである、NESTschoolのWebサイトを実際にマークアップしていきます。


時間もペースも自由なのに、1本ですべてのスキルが身に付けれられる!

デザイン面・技術面と学ぶことは多いけれど、本で勉強するのは分かりにくい。
だけど学校に通う時間も取れない、取れたとしても自宅で課題をこなす時間がないかもしれない。それに全部のスキルを教えてもらうには授業料だってかなりかかる...。

そんな悩みや心配も、動画で学べるこの講座ですべて解決できます!

実際にスクールを運営している、実績多数の講師がお教えします

講師はテクノロジーとクリエイティヴのプロを目指すためのスクールを運営しており、卒業生は1000名以上。
未経験からWebデザイナーとして働けるレベルになることをゴールとした、Webデザインコースを提供しています。

450レッスンオンラインコースの講師について


最初から最後まで全て同じ講師がみっちりレクチャーします!

About the Instructor

Course content

Total 42 hours 17 minutes
Preview You can preview lectures with this label
Loading .

Ratings and reviews

4.5
139 reviews
5 stars
51%
4 stars
48%
3 stars
1%
2 stars
0%
1 stars
0%
とてもわかりやすく、テンポの良い動画でスキルがグングン身に付きます。レッスン時間は長いですが本気でWebデザイナーを目指すならばこのボリュームは必要です。当社での研修訓練にもこのコースを利用させて頂きます。
See more

Related Courses