【2023年最新】Web制作会社が選ぶ、よく使うChromeの拡張機能。

Web制作会社が選ぶ、よく使うChromeの拡張機能

こんにちは! 1年目のあみです。
今回はこちらの記事の最新版としてChromeの拡張機能について調査しました!
「Chromeの”使える便利な拡張機能”。Web制作の現場便利ツールをご紹介。」

前回同様、ネクストページの社員に協力していただき、アンケートを行いました。
5年間でランキングに変化があったのか、ぜひ比較してみてください!

ネクストページ Google Chrome 拡張機能ランキング2023

第3位(4票)
なんと、3つの拡張機能が同率で第3位にランクイン!

Alt & Meta viewer
用途
画像に設定された Alt または Title 属性をツールチップで表示することができる。
ヘッダの Title、Meta 情報を一覧表示させることができる。
コメント

Altやdescriptionを確認する時に使います 。(ディレクター)

PerfectPixel by WellDoneCode (pixel perfect)
用途
Webサイトと画像を重ねることでピクセル単位の精度でWebサイトを確認できる。
コメント

コーディングCK時、自分の目で見ると何が正しいかわからない。デザント重ねてCKできるため、余白感や全体的なデザインの再現性をみれる! (ディレクター)
デザイン通りにコーディングされてるかチェック。(ディレクター)
コーディングのときも使うし、コーディングチェックのときも使います。(デザイナー)

FireShot
用途
Webサイトのスクリーンショットの撮影
コメント

現行の状態を確認しつつCOしたいときや、キャプチャからデザインするときにサイト全体を1枚の画像したりして使っています。(デザイナー)
キャプチャ撮るのに使っている。(ディレクター)

第2位(5票)
惜しくも第2位となった拡張機能は・・・ !

Check My Links
用途
Webサイト内のリンクやaltのチェック
コメント

リンク切れや、Altを確認できるから多用している。(ディレクター)
エラー箇所がパッと見て色でわかるので便利。(ディレクター)
リンク切れのチェックで使う。(エンジニア)

第1位(6票)
僅差の中、第1位を獲得した拡張機能はこちら!

GoFullPage
用途
Webサイトの画面キャプチャの撮影
コメント

キャプチャとりたいけど一画面に収まらないときに使います。(ディレクター)
画面全体のキャプチャをとる。仕様書を作成するとき、画面全体をとれるので便利。(ディレクター)
構成案や仕様書作成時に使用 。(ディレクター)
画面キャプチャをとるのに使っています。(デザイナー)

その他、おすすめChrome拡張機能

ランキングには入りませんでしたが、他にもたくさんのChromeの拡張機能があったので紹介します!

Wappalyzer
用途とコメント
閲覧サイトになんのCMSが入ってるかの確認。(ディレクター)

OneTab
用途とコメント
参考サイトをまとめるのに使っています。(デザイナー)
毎朝開くものをピン留めして、ワンタッチで開いたり、案件ごとの参考サイトをまとめている。(ディレクター)

Window Sizer
用途とコメント
ウィンドウサイズを保存してワンクリックでサイズ変更できる。(エンジニア)

Window Resizer
画面幅を指定できる、キャプチャを撮るときに同じサイズで統一できる。(ディレクター)

DevTools z-index
用途とコメント
ページ内でz-indexが指定されている要素を一覧で確認できる。(エンジニア)

The QR Code Extension
用途とコメント
QRコードを出して検証機で確認するのに使っています。(デザイナー)
サイトにアクセスできるQRコードを生成してくれる拡張機能です。 SPを実機で確認したいときに使います。(デザイナー)

EditThisCookie
用途とコメント
ブラウザのCookie情報を消すときに利用。(ディレクター)

Pasty
用途とコメント
サイト全体をざっくり見るときにたくさんのURLを一度に開く。(ディレクター)

Go Back With Backspace
用途とコメント
バックスペースキーで前のページに戻れるようにする 。(ディレクター)

WhatFont
用途とコメント
Webサイトのテキストをクリックしたらフォントの種類とサイズの詳細が表示される。(ディレクター)

Toggl Track
用途とコメント
作業時間の記録用。(エンジニア)

DeepL翻訳
用途とコメント
ライブラリの説明などを読む時に使う。テキストを一部だけ選択してすぐに翻訳できるのがいいです。(エンジニア)

1年目が利用するChrome拡張機能

同期の1年目にもアンケートを行いました!
ランキング上位の拡張機能はもちろんですが、他にもこんな拡張機能を利用しているようでした!
新人Web制作者の方はぜひ参考にしてみてください!

Tag Assistant Legacy (by Google)
用途とコメント
GAなどのタグが入っているかすぐに確認できる。

Session Buddy
用途とコメント
開いているタブをまとめて保存し、それをまた開くことができるため、普通のブックマークより早い。

difff
用途とコメント
テキストチェック、量がおおいとき便利。
※拡張機能ではないですがおすすめなので紹介しました!

まとめ

今回のアンケートを通して、知らなかった拡張機能を知ることができました。
5年前と比較して、ランキングに少し変化があったのも面白かったです!
効率的に仕事ができるようにいろんな拡張機能を利用していきたいです!