PAGE TOP ▲

大副業時代を生き残るためのブログ。切り売り労働からの脱却、少しでも収入をアップしたい方へ。

TOP 独学でもWebデザインやコーディングの勉強は可能か

独学でもWebデザインやコーディングの勉強は可能か

本当に勉強できるか不安な方もいると思いますが一つ一つ段階を踏む事で確実に覚えられます。別の記事でスクールに通うよりも独学を薦めますと書きました。では実際にどうやってWebデザインやHTMLコーディングを勉強するのかなんて分かりませんよね。

「独学」の技術を身につけることで今後のWebデザイナーとしての人生が変わりますので大変ですが挑戦してみて下さい。

インターネットに全てがあります

世の中には色々なWebサイトが公開されています。簡単に言ってしまうとこれらのサイトからすべて学ぶ事ができます。HTMLのソースもほとんどのサイトで見る事が可能です。あなたが良いなと思ったサイトで右クリックやメニュー内にソースを表示というボタンがありますのでそれを利用します。Macの場合は「command+U」で見る事が出来ます。

このように無料でデザインもソースも見る事ができますがどれが良いデザインでどれが良くないデザインなのかもまだ分からないのが正直な所ではないでしょうか。

良いデザインをたくさん見る

良いデザインを作るには良いデザインをたくさん見ることです。その中で自分が好きなデザインが出てきます。好きなデザインの傾向はデザイン力がアップしていくと共に変わっていくものです。そしてWebデザイナーとして独立する事を選んだアナタはクライアントからの要望を聞きながら効果のあるデザインを作る事を要求されます。その為にも色々なデザインを見ていきましょう。

私がデザインを考える時によく見るサイトでたくさんWebデザインを紹介しているサイトがありますので参考にしてみて下さい。

MUUUUU CHANG http://muuuuu.org/
ウェブアートノックARTNOC http://www.art-noc.com/
I/O 3000 http://io3000.com/
web design gallery http://design-gallery.biz/
Good Design Web http://gooddesignweb.com/

このサイトに紹介されているWebデザインはどれもプロのWebデザイナーが制作したものばかりです。このような完成されたデザインを見てどんどん自分の頭に吸収していくことで「このクライアントはこんなデザインを希望しているな」といった感じでアイデアの引き出しが増えてきます。

そして全体のキレイなデザインだけではなくこのサイトは一番に何を伝えたいのかなども見ていくと勉強になります。

デザイン初心者がやってしまいがちな事

多くのWebデザイナー初心者を見てきましたがWebデザインをする際に伝えたい事が多すぎて結果的に全ての情報が埋もれてしまう事です。伝えたい側のクライアントは幾つもの伝えたい情報を目立たせてくれと要求します。

ですが、反対にWebサイトに訪れるユーザーはたくさんの情報いっぺんに見せられても見ていない事がほとんどです。Webデザインをする場合3秒以内に何のサイトかを分かるように制作する事がとても重要です。

サイトに訪れるユーザーは気まぐれです。何のサイトか分からずに一生懸命ページを進めてくれる方は少ないです。瞬間的に何のサイトかを理解してもらえたら次は何を伝えたいかを考えます。

ここでは伝えたい事を一個にだけにします。例えばアナタがどこかのお店に入ったとします。店員さんが近づいてきて「当店では●●●と▲▲▲がおすすめで★★★と■■■は大変お買い得です。●●●と★★★はセットでも買えます!」と一度にたくさんの事をいきなり話されても困りませんか?結果的に何がオススメなのかも分からないですし。そうならない為にも伝えたい事は一個だけにして下さい。

ですがクライントは「だけど全てを伝えたい」と希望してきます。ここからがWebデザイナーの見せ所です。ここでは簡単にお話ししますがデザインは強弱をつける事でいくらでも効果的に伝える事が可能です。

そして必ずしもユーザーはトップページから来る訳ではないという事を覚えておいて下さい。検索結果には下層ページから訪れる事もよくあります。

コーディング

HTMLなどのコーディングとは家を建てる時の大工さんの部分です。大工さんに家を建ててもらうには設計図も必要ですし材料の手配も必要になってきます。同じようにコーディングもワイヤーフレームという設計図がありPhotoshopでデザインしたものをWeb用に最適化してパーツを用意して初めてコーディングが出来ます。

Webサイトを作る時には主にHTMLとCSSのコーディングをするのですが家で例えるとHTMLは土台や柱などの骨組みにあたります。CSSは外壁だったり内装だったりと見た目の部分で各部屋がそれぞれのコンテンツになり、家具が記事の部分になります。

Webデザイナーとして独立される方はこの作業をすべて一人で行います。パーツ毎に外注するケースもよくありますが最初は自分でやるだけで精一杯なので慣れてくるまではどうしても一人での作業になります。

こういった地味な作業は小さなサイトでも大きなサイトでも必ずやらなくては行けない作業です。大変ですが慣れてくるとテンポよく進めることが出来ますので多くのサイトを積極的に作る事で解決していきます。

保管庫の関連記事一覧

タグ打ちとコーディングの違いについて。

2017年05月29日
タグとは何か。。。 まずは「タグ」とは何だろう?という所から説明します。タグとはHTMLで使用するもので例えば「こんにちは!」という文字をそのページのタイトルにしたい時 <title

ヒアリング の重要性を理解することでワンランク上がります。

2017年02月05日
ヒアリング の重要性 ヒアリング がWeb制作を行う上で最重要と考えています。段取り八分です。 例えばクライアントに確認する事が100項目あったとします。最初に全て確認しても、作業しながら

ハッキングにあったのでWordPressの運用をできるだけシンプルに考え直す。

2017年02月03日
ハッキング にあったサイトは現在ご覧頂いているこのサイトです。無事解決しているので運用を再開しているのですが、この機会にデザインも一新してみました。技術的な解決方法は色々なサイトで紹介していると思いま

ランサーズで経験を積む。

2017年02月02日
このサイトを見て頂いている方のほとんどは、未経験者や独学で勉強中の方が多いと思います。ただ実践を積み重ねないことには経験を積むことも出来ないが、経験がない人には実践を与えられる機会も少ないのが現実です

Youtubeのサムネイルの代わりに画像を貼り付ける

2016年12月17日
動画サムネイルの代わりにご自身で制作した画像を表示することが出来ます。これは動画の埋め込みタグ(iframe)をjsに流し込み画像をクリックしたら消え、動画を表示するという順序で動きます。 ※埋め込

専門学校やスクールを出ないとWebデザイナーなることは出来ないのか

2016年02月06日
この質問はWEBデザイナーを目指している方からだけではなくクライアントからも「やっぱりそういった学校卒業されたのですか?」という質問をよく受けます。 私の場合は独学でした 私のお話をさせて