私が普段サイトを制作する際、使用している便利なサイトがあります。
デザインやIllustrator・Photoshop関連だったり、CSSやHTMLやSEOのサイトです。
このサイトを利用するだけでサイトのクオリティや作業効率がグッっとアップするかもしれません！！
今回はその便利かつ勉強になるサイトを紹介していきます！
この記事の目次
サイトデザイン関連
WEBデザインの見本帳
かなり調べやすいサイト。
印象・色・ジャンルからしらべられる
WEBデザイン参考サイト bookma! v3
横幅をいっぱいに使用しているサイトが多い。
イケサイ ウェブデザイナーのWEBデザインデータベース
こちらも調べやすいサイト。
サイトが業種毎にわかれており、便利。
歯科医院のホームページデザイン集｜ホームページラボ
歯医者さんのサイトを集めたサイト。
こちらも色やサイトの雰囲気等に分かれており調べやすい。
Illustrator・Photshop関連・その他
Free Vector Art, Images & Graphics for Free Download
海外のIllustratorやPhotoshopを取り扱っているサイト。
デザインを調べにくいが、ボタンや背景に使えそうなデザインが充実。
無料イラストなら「イラストAC」
日本のサイト。
IllustratorやPhotoshop・画像データを取り扱っている。
ダウンロードするには会員登録が必要だが、色々なタッチのデザインがあり、かなり使える。
かわいいフリー素材 いらすとや
タイトルの通りかわいいイラストが揃っているサイト。
ホームページをよくみている方なら、一度は見たことがあるタッチの絵だろう。
背景透明のpngだが、ページ等の装飾に使用させて頂いています。
HTML・CSS関連
Another HTML Lint – Gateway
HTMLの構文をチェックしてくれるサイト。
正しい構文を書くことでSEOに効果的なので、サイト公開前に必ずチェック・修正しています。
CSS Border Radius Generator
CSSの角丸を作成するジェネレーター。
上だけ角丸にしたり、下だけ角丸にしたりと、細かく設定できるので便利。
Ultimate CSS Gradient Generator
CSSでグラデーションを実装するジェネレーター。
縦か横にグラデーションをかける事が出来る。
レスポンシブデザインのサイトなら、画像を背景にするより、CSSでグラデーションかけた方が楽なので良く使っている。
CSS3 box-shadowジェネレーター
BOX要素にシャドウをつけるジェネレーター
上記に書いてある理由と一緒で、CSSでシャドウをかけた方が楽なので良く使っている。
Easy Imagemap Generator
イメージマップを作成する為のジェネレーター。
前回「jQuery 高機能でオシャレな地図検索を作成！」でも使用した。
SEO
SEOTOOLS – SEO対策を無料ツールで診断！
サイトの状況や、ライバルサイトとの比較が出来るサイト。
キーワードプランナーやアクセス解析など、色々な昨日が無料で使える。
PageSpeed Insights
Googleが運営している、サイトの速度を測定してくれるサイト。
問題点を解決する為の提案をしてくれる親切なサイト。
マイサイト被リンクチェックツール
被リンクの数を調べる為のサイト。
ちょいちょい調べて、被リンク数が増えていたら一人でニヤッとしている。
リンク切れチェックツール
サイト内のリンク切れを調べるためのサイト。
リンク切れがあるとSEOで不利になるので、こまめにチェックしたい。
以上が普段使用しているサイトです
皆さん参考になりましたでしょうか？
私はこれでサイト制作を行っています。
特にSEO関係のサイトは、運営に関して凄く重要なので一度試してみてはいかがでしょうか？
コメント