IEテスターよりも便利な開発者ツール

公開日: : 最終更新日:2015/07/11 副業で稼ぐ仕組みの作り方

IEテスター重すぎてテストに環境としては悪すぎる・・・そんな人の為に開発者ツールをご紹介させて頂きます。

はじめに

過去にcssのハックと確認方法と言う記事でIEテスターと言う全てのバージョンでチェックできる物を紹介しましたが、とにかく重すぎるなと自分でも感じていました。

そんな時に見つけたのがIEに標準装備の機能を使って全てのバージョンでチェックする方法です。

注意事項

現在のIEのバージョンによってこの機能が使えない場合があります。

IEテスターだと

ietest

IEテスターを使っている人だとわかると思いますが

  • まずとにかく立ち上がりがとにかく重い
  • ファイルサイズが大きい
  • すぐに落ちる

こういった事ってよくありませんか?

こんなに使うのにストレスが溜まるのに他に使えるツールがないからIEテスターを使っている・・・

そんな皆さんに朗報です

もっと簡単にIEの全てのバージョンをチェックする方法がございます。

IE開発者ツール

IE開発者ツールと言うのは、IEにデフォルトでついている機能なので

  • インストールする必要なし
  • 簡単に全てのバージョンチェックをする事が出来る

と言うのがポイントです。

使い方を紹介します

IE開発者ツールを使いたい場合は

ietest1

まず、IEを立ち上げデザインをチェックしたいページに移動します

ietest2

キーボードのF12を押します

ietest3

Edgeをクリックして任意のバージョンをクリックする

たったこれだけで簡単にIEのバージョンによるデザインチェックをする事が出来ます。

チェックしてみたよ

念のため、本当にブラウザチェックをして動くかどうかのチェックをしてみました。

IE5のブラウザチェック

ietest4

IE7のブラウザチェック

ietest5

IE8のブラウザチェック

ietest6

IE9のブラウザチェック

ietest7

IE10のブラウザチェック

ietest8

すべて色通りになっていました。

IEの開発者用のバージョンチェックを作ってみたので皆さんも一度チェックをしてみてください。

IEのブラウザチェック

問題点

cssのハックが動かない

こちらの生地の最初にcssのハックと確認方法と言うのを紹介いたしましたが、こちらではcssのハックをつかってIEのバージョンによって崩れた部分などの調整をするやり方を紹介しましたが、このIE開発者ツールの場合はcssのハックでは動かないようでした。

例えばIE7でチェックした場合

ietest9

本来ならば赤色が表示されていないといけないのですが、紫色が表示されています。

これだと結局のところcssだけでは確認が出来ないのでhtmlに各IEのバージョン用タグを埋め込まないといけませんね。

フリーズする・・・だと・・・

IEテスターだとフリーズしたり動作が終了してしまうなんて事があるからと言う理由でIE開発者ツールをつかったとしても、情報量が多ければどうしてもフリーズしてしまいます。

そんな時の対応方法は

ローカルでチェックする

事です。

デザインチェックをするだけであればローカルで動かした方がサクサク動くのでチェックしやすいですよ。

このようにすんごく使いやすい!と言うわけではありませんがIEテスターに比べると圧倒的にストレスは減ると思います笑

さいごに

IEのバージョンテストは本当に面倒くさい

私は稼げる副業の一つでホームページ制作をしておりますが、正直一番やっかいなのがIEです。

私の場合は5.5以下は全て対応なしにしているので大きな影響はありませんが、全てのバージョンに対応している人であれば正直な話結構大変な思いをしているのではないでしょうか?

過去に自社サイトを作成する際にIEの5.5にも対応させようとIEテスターを使って確認作業をしていましたが、

立ち上がりが遅い上に情報量が多い場合は更新するたびに時間がかかりすぎていたので正直うんざりしていました。

そんな時に見つけたIEの開発者ツールを使えば簡単に全てのバージョンのデザインを確認する事が出来るのでかなり効率が良くなりました。

もっと早く出してほしかったなぁ。

この一言につきますね笑

広告

関連記事

ワードプレスの記事下に任意の情報を入れるプラグイン

ブログの最後に毎回同じ情報を入れている人にお勧めのプラグインを発見しました。毎回コピペして入力しなく

記事を読む

ワードプレスで記事の投稿数を表示させる方法

ワードプレスで全○記事とブログ記事の投稿数を表示させる事が出来る方法をご紹介いたします。 はじ

記事を読む

データベースのバックアップ用プラグインWP-DBManager(ワードプレス)

副業をするのに、ワードプレスを導入した方は必ずバックアップをとっておいてください。今回は自動でバック

記事を読む

エックスサーバーからさくらサーバーにドメインを移管してみた

エックスサーバーからさくらに移管しているって情報が少なかったので自分のメモとしてやってみました は

記事を読む

tinymce advancedで絵文字もフォントサイズも可能に

ワードプレスって、顔文字が使えなかったり、フォントサイズがいじれなかったりと日本人のブログとしては微

記事を読む

商品一覧ページを第一階層ごとにデザインを変える【ECキューブ2.12】

商品のカテゴリが数百とある場合、クライアントが欲しい商品を探すのに苦労してしまいます。 はじめに

記事を読む

WordPressで記事の盗用をさせないWP-Copyright-Protection

5時間かけて書いた記事が色々なところで盗用されているなんて悲しい事ありますよね はじめに まず、

記事を読む

ワードプレスのカテゴリ名やURLの取得方法

ワードプレスのカスタマイズでカテゴリ関係の情報を調べたがあまり出てこなかったので、メモして は

記事を読む

ワードプレスをスマホと携帯に対応させるプラグイン

ブログを書いていてもガラケーやスマホに対応していないと見にくくなりますよね?そこで、プラグイン一発で

記事を読む

特定のカテゴリー情報一覧をquery_postsで取得する方法

query_postsを使ってランダム表示一覧で取得したところ、特定のカテゴリー情報しか取得されてい

記事を読む

広告

Message

広告

現在の総記事数: 297件

【無料公開】メルカリで月10万以上稼いだテクニック

メルカリに出品しているけど、なかなか売れない人の参考になれば嬉しいです

メルカリで絶対にあかんバグが起きました

メルカリで絶対にやってはいけないバグが見つかりました。運営さん!早く対

ロボットが資産運用 WealthNaviの申込み方法

最近流行りのロボットに任せる資産運用でWealthNaviを試してみま

windows10で画面に[あ]や[A]と大きく出るのを消す方法

windows10で画面にや[A]と大きく出るのを消す方法

ロボットが資産運用 THEO[テオ]の申込み方法

自分自身で資産運用をするときって何を選べば良いかわかりませんよね。そん

→もっと見る


  • ここでは副業での稼ぎ方や、誰でも簡単に稼げる副業のジャンルなどを紹介しております。 今の所、平均して月に15,000円ほど副収入があります。
    • エステコスメ エステ化粧品やエステコスメの通販サイトです。一般の方でもエステサロンで使用しているコスメを激安価格で購入出来ます。
    • エステ用品 エステ用品のMOCOエステです。新規開業を考えているエステサロン様向けに卸価格でご提供させて頂きます。
    • サロン集客 サロン集客に悩んでいる人向けに完全無料で集客方法を公開しております。インターネットを使う事で0円でサロン集客する方法もお教えいたします。
    • ヒートマット 遠赤外線ヒートマットシリーズは入ると滝に打たれたような発汗を体験できます。サロン様から一般の方までご利用いただけます
    • フェイシャルスチーマー 業務用だけでなく、一般の方も使用出来るフェイシャルスチーマーを詳しく説明しているホームページです。
    • 美容室のホームページ制作 美容室やエステサロン、ネイルのホームページ制作です。3万円台から制作も出来るので予算のないサロン様にも対応しております。
PAGE TOP ↑