Cool Bookmarklets

ブラウザをより便利に利用できるようになるブックマークレットの紹介です。ブックマークレットとは、ブラウザのブックマークに登録しておき、特定のWebサイト上でクリックすることで利用できるプログラムです。例えば見ているWebサイトを素早くSNSでシェアしたり、URLをコピーしたりできます。Chrome拡張機能と違ってメモリを専有したりせず、気軽に利用できます。ブックマークバー上にフォルダを作ってまとめておくと、たくさん登録しても邪魔になりません。

使い方

  1. 利用したいブックマークレットのボタンをブラウザのブックマークバーにドラッグ・アンド・ドロップして、ブックマークとして登録しておきます。
  2. 対象となるWebサイトを開き、そのサイト上で登録しておいたブックマークレットをクリックします。

本ページ内で直接公開しているものは私が作成したブックマークレットです。SNSでのシェアなどは公式や外部の方が作られたものなどいろいろありますが、再配布を禁止しているところもあるので外部リンクで紹介しておきます。

最終更新: 2017/6/21

サイトのタイトルをコピー

開いているWebサイトのタイトル( titleタグに指定されているテキスト )をクリップボードにコピーします。通常サイトのタイトルはソースを確認しないとコピーできないので、地味に便利です。

copy title
このボタンをブックマークバーにドラッグします

URLをHTML形式でコピー

開いているWebサイトのURLとタイトルを、HTMLのaタグ形式でクリップボードにコピーします。

copy html link
このボタンをブックマークバーにドラッグします

URLをMarkdown形式でコピー

開いているWebサイトのURLを、Markdwonのリンク形式でクリップボードにコピーします。

copy md link
このボタンをブックマークバーにドラッグします

Google検索の期間指定

Google検索の結果ページで実行すると、対象のサイトを3年間以内のものに限定します。

search in 3years
このボタンをブックマークバーにドラッグします

サイトをGoogle翻訳

日本語以外のWebページで実行すると、対象のサイトをGoogle翻訳で日本語に翻訳します。

translate JP
このボタンをブックマークバーにドラッグします

サイト内(ドメイン内)検索

対象となるWebサイト全体の中(ドメイン内)でテキスト検索します。よくあるブックマークレットですが、挙動が微妙なものばかりなので自作しました。

search in domain
このボタンをブックマークバーにドラッグします

スマホファーストビューチェッカー

スマホで見た時にファーストビューがどのような表示になるか、ブラウザの枠付きで確認できます。とりあえずiPhone7だけ対応です。

first-view
このボタンをブックマークバーにドラッグします

説明

事前にChromeのモバイルプレビューモードをONにします(⌘⌥I→⌘⇧M)。iPhone7を選択します。

クトゥルフ神話TRPG用ブックマークレット

かなりニッチなブックマークレットです。自分用に作成しました。クトゥルフ神話TPRGでキャラクターシートを作成する際に便利です。

CoC Dice Roller
このボタンをブックマークバーにドラッグします

説明

キャラシ作成サイトクトゥルフPC 作成ツールをより便利に使用できるブックマークレットです。

する機能を追加します。

使い方

  1. クトゥルフPC 作成ツールにアクセスします。
  2. 事前に登録しておいたこのブックマークレット ( 保存したブックマーク ) をクリックします。
  3. ページの上部にボタンが2つ出現します。

DiceRoll ボタン

キャラクターシート出力

Twitterでシェア

現在開いているページをTwitterでつぶやきます。Twitter公式のブックマークレットです。

source:  Share Bookmarklet — Twitter Developers

ただし、公式そのままだとhttpsのサイトでうまく動作しないため、以下のサイトで紹介されているものを利用することをおすすめします。

source:  Twitterの共有ブックマークレットをHTTPSなサイトでも使えるように: DNAが支配する世界

Facebookでシェア

現在開いているページをFacebookにシェアします。Facebook公式のブックマークレットです。

source:  ブックマークレットを共有する

Google+でシェア

現在開いているページをGoogle+でシェアします。Google公式のブックマークレットです。

source:  Share  |  Google+ Platform for Web  |  Google Developers

はてなブックマークに登録

現在開いているページをはてブします。はてな公式のブックマークレットです。(確認にはログインが必要です。)

source:  はてなブックマーク - はてなブックマークをはじめる (セットアップ)

Tumblrでシェア

現在開いているページをTumblrにシェアします。Tumblr公式のブックマークレットです。

source:  アプリ | Tumblr

Pocketに保存

現在開いているページをPocketに保存します。Pocket公式のブックマークレットです。

source:  Pocket: 保存方法

Feedlyに登録

現在開いているページのRSSをFeedlyに登録するためのページを開きます。Feedly以外の利用者のためのブックマークレットもあります。

source:  ニュースリーダー『Feedly』の新規登録などのブックマークレットまとめ | 代助のブログ

Pinterestに画像をピンする

現在開いているページの画像を選択してピンできます。Pinterest公式では公開が終了していますが、こちらに登録の説明があります。

source:  How to recreate your long-lost Pinterest bookmarklet.

テンプレートからGmailを作成 / ページをGmailで共有

事前にテンプレートを設定でき、実行するとすぐにその形からメールを作成できる。もうひとつは、在開いているページのタイトル・URLを本文に含めてメール作成できる。かなり古いブックマークレットですが問題無く動きます。

source:  Gmailテンプレート :: ブックマークレット source:  Gmailで送信 :: ブックマークレット

YouTubeを保存する

YouTubeの動画をmp3(音声)、mp4(動画)で保存できるサービス"Offliberty"が提供するブックマークレットです。YouTubeで動画を開き実行すると、開いている動画を変換してくれます。

source:  Offliberty - evidence of offline life

次/前のページへ

URL中の数字を増加する、つまり複数あるページの次/前のページへ移動できるブックマークレットです。

source:  Miscellaneous Bookmarklets

ページの読み込み速度を計測する

開発者向けツール。実行すると開いているページの読み込み速度を計測します。ブックマークレットはページの一番下にあります。

source:  justice

ページのHTMLチェック

開発者向けツール。HTMLが正しい文法・規約に沿って記述されているかとアクセシビリティのチェックし、レポートを出力してくれる。

source:  HTML_CodeSniffer

Webページで使われているフォントを調べる

開発者向けツール。選択文字のフォント指定を表示できる。少し重い。Chromeブラウザのデフォルト機能でも同じようなことは可能だが、より気軽に利用できる。

source:  WhatFont Tool - The easiest way to inspect fonts in webpages « Chengyin Liu

ページのレスポンシブチェック

開発者向けツール。Webページを他のデバイスで表示したときどのように表示されるかチェックできる。少し重い。Chromeブラウザのデフォルト機能でも同じようなことは可能だが、より気軽に利用できる。

source:  Responsive design testing tool – Viewport Resizer – Emulate various screen resolutions - Best developer device testing toolbar

ページにグリッドを表示

開発者向けツール。Webページにグリッドを重ねて表示してくれる。グリッドは自由に設定できる。

source:  Allan Jardine | Reflections | Design

Webページをシューティングゲームで破壊する

すばらしいクソブックマークレットです。表示しているWebページ上でシューティングゲームができます。

source:  Kick Ass - Destroy the web