No More Excuses - 凡人が奮迅して目指す起業ブログ -5ページ目

HTML5でサイトを作ってみる

先日記載した、HTML5対応を進めよう！ですが、私もHTML5で、お試しをしてみました。
まず、気づいたのは。。。

新しく追加された新要素に、CSSを指定。
例えば、ヘッダータグ<header>に、背景色の色をつけると。。。。

IE(Internet Explorer)はCSSが効いてない！！

設定をしても、色がつかないっ。。＞_＜

/*** こちらはIE8の画面 ***/

他のブラウザは、指定通りに色がつきます。
/*** これはChrome最新版 ***/

このサンプル画像を見てお分かりのように、見た目にもIEと他のブラウザで差が出ます。
IEだけしか確認しないで、サイトの作りこみをするのは危ないですね。

ちなみに、私のIEはバージョン8のままです。9にはしていません。
他のブラウザを見てみましたが、他は大丈夫そうです。
かつて黄金時代を迎えていたIE、今ではすっかり時代遅れです。。。

調べてみると、出てくる出てくる、HTML5のIE対処方法ｗ

IEで、HTML5によるCSSを対応しようとしたら、どうやらJavaScriptを使って、
要素を作ってやる必要があるみたいです。要素がないから色が付かないわけで、、
なら要素そのものを作ったらいいんじゃない？ってことか＾＾；

確かに、JavaScriptで要素を作ってやって、その後、CSSで、ブロック要素の設定をしてあげれば、
IEにも新しく追加されたHTML5タグにCSSがあたるようになりました。

↓↓ こんな感じでIE8にも色がついた ↓↓

やり方などは他の方も書いているんですが、私自身のメモ用に、改めて書こうと思います。

ふむふむ、と思った方はポチっとｵﾈｶﾞｲします☆

Firefox Syncがアツイ。

前回、前々回の続きで、Firefoxシリーズの第三弾の徒然をお送りします。

個人的には、この Firefox Sync がイケているのではないかと思います。
ちなみに、syncは「同期」という意味です。

私も、自分のiPodTouchに入れてみましたが、
これは便利っっ！！

以前も似たようなブックマーク同期サービスがありましたが、今はこのFirefox Syncがあれば大丈夫！！
複数のパソコンや、なんとスマートフォンに至るまで、同期してくれるというスグレモノです。
もう、外出先で、「あ～～！あのURLは家のパソコンにはブックマークしてあるんだけど。。。」と思わなくて済みます♬

最新版のFirefoxでは、以前に比べて7倍ほどの速度アップがあるほか、
↓　Virtual Park というTwitterがらみのサービスもある模様。

私はまだ試してませんが、ぱっと見は面白そうです。
Virtual Parkの説明は コチラ からどうぞ

ふむふむ、と思った方はポチっとｵﾈｶﾞｲします☆

Firefox - 拡張機能をちょっとご紹介

さてそれでは、前回の続きで、Firefox についてちょっとご紹介します。

エンジニア御用達ブラウザであり、その理由の一つとして、アドオン(拡張機能)の充実が挙げられます。

アドオンはどんなのがあるの？って聞かれても、沢山あり過ぎて説明不可能です^^;
とりあえず、使ってマス、ってものだけをいくつかご紹介しますね。

//エンジニア御用達（の一部）
Firebug
Web developer
開発者向けなのでHTML,CSS,JavaScriptの検証とかが必要な人向けです。
用途などの説明は、開発者向けになるので割愛します。

//Webデザイナー関係の方は、この辺りが役に立ちそうかも？
Open With
MeasureIT
Color Zilla

このOpen Withは、IEやChrome、Safari、Operaといった、Firefox以外のブラウザでそのページを開くというものです。
HTMLやCSSでページを作った場合、いろいろなブラウザで、デザイン等の崩れがなく見れるかどうかの確認は重要です。
（最も、Webプログラマもこの確認をしますが）
その時に、可能な限りサックリと確認出来たら、時間も節約できて便利ですよね。
英語サイトでの評価も高く、皆一様に五つ星ですね。

MeasureItは、コンテンツの大きさや長さ等が計れちゃいます。
この画像、一体何ピクセル何だろう？とか、画像を何ピクセルにすればこの間に入るんだろう？？等、
手っ取り早く大きさを把握したい時に、これでサクッと調べてしまいましょう。

ColorZillaは、サイトを見ていて、「この色いいな。使いたいけど、カラーコードは何だろう？」と
思った時に、色情報を抜きとれます。

とにかく、沢山あるので以下から検索したり、
どんなものがあるかなー？？とみてみて下さいね＾＾

//Firefox アドオン - 日本語
https://addons.mozilla.jp/firefox/

//Firefox Add-Ons - English
https://addons.mozilla.org/en-US/firefox/?browse=featured

次回は、Firefoxの”これはっっ！！”というものをご紹介 >>>

ブラウザ乗り換えてみるか、、と思った方はポチっとｵﾈｶﾞｲします☆