統計データマーケティングお役立ちレポート全てのカテゴリを見るferret記事をさがすプログラミングエンジニア必見!作業効率が格段に上がる無料のChrome拡張機能13選エンジニア必見!作業効率が格段に上がる無料のChrome拡張機能13選2018年05月24日プログラミング会員登録するGoogleChrome拡張機能は、ブラウザ上で手軽に追加できる便利なツールの一つとして多種多様な機能が存在し、あまりの多さに迷ってしまうほどです。弊社エンジニアの間でもChrome拡張機能は活用されていますので、その中から実際に使っているオススメ拡張機能を厳選してご紹介します。中には、エンジニアの方に限らず、Webサイトに携わる方であればインストールして欲しい拡張機能もありますので、ぜひ参考にしてみてください。※執筆時(2015年9月24日)時点では、どれも無料で使用することができます。エンジニアにオススメのChrome拡張機能まとめ1.YSlowhttps://chrome.google.com/webstore/detail/yslow/ninejjcohidippngpapiilnmkgllmakhWebサイトのパフォーマンス計測と問題点の発見を行うことができるChrome拡張機能です。総合評価として、該当のWebサイトのグレードとスコアが分かり、項目別にA〜Fで評価をしてくれます。グレードがAに、点数が100点に近ければ近いほど、パフォーマンスのよいWebサイトと評価されます。各項目では、改善すべき内容や改善の対象となるファイルが表示されます。どこにどれくらいの容量がかかっているのかの確認もできるので、サイトパフォーマンスの向上を考えている方にはオススメしたい拡張機能です。2.JSONViewhttps://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmcJSONデータを自動で整形してくれるChrome拡張機能です。JSONViewを入れておくだけで、改行やスペースなどで読みにくくなっているJSONデータを自動で整形してくれます。整形されたソースコードを見ると、該当部分はハイライトされ、分かりやすく表示されています。AnalyticsやAdWordsなどの計測タグの設置状況を調べることができるChrome拡張機能です。インストール後にURLバーの横に表示されるアイコンをクリックすると、設置状況を確認することができます。working」と表示されます。ここをクリックすると、詳細情報を確認することもできます。オプション機能も充実しており、全ページ検証、検証レベルの設定などが可能です。トラッキングコードや計測タグなどを設置した後やトラブルが起きた場合などにチェックする際に活用しましょう。pluginhttps://chrome.google.com/webstore/detail/adb/dpngiggdglpdnjdoaefidgiigpemgageパソコンのChrome上で、実機AndroidのリモートデバックができるChrome拡張機能です。パソコンとAndroid端末をUSB接続しておきます。Android端末でChromeを起動して、設定画面から「USBウェブデバック」をONにしておきます。ADB」をクリックすると、パソコン上でAndroid端末の動作状況を確認することが可能になります。Me」の略語で、コードやデザインのレビューなどでFacebookでいう「いいね」の意味で使用されます。このChrome拡張機能をインストールして、MarkDownが使用できるテキストボックスにフォーカスした状態で拡張ボタンをクリックすると、LGTMの画像を使用したい時にわざわざ自分で探さなくても表示してくれます。LGTMは特に、エンジニアの方の間で「文化」として扱われています。Chromeに保存されているクッキーを表示、編集することができるChrome拡張機能です。該当のWebサイトで、インストールするとURLバーの横に表示されるチョコチップクッキーのアイコンをクリックすると、値、ドメイン、パス、有効期限といったクッキーの詳細情報が表示され、編集可能になります。他にも、クッキーのインポートまたはエクスポート、検索、削除などを行うことができます。Chatworkhttps://chrome.google.com/webstore/detail/chat%20%20-for-chatwork/amhfnpimdfcdcpnchjionbddjjbmofnl情報共有サービス「Chatwork」をより便利にしてくれるChrome拡張機能です。FacebookやTwitter、Githubなどと同じようにToを送信することができます。ショートカットが豊富に用意されているので、マウスを使用せずに操作することも可能です。画像リンクの下には小さなサムネイルが表示されたり、コードがハイライトされたりするので、特にWebサイト制作に携わるエンジニアの方の情報共有ツールとして、オススメしたい拡張機能です。Eyedropperhttps://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolgカラーコードを手軽に調べることができるChrome拡張機能です。インストール後にURLバーの横に表示されるアイコンをクリックすると、動作が開始します。カラーコードが知りたい画像やロゴなどの上にマウスオンすると、カラーコードが表示されます。Webサイトで表示されている色はラスタ形式のため、カラーコードがドット単位で構成されています。そのため、なるべく色の濃い中心部分を調べると、正確なカラーコードを調べることができます。9.MesureIthttps://chrome.google.com/webstore/detail/measureit/pokhcahijjfkdccinalifdifljglhclm?hl=jaWebサイト上で画像やウィンドウのサイズを計測することができるChrome拡張機能です。インストール後にURLバーの横に表示されるアイコンをクリックすると、Webサイトの画面に白っぽいマスクがかかります。この状態で、サイズが知りたい場所を囲うと、縦幅と横幅がpx単位で表示されます。手軽にサイズ計測を行うことができるので、エンジニアの方以外でもインストールをオススメしたい拡張機能です。10.kimonohttps://chrome.google.com/webstore/detail/kimono/deoaddaobnieaecelinfdllcgdehimihWebサービスの中では、APIが提供されてないサービスがほとんどです。そのようなサービスをAPI化し、サイトの情報を取得することができるようにしてくれる「kimono」というサービスがあります。このサービスのChrome拡張版です。この拡張機能を利用すると、プログラミングをする際に少しでも効率よく行うことが可能になります。11.ウェブタイムマシンhttps://goo.gl/VIdbtV現在閲覧しているWebサイトの過去のサイトデザインを閲覧することができるChrome拡張機能です。インストール後に、該当するWebサイト上で右クリックをすると、ダイアログボックスに「過去ページ閲覧」というメニューが表示されます。この項目をクリックすると、いつに戻るかを選択するカレンダーが表示されるので、閲覧したい日付を選択します。すると指定した日付の日、Webサイトがどのようなサイトデザインだったのかを見ることができます。時代の流れとともに、Webサイトのサイトデザインがどのような変化を遂げているのかを遡ることができる面白い拡張機能です。Analyticshttps://chrome.google.com/webstore/detail/page-analytics-by-google/fnbdnhhicmebfgdgglcdacdapkcihcoh現在閲覧中のWebサイトのアクセス状況などを簡単に調べることができるChrome拡張機能です。Analyticsを開かなくても調べられるので非常に便利です。Analyticsにログインして該当のWebサイトを登録しておくことが必要です。使い方は、調べたいWebサイトを閲覧している状態で、URLバーの横に表示されるアイコンをクリックすると、ページ上部に各指標やWebページ内のクリック分析が記載されたスコアカードが表示されます。画面右上に表示されている、色のアイコンをクリックすると、ヒートマップのような表示に切り替えることも可能です。エンジニアの方だけではなく、ディレクターの方やメディアを運営されている方にオススメの拡張機能です。Capturehttps://chrome.google.com/webstore/detail/full-page-screen-capture/fdpohaocaechififmbbbbbknoalclaclWebページを丸ごとスクリーンショットすることができるChrome拡張機能です。現在ブラウザ枠で見えている部分だけではなく、表示されていない部分まで撮影することができます。インストール後にURLバーの横に表示されるカメラアイコンをクリックするだけで、撮影が可能です。撮影後の画像はpngで保存されます。まとめいかがだったでしょうか。どれもかゆいところに手が届くような拡張機能ばかりで、インストールしておくと作業効率が格段にあがるものばかりです。エンジニアの方に限らず、Webサイトに関わる方なら拡張機能のような便利ツールを最大限に活用すると作業効率もあがります。今回ご紹介した拡張機能は、どれも弊社のエンジニア陣が自信を持ってオススメする珠玉の13選です。参考にしてみてください。このニュースを読んだあなたにオススメ【ライター必見】記事を書くときに便利なクロームの拡張機能15選ブラウザ上で簡単に競合調査ができるオススメのChrome拡張機能10選このニュースに関連するカリキュラムホームページを強化するタグ貼り付けをマスターしようfacebookのソーシャルボタン、Googleアナリティクスのトラッキングコード、AdWordsのコンバージョンタグ・・・など、Web担当者はいろいろなタグを貼り付けなくてはなりません。タグ管理が重要業務です。GoogleGoogleとは、世界最大の検索エンジンであるGoogleを展開する米国の企業です。1998年に創業され急激に成長しました。その検索エンジンであるGoogleは、現在日本でも展開していて、日本のYahoo!Japanにも検索結果のデータを提供するなど、検索市場において圧倒的な地位を築いています。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るGoogleGoogleとは、世界最大の検索エンジンであるGoogleを展開する米国の企業です。1998年に創業され急激に成長しました。その検索エンジンであるGoogleは、現在日本でも展開していて、日本のYahoo!Japanにも検索結果のデータを提供するなど、検索市場において圧倒的な地位を築いています。詳しく見るタグタグとは、原義では「モノを分類するために付ける小さな札」のことです。英語の「tag」を意味するものであり、荷札、付箋といった意味を持っています。インターネットに関する用語としてのタグは、本文以外の情報を付与するときに用いられます。Locator」の略称です。情報がどこにあるのかを示すインターネット上の住所のようなものだと考えるとわかりやすいでしょう。各ページのURLは、インターネットブラウザの上部に文字列として表示されています。いう名称がついていますが、実際には日本でもURLという語が使われています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るタグタグとは、原義では「モノを分類するために付ける小さな札」のことです。英語の「tag」を意味するものであり、荷札、付箋といった意味を持っています。インターネットに関する用語としてのタグは、本文以外の情報を付与するときに用いられます。OSとはスマートフォン用に開発された基本ソフト(OS)の一種です。米国Google社が中心となり開発されました。OSとはスマートフォン用に開発された基本ソフト(OS)の一種です。米国Google社が中心となり開発されました。OSとはスマートフォン用に開発された基本ソフト(OS)の一種です。米国Google社が中心となり開発されました。Locator」の略称です。情報がどこにあるのかを示すインターネット上の住所のようなものだと考えるとわかりやすいでしょう。各ページのURLは、インターネットブラウザの上部に文字列として表示されています。いう名称がついていますが、実際には日本でもURLという語が使われています。OSとはスマートフォン用に開発された基本ソフト(OS)の一種です。米国Google社が中心となり開発されました。詳しく見るテキストテキストとは、純粋に文字のみで構成されるデータのことをいいます。太字や斜線などの修飾情報や、埋め込まれた画像などの文字以外のデータが表現することはできませんが、テキストのみで構成されたテキストファイルであれば、どのような機種のコンピューターでも共通して利用することができます。詳しく見るGoogleGoogleとは、世界最大の検索エンジンであるGoogleを展開する米国の企業です。1998年に創業され急激に成長しました。その検索エンジンであるGoogleは、現在日本でも展開していて、日本のYahoo!Japanにも検索結果のデータを提供するなど、検索市場において圧倒的な地位を築いています。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。Locator」の略称です。情報がどこにあるのかを示すインターネット上の住所のようなものだと考えるとわかりやすいでしょう。各ページのURLは、インターネットブラウザの上部に文字列として表示されています。いう名称がついていますが、実際には日本でもURLという語が使われています。詳しく見るドメインドメインとは、インターネット上で利用可能なホームページやメールなどを識別するときの絶対唯一の綴りを言います。電話番号や自動車ナンバーが同一のものがないのと同様に、インタネットにおいても、2つとして同じドメインは存在できない、といった唯一無二の綴りです。詳しく見るTwitterTwitterとは140文字以内の短文でコミュニケーションを取り合うコミュニティサービスです。そもそもTwitterとは、「小鳥のさえずり」を意味する単語ですが、同時に「ぺちゃくちゃと喋る」、「口数多く早口で話す」などの意味もあります。この意味のように、Twitterは利用者が思いついたことをたくさん話すことのできるサービスです。詳しく見るリンクリンクとは、インターネット上では、あるページの中に記された、他のページの所在を表す情報のことを「ハイパーリンク」と呼び、これを略した言葉です。リンクのある場所をクリックすると、他のページにジャンプするようになっています。詳しく見るサムネイルサムネイルとは、多数の画像や動画など、読み込みに時間のかかる情報の概要をおおまかに把握するために作られた縮小画像のことです。一般的にはサイズ・画質が落とされた画像が採用され、該当の画像や動画を読み込むかどうかを判断するための「見本」として使われます。nail)という意味を持つ言葉で「サムネ」と略して呼ばれることもあります。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。Locator」の略称です。情報がどこにあるのかを示すインターネット上の住所のようなものだと考えるとわかりやすいでしょう。各ページのURLは、インターネットブラウザの上部に文字列として表示されています。いう名称がついていますが、実際には日本でもURLという語が使われています。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。Locator」の略称です。情報がどこにあるのかを示すインターネット上の住所のようなものだと考えるとわかりやすいでしょう。各ページのURLは、インターネットブラウザの上部に文字列として表示されています。いう名称がついていますが、実際には日本でもURLという語が使われています。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るGoogleGoogleとは、世界最大の検索エンジンであるGoogleを展開する米国の企業です。1998年に創業され急激に成長しました。その検索エンジンであるGoogleは、現在日本でも展開していて、日本のYahoo!Japanにも検索結果のデータを提供するなど、検索市場において圧倒的な地位を築いています。詳しく見るGoogleGoogleとは、世界最大の検索エンジンであるGoogleを展開する米国の企業です。1998年に創業され急激に成長しました。その検索エンジンであるGoogleは、現在日本でも展開していて、日本のYahoo!Japanにも検索結果のデータを提供するなど、検索市場において圧倒的な地位を築いています。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。Locator」の略称です。情報がどこにあるのかを示すインターネット上の住所のようなものだと考えるとわかりやすいでしょう。各ページのURLは、インターネットブラウザの上部に文字列として表示されています。いう名称がついていますが、実際には日本でもURLという語が使われています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るヒートマップヒートマップとは、ウェブマーケティングにおけるヒートマップとは、ホームページ内でのユーザーのアクションの大小を、サーモグラフィーのように表示する機能です。ユーザーがどこを一番見ているのか、マウスの動きやスクロールなどから解析し、それを色によって表します。「クリックヒートマップ」「マウスヒートマップ」「スクロールヒートマップ」「ルッキングヒートマップ」などの種類があります。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。Locator」の略称です。情報がどこにあるのかを示すインターネット上の住所のようなものだと考えるとわかりやすいでしょう。各ページのURLは、インターネットブラウザの上部に文字列として表示されています。いう名称がついていますが、実際には日本でもURLという語が使われています。詳しく見るWebサイトWebサイトとは、インターネットの標準的な情報提供システムであるWWW(ワールドワイドウェブ)で公開される、Webページ(インターネット上にある1ページ1ページ)の集まりのことです。「Pardotユーザー会」が国内最大級のMAユーザー会へと成長した理由マーケティングオートメーション(MA)ADグロースハックソフトバンクグループのサイバー大学がチャットコマース「ジールス」を導入。ノーリスクでリード獲得件数を増加させた3つの施策とはグロースハックADマーケティングオートメーション(MA)「Pardotユーザー会」参加者が、Pardot創業者と語る。参加者同士の“深い”つながりから生まれる価値とはマーケティングオートメーション(MA)BtoBマーケティングのノウハウ資料をダウンロード!基礎から4ステップで実践まで!BtoBマーケティング実践ガイド(無料)BtoBマーケティング実践ガイドは、BtoB事業のマーケティングのノウハウを網羅的かつ体系的にまとめたものです。基礎から応用まで4つのステップでマーケティングが実践できるBtoBマーケターの永久保存版です。株式会社SoLabo「0→1」「1→10」がどちらも叶う。株式会社ベーシック【求人】サービス価値を高め市場を創造。ferret編集部卒業後は、沖縄にてフリーランサーとして子育てをしながらWeb関連業務のなんでも屋さんをしています。【2019年版】無料で使える画像編集ソフト・GIMP(ギンプ、ジンプ)の使い方ADWebサイト制作でよくある失敗例5選。PIECE』を超える異例の売上。【2019年版】無料で使える画像編集ソフト・GIMP(ギンプ、ジンプ)の使い方ADWebサイト制作でよくある失敗例5選。PIECE』を超える異例の売上。『鬼滅の刃』が大ヒットした理由ケーススタディで学ぶ。人気記事をもれなくチェックSNSで話題!BtoBビジネスで勝てるマーティングのノウハウを1冊の資料にまとめました。