こんにちは！副業ママデザイナーのつばさです。
今回は私がデザインを作る際によく使うChromeの拡張機能をご紹介します。
contents
Chromeのブラウザを使っているのは拡張機能が便利だから！
「Chrome」というのはGoogleが提供している、インターネットを閲覧するためのブラウザです。
WindowsのInternet ExplorerやMacのSafari、Firefoxもインターネットを閲覧するためのブラウザなのですが、同じようにインターネットを閲覧できるブラウザがこんなにたくさんあるのになぜChromeを私が愛用しているかというと「拡張機能が充実しているから」です！
制作中は調べつつ制作をすることがほとんど。
そうなると、自分の制作が便利になるような拡張機能をあらかじめ設定しておくことは、作業スピードを早めるためにも重要ですね。
よく使うChrome拡張機能
Color Zilla
webサイトを見ていて、「あっ、この色いい！今作ってる制作物にも使いたいな」ってこと、ありませんか？そんな時はこの拡張機能を使うと、webサイト上から色を抽出してくれるのです。
スポイトマークをクリックし、十字カーソルを調べたい色のところでクリックすればOK!
カラーコードやRGB値を取得してくれます。
Clear Cache
webサイトを更新してクライアントさんへ完了報告をした後「更新、されてないよー！」と連絡が来たこと、ありませんか？実はそれ、ブラウザのキャッシュをクリアすれば改善する場合がほとんど！
※他の原因でエラーになっている場合ももちろんありますよ
ブラウザの設定メニュー内にもキャッシュクリアボタンはありますが、拡張機能に登録しておけば一瞬でキャッシュがクリアできてしまうのでとても便利。
自分自身が更新したwebサイトも、まずキャッシュクリアしてから確認するようにしましょう。
What Runs
webサイトで使用されているフレームワークやスクリプト、フォントやプラグインを調べてくれる拡張機能です。
「あの通販サイト、どんな風に作られているんだろう？」という時などに便利。
「＋」マークをクリックすることで、表示させたwebサイトの情報を保存することもできますよ。
HTMLエラーチェッカー
HTMLの記述エラーを表示してくれる拡張機能です。
HTMLのタグの閉じ忘れなどあった場合に地道に記述を見ながら探すのはとても大変。
そんな時に使って欲しいのがこの拡張機能です。
調べたいページを表示させ、HTMLエラーチェッカーのアイコンをクリックするだけ。エラーがあれば、エラー箇所とその内容を表示してくれます。
Fontface Ninja
webサイトのフォントを調べることができます。
さらにそれだけではなく、個々のフォントの文字サイズや文字の間隔や色などまでわかってしまうのです！
webサイト制作のみならず、紙媒体の制作にも役立ちそうですね。
拡張機能はこの他にもたくさんあります。
いろいろ探して、自分だけの作業しやすい環境をカスタマイズしてくださいね！
兼業webデザイナー。２児の母。普段は事務系会社員としてフルタイム勤務しながら、個人で仕事を請け負っている。いずれはママのための講座やコミュニティを運営したいという夢を持ち、日々勉強中。
