リンクもまるごとキャプチャしてSVGで出力するChromeスクリーンショット拡張をつくりました - #daiizメモ
閲覧しているウェブサイトの選択された範囲のスクリーンショットを撮ってSVG形式でダウンロードできるChrome拡張機能をつくりました．SVGで出力しているため，普通のPNGやJPGと比べると，以下のような少しだけ高度なことができます． スクリーンショットを撮ったページのURLを<svg>のdata属性として保持できる スクリーンショットの範囲内のリンクをそのまま残すことができる． ページ中の<a>の位置に，外部ページヘのリンクを持つ<rect>を挿入しています．クリックするとリンク先のページが開きます． ブラウザで通常リンクと同じように扱われるため，rectをホバーするとChromeの左下にジャンプしようとしているURLが表示されるので，移動先もしっかり確認できます． まだかなり荒いベータ版ですが，GitHubで公開しています．クローンして，そのままChromeの拡張機能管理ページから読み
DevTools Extensions For Web App Developers
March 26, 2013 The past year has seen many leaps made to improve developer productivity through better tooling. We're paying increasing attention to our workflow and many of us have spent time optimising our usage of tools like Grunt, Bower, Yeoman and the terminal. Another important area worth spending time on is your debugging workflow - if you're like me, this starts with the Chrome DevTools. W
Dimensions Browser Extension
Images & HTML Elements Measure between the following elements: images, input-fields, buttons, videos, gifs, text, icons. You can measure everything you see in the browser. Mockups Your designer handed you mockups as PNGs or JPEGs? Just drop them into Chrome, activate Dimensions and start measuring. Keyboard Shortcut For the best experience set a keyboard shortcut in the chrome setting at the end o
モバイルWeb開発に役立つ！Chrome DevToolsの新機能「デバイスモード」
モバイルWeb開発に役立つ！Chrome DevToolsの新機能「デバイスモード」 Tomomi Imura（Slack） 今回のGoogle I/OはAndroidに特化していた傾向が強く、WebテクノロジーやChromeの扱いが比較的小さかったせいもあり、多くのWebフロントエンドディベロッパーは不満を感じた部分もありました。 そこでその中の数少ないChromeのセッションの中から、私が興味深く感じたクロスデバイス開発にはこの先欠かせなくなると思われる Chrome DevToolsの新機能についてレポートします。 このセッションを行ったPaul Bakaus氏（以下、ポール氏）は、かつてjQuery UIやAvesゲームエンジンを開発したことでも知られています。一時期日本に在住していたこともあるので、この記事を読んでいる皆さんには既になじみのある方かもしれません。現在はGoogle
Hit-a-HintのためのChrome拡張機能を作った - @slaypniのまとめも
Chrome ウェブストア - Moly HaH キーボードの入力でリンクに飛べるHit-a-Hintを実現するためのChrome Extensionを作った。 Hit-a-Hint (HaH)とは、特定のキーを叩くと各リンク上にヒントとなる文字列が表示され、その文字列を入力するとリンクに飛べる機能。 画像は、ヒントを表示させた時のもの（初期設定では"E"に割当て）。 実のところ、すでにChrome WebStoreには同様の機能を実現する拡張機能がいくつか存在している。 しかし、FireFoxのKeysnailアドオンのHoKプラグインによるHaHの快適さに敵うものは、探してみても見つからない。 というわけで、このMoly HaHを自作した。 もっとも、この拡張機能を利用するような場合、大抵はVichromeやKeyconfigなどの一般的なキーバインド拡張機能と一緒に使うことになると思
Chrome Gitlab Notifierを作りました - くりにっき
会社でGitlabを使ってるのですが、通知がメールしかないのが不便だったのでchromeの拡張として作りました。 1ヶ月くらい仕事で試用してだいぶこなれてきたので勢いで公開。*1 ダウンロード: https://chrome.google.com/webstore/detail/chrome-gitlab-notifier/eageapgbnjicdjjihgclpclilenjbobi ↑がリンク切れだったら https://chrome.google.com/webstore/search/Chrome%20Gitlab%20Notifier で リポジトリ: https://github.com/sue445/chrome-gitlab-notifier 公開して気づいたのですが、スクリーンショットがないとどんなツールかさっぱり分からないので何か追加します。。。 GitlabのAPI
Tutorial: Migrate to Manifest V2 | Chrome for Developers
Manifest version 1 was deprecated in Chrome 18, and support will be phased out according to the manifest version 1 support schedule. The changes from version 1 to version 2 fall under two broad categories: API changes and Security changes. This document provides checklists for migrating your Chrome extensions from manifest version 1 to version 2, followed by more detailed summaries of what these c
Google Chrome Extensions Manifest Version 2 対応メモ
さてそろそろ Pediator の辞書でも最新化しますかねと思い、 Wikipedia からタイトルリストを取得してごにょごにょやっていると、何だかちゃんと動かない。 あれー Chrome の仕様が変わったんかいなと思って調べてみると、いつの間にか Google Chrome Extension の Manifest Version 2 なるものが出ていました。え、いつの間に？ そんなアナウンスあったっけなーとメールボックスを漁ってみると、2012/07/04 に来てました。orz Manifest_Version 1: Manifest Version 1 has been deprecated since Chrome 18, and when Chrome 21 hits stable in mid-August the Chrome Web Store will no longer
ニートなプログラマが世界を変える: Vichrome : vim風インタフェースを実現するChrome Extension
2011/09/28 Vichrome : vim風インタフェースを実現するChrome Extension Vichrome（ユーザーマニュアルはこちら） ここ最近こっそり開発してたのがこれ。 さあ君も今すぐインストール！ Vichromeって？ viライクな操作をChromeで実現するという比較的ありがちな、VimperatorマジリスペクトなGoogle Chromeエクステンションです。 実はChromeのエクステンションには既に似た様なものがいくつかあるのですが僕の要求を100%満たせるものは存在しないようです。しかし、それでもvimmerな僕としてはWebブラウジングでマウスを極力使いたくないという思いがあります。 で、それならいっそ作ってしまえということで開発したのがVichromeというわけです。 ということで今日はVichromeの紹介をします。自分のために作ったと
複数のバージョンのGoogle Chromeを同時に動かす方法 - os0x.blog
複数バージョンのChromeを同時に動かす方法は公式には用意されていませんが*1、割と簡単にバージョンごとのChromeを動かすことができます。 出典はGoogle Chromeを任意のフォルダにインストールする方法など: 夜明け前と2chのChromeスレ*2からです。 インストールしたいバージョンのインストーラーを用意 4.0.249.30をインストールしたい場合、http://dl.google.com/chrome/install/249.30/chrome_installer.exe からダウンロードできます。 バージョン番号の後半2つをhttp://dl.google.com/chrome/install/xxx.xx/chrome_installer.exe のxxx.xxの部分に当てはめればそのバージョンがダウンロードできます。バージョン番号は後半2つだけでユニークになるよ
SEO解析データ 全部入りChrome拡張機能「SEO Site Tools」
組織のマインドマップツールをマインドマイスターにすべき理由 伸びてる産業、会社、事業を紹介しまくるStrainerのニュースレターに登録!! とにかく便利な SEO解析全部入りChrome拡張機能 「SEO Site Tools」は、SEO解析に必要な多くのデータを、一括でわかりやすく表示してくれるChrome拡張機能。 SEO評価の指標として疑問視されつつあるページランクではなく、SEOmoz のドメイン ランクをボタンに表示するのも特徴のひとつです。 「SEO Site Tools」で解析できるもの 全部書き出しているとキリがないので、画像で一気にご紹介します。 ボタンにSEOmoz のドメイン ランクを表示 ↑どうしてもGoogleのページランクで判断してしまいがちですが、デフォルトでこのような数値を表示してくれるのはありがたいですね。 基本のサイト・ページデータの表示 ↑Alexa
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Careful With The optimizelegibility Property | Font Metrics
AdSense (日本語) - Google グループ
Chrome Extensions | Chrome for Developers
Chrome の記事一覧 | DevelopersIO
Chrome Extensions API リファレンス