先日FlickrがIE7とFirefox3.6をサポート対象外にするという発表がありました。IE7もシェアが少なくなって来ていますし、IEの自動アップデートが今年から開始されるので最新のブラウザへの移行も進みそうです。
IE7をサポートから外せば結構色々な事ができるようになります。例えば:before, :after疑似要素(pseudo-elements)がIE8以上では使えるようになります。今回はこの疑似要素とはなんぞやというところから、疑似要素と疑似クラスの違い、そして実際に使えるTipsをいくつかご紹介します
Read More
CSSを使ってBoxを上下左右中央に配置するやり方はこれまでもいくつかありました。代表的なのはdisplay: table; を使った方法と、positionプロパティとネガティブmarginを用いたやり方が有名ですね。ネガティブマージンを使った方法は以下のようなものです。
Read More
HTML5が広まり始めた昨今、Webアプリケーションやブラウザ上で実現するゲームなどが出現し、Webブラウザは単なるWebサイトを閲覧するものからその範疇を越えて、アプリの実行環境として加速度的に進化しています。そういったブラウザ上で動作するWebアプリやゲームはパフォーマンスが非常重要になってきます。これまでは主にバックエンドやJavaScriptの最適化などの話は良く聞きましたが、CSSとそのパフォーマンスに関する話は少なかったように思います。
今回は「Profiling CSS for fun and profit. Optimization notes.」という海外の記事からCSSのセレクタとパフォーマンスの話と、Webkitに新たに搭載される(予定の)CSS プロファイラーツールをご紹介します。
Read More
Webサイトをコーディングする場合、見出し(h1〜h6)のスタイリングって結構厄介ですよね。特にCSS2までは角丸や影を表現するには画像を使わないとできませんでした。しかしCSS3を使うと格段に表現の幅が広がります。今回はCSS3を使って見出しをスタイリングする方法をご紹介します。
Read Moreここ1,2年でiPhoneやiPadに代表されるモバイルデバイスの発展と普及には目を見張るものがあります。Androidもまたしかり、いよいよiPhoneを追い抜こうかという勢いです。iPhoneアプリやAndroidアプリに注目が集まり、多くのディベロッパーが参入しています。昨年海外では9歳の少年がiPhoneアプリを作ったというニュースもありました。
確かにスマートフォンが巷を席巻し、猫も杓子も「アプリ！アプリ」となっていますが、あえて言おう「HTML5とWebアプリの時代が来る」と・・・
iPhoneやiPad,またはAndroidのモバイルデバイスではネイティブアプリ(端末上でネイティブ動作するアプリ)が主流です。しかしこの流れは今後5年のうちに大きく変わってくるでしょう。もちろんiPhoneアプリが無くなると言う話ではなく、ネイティブアプリとWebアプリそれぞれが上手く棲み分けする形になってくると思います。その理由の1つが、HTML5の普及です。iPhoneやiPadには最も先進的な(悪く言えば先走りし過ぎてる)WebkitベースのSafariが載っています。Android端末には同じくWebkitベースのChrome、またはOperaが搭載されています。これらのブラウザはどれもいち早くHTML5とCSS3に取り組み、先進的に実装を進めています。
つまりiPhoneやiPad, Androidといった先進的なモバイルデバイスの多くには「HTML5とCSS3を使う環境が既にある」ということ。機は熟したのです。 Read More