Vorlon.JS·多数のブラウザをまとめてデバッグできるリモートデバッガー MOONGIFT
今はWebブラウザの種類も増え、かつスマートフォンまであるなどWebサイトの作成も大変になっています。しかも開発ツールの使いやすいブラウザ、使いづらいブラウザもあり、開発に時間がかかります。 そんな現状を打破できるかも知れないのがVorlon.JSです。Vorlon.JSを使うと多くのWebブラウザのデバッグを一元管理できるようになります。 Vorlon.JSの使い方 Vorlon.JSはnpmでインストールできます。 $ npm install vorlon そしてvorlonコマンドでサーバが立ち上がります。 $ vorlon 後はこのVorlon.JSが出しているJavaScriptをデバッグしたいWebページ内に組み込みます。 <script src="http://localhost:1337/vorlon.js"></script> これで準備は完了です。例えば以下のようになり
レスポンシブ対応用に複数のブレイクポイントで手軽に確認できるツール -Wood Cuttr
スマフォの横と縦のサイズっていくつだっけ？ タブレットは？ ネットブックは？ とウェブページの制作で、レスポンシブ対応用に複数のブレイクポイントで簡単に確認できるツールを紹介します。 Wood Cuttr Wood Cuttrの対応ブラウザ・デバイス Wood Cuttrの使い方 Wood Cuttrのセットアップ Wood Cuttrの対応ブラウザ・デバイス 対応ブラウザ・デバイスは、下記の通りです。 動作するブラウザ IE9+ Firefox 3.6+ Chrome 10+ Safari 5.1+ Opera 11.6+ ※Wood Cuttrが動作するブラウザです。 サポートしているデバイス iPad & iPhone Models Android スタンダードなTVスクリーン デスクトップ ※ビューポートのサイズをサポートしているデバイスです。 Wood Cuttrの使い方 使い方
自分のサイトの表示を5種のブラウザでチェックできるネットサービス「browserling」
サイトのURLを入力すれば、わざわざ全種類・全バージョンのブラウザ環境をそろえることなく、、無料でバージョン別にInternet Explorer・Google Chrome・Firefox・Safari・Operaでの表示がチェックできるネットサービスが「browserling」です。操作方法は以下から。 browserling - interactive cross-browser testing https://browserling.com/ ◆操作方法 上記サイトにアクセスすると、このような画面が表示されます。 使い方は簡単、まず上部に「表示させたいサイトのURL」を入力します。今回はGoogle Chromeのバージョン14.0でサイト表示を確認したいので「Google Chromeのアイコン」・「14.0」の順に選択してから、「run」をクリック。 そうすると、以下のようにG
CSSのプロパティを検索してブラウザのバージョンごとの対応状況を確認出来るリファレンスサイト・Browser Support
プロパティがどのブラウザに対応 しているかを調べられる、という 検索式のリファレンスサイトです。 バージョン別になっているので、 動かなくて困った、という時に調 べて見ては如何でしょう。 休日なので軽い話題。プロパティで検索するとIE、Firefox、ChromeやOperaなどの対応状況をバージョンまで確認出来る、というリファレンスサイトです。 borderとかcolorといったプロパティで検索すると各ブラウザの対応状況がバージョン別で把握出来る様になっています。 スクリーンショット ↑ こんな感じでバージョンも把握出来る様になっています。緑色の部分が対応ブラウザですね。 また、左下のTEST CASESからデモも確認できます。 ↑ かなり古いバージョンも掲載されています。が、IE6はありませんでした。個人的主観？ ↑ 一覧ページもあります。 ↑ 若干挙動が怪しいですけどオートサジェスト
ブラウザサイズに応じて全体に広がる背景を実装できるjQueryプラグイン「Backstretch」:phpspot開発日誌
ブラウザサイズに応じて全体に広がる背景を実装できるjQueryプラグイン「Backstretch」 2012年03月21日- Backstretch: a simple jQuery plugin that allows you to add a dynamically-resized background image to any page ブラウザサイズに応じて全体に広がる背景を実装できるjQueryプラグイン「Backstretch」 他にも同様のプラグインがありますが、まず使い方が超簡単で、「$.backstretch(http://dl.dropbox.com/u/515046/www/garfield-interior.jpg);」って必要なプラグインをロードした後に書くだけです。 配列として渡すことでスライドショーさせることもできます。 昔ならこんな大きな背景画像を使ったら怒
W3CのValidatorをサイト全体にかけてサイトマップも作ってくれるツール「W3Clove」:phpspot開発日誌
W3CのValidatorをサイト全体にかけてサイトマップも作ってくれるツール「W3Clove」 2011年12月07日- W3Clove :: site-wide markup validation tool W3C Validator の結果を一括で得られ、サイトマップのXMLも生成してくれる便利なサービスのご紹介です 最初にトップページのURLを入力すると、サイトをクロールしてくれるのでしばらく待ちます。 まっていると結果が次のように出ます。 OKなものはグリーンデ表示され、赤でエラー、オレンジで警告といった具合に分かりやすくW3C Validatorの結果が閲覧できます サイト全体で多く見られたエラーのサマリも見ることができ、どこを集中的に改善すればいいのかが分かりやすいです 関連エントリ スマフォ上で動くブラウザベースアプリ開発に役立ちそうなデバッグツール「Socketbug」
Movable Typeのカスタムフィールドで入力したデータの重複チェックを行う「CustomFieldDataCheckerプラグイン」
Movable Typeのカスタムフィールドで入力したデータの重複チェックを行う「CustomFieldDataCheckerプラグイン」を公開します。 １．機能 このプラグインでは、プラグイン設定画面で指定した特定のカスタムフィールドに入力した値をチェックし、他の記事の同一カスタムフィールドの値と重複している場合に以下のエラーを表示します。 v0.02ではブログ記事・ウェブページのカスタムフィールドのチェックを行います。 ２．価格 価格：\3,000-（税別）/1インストールMT（購入前に必ず動作確認してください） ３．プラグインのダウンロード 以下のリンクからプラグインをダウンロードしてください。 2011.01.20 v0.01 初版 2011.03.31 v0.02 ブログ記事をチェック対象に追加／複数カスタムフィールドチェックに対応／エラーメッセージの改善 2021.02.26
IE6/IE7/IE8/IE9の共存まとめ
Windows 7やWindows VISTAでIE6/IE7/IE8/IE9を共存させる方法です。IE9はまだベータ段階ですが、周辺ツールも対応してきた頃なのでまとめてみました。 公式ブラウザの共存はできませんが、以下に示す方法で各バージョンの表示を確認することができます。最近はIETesterが主流になってきたようなので、そこを踏まえてます。 IETesterを利用＋IETesterでIE9を確認できるようにカスタマイズする 「Microsoft Expression Web SuperPreview for Windows Internet Explorer」と「Internet Explorer Platform Preview（「Internet Explorer 9 Platform Preview」）」を併用する IE9のブラウザーモードとドキュメントモードを利用する 以下、
cssの未使用セレクタをその場で複数ページ一括調査するブックマークレット・cssess
中小規模サイトの構築時に役立ちそうな ブックマークレットがあったのでご紹介します。 閲覧しているWebサイトで使用しているcss の未使用セレクタを教えてくれるブックマーク レットです。こういったWebサービスはあります が、その場でサクッと調べられるのは面倒が 無くて良いですね。 使いどころはやや限られますが、複数ページを一括で調査し、それぞれのページの未使用セレクタを知らせてくれますのでなかなか便利だなぁと感じました。 おそらくブックマークレットを使ったページからリンクされている同一ドメインページを読み込んでるっぽいのです。zipや#の付いたURLも含まれているのはそのためでしょうかね。こういうリンクがある場合はチェックをはずしてください。 ページごとに使っていないセレクタを教えてくれます。 ブックマークレットを使うと上記のような半透明のボックスが出ますので調べないページのチェックを外
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
