Web制作に便利なChrome拡張
PerfectPixel by WellDoneCode
言わずと知れたピクセルパーフェクトな実装を補助してくれるコーダー必携拡張。
ダウンロード・画像引用元
Favicon Detector
ユーザーが見ているのはサイトのタイトルではない、Faviconだ!(言い過ぎ)
というわけでこれを入れておくとそのサイトのFaviconのセットを一覧することができます。
ダウンロードも可。
なおNetflixのFaviconは大変潔く理にかなってて好き😇
ダウンロード・画像引用元
fonts infos
ページのフォントの情報をチェックできる。
フォントサイズの確認などに威力を発揮😇
確認できる項目は以下。画面上にレイヤーで表示してくれる。
- font Weight
- font Size
- font Family
- font Style
- font Color
- line height
- letter spacing
- text transform
- text decoration
ダウンロード
Lighthouse
Webサイトのパフォーマンス改善のヒントに。
開発者ツールにも入っている Lighthouse だけど、拡張版は専用のページに出力してくれるため見やすい。
そしてChromeのコンテキストメニューの「日本語に翻訳」が使えるのも魅力💚
ダウンロード
Wappalyzer
みんな大好き Wappalyzer!
任意のWebサイトに使われてる技術をチェックできます。
へ〜こんなのあるんだ〜などの発見に。楽しい。
あと例えば「Javascriptフレームワーク」のリンクからサイトに飛ぶと、
マーケットシェアとかも見れてなお楽しいです😇 React.js と Backbone.js が強いですネ〜
おすすめ!
ダウンロード
Workona Tab Manager
これは絶対に入れたほうがいいです。絶対にだ。
- タブが大量に増えて1タブ5mmくらいになってるあなた。
- タブの中に複数の案件用のページが混ざってしまうあなた。
- タブの中にAmazonのタブとかあって気が散ってしまうあなた。
- ブックマーク機能じゃちょっと不便かなと思ってるあなた。
そんなあなたにおすすめです。
生産性が5倍くらい上がります(当社比)。
私はこれで、案件ごとにワークスペース(タブのセット)を作ってその時々で切り替えて使ってます😇
住んだ案件はしばらくアーカイブして取っておく。
詳しくはインストールしてください。
ダウンロード
Octotree
Githubの使いやすさが向上するChrome拡張。
特に「IDE-like」なファイルツリーがどこでも使えて便利😇
そしてファイル検索、あとはダークモード。
これに加えてpro版ではマルチタブやコードレビュー用の機能、コードのフォント変更など
色々あるのでぜひお試しあれ〜(無料お試し期間あり)
#ダウンロード