ウェブサイトの制作・検証に役立つブックマークレット集
ウェブサイトの制作・検証に役立つブックマークレットをspeckyboyから紹介します。
32 Indispensable Bookmarklets for Web Developers and Designers
Layout Grid Overlay
レイアウト用のグリッドをオーバーレイで表示します。
URLを変更すれば画像の変更可。
- Bookmarklet
- Layout Grid Overlay
MRI
セレクタをチェックします。
- Bookmarklet
- MRI
Spry Medias Design
グリッドやルーラーを表示します。
- Bookmarklet
- Spry Medias Design
Quick Accessibility Page Tester
アクセシビリティをチェックします。
- Bookmarklet
- Quick Accessibility Page Tester
Reload CSS
スタイルシートを2秒ごとにリロードします。
- Bookmarklet
- Reload CSS
Slayer Office Mouseover DOM Inspector
DOMをチェックします。
- Bookmarklet
- Slayer Office Mouseover DOM Inspector
Slayer Office Favelet Suite
カラー、ドキュメントツリー、HTTPヘッダなどを表示します。
- Bookmarklet
- Slayer Office Favelet Suite
Wave - Web Accesibilty
アクセシビリティの評価をします。
- Bookmarklet
- Wave - Web Accesibilty
XRAY
エレメントのさまざまな情報を表示します。
- Bookmarklet
- XRAY
ブラウザのサイズを変更
指定サイズにブラウザのサイズを変更します。
- Bookmarklet
- ブラウザのサイズ変更：240x320
- ブラウザのサイズ変更：480x640
- ブラウザのサイズ変更：640x480
- ブラウザのサイズ変更：800x600
- ブラウザのサイズ変更：1024x768
- ブラウザのサイズ変更：1280x768
- ブラウザのサイズ変更：1600x1024
検証やチェック
HTMLの検証をします。
- Bookmarklet
- W3C Validate HTML
- Quick Validate HTML
CSSの検証をします。
- Bookmarklet
- W3C Validate CSS
リンクのチェックをします。
- Bookmarklet
- W3C Link Checker
スタイルシート・スクリプト関連
スタイルシートやスクリプトを表示します。
- Bookmarklet
- View CSS
- View Scripts
- List Computed CSS Style
テーブル関連
テーブルや見出し、セルを表示します。
- Bookmarklet
- テーブルの見出しを表示
- テーブルをハイライト表示
- テーブルのセルを表示
その他、開発者用
サイトの編集をしたり、ショートURLを作成したり、その他開発者向けのブックマークレットです。
Post on:2009年2月26日
);void(myBody=document.getElementsByTagName('body')%5B0%5D);void(myDiv.style.background='url(http://www.andybudd.com/images/layoutgrid.png)');void(myDiv.style.position='absolute');void(myDiv.style.width='100%');void(myDiv.style.height='100%');void(myDiv.style.top='0');void(myDiv.style.left='0');void(myBody.appendChild(myDiv));){kind=link}
Comments
より早くcssやhtmlのコーディングが行えそうな情報いろいろ – かちびと.netkachibito.net | PORTFOLIO -POST批評空間-
on 2010年7月1日
[...] ウェブサイトの制作・検証に役立つブックマークレット集 / まとめ [...]