って無理矢理すぎっ！！
最近は知識がなくても簡単にホームページ制作が出来る時代になってきました。本当に時代の進歩というのはすさまじいものです。といってもテンプレートにはめ込むだけのホームページ制作じゃあ物足りないもの。
ということで今回は初心者の方でもホームページを制作するときに必ず役に立つツールやサイトをお伝えしたいと思います。
スポンサーリンク
学習サイト
ホームページ制作に必要な知識は今や独学で取得できます。なぜなら
無料で教えてくれるサイトがあるから。
なぜ、無料で教えてくれるのか意味不明ですが教えてくれるなら学ばせてもらうしかないということでご紹介します。
・ドットインストール
ドットインストール
とりあえずホームページの知識を学びたいならこのサイト見ておけば大丈夫！！３分の動画でわかりやすく教えてくれます。ホームページ制作以外にもプログラミングやサーバーの知識、アプリなども配信しています。
プレミア会員になれば、さらに深い知識も学ぶことが出来てコスパが最強なサイトとなっております。
・Progate
Progate
こちらも無料で学べるサイトとなっております。
学習方法はドットインストールと異なり、スライドで説明が行われております。Progateのすごい所はスライドだけではなく実践もありこの実践をクリアしないと次に進めません。きちんとインプットされた状態で学ぶことが出来るのです。
またホームページ制作に必要な知識だけでなく、rubyなどサーバー言語のプログラミングのレッスンも行う事が出来ます。
サーバーの環境を構築するなんてつらすぎる！！
と不安になることはありません。すでにProgateに準備されています。
そうProgateならね。
インプットをしよう
さぁホームページを作ろうと思ってみても実際に作り始めてみるとなかなか進まないもの。そういう時は素敵なホームページのデザインを見てどんどん頭にインプットしていきましょう！
100個でも見れば今のサイトのトレンがわかるはず！(僕は分かってないけどっ！！)
・AWWWARDS
AWWWARDS
最先端のウェブデザインが集合するサイト。AWWWARDSに載るサイトはクオリティが高すぎて意味不明ですが、制作意欲が高まること間違いなしです！僕も毎日覗いて
「amazing！！amazing grace！！」
と叫んでいます。
・MUUUUU.ORG
MUUUUU.ORG
クオリティが高いサイトがずらーっと並んでいます。更新頻度も高く僕も毎日覗いてあまりのクオリティーの高さに
「半端ねぇーー！！」
と叫んでいます。
日本のサイトが非常に多いので作りたいサイトが見つかるはず！
・LPARCHIVE
LPARCHIVE
LPサイトが2000件以上登録されているサイトです。
LPサイトは一枚ですべてを伝えないといけないので非常に見た目が重要と言われています。登録されているサイトはどれもクオリティが高く、写真の使い方や色の使い方、アピールポイントの強調の仕方などホームページ制作にかならず役に立つ情報をインプット出来るはずです。
・feedly
feedly
有名なニュースリーダー。
デザインブログなどを片っ端から登録しておき読み漁ってトレンドをインプットしちゃいましょう。
僕なんて登録しすぎて未読が2000件とかになってしまって、インプットより既読にするのが目的になってしまっています。初めて利用する人はある程度数は抑えた方が良いと思います。
便利なツールで制作をしよう
ある程度作りたいホームページが決まったら便利なツールを使って効率よくホームページ制作を行いましょう。
・atom
atom
ホームページ制作をするためにはコードを書かないといけません。メモ帳でもコードは書くことは出来るのですが、せっかくならおしゃれなエディタで制作を行いたい。
そういう時はatomを使用して下さい。
オープンソースの無料のエディタです。これが未来のエディタと思わせるぐらいおしゃれなエディタとなっています。
しかも、オープンソースの為、世界中の人たちが作った便利な拡張機能を無料で使うことも出来ます。この意味不明な優しさ。びっくりします。
・codic
codic
ホームページを作ってると悩むのが
ネーミング
ページ数が増えれば増えるほど、クラス名の被りなどを意識していかないといけません。そのためにも意味のあるネーミングをつけることが大切です。
このサイトを使えば、もうネーミングで悩む必要はありません。当てはまる日本語を打てば勝手にそれっぽいネーミングに変更してくれます。
・Browse Palettes
Browse Palettes
色の組み合わせというのは非常に大切です。ある程度勉強をしないと色の組み合わせというのは分からないものです。そんな色に詳しくない人でもこのサイトを見れば大丈夫。
莫大な量のカラーパレットが存在しています。自分が好きな色の組み合わせを見つけておしゃれなホームページを作成しましょう！
・uigradients
uigradients
色の組み合わせも非常に大切ですが、最近ではグラデーションを使用しているホームページも多くなってきました。
このグラデーション。自分で作ると理想の色を完成させるのがなかなか難しいです。
しかし、このサイトなら沢山のグラデーションの中から自分の理想のグラデーションを見つけることがきっと出来るはず。
CSSで吐き出すことも出来るのでコピペですぐに実装することが出来ますよ。
・css3buttongenerator
css3buttongenerator
ホームページに必要なものといえば「ボタン」
・ボタンは立体的な方がいい。
・ボタンはグラデーションがかかっていたほうがいい。
などなど理想のボタンがあるはずです。しかし、理想どおりのボタンを作るのは初心者の方には難しいもの。
このサイトのジェネレーターを使用して作成すればあとは勝手にCSSを吐き出してくれます。それをコピペすれば完了です。
素敵なボタンを作成してホームページ制作に役立てて下さい。
制作に詰まったら聞いてみよう
1人で制作を行っているとどうしても詰まってしまうところもあると思います。ググって解決すれば良いのですが、なかなかピッタリの解決方法がないものです。
そういう時は恥ずかしがらず聞いてみましょう。僕も何度も助けられております。
日本人の助け合い精神というのは本当に素晴らしいものです。
・teratail
teratail
プログラミング専門のQ＆Aサイトです。悩み事をぶちまけるとドラえもんみたいな人たちが解決してくれます。
まさにドラえもんズ。状態！！
回答率も非常に高く、意味不明な優しさで包まれているサイトとなっております。1人でずっと悩んでいるならぜひ質問を行ってみてはいかがでしょうか。
・timeticket
timeticket
自分が悩んでいることを文章で伝えるのが苦手な人はもう直接会っちゃいましょう。
このサイトを使用すれば、その道のスペシャリストと会って解決することが出来ます。有料ですが、やっぱり会って解決出来るというのは安心だし、自分のスキルアップにもつながります。
スポンサーリンク
本を読もう
ネットで色々調べるのが苦手な人はやっぱり本。本じゃないと頭に入ってこないという人も多いと思います。
僕も毎月5冊ぐらいは購入しております。読んでも読んでも頭に入ってこないため、脳が本当に動いているのか不安になる時があります。
そんなことはどうでもよくて、とりあえずこれさえ購入しておけばホームページ制作は問題ないという本をご紹介させて頂きます。
・スラスラわかるHTML&CSSのきほん
初心者向けの本となっており、
これを読んで分からない人はいないだろ！！
というぐらい理解することが出来るはずです。
という方にはピッタリの1冊となっております。
・作りながら学ぶ HTML/CSSデザインの教科書
サイトの公開まで詳しく記載されており、少し本格的なHTML/CSSの教科書となっております。
実際にサンプルサイトを作成するのでサンプルサイトが完成する頃にはHTML/CSSの知識が備わっていることでしょう。
・作りながら学ぶ HTML/CSSデザインの教科書
HTML/CSSの操作になれてきたらこの教科書がきっと役に立ちます。
擬似要素を使用したコーディングなどが記載されており、jqueryを使用してサンプルサイトを制作していきます。
レスポンシブ設計などもきちんと解説されており、モバイルファーストでホームページ制作を行うことが出来るようになりますよ。
※初心者向けではないのでご注意を。
まとめ
色々記載しましたが、せっかく作るなら楽しく作れないと意味はありません。
ご紹介したツールを使用して楽しくクリエイティブなホームページ制作をして下さい。