ITエンジニア/デザイナ向けにオープンソースを毎日紹介

技術 - ブックマークレットの記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2017/02/26

GetPageTitleAndURL - 複数パターンでタイトルとURLをコピー

WebブラウザではURLのコピーは簡単でも、タイトルのコピーは意外と面倒だったりします。HTMLソースからコピーするのは面倒ですし、ブックマークレットを実行する方が多いかと思います。そんなURLとタイトルのコピーを手軽に、かつ複数のフォーマットに対応させたのがGetPageTitleAndURLです。## GetPag...

List

  • 2016/08/20

notepadlet - ブックマークレットとして動作するメモ帳

メモは常に近くにあると便利です。何か思いついたとしてもメモを探しているようでは忘れてしまうでしょう。さらにメモに時間をかけていると元々の作業の集中力が切れてしまいます。思いついたらささっとメモして元の作業に戻れる早さが必要です。今回はnotepadletを紹介します。1ファイルもない、ブックマークとして動作するメモ帳で...

List

  • 2016/01/12

jetzt - 英文速読を補助するブックマークレット

少し昔に流行った英語の速読術があります。目の前で高速で入れ替わる英単語を視界全体でぼんやりと捉えつつ、中央の赤い文字に注意を払って見るというものです。確かにこの方法を使うと長い英文も素早く見ることができます。もし英文の長い記事を読もうと思った時にはjetztを使ってみましょう。英語速読術をWebブラウザ上で使えるように...

List

  • 2015/10/06

tota11y - Webサイトのアクセシビリティをチェックできるブックマークレット

インターネットがインフラになっていくのに合わせて大事になっているのがアクセシビリティです。つまり色遣いであったり、スクリーンリーダーに合わせたテキスト情報など誰にとっても使いやすいサイトであることを意識しなければなりません。そんなアクセシビリティチェックをブックマークレット形式で提供してくれるのがtota11yです。#...

List

  • 2015/08/27

Toggle css bookmarklet – スタイルシートがない状態を確認できるブックマークレット

SEOはまず文書構造を考える必要があります。スタイルシートで表示はカスタマイズできますが、それはクローラーには理解できませんし、スクリーンリーダーのようなアクセシビリティを考える際にも文書構造はとても大事です。そこでWebサイトがスタイルシートを解除するとどう見えるのか、それを体験できるのがToggle css boo...

List

  • 2015/06/16

Yet Another Kindle Cloud Downloader – Kindleのコンテンツをダウンロードできるブックマークレット

Kindleで電子書籍を購入する人は多いと思います。対してデバイスとしてのKindleはそれなりに便利そうに見えるのですが、画面の大きさが今ひとつだったり、発色の具合もあって個人的にはiPad miniで読むようになってしまいました。そんなKindleで購入した書籍を標準のKindleよりも大画面なKindle DXで...

List

  • 2015/05/24

Performance-Analyser - Webサイトパフォーマンスをレポートするブックマークレット

Webサイトのパフォーマンスは高いに越したことはありません。遅いサイトはあっという間に訪問者から離れられてしまいます。また、最初はパフォーマンスが高かったのに、更新を繰り返す度に徐々にパフォーマンスが劣化していくというのもよくあることです。だからこそ定期的にパフォーマンスチェックを行わなければいけません。そのためのツー...

List

  • 2015/04/03

Responsive Design Bookmarklet - レスポンシブデザインの確認ができるブックマークレット

レスポンシブデザインでWebサイトを作った場合の問題点と言えばそのデザインの確認です。単純な方法としてはウィンドウ幅を変えるというのがありますが都度変更するのは面倒です。またGoogle ChromeであればDevToolsを使って幅を選択することもできますが、多様な機種が登録されている中での選択は逆に面倒だったりしま...

List

  • 2014/05/04

Dear sir or madam – 犯罪に使える(!?)文章を生成

悪用厳禁(まぁやらないと思いますが)!もしあなたが誘拐犯だとして、被害者家族に対して身代金を要求したいと思ったり、犯罪予告状を送りたいと思ったとしましょう(どんな状況かと小一時間ry)。日本ではそんな時、昔から新聞や雑誌を切り抜いて手紙を作るというのが一般的(!)です。しかしコンピュータが普及した現在、そんな手間は不要...

List

  • 2014/03/13

Squirt - ブックマークレットで手軽にスピードリーディングをはじめよう!

なんとなく最近海外で流行っているのスピードリーディング。意外とちゃんと頭に入ってくるので不思議です。むしろ単語を全て完璧に追いかけなくなるので、雰囲気として文章の概要を掴んだり、notやnoなどの否定を意識することで全体の理解が進むようになります。そんなスピードリーディングをWebサービスとして提供するのがSquirt...

List

  • 2014/03/07

OpenSpritz - 英語版速読、Spritzをブックマークレットで体験

Spritzというリーディング技術があります。いわゆる速読なのですが、視線を動かさずに文字を表示させていく事で眼球を動かさずに文字を理解していくというものです。日本語ではなく、英語圏で使われているようです。そんなSpritzをWebページで体感できるブックマークレットがOpenSpritzです。## OpenSprit...

List

  • 2014/02/18

Google Plus +1 & Share to Stream Bookmarklets - 任意のWebサイトにGoogle+ボタンを表示するブックマークレット

Facebook/Twitterに比べて今ひとつ伸びがないGoogle+ですが、そのせいでWebサイトにGoogle+用のボタンを置いていないサイトも多いです(MOONGIFTもそうですが…)。そんなサイトでも+ボタンを押したい、そう考える人もいるでしょう。そこで使ってみて欲しいのがGoogle Plus +1 & S...

List

  • 2014/02/05

AppHtml/AppHtmlWeb - iOSアプリストア向けのアフィリエイトリンクを簡単作成

PHGにも対応していますのでどんどん紹介できますね!iOSアプリがここ数年で一気に広まったのには間違いなくアフィリエイトの力が大きかったと感じています。アプリを紹介するブログ、メディアも多数立ち上がり、アプリをメディアで紹介してもらうのは人気を集めるのに必須となっています。紹介する側としてもアフィリエイトで得られる収益...

List

  • 2013/08/26

アクセシビリティチェックに。色覚異常を再現する「ColorScope.js」

ColorScope.jsはJavaScript製のオープンソース・ソフトウェア(MIT License)です。インターネットの裾野が広がるのに合わせてWebページのアクセシビリティは大事な要件になってきました。今回は色覚異常を再現するブックマークレットColorScope.jsを紹介します。ブックマークレットを実行す...

List

  • 2013/08/01

Webブラウザ上でタイポグラフィをコントロール「kern.js」

kern.jsはJavaScript製、WTFPLのソフトウェアです。Webページ上にある文字が大きさを変えたり、配置を変更したらどう効果的になるか。それをWebブラウザ上で試せるのがkern.jsです。色々試すと、思いもしなかったインパクトあるデザインができるかも知れません。デモです。テキストの場所を変えたり、文字を...

List

  • 2013/02/28

Webページの印刷時に。QRコードを表示するブックマークレット「Inky-Linky」

Inky-LinkyはWebページのリンクの横にQRコードを表示するブックマークレットです。Webページを印刷した際に、その元URLを開こうと思うと検索したり、印刷されたページの下にあるURLを手打ちしたりしないといけません。その労力をちょっとだけ解消してくれるのがInky-Linkyです。実行した例です。リンクが多い...

List

  • 2013/01/04

Webサイトをもっと万人に対してアクセスしやすくするために「HTML_CodeSniffer」

HTML_CodeSnifferはウェブアクセシビリティ改善のためのブックマークレットです。Webは限られた人たちのものではなく万人向けのものであるべきです。そこで考えられるべき項目として障害のある人に対するアクセシビリティです。そのチェックに使えるブックマークレットがHTML_CodeSnifferです。実行すると右...

List

  • 2012/10/29

CSS3の設定を外すとどう見えるかをチェックできるブックマークレット「deCSS3」

deCSS3はCSS3のプロパティを解除してCSS3非対応Webブラウザの表示を確認できるブックマークレットです。最近のモダンなWebブラウザは大抵CSS3に対応しています。格好いいイフェクトを実現するのも容易ですが、レガシーなWebブラウザでの表示をつい怠ってしまいがちです。そこでCSS3の設定を外してくれるdeCS...

43680?type=list&url=http%3a%2f%2fwww.moongift.jp%2fwp-content%2fuploads%2f2012%2f10%2fscreenshot-2012-10-11-20.21.46_thumb

  • 2012/10/23

ウィンドウサイズをリアルタイムモニタリング「FitWeird」

FitWeirdはウィンドウサイズをピクセス、em単位で表示するブックマークレットです。Webデザインを行う際に画面上に物差しを表示したりツールもありますが、今回はもっとシンプルなFitWeirdを紹介します。ウィンドウサイズが今いくつであるか、リアルタイムに表示してくれます。ブックマークレットを実行しました。右下にウ...

40149?type=list&url=http%3a%2f%2fwww.moongift.jp%2fwp-content%2fuploads%2f2012%2f06%2fscreenshot-2012-06-25-13.08.31_thumb

  • 2012/07/04

ああ素晴らしき才能の無駄遣いよ。Gistをスライドに変身!「GistDeck」

GistDeckはGistをスライドに変身させるブックマークレットです。プログラマーがちょっとしたコードを共有したりするのに便利なのがGitHubのGistです。そんなGistの新しい使い方、なんとスライドに変身させてしまうのがGistDeckです。使い方です。ブックマークレットをコピーするだけで準備は完了です。スライ...