みなさんは、ブラウザは主に何を使われていますか？

↓こちらは、このブログの一ヶ月間の読者の方々のブラウザTop10なのですが、まだまだ半数以上の方々がIEを使われているようですね。。（少し見づらくて申し訳ありません…。）

ちなみに、こちらがIEのバージョン情報です。6.0を使っている方が、かなり多いんですね。

こちらはFirefoxのバージョン。圧倒的に2.0の方が多いです。

っと、いろいろなバージョンのブラウザを使われているので、どのブラウザで見ても、なるべく崩れたりしないように、サイトを構築していきたいものです。

本日は、MacやWindowsで複数バージョンのブラウザを共存させて、簡単にブラウザチェックができる方法をまとめてみました。

Windows IE編

Multiple IE

こちらは、かなり有名なのでお使いの方も多いのではないでしょうか？IE3〜IE7までを共存させる事ができるソフトです。とっても便利ですね。。ずいぶん前にこのブログでもご紹介しました。インストール方法はこちらからどうぞ〜。

IETester

こちらは、先日話題になっていたツールですね。共存というと少し違うのかもしれませんが、IE8.0 betaも確認できるところが良いですよね。

Mac IE編

2005年12月31日にサポートを終了したIE for macなのですが、IE6.0と7.0をMacにインストールできてしまうソフトです。ちなみに、めちゃめちゃ重いです。。さらに、7.0は、もっと重いです。。表示も6.0のままだったり…日本語も、フォントをインストールしないと文字化けます。。っと、使い勝手は良くないです。。が、BootCampやVMwareなどを使わずに、IEをMacで確認できるのは、ちょっと便利かも。

ies4osx

実際にインストールしてみると↓こんな感じです。

Mac Firefox編

Macで複数のバージョンのFirefoxを同時に起動させる方法

今回は、試しにfirefox3.0b4をインストールしてみました。ファイルをダウンロードして、開くと↓のウインドウが開きます。アイコンをデスクトップにドラッグ&ドロップ。

保存された、Firefoxの名前を変更します。（そうしないと、今お使いのFirefoxに上書きされてしまいます。）今回は、firefox3.0b4と名前を変更しました。名前の変更が終わったら、Applicationsフォルダにドラッグ&ドロップ。これで、Firefoxが２つ目がインストールされます。その後、Mac OS Xのターミナルを起動して、

$ /Applications/Firefox3.0b4.app/Contents/MacOS/firefox -ProfileManager

入力してreturnキーを。（Firefox3.0b4.appの部分は、変更した名前を入力してください。）

すると、プロフィールを選択するウインドウが開きます。ここに、新規でプロフィールを追加して、Firefox3.0b4は、別のユーザーが開く設定にすると出来上がり〜！

同時に、Firefox2.0と3.0が起動しました！

Mac Safari編

Multi-Safari

こちらは、MacのPantherやTigerをお使いのユーザーの方用ですが。。Safariの複数のバージョンがインストールできます。

Safari 2.0.4 for Leopard

こちらは、Leopardをお使いの方にSafari 2.0.4がインストールできます。

実際にインストールしてみました。少し分かりにくいですが…Safari2.0.4と3.1が同時に起動しました〜。

みなさんも気をつけてお試しください。

スクリプトで、ブラウザーのサイズを変更するのって、ユーザーの方々のそれぞれの環境などを無視したつくりになってしまうので、結構、嫌がられる傾向にあるのですが・・・

ここまで来れば、アリなような気がします。。

↓こちらのサイトは、動画にあわせてブラウザのサイズが変わっていきます。。なかなか面白いアイデアですね。。

最後にオチもあっていいですね。。

今日、大変興味深い記事を発見したのでメモ。

その名も「Speed Up Firefox web browser」

元記事の筆者が言うには３－３０倍Firefoxがスピードアップするということですが。。

っちゅうわけで、日本語訳しながら、早速やってみました。。

まず、Firefoxを立ち上げて。。↓のようにロケーションバーのところにabout:configってコピーしてenterキーを。。。そしたら、なにやら色々出てきます。。

下にfilterってボックスがあるので、そこにnetwork.http.pipeliningってコピーしてenterキーを

絞り込まれた、network.http.pipeliningを選択して、右クリックで「toggle」を選択して、Valueのfalseの部分をtrueに変更。

次に、またfilterボックスにnetwork.http.pipelining.maxrequestsってコピーしてenterキーを

絞り込まれた、network.http.pipelining.maxrequestsを選択して、右クリックで「modify」を選択して、Valueの4の部分を8に変更。

またfilterボックスにnetwork.http.proxy.pipeliningってコピーしてenterキーを

絞り込まれた、network.http.proxy.pipeliningを選択して、右クリックで「toggle」を選択して、Valueのfalseの部分をtrueに変更。

またfilterボックスにnetwork.dns.disableIPv6ってコピーしてenterキーを

絞り込まれた、network.dns.disableIPv6を選択して、右クリックで「toggle」を選択して、Valueのfalseの部分をtrueに変更。

またfilterボックスにplugin.expose_full_pathってコピーしてenterキーを

絞り込まれた、plugin.expose_full_pathを選択して、右クリックで「toggle」を選択して、Valueのfalseの部分をtrueに変更。

次に、どの項目でも良いので選択して、右クリックで「new」を選択して、「integer」を選択。

「integer」を選択しすると、↓のようなボックスが出てきます。

nglayout.initialpaint.delayと入力して、「OK」ボタンをクリック

「0」を入力して、「OK」ボタンをクリック。

filterで、nglayout.initialpaint.delayと入力して、enterを押して、nglayout.initialpaint.delayが見つかればOK

また、どの項目でも良いので選択して、右クリックで「new」を選択して、「integer」を選択。

「integer」を選択しすると、↓のようなボックスが出てきます。

content.notify.backoffcountと入力して、「OK」ボタンをクリック

「5」と入力して、「OK」ボタンをクリック。

filterで、content.notify.backoffcountと入力して、enterを押して、content.notify.backoffcountが見つかればOK

また、どの項目でも良いので選択して、右クリックで「new」を選択して、「integer」を選択。

「integer」を選択しすると、↓のようなボックスが出てきます。

ui.submenuDelayと入力して、「OK」ボタンをクリック

「0」と入力して、「OK」ボタンをクリック。

filterで、ui.submenuDelayと入力して、enterを押して、ui.submenuDelayが見つかればOK

一通り設定が終わったら、いったんFirefoxを閉じて起動しなおしてみます。。う。。。微妙に早くなったかな。。気の持ちよう？？いや、早くなったはず。。。うん。確かに早くなった気がする。。。

特に、画像の多いページを読み込むときには早くなったような気がします。。。
もちろん、ネット接続スピードが速くなるわけではないですが。。

どなたか、詳しい解説おねがいします～！！！（ひとまかせ。。。ごめんなさい。）

デザインblogランキング

ブログのコメントとか、メールとかで使われてるフォームですが、ボタンとか、テキストボックスってそれぞれのOSとかブラウザごとに微妙に違いがございます。

最近では、このブログの、コメントのところみたいに、CSSでフォームのデザインをいじってる人が多いですが。。何も指定しなかった場合は結構な違いがあるみたい。

っちゅうわけで、まとめ。

1. ボタン

2. セレクトボックス

3. テキストボックス

4. チェックボックス

5. ラジオボタン

6. ファイルアップロード

OS、ブラウザごとに結構違いがありますねぇ。。。

デザインblogランキング

これって、意外と知らん人多かったんですねぇ。

こんなんですわ↓

ブラウザのURLの横っちょに出てくるアイコンですわ。
お気に入りに追加したときにも出てくる小さいアイコン。

英語では、favorite icon略して、favicon（ファビコン）って呼ばれとります。

では、では、今日は簡単なファビコンの設定のお勉強ですわ。

16px×16pxで作られるのが一般的なようで・・・

拡張子はicoで作ってくださいな。う～ん。

なんだか、めんどくさそうですなぁ。。。

っちゅうわけで、簡単にファビコン作ってくれるサイトをまとめてみたのじゃ。

Dynamic Drive
ファイルをアップロードするだけで、favicon.icoを作成してくれる便利サイト

favicongenerator
ここもファイルをアップロードするだけで、favicon.icoを作成してくれる便利サイト

degraeve
こちらは、点に色を塗っていってfaviconを作るツール。塗り絵みたいでおもろいかも。

MpP Favicon Gallery
faviconのデザインに迷ってしまう方はこのギャラリーでサンプル見放題！

こんな感じで作ったfavicon.icoをＦＴＰでサーバーにアップロードして・・・

↑のコードをコピーして、ドメイン名を書き換えて、htmlファイルの<head>～</head>の間に貼り付けたら出来上がり～！ですねん。

デザインblogランキング

先日「Internet Explorer 7」の日本語版の正式版が公開されましたねぇ。

わたくしウェブデザイナーのはしくれといたしましても、会社では「Internet Explorer 7」のRC版で、ブラウザチェックしたりしてたのですが・・・そろそろ正式版も発表されたことやし、自宅のコンピューターにもインストールするべき？っと考えておりました。

このブログでのアクセス解析を見てみると、Internet Explorerを使ってるユーザーさんのおよそ10%が既にInternet Explorer 7を使ってるというデータを発見いたしました。

う～ん。。インストールすべきですかねぇ。。。でも、まだ90%近くのユーザーさんは「Internet Explorer 6」を使ってるわけで。。。悩むこと。１０分。

インストールすることに決定。どうせ、半年後には80%以上のユーザーさんが「Internet Explorer 7」を使うことになるんだろうしね。。。

っちゅうわけで、インストールしてみました。
そういえば、仕事として作ってるサイトは「Internet Explorer 7」でどのように見えるかブラウザチェックしとったんですが・・・

このブログは見てなかったなぁ。。。
というわけで。。このブログを「Internet Explorer 7」で見てみる。。。

スクリプトをバリバリ書いてるこのブログでも、意外と大丈夫そう・・・

ん？？

えらいこっちゃぁ・・・右上の検索ボックスが・・・消えとる。。。
まぁ、検索ボックスがあるであろうところあたりをクリックすると、入力可能なのですがね。

「Internet Explorer 7」にあわせて直すのは簡単なんですがね。。。そしたら、まだアップグレードしてないユーザーさんにはどう見えるのやら。。。

今後数ヶ月は「Internet Explorer 7」と「Internet Explorer 6」の狭間で眠れない夜が続きそうです。。。

みなさん、とっとと「Internet Explorer 7」にアップグレードしてくださいな。まえのんよりぜんぜん使いやすいのでね。これは、マジで。

「Internet Explorer 7」の日本語版の正式版ダウンロードはここから

詳しいインストールの仕方は・・・ITmediaさんの記事から

みなさんは、ブラウザー何使ってるんでしょうかね？

ほとんどのみなさんはインターネットエクスプローラーって答えるんでしょうなぁ。。。
実際、わたくしの運営しているサイトでの、アクセスデータを調べてみたのですが・・・

だんとつでインターネットエクスプローラーでございました。。。

やっぱり、買ったパソコンに最初から入ってるし。。。そのまま使い始めてそのまま。。。
って人が多いのでしょうねぇ。。

でもね。正直使いにくいよ・・・インターネットエクスプローラーって。。。マジで。。

毎日８時間以上パソコンの前に座っていて、ウェブサイト作りながら、いろんなブラウザーでサイトをチェックしてるわたくしは。。。インターネットエクスプローラー使ってません。。

でも、大半の人がインターネットエクスプローラー使ってるので、仕方なしにインターネットエクスプローラーでチェックしてますが・・・基本はやっぱりFireFoxっちゅうブラウザーですわ。

そんなFireFoxさんが先日アップデートされましてさらにさらにつかいやす～くなったのですわ。
基本的にFireFoxは、一度インストールするとアップデートは自動でされると思っていたのですが・・・
今回は、FireFox2.0ちゅうメジャーアップデートだったもので、自動ではアップデートされないようですわ。っちゅうわけで、すでにFireFoxインストールしとる人もダウンロード必要ですよ～。

別にわたくしFireFoxのまわしもんでもなんでもないですがね。。。
使ったことない人は、ぜひ使ってくださいな。

はい、じゃぁFireFoxの便利なところベスト３じゃ。

1. タブで開ける

やっぱり、これは便利ですなぁ。↑のんは、ひとつのウインドウで「Yahoo! Japan」「Google」「楽天」を開いたところ。ブログ書くときとか、mixiで日記書くときとかにも便利。mixi開きながら、googleで写真検索したりできるしね。インターネットエクスプローラーやったら、ウインドウまみれになってうっと～しぃ！

2. 追加機能が豊富

これまた便利ですねぇ。。最初からいろんな機能が入ってるんじゃぁなくって、自分が必要な機能だけを追加できる！！っちゅう訳ですわ。わたくしウェブデザイナーには欠かせないデベロッパー用のツールから、mixiの自分の日記にコメントついたら教えてくれる一般人用の便利なツールまでいろんなツールを自分の必要なものだけ追加できますねん。

3. RSS対応

ブログをお気に入りに追加するときにRSSをお気に入りに追加しとくと、最新記事のタイトルを自動で拾ってきてくれるのでわざわざそのブログが更新したかどうかを見に行かなくてもよいのですわ。↑のんは、このブログのRSSをブックマークした場合どす。

どない？FireFox使う気になった？でしょ？

ここからじゃ↓（もち無料）