
表題通り、4/17に開催される CSS Nite LP9 にて、コーディングコンテスト が開催されることになりました。
あらかじめ用意されている PSD データを基に、自分の考えに基づいてコーディングを行い、テクニック、デザイン再現性、メンテナンス性の高さを競うものです。
さらに今回のコンテストはなんと、HTML5+CSS3 でのコーディングとなります。
HTML5 とか CSS3 まだ使ったことないんだよなーという人も、この機会に参加してみてはいかがでしょうか。いちおう自分も参加するつもりでおります。
しかも発表は、CSS Nite LP9 イベント当日に行われるそうです。いくつかの賞が用意されているようで、最優秀賞作品はシックス・アパート公式サイトで公開されるようです。(デザインサンプルの提供がシックス・アパートで、コンテスト対象のデザインも MT5 のページ 1 ページをコーディングする、というものです)
対象ブラウザも Firefox3.6 と Safari4 と、かなり思い切ったものなので、思う様 CSS3 を書くチャンスですw
なかなか実務で使うことが難しい CSS3 ですが、たまに CSS3 のサンプルを書くとあまりにも楽なセレクタや表現の幅の広がりに涙が出そうになります。
そういった CSS3 の素晴らしさを知る、という意味でも参加してみると面白いと思います。

いよいよ Firefox3.5 がリリースされましたね。n
このバージョンアップにより、かなりの CSS3 セレクタに対応しました。
これで、Firefox, Safari, Google Chrome, Opera でほとんどの CSS セレクタに対応したことになります。(IE は相変わらず・・)n
取り立てて大幅にレイアウトが崩れる、という状況でなければ、積極的に使っていっていいのではないでしょうか。n
今回、Firefox3.5 が新しく対応した CSS3 セレクタを紹介します。(ちなみに、CSS3.info というサイトのチェックを参考にしました)
詳しい CSS セレクタの説明は CSSセレクタまとめ1、CSSセレクタまとめ2、CSSセレクタまとめ3 を参照ください。n
タイトルバーのところのアイコンも変わったみたいですが、なんか以前のより安っぽくなったような気がするのは自分の気のせいでしょうか・・w
ちなみに、過去のバージョンと共存させたい、なんていう方は、過去のバージョン置き場 からインストールしたいバージョンのセットアップファイルをダウンロードしてください。n
合わせて読むと役に立つかもなエントリー
4月あたりから、GENOウィルスというのが猛威をふるっていたそう。
現在は小休止状態みたいですが、大手サイトも感染していたとかで注意が必要です。
感染すると、以下のような症状が出るよう。n
それ以外にも、感染したパソコンで FTP に接続すると、ID/PW が盗まれて、自分が管理しているサイトにも感染させるためのスクリプトを埋め込む、というようなこともあるらしいので、サイト運営者や、FTP 接続をしている人は特に注意したほうがいいかもしれません。n
感染の確認方法や、詳細については以下のサイトが参考になりそうです。n
今回はサイト製作に便利な JavaScript ライブラリの紹介です。
IE6 では透過 PNG(PNG-24 PNG-32 の間違いでした;)を使えません。
いちおう画像を表示することはできますが、透過部分が反映されません。
しかし、代替処理として「AlphaImageLoader」という CSS の filter を使うことで使うことが可能です。
ですがこれ、ActiveXの問題なのか、指定している透過PNG画像のドメインが違うとうまく反映されませんでした。
しかし今回紹介するJavascriptライブラリは、VMLという技術を使ってPNG画像の透過を実現します。
そのため、ドメインなどの問題もなく、しかも指定も楽でimg要素、CSSともに使用できるためとても便利です。
しかしながら、やはりこちらも使用には何点か注意点があります。
CSSの背景にPNG画像を指定した場合は問題ありませんが、img要素に(つまり通常の画像として)指定した場合、いくつかのライブラリで実装する、フェードアウトやフェードインの視覚的効果が実行されません。
推測では、filter 機能が使えないために透明度が変更できないのだと思います。
なので、もしこのライブラリを使う場合は CSS の背景として使うのが無難です。
簡単にデモを作ってみたので見てみてください。
スクリプトファイルを読み込んだあと、「DD_belatedPNG.fix('.png_bg');」で透過 PNG を使用している要素を指定します。
指定の仕方は簡単で、CSS セレクタと同じように指定ができます。
複数指定する場合は、やはり CSS と同じようにカンマ区切りで列挙します。
合わせて読むと役に立つかもなエントリー
世界最高峰のカンファレンスがついに来日!!
東京でアジア初開催!n
ってことで、web業界最先端のカンファレンスが開催されます。
このカンファレンスのことを知ったのは、CSS3のアニメーションの記事を書いたときにも少し触れた、CSS Reloadedというイベントのときでした。
このイベントで、CSS3のすごさを知り、かなり詳しくなったと思っていたCSSでこんなに驚かされるとは思っていませんでした。
こうしたイベントやセミナー、カンファレンスには、いくら自分で詳しくなったなぁと思っていても出てみるべきだなと実感してます。n
が!
このカンファレンスの日、あいにくと予定が入っていて参加できず・・。
というか、こういうカンファレンスとかセミナーがあって、しかも行って見たいなーって思うのに限って予定がかぶるというorz
なんか出てはいけない運命でもあるんだろうか・・。
まぁでも、それは置いておいても。n
とある記事で見つけた画期的なGoogleサービスを紹介してみる。
今回紹介するのは以下のサービス。n
Prototype.jsやjQuery.jsなど、最近よく使われているJavascriptライブラリたち。
メインで使っているライブラリやそれのプラグインでは実現できない(あるいはちょっとめんどくさい)表現を、別のライブラリを使って実現しようとしたりすると、メインではないだけにどこに保存したか忘れていたり、まったく新規の場合はダウンロードサイトから落としてきて解凍してアップしたり・・。n
ライブラリは便利でも、ver違いがあったり読み込むファイルを変更したりが面倒になってくる。そこで活躍するのが上記サービス。
これはGoogleが提供しているサービスで、各verごとの有名なJSライブラリをGoogleのサイトから読み込ませる、というもの。
以下に利用するための簡単な説明を書きます。n
最近知った「Googleアラート」。
自分の興味のあるキーワードを設定しておくだけで、それに関連する記事をピックアップしてメールに届けてくれる機能です。n
キーワードには「CSS」や「html」、「javascript」などと記載して使っています。
届いたメールのサンプルはこんな感じ↓n
設定には、キーワード以外に配信頻度が設定でき、「1日1回、その都度、1週間に1回」が選べます。
また、収集元をニュースやウェブ、グループとカテゴリを選択。(総合もある)
収集元で配信された記事から、設定したキーワードに関連する記事を届けてくれる、というものです。n
RSSより設定が簡単で、なにより自分が購読していないRSSなどの情報を届けてくれるため、RSSと合わせて使うとより情報収集力がアップすること間違いなしです!n
関連エントリー