Original

知識ゼロから独学でWebデザインを学びたい人におすすめのサイト11選

前回の記事では、自社ホームページを作成する上で参考になる“カッコいい”・“世界観の表現が上手”なサイトを10通りご紹介しました。皆さんの実現したいホームページのイメージはだんだん固まってきましたか?

さて今回は、自分でイチからホームページのデザインをしたいけれど「知識がない」「どこから手をつければ良いのだろう」とお悩みの方向けに、Webデザインを学ぶ時に参考にしたいサイトを集めてみました。
​​​​​​​

目次

  1. Webデザインのセオリーを学ぼう
  2. ひとりでWeb制作できた!「知識0から学ぶ」すごいスライドやサイト27
  3. Udemy(ユーデミー)
  4. Tech Academy(テックアカデミー)
  5. ドットインストール
  6. Web Design Clip
  7. Responsive Web Design JP 
  8. MUUUUU.ORG
  9. AWWWARDS
  10. CSS Design Awards
  11. s5-style


そもそもWebデザインとは

Webデザインは見た目の「かっこよさ」を追求するだけでは、伝えたいホームページの情報をユーザーに伝えることはできません。

ユーザーが欲しい情報にストレスなくたどり着けることが、Webデザインにおいて大事なポイントです。

そのために、まずWebデザインは「どうあるべきなのか」を学びましょう。

インターネット上で公開されているスライドやまとめブログを活用することで、本を買うよりも手軽にWebデザインを学べます。

1. Webデザインのセオリーを学ぼう

https://www.slideshare.net/shirokuro331/web-11608357

こちらは、福井工業口頭専門学校にて行われたデザインセミナーの公開スライドです。

Webデザインに着手するときの考え方、大事な原則事項などを説明しているので、Webデザインの「いろは」を身に付けたい方は目を通してよくと良いでしょう。

2. ひとりでWeb制作できた!「知識0から学ぶ」すごいスライドやサイト27


http://commte.net/blog/archives/3403

Webデザインを実現するためには何が必要なのかを解説した、まとめブログです。

1.のスライドで紹介した「Webデザインのセオリーを学ぼう」も紹介されています。

たくさんのプログラミング言語が紹介されていており、Webデザインの勉強を始める前からくじけそうですが、Webデザインを学ぶならばHTMLとCSSとJavaScriptの基本を押さえておきましょう。

Webデザインを学ぶならとにかく手を動かそう!

Webデザインに必要な理論や情報は手に入れました。しかし自分のホームページを完成させるには、手を動かして実際にコーディングする必要があります。

そのために効率的な学習方法として、私がおすすめしたいのがオンラインでの学習です。

スマートフォンでの対応もしているので、電車内やちょっとした空き時間でも講座を観ることができます。

3. Udemy(ユーデミー)

https://www.udemy.com/jp/

Udemyはもともとアメリカの会社が実施しているオンライン学習サイトです。日本ではベネッセコーポレーションと提携して、オンライン学習サイトを展開しています。

Udemyの特徴としては、誰でも講師になって講座を開くことができることがあります。またプログラミングだけでなく、資格や言語まで幅広い分野をオンラインで学習できます。

2018年4月23日現在、Udemyでは65,000もの講座が受講可能となっています。

Udemyの講座は基本的に有料で展開しており、その価格帯もバラバラです。しかし定期的に開催されるセールを利用すれば、高額な講座でも1,000円台で手に入れることもできます。

4. Tech Academy(テックアカデミー)

https://techacademy.jp/

先述したUdemyに比べると、より本格的なオンライン学習ができるのがTech Academyです。

現場で通用する実践的なプログラマーを目指すならTech Academyを選びましょう。ただし、その分講座は高額で数万円(時には十数万円)以上になります。

Tech Academyの特徴として「メンタリング」システムが挙げられます。「メンター」という現場経験が豊富な相談役が付いてくれて、自分がプログラミングで迷った時にすぐに答えてくれるのです。

本格的に学びたいけれど少し迷っている場合は、無料体験も用意されているので、そちらを試してみると良いでしょう。

5. ドットインストール


https://dotinstall.com/

UdemyもTech Academyも自分には本格的すぎる、と感じたらドットインストールはいかがでしょうか。

1本の動画が3分台で作成されているので、学習の手軽さで言えばUdemy以上です。しかし、だからと言ってクオリティーが低いわけではなく、プロのエンジニアからも支持を得ているサイトです。

2018年4月23日現在、Python 3入門 、HTML入門 、iPhoneアプリ開発入門などに関するレッスンを 5,000本以上提供しています。

基本的に無料で利用できますが、有料版でも880円/月と格安なので、気に入った方は有料版を申し込み、ぜひフル活用してください。

ちょっとした空き時間で学ぶならばドットインストールかUdemy、本格的に学ぶならTech Academyのように学ぶ目的に合わせてサービスを使い分けましょう。

参考にしたい見本のサイトを1つは持っておこう

自社ホームページの魅力を最大限に伝えるために、様々なホームページのデザインを学ぶことも大切です。

参考にしたいのは、様々なホームページやランディングページを集めたギャラリーサイトです。ここでは国内と海外のギャラリーサイトをいくつかご紹介します。

6. Web Design Clip


http://www.webdesignclip.com/

姉妹サイトでWebDesignFile(http://www.webdesignfile.com/)があり、こちらは海外のサイトを紹介しています。
自分のお気に入りのページを「My Clip」として保存ができる上、掲載もできる点がユニークです。

7. Responsive Web Design JP


http://responsive-jp.com/

Webデザインで欠かせない、レスポンシブデザインの参考になりそうなギャラリーサイトです。

8. MUUUUU.ORG

http://muuuuu.org/

国内を中心に、「いま」風のおしゃれなホームページのデザインを集めたギャラリーサイトです。

9. AWWWARDS

https://www.awwwards.com/

このギャラリーサイトでは世界中のWebデザインを見ることができ、各国のデザイナーが採点している様子も見ることができます。

10. CSS Design Awards

https://www.cssdesignawards.com/

毎日、世界中のクリエイティブなホームページを表彰しているギャラリーサイトです。

11. s5-style


http://bm.s5-style.com/

国内と海外のハイセンスなホームページをまとめて見たい場合はs5-styleがおすすめです。国の違いに捕われることなく、純粋に「いい」と思えるものを見つけやすいギャラリーサイトになっています。

まとめ

いかがでしたか?Webデザインを勉強することで、自社ホームページの魅力を最大限に伝えられるようになります。ユーザーに「何を最優先に伝えるべきか」「どのように伝えるか」を考え、ユーザーが求める情報を適切に与えることで、すばらしいWebデザインが出来上がるでしょう。

今回ご紹介したサイトを活用し知見をためて、自社ホームページのデザインをより良いものにしてみてください。

福田ひとみ(フクダ ヒトミ)

福田ひとみ(フクダ ヒトミ)

Webディレクター Web業界未経験で飛び込んで早2年。プロダクトに携わり、迷いながらも日々奮闘中の新米ディレクター。Webも好きですが、サメが一番好きです。

無料ホームページ作成ツール「One Page」

One Page(ワンページ)は400種類以上のデザインとドラッグ&ドロップの簡単操作により、たった3ステップでホームページを作成することができるツールです。

◆One Pageの特徴
・自由に使える豊富なフォントや画像素材
・コンテンツを考える時間を削減する例文テンプレート
・海外向けのページも作成できる多言語対応機能
・お問い合わせ管理ができるフォーム機能
・初めての方でも安心のチュートリアル

無料から始めることができるので、集客用のページが必要だという方はぜひ一度ご利用ください!

人気記事ランキング

タグ

アーカイブ

ユーザー向け記事一覧

登録番号 IA180169  適用規格 ISO/IEC 27001:2013 / JIS Q 27001:2014