画像の使用を(略)CSS大会: 画像ゼロ部門に参加してみた

via
画像の使用を極力控えてスペースとかボーダーとかのみでCSSデザインする大会とか誰かやらないですか (JamGraffiti)

開催決定してからどれだけたっているんだよ…と思いながら今更ながらに手を付けました。いざ手を付けたら完成までに1時間半くらい。まあそれだけ時間が掛かった事にも驚きなくらい面白みも何も無いCSSになっています。

コンセプトは成分解析 with 和色大辞典: 色々と解析してみた (CEFA::Blog)にて出た色彩を使ってみる事。狙いから考えれば成功だと思うのですが如何ですかね。丁度10分前くらいにメール送信したんでアップして頂けるのがいつになるかはわかりませんが、公開されたらスナップ出してみようかと。

投稿後の雑感: このCSSもう少し触ってブログのデザインを変えてみようか…とか妄想してみる。

参考URL
画像の使用を極力控えてかっこいいCSSデザインをやってみよう

DOCTYPE: 実は XHTML 1.0 Strict では無いんです

via
今更ですがCSS Naked Day2007参加サイトをまとめてみた | caramel*vanilla

さらに今更なんですがちょっとした誤解を解いておこうと(まあどうでも良い話なんですが)。

ただ並べただけでは面白くないのでDTD別にAnother HTML-lint gatewayでの採点順に敬意を込めてリストアップしてみます。

というわけでこのサイトも掲載していただきました。ホントありがとうございます。でも実は XHTML 1.0 Strict じゃいないんですよ。

Another HTML-lint: 新テンプレートで高得点を狙う (CEFA::Blog) でも少し書いたんですが、 Another HTML-lint では XHTML 1.1 plus MathML 2.0 を解釈する事ができないようです。そんなマニアックなドキュメントタイプ使うなよ…と言われると弱いのですが、何となく使っちゃったんだから仕様がない。

本当は数学的なエントリもしたくての仕様変更なんですが、最近は飾りだったりします。それでもあえて言わせてください。

「このサイトのドキュメントタイプは XHTML 1.1 plus MathML 2.0 なんです 」

一応コメントしておきたかっただけなんです。 lomoさん気悪くしないでください。あと強制的に XHTML 1.1 でチェックしたからといって劇的に点数があがるわけでもありません。あしからず。

コーディングコンテスト Vol.1: 応募しました

コーディングコンテスト Vol.1: 参加できるのか、それが問題 (CEFA::Blog) でかなり不安気な参加表明をしましたが、無事に〆切の 22日 に応募しました。本日付で送付データの確認返信メールを頂きホッとしています。

完成に至るまでの作業なんですが、実は結構悩みました。理由は次の通りです。

  • PhotShop 持っていないどころか使った事も無い。
  • 画像パーツを組み合わせたページの生成なんてした事無い。

ある意味終っている状況だったのですが、勉強ですからね。トライしてみたというわけです。因みに一度全て作ってみてから提案部分を加えた内容に作り変えました。二度手間だったかもしれませんが、実際にやってみてからでないと改善効果が実感できないですし。こういうところは普段業務でコーディングされている方と大きく異なるんだろうなと思いました。

結果発表の際には自分の不出来を実感する事になるでしょうが、それはそれで経験ですから。他の方々の作品を参考にできればと思います。公開が楽しみです。

参考URL
審査対象の応募を締め切りました:コーディングコンテスト Vol.1|CSS HappyLife

コーディングコンテスト Vol.1: 参加できるのか、それが問題

via
コーディングコンテスト Vol.1 ?Coder’s High?|CSS HappyLife

そもそも PhotoShop を使った事が無いという時点で終わっている気もしますが、なんとなくコーディングという言葉には惹かれてしまうわけでして。とりあえず素材をダウンロードして弄ってみようかなと思っています。〆切まで10日ほどですから何処までできるかは判りませんが、チャレンジという事で。

完成しなかったら当然応募しませんよ?(当たり前)PhotShop って高いんですね。手出ないです。使わない方法を考えてみるか。

[amazonjs asin=”B000CGXAJ0″ locale=”JP” title=”Adobe Photoshop CS2 日本語版 Windows版 (旧製品)”]

YouTube -> Valid: 便利でよい感じ

via
小粋空間: YouTube の Embed タグを一発で XHTML valid にする「YouTube -> Valid」

というわけで変換したタグを使ってみました。手間が省けるのでこういったツールは大歓迎です。でも偶にはマニュアルで修正しないと本当の Valid XHTML の構文を忘れてしまいそうな危機感を覚えたり。便利なことは良いことだけれど便利すぎるのも怖いですね。

因みに引用した動画の内容は本文に全く関係ありません。

http://www.youtube.com/watch?v=48FtUS87RZI

参考URL
YouTube -> Valid

CSS Cheat Sheet を印刷してみた

参照URL
[N] CSSの情報が1枚にまとめられた「CSS cheat sheet」

「これさえあればCSSが書ける」という様なものではありません。ある程度構文とか把握していて何か判らない所があった時に属性値とか調べる人向けのツールです。早速印刷してみましたが、丁度A4一枚にピッタリ収まるのが嬉しいです。

サイトデザインを弄る時にはもってこいですね。必要な情報としては十分です。ただ贅沢を言うなればfont-familyで指定する論理フォント名まで記載されていたら神だったんだけれど。

参考URL
CSS Cheat Sheet

FeedBurnerに移行する

最近、何かとサーバが高負荷状態になるようです。そこでフィードの生成くらいは外出しにしようと FeedBurner に登録しました。基本的な作業手順というか内容は FeedBurnerに移行した件について。 – Ogawa::Memoranda と全く同じです。今後フィードは次の URL になりますので宜しくお願いします。

これで作成するフィードは1つになって何となく気分爽快。因みにフィードアイコンはFeed Icons – Home of the standard web feed iconからダウンロードしてきたものを使用しました。

参考URL
FeedBurner – フィードを登録ましょう。あとはFeedBurnerにお任せください

続きを読む FeedBurnerに移行する

RSS 1.0に割当てていたXSLTが無視された件について

Firefox 2.0を導入しましたの後自分のサイトが正常に見えているのかをチェックしていたのですが、RSS 1.0が割当てたスタイルシートを通して見えないという事に気が付きました。

なんだか寂しい気分です。

余りに寂していじけていたらThe Web KANZAKIでもネタに上がったりしていたわけでして。確かに試してみたらIE7でも同じ現象が。

何か余計な事しでかしてくれるよりプレーンなXMLを表示してくれた方が、まだ便利だったかも。特にRSS 2.0とかATOM 1.0とか表示できない要素多すぎです。どうせユーザのスタイルシートを無視するのだったらもっと真面目に作ってください。

トホホ。

参考URL
ちょっとしたメモ – IE7もFirefox2もRSSを特別扱い (The Web KANZAKI)

RSSアイコン 2.0を使ってみた

参照URL
My RSS 管理人 ブログ: 説明ページつきのRSSアイコンを作成する無料サービス – RSSアイコン2.0
RSSアイコン2.0 : RSS の説明ページを自動生成 – Make your site Feed-Icon-Friendly

確かにRSSやATOMの認知度はまだまだ低いです。『だから知ってもらおう』的なツールって事なんでしょうね。私も使ってみたので、アウトプットを下に貼り付けてみました。

クリックしてもらうと実際の生成ページに飛びますが、何となくIE7のXSLTに似ているかも。あと、プレビューの部分にitemも表示してしまうと、華やかな感じがしてよいと思いました。

※名前に 2.0 とついていますが、なんとなくつけただけですので「にー、ちょん、ぜろ」とでもよんでいただければ…w。

兎にも角にも2.0ブームですね(笑)

Color Checker Bookmarkletsを使ってみた

範囲指定からその部分のRGBを表示してくれるbookmarkletです。複数のブラウザ用にそれぞれ公開されていますので自分にあったものを選択できるのが嬉しいですね。

CSSを作成する際に一番気になるのが色彩です。背景とのバランスや目に優しい色合いで確りと見えるかと云った部分が一番難しいんですよね。背景に画像を貼っているサイトでは十分に生かしきれないかもしれませんが、コントラストの数値を参考にユーザフレンドリーなサイト作りを目指してみては如何でしょうか。

参考URL
Color Checker Bookmarklets (The Web KANZAKI)