これいいなぁと思ったのでご紹介。海外のチラシ、フライヤーを集めたサイト「Flyerfolio」です。紹介されているフライヤーのクオリティがどれも凄い！センスの良いものばかりです。
Read MoreCategory Archives: Web制作・デザインTips
CSSの疑似要素と疑似クラスをもう一度最初から
先日FlickrがIE7とFirefox3.6をサポート対象外にするという発表がありました。IE7もシェアが少なくなって来ていますし、IEの自動アップデートが今年から開始されるので最新のブラウザへの移行も進みそうです。
IE7をサポートから外せば結構色々な事ができるようになります。例えば:before, :after疑似要素(pseudo-elements)がIE8以上では使えるようになります。今回はこの疑似要素とはなんぞやというところから、疑似要素と疑似クラスの違い、そして実際に使えるTipsをいくつかご紹介します
Read MoreCSSでボックスを上下左右中央に配置する第３の方法
CSSを使ってBoxを上下左右中央に配置するやり方はこれまでもいくつかありました。代表的なのはdisplay: table; を使った方法と、positionプロパティとネガティブmarginを用いたやり方が有名ですね。ネガティブマージンを使った方法は以下のようなものです。
Read MoreWebKitに新搭載(予定)！CSSプロファイルツールでCSSのチューニングをしよう
HTML5が広まり始めた昨今、Webアプリケーションやブラウザ上で実現するゲームなどが出現し、Webブラウザは単なるWebサイトを閲覧するものからその範疇を越えて、アプリの実行環境として加速度的に進化しています。そういったブラウザ上で動作するWebアプリやゲームはパフォーマンスが非常重要になってきます。これまでは主にバックエンドやJavaScriptの最適化などの話は良く聞きましたが、CSSとそのパフォーマンスに関する話は少なかったように思います。
今回は「Profiling CSS for fun and profit. Optimization notes.」という海外の記事からCSSのセレクタとパフォーマンスの話と、Webkitに新たに搭載される(予定の)CSS プロファイラーツールをご紹介します。
Read MoreHTML5のアウトラインって何？ Web制作者なら知っておきたいアウトラインの仕組み
HTML5を理解する上で欠かせないのがアウトライン生成の仕組みとセクショニングコンテンツの理解です。sectionとarticleの違いを覚えるだけでは不十分で、現に間違った使い方をしているサイトが結構あります。今回はHTML5のアウトラインアルゴリズムについて深く掘り下げていきます。
Read More