Allan Jardine | Reflections ブックマークレット「Design」には4つのツールがあり、それぞれ同時に使用することもできます。 Grid リアルタイムに変更できるグリッドを表示します。
Allan Jardine | Reflections ブックマークレット「Design」には4つのツールがあり、それぞれ同時に使用することもできます。 Grid リアルタイムに変更できるグリッドを表示します。
Webサイトの制作に役立つ便利なブックマークレットを紹介します。 ブラウザの機能拡張も便利ですが、入れすぎると重くなったり、Chromeで使えるけど他で使えないなどあるので、ブックマークレットもなかなか重宝します。 ページにグリッドを表示した確認 レスポンシブWebデザインの確認 デザインの確認をピクセル単位でできる ページで使用しているフォントをチェック ページをワイヤーフレーム化 ページの構造が正しいか確認 マークアップのいまいちな箇所を指摘してくれる 背景を素敵なテクスチャに変えてみたい ページのパフォーマンスを確認 minifyされたCSSを見やすく表示 SEOやソーシャルメディアに大切な項目を確認 コードとアクセシビリティをチェック ページにグリッドを表示した確認
デザインなんかを勉強している人にいいかも、と思ったのでご紹介。 Wirifyのブックマークレットを使えば、今見ているサイトのワイヤーフレームを表示してくれる。 そのサイトがどういう要素でもって出来ているのか、デザイン的にどう配置されているのかをすっきりみたい場合に便利だろう。 なお、このツールを使うと、サイトのタイトルとURLが収集されるそうなので、セキュリティ的に保護されているページに使うには注意が必要だ。 きれいなサイトを見つけたときには、こうしたツールを試してみるのもいいですな。
こんにちは、デザイナーのサリーです。セブ島のお土産に名物のシニガンスープの素をたくさん貰いました。 シニガン?な私は裏面(おそらくフィリピン語)を見てもさっぱり作り方がわかりません、クノールなのに… パッケージイラストとクックパッドを頼りにどうにかこうにか料理してみようと思います。 今日はデザインやコードをチェックするのに便利なブックマークレット10個を紹介します。 デベロッパーツールやブラウザの拡張機能を使った方が良さそうだと思ったもの、個人的に使いづらかったものは除外して、実用性のあるブックマークレットを選んでみました。 「ブックマークレットってなんだろう?」な方に説明をしておくと、 ブックマークレット 通常ウェブブラウザでブックマーク(お気に入り)を選ぶと、登録しておいたURLに遷移するが、URLの代わりにJavaScriptのプログラムコードをブックマークしておくことで、それを選ん
CSSのセレクタをインタラクティブに確認できる超絶便利ブックマークレット『SelectorGadget』 February 27th, 2009 Posted in その他 Write comment かなりマニアックではあるが、その筋の人にはすっごく便利なのでは。 SelectorGadgetではCSSのセレクタを書くためのブックマークレットを配布している。CSSのセレクタは慣れるまで書くのが大変である。 しかしこれを使えば「タイトルだけを指定するCSSセレクタ」「このテーブルのこの列だけを指定するセレクタ」なんてのをインタラクティブに指定しながら確認していくことができる。 使い方は簡単で、まずはブックマークを好きなページで起動する。すると右下にセレクタ表示用のボックスが現れる。 次にセレクタに含めたいDOMをクリックする。するとそこが緑になり、さらにそのセレクタにマッチするDOMが黄色
レイアウト用のグリッドをオーバーレイで表示します。 URLを変更すれば画像の変更可。 Bookmarklet Layout Grid Overlay MRI
HTMLの構文チェックをその場で できるブックマークレットです。 問題箇所の数や、問題箇所もお しえてくれます。割と便利そう だったのでご紹介してみます。 HTMLのlintです。ブックマークレットを起動させてその場で解析、問題箇所も教えてくれます。 OSSとしてGithubでも公開されてますので日本語に直しての利用も出来ますね。 ↑ 起動させるとすぐに解析してくれます。 ↑ 表示されたボックス下部のView Reportに進むと個別箇所が一覧で表示され、それぞれの問題箇所を上図のようにアイコンで教えてくれます。 errorとwarningの表示/非表示のスイッチも出来ます。なかなか便利ですね。 HTML_CodeSniffer
個人的によく使っているブックマークレットのご紹介。どれも便利で役立つので手放せないものになっています。Web制作をしている人なのでそれ系に偏っているかも知れませんが、多少でも参考になれば幸いです。ほとんど有名なものだとは思いますが・・・ というわけで、便利なお役立ちブックマークレットをいろいろとご紹介。手軽なのが素敵ですよね。以前書いてから大分経ちますので改めてエントリーしますが、少々Web制作系に偏っています。順不同です。 CSS構成を一目で確認出来るXRAY 何かと便利なXRAY。クリックした要素の詳細を教えてくれます。Web屋さんはご存じの方も多いのでは。 XRAY 今見ているページをiPhoneで「後で見る」KeepItWith.Me 最初の設定がすごくストレスだったのですが、設定後の便利さが感動したのでご紹介。PCで見ているページでブックマークレットを使って自分のiPhoneに送
Web担編集部の安田です。Web担のはてブ件数1万件超え()を記念して、ご愛読のみなさんのお役にたてる便利なツールを作りました。名付けて、「位置調整可能なグリッドオーバーレイ」ブックマーク。ウェブデザインをする人なら日常的にdivの幅や隙間の長さを測ったりしていることでしょう。そういうときに手放せなくなるツールです。 akiyanさんが作った便利なグリッドオーバーレイのブックマークにインスパイヤされて、さらに便利な機能を盛り込んでみました。 名付けて、「位置調整可能なグリッドオーバーレイ」ブックマーク。 使い方その1普通のブックマークレットです。以下のリンクを右クリックして「お気に入りに追加」(IEの場合)または「このリンクをブックマーク」(Firefoxの場合)してください。 IEでは「追加しようとしているお気に入りは安全でない可能性があります。続行しますか?」とのセキュリティ警告が出ま
どーもノリ五藤( @nori510 )です。 ブログを書く上で、どうしても必要な手間がかかる部分があります。リンクを貼ったりとか、HTMLのタグうちなど。 そういう手間は、なるべく減らしたい。 という事で、今回はブログ更新の手間を減らす私がブログ更新に使用している便利なbookmarkletをまとめてご紹介してみようと思います。 ブロガーに必須のブックマークレット まとめ その0 ブックマークレットを超絶快適に使う為のChrome エクステンション『Keyconfig』 まず、PCでブックマークレットを使用する時などに、ほんとに素晴らしい働きをしてくれるchromeの拡張機能『Keyconfig』をご紹介させて頂きます。 ブックマークレットを語る上でコチラは欠かせません。 キーボードショートカットをブックマークレットの起動に割り当てれば、超快適にブックマークレットを使用できます。 使用頻度
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く