Chromeで使える便利なブックマークレット4選

おすすめ・紹介

Chromeを使っていて「もう少し作業を効率化できないかな？」と感じたことはありませんか？
実は、ブックマークレットを使うだけで、普段のブラウジングが驚くほど快適になります。

この記事では、すぐ使える便利なブックマークレットを厳選して紹介します。
特別な知識は不要なので、ぜひ最後までチェックしてみてください。

ブックマークレットとは？

ブックマークレットとは、JavaScriptで書かれた簡単なプログラムをブックマークとして登録し、クリックするだけで実行できる仕組みです。

通常の拡張機能とは違い、以下のような特徴があります。

  • インストール不要
  • Chrome以外のブラウザでも使える場合が多い
  • 必要なときだけ実行できる

基本的には、ブックマークのURL欄にコードを貼り付けるだけで利用できます。

ブックマークレットでできること

ブックマークレットを使うと、Chromeの使い勝手が一段階アップします。
例えば、以下のようなことがワンクリックで完結します。

  • 開いているページを外部ツールで即チェック
  • ページ構造やデザインの確認
  • 翻訳や調査作業の時短
  • Web制作・情報収集の効率化

難しい操作は一切不要なので、初心者でも安心です。

Chromeで使える便利なブックマークレット4選

ここからは、実際に使えるおすすめブックマークレットを紹介します。
すべて「登録してクリックするだけ」で使えます。

開いているページを PageSpeed Insights で計測する

javascript:(function(l){q=l.href;if(q)window.open('https://developers.google.com/speed/pagespeed/insights/?hl=ja&url=%27+encodeURIComponent(q),%27_blank%27);})(location);

今見ているページを、Google公式のPageSpeed Insightsで即座に計測できます。
URLをコピペする手間がなくなり、非常に便利です。

ページ内の要素にアウトラインを付与する

javascript:var styleTag%3Ddocument.createElement('style')%3BstyleTag.innerText%3D'*%7Boutline%3A 1px solid red%3B%7D'%3Bdocument.getElementsByTagName('head')%5B0%5D.insertAdjacentElement('beforeend'%2CstyleTag)%3Bvoid(0);

ページ内のすべての要素に赤いアウトラインを表示します。
Web制作に詳しくなくても、視覚的に理解しやすいのが特徴です。

選択した文字をDeepLで翻訳する

javascript:(function(){str=window.getSelection()+'';if(!str){alert("テキストが選択されていません");}else{window.open('https://www.deepl.com/translator#en/ja/'+str);}})();

翻訳したい文字を選択してクリックするだけで、DeepL翻訳が自動で開きます。
コピー＆ペーストの手間がなくなり、調べ物がかなり楽になります。

サイトのOGP情報を確認する

javascript:window.open('https://rakko.tools/tools/9/?url=%27+location.href+%27&utm_source=bookmarklet%27)

表示中のページのOGP（タイトル・説明・画像など）を一括で確認できます。
一般ユーザーでも使う場面は意外と多いブックマークレットです。

まとめ

ブックマークレットは、Chromeをより快適に使うためのシンプルで強力なツールです。

まずは気になるものを1つ登録して、日常のブラウジングに取り入れてみてください。
きっと「もっと早く使えばよかった」と感じるはずです。

NAMEKO.ONLINE では、Web開発初学者向けのコンテンツを発信しております！
ぜひ、多くの方にシェアいただけますと嬉しいです！

コメント

タイトルとURLをコピーしました