ブラウザ｜WEB制作・WEB開発のTips＆News Kamimoto.biz Labs

2009年10月 8日

モバイルWebkitをエンジンとしているブラウザの比較表をご紹介。

モバイル版Webkitをレンダリングエンジンとしているブラウザは、多くのスマートフォンで搭載されていて、代表的なものとして、iPhoneに実装されているモバイルSafariが挙げられるわけですが、それらの表示を実際に試してみた表みたいです。

The Great WebKit Comparison Table

今回、19種類のWebkitエンジンのブラウザ上で、CSSやJavaScriptに関する様々なテストを行ったようです。

その結果、結論として出てきた言葉。

There is no "WebKit on mobile!"

つまり、『モバイルには「Webkit」なんてものは存在しない！！！』らしいのです(笑)

このページの下部には、「どのブラウザが一番多くのテスト項目をパスしたか」の棒グラフも載っているので、こちらも見るのも興味深いです。

代表的なものの優劣だけ列挙すると、上からこのような順番になります。

1. Safari4
2. Chrome3
3. Chrome2
4. iPhone3.1
5. Chrome1
6. iPhone2.2
7. Android G2
8. Android G1

個人的には、Androidの順位の低さが残念です。。

• Android
• iPhone
• webkit
• 比較

2009年10月 4日

今回、twitterデザイン集【ツイッテーマ】を公開するにおいて、ちょっと考えたのが、Web屋にとっての天敵Microsoft Internet Explorer 6への対応です。

クライアントワークでは、対応せざるを得ないのですが、ツイッテーマのような趣味のサイト（＝プライベートワーク）の場合、正直、もう対応しなくてもいいかなと思っています。

そこで、今年、Web制作会社が公開した「IE6 No More」を使いました。

日本語版は、こちらから確認することができます。

IE6 No More code-samples

ソースはこんな感じです。

<!--[if lt IE 7]>
  <div style='border: 1px solid #F7941D; background: #FEEFDA; text-align: center; clear: both; height: 75px; position: relative;'>
    <div style='position: absolute; right: 3px; top: 3px; font-family: courier new; font-weight: bold;'><a href='#' onclick='javascript:this.parentNode.parentNode.style.display="none"; return false;'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-cornerx.jpg' style='border: none;' alt='Close this notice'/></a></div>
    <div style='width: 640px; margin: 0 auto; text-align: left; padding: 0; overflow: hidden; color: black;'>
      <div style='width: 75px; float: left;'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-warning.jpg' alt='Warning!'/></div>
      <div style='width: 275px; float: left; font-family: Arial, sans-serif;'>
        <div style='font-size: 14px; font-weight: bold; margin-top: 12px;'>Stai usando un browser obsoleto</div>
        <div style='font-size: 12px; margin-top: 6px; line-height: 12px;'>Per una migliore navigazione su questo sito, per cortesia passa ad un browser di ultima generazione.</div>
      </div>
      <div style='width: 75px; float: left;'><a href='http://www.mozilla-europe.org/it/' target='_blank'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-firefox.jpg' style='border: none;' alt='Get Firefox 3.5'/></a></div>
      <div style='width: 75px; float: left;'><a href='http://www.microsoft.com/downloads/details.aspx?FamilyID=341c2ad5-8c3d-4347-8c03-08cdecd8852b&DisplayLang=it' target='_blank'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-ie8.jpg' style='border: none;' alt='Get Internet Explorer 8'/></a></div>
      <div style='width: 73px; float: left;'><a href='http://www.apple.com/it/safari/download/' target='_blank'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-safari.jpg' style='border: none;' alt='Get Safari 4'/></a></div>
      <div style='float: left;'><a href='http://www.google.com/chrome?hl=it' target='_blank'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-chrome.jpg' style='border: none;' alt='Get Google Chrome'/></a></div>
    </div>
  </div>
  <![endif]-->

実際に、IE6で見るとこんな感じになります。

今後、趣味のサイトは、IE6は放置プレーする方向で行きます。

IE6に最適化する時間があれば、何か作った方が自分にも、世の中のためにもなると思うので。

• IE6
• ブラウザ

2009年9月18日

Google Chrome 3の安定版が登場していたので、ちょっと遅くなったけどインストール。

Google Chrome 3 ダウンロード

「Google Chrome 3」安定版公開、新規タブを改善、テーマも導入

「Google Chrome 3」安定版では、JavaScriptのパフォーマンスは前回の安定版に比べて25％改良されたという。

HTML5にもどんどん対応してる。

今度、HTML5を勉強するので、ちょっとずつ試していきたいところ。

あと、Google Chrome への最大の要望は、「『タブの固定』をオンにさせてほしい」ってこと。

タブを横へ移動させようとすると、いつも、下にずれて、別ウィンドウになる。。

わずらわしい。

それ以外は、Firefoxとの併用で抜群の活躍を見せているんだけどね。

• Google
• Google Chrome
• HTML5

2009年8月 7日

激しく同意。

Internet Explorer（IE）6を撲滅せよ――Web企業が反IE6キャンペーン「IE6 No More」を立ち上げた。

Web企業はIE6に対応せざるを得ないが、「IE6対応は難しく、いら立たしい作業で、過度に時間を取られる。さらにIE6は最近のWeb標準をサポートしていないため、開発者ができることに制約がある」状況に苦労しているという。

本当に、IE6はなくなってほしい。

「いまだに利用している人が信じれない」というのは、あくまでも、Web屋、IT業界人のつぶやきだろう。

マイクロソフトには頼ってられなので、テクノロジー・団結で、Web屋からのアプローチが必要じゃないかと。

というより、Web屋から、クライアント企業へのアプローチとして、

「IE6ユーザに対して、乗り換えを促すことは、そのユーザのWebライフを向上させるという意味で、一種の『CSR』です」とかっていう仕様策定時の提案はどうでしょう？（笑）

さすがにちょっと無理がある？？？

と、先週、今週、IE6,7のせいで、多くの時間を犠牲にした一人のWeb屋として強く願う感じ。

• CSR
• IE
• IE6
• IE7
• ブラウザ
• 提案

2009年7月11日

けっこう忘れそうな点というか、基本は、width属性、height属性ともにしっかりと指定するのが多いので、こんなことはないのですが、

実際のサイズと異なるサイズをあえて指定すると、Internet ExplorerとGoogle Chromeでは表示されなくなります。

メモとして。

• Chrome
• Google
• Internet Explorer

2009年7月 4日

Firefoxが最新版3.5を7月1日にリリースされました！

Firefox 3.5 は、この 1 年間開発が続けられてきた Gecko 1.9.1 レンダリングプラットフォームを基盤としています。Firefox 3.5 では、新しい Web 標準技術への対応、パフォーマンスや使い勝手の向上、エンドユーザ向け新機能の追加など、現行バージョンから多くの変更が行われています。

ってことで、対応アドオンにびびりながらもアップグレードしてみました。

ただ、いくつかのアドオンは現時点では無効化されました。

使っている中でだめだったものをいくつかご報告。

• Norton IPS
• Norton Toolbar
• Sage-Too
• SBMカウンタ
• Web Developer[日本語版]

開発者の皆様、首を長くして待ってますので、よろしくお願いします。m(_ _)m

• Firefox
• アドオン

2009年6月14日

Web制作・開発のための今日のブックマークです。

・16×16
faviconなどのアイコン作成用のサービスです。
何気にアイコン作りのようなドット絵は楽しかったりしますね。

・Add-ons for Firefox
Firefoxの最大の魅力は、Firebugなどに代表される数多くのアドオンでしょう。
そんなアドオンですが、有効なのに日の目を見ないものが多いのはほかの世界でも同じです。
そんなアドオンをソーシャルの力を利用して掘り出そう的なサービスですね。

• Firefox
• はてな
• アイコン
• アドオン

2009年5月25日

Web制作･開発のための今日のブックマークです。

・iモードがJavaScriptやCookie対応、Flash動画も
進化してます、ドコモのi-mode。

・iモードブラウザ2.0｜NTTドコモ
本家NTTドコモの公式サイト内のiモードブラウザ2.0。

・Googleが目指す最高の検索UI
目指すものが高ければ高いほど、いいものが作れる。

• Google
• UI
• i-mode
• ドコモ

2009年3月24日

これは便利です！

Movable Type、WordPressなどのCMSでブログを書かれている方も多いかと思いますが、これは便利！とうなるFirefoxアドオンが3つ紹介されているのでご紹介。

CMSを超快適にするFirefoxアドオン3選

1. dragdropupload
2. Resizeable Textarea
3. It's All Text!

特に、1、3はいい感じですね♪
2は、Firefoxにデフォルトで実装されていないだけですしね。

• Firefox
• アドオン

2009年3月22日

GoogleがGoogle ChromeのJavaScript実行速度を体感してもらうためのサイト集を公開してるのですが、これが単純にすごいいいです。

Chrome Experiments

中村勇吾さんのFlash作品から感化されてJavaScriptで作ったような作品も多いです。

ballpoolやGoogle Gravity

非常に参考になりますね。

• Google
• JavaScript

こちらで紹介してるWEB制作・WEB開発は、各種サービスサイトでご相談ください。各種ライブラリ（Prototype.js、script.aculo.us、jQuery）によるAjax開発、Movable Typeサイト制作のサイトへぜひ一度アクセスしてみてください。

• サイトマップ
• お問い合わせ
• ホームページ制作
• Web制作アイデア
• HTMLコーディング
• SEO
• SEO対策情報ブログ
• ウェブデザイン
• twitterデザイン
• twitterサービス
• twitter情報
• 動画まとめ