Google Chrome拡張17選
これ無しではいられないChrome拡張
および各種拡張紹介を読んでいて、一連自分のためのテストなりに使ったら面白そうなものを集めておいた。見つけ次第増やす、という落書き。
1. 応答性能: Browserstack
URL: http://www.browserstack.com/
異なるブラウザ上でのウェブサイトの応答性を即座にテストすることができる。
BrowserStackを使ってブラウザテストに取り組んでいる知見 でも紹介あり。
ここから入手
2. 色: ColorZilla
http://colorzilla.com/
ウェブ開発者は必ず入れたいブラウザ拡張機能13選 でも紹介あり。
ブラウザの任意のポイントから色の読み取り、色を調整、別のプログラムに貼り付けることができる。
ここから入手
3. CSS: CSS Viewer
シンプルなCSSプロパティビューア。
ここから入手
4. CSS: User CSS
簡単にCSSを適用して遊べる。
ここから入手
5. リンク: Check My Link
URL: https://logflare.app/
ウェブページをクロールして壊れたリンクを探すリンクチェッカー。
ここから入手
6. キャッシュ: Clear Cache
ワンクリックで、キャッシュや閲覧データをクリアする。
GoogleChromeのおすすめ拡張機能 にも紹介あり。
ここから入手
7. ダークモード: Dark Reader
URL: https://darkreader.org/
あらゆるウェブサイトにダークモードを。
Dark Readerを利用してWebサイトをとことんダークモードにする にも紹介あり。
8. 要素間の距離: Dimensions
URL: https://www.felixniklas.com
マウスポインタを上下左右に動かしたときの寸法を、境界線に当たるまで測定。ウェブサイト上の要素間の距離を測定したい場合に。
ここから入手
9. ウィンドウサイズ: Window Resizer
URL: http://coolx10.com/
ブラウザのウィンドウサイズを変更して、様々な画面解像度をエミュレートする。
ここから入手
10. Htmlのアウトライン構造: HTML5: Window Resizer
アウトライン構造が正しくできているかのチェック。
Web制作によく使うChromeのエクステンション にも紹介あり。
ここから入手
11. Alt/Meta 要素: Alt&Meta viewer
Alt, Metaタグを簡単に確認できる。
Web制作によく使うChromeのエクステンション にも紹介あり。
ここから入手
12. フォント: WhatFont
URL: http://chengyinliu.com/
ページで使用されているフォントを調べる。
ここから入手
13. 利用技術: Wappalyzer
URL: http://wappalyzer.com/
ウェブ技術を識別。どのようなウェブサイトがどのように構築されているかを示す技術プロファイラー。
「このサイト何の技術でできているんだろう？」が一発で解決できる機能を紹介 でも。
ここから入手
14. 網羅的に: Web Developer Checklist
URL: http://toptal.com
ベストプラクティスに違反していないかどうか分析する。
開発者がウェブサイトの問題点を簡単に発見するのに便利。
ここから入手
おわりに
自分のお庭、色々掃除していきたいなあ。
一連、なにかの参考になればさいわいです。