esprit
CSS BloomというブログなどのCSSデザインをみんなで評価するサイトにて、高評価のデザイントップ20です。 日本のブログデザインのコンセプトとちょっと違うのが多く、見ているだけでも面白いです。ブログデザインの展示会といった感じ。また、どんなデザインのブログにしようかな~と思っている場合にはかなり参考になります。 Top 20 Blog Designs | Blog http://silentbits.com/?p=339 http://silentbits.com/?p=385 以下、上記サイトで出てきたトップ20のサイト第1弾。 Veerle's blog 2.0 - Webdesign - XHTML CSS | Graphic Design Avalonstar. The Aries Project. By Bryan Veloso. Matt Brett Joshuaink
「curvyCorners」はフリーのJavaScriptで、角が丸いコーナーをDIV要素で簡単に作ることが可能。特徴は画像を使ったのと同じくらい角がなめらかに丸くなる点と、いたって利用が簡単な点。 どれぐらい丸くなるのかという実例とコードのダウンロード、設置方法は以下を参照。 例その1、3ピクセルの白いボーダーを使い、角は半径20ピクセルで丸くなってます 例その2、固定幅と高さで画像を固定し、角は半径20ピクセルで丸くしている例 ダウンロードはこちらから 使い方は以下を参照 http://www.curvycorners.net/ ほとんどのメジャーなブラウザをサポートしているので汎用性も高く、使い勝手もいい感じです。
wg:Bubble Tooltips Bubble Tooltips are an easy way to add (via a bit of CSS and javascript) fancy tooltips with a balloon shape to any web page. 吹き出し方式のツールチップテキスト作成JavaScriptライブラリ。 次のような吹き出し方式のツールチップテキストを作成できます。 次のようなJavascriptコードを書いておき、 <script type="text/javascript" src="BubbleTooltips.js"></script> <script type="text/javascript"> window.onload=function(){enableTooltips()}; </script> アンカー<a>タグのt
ユーザビリティのヒント(1) 多くのユーザーは 一度に1本しかジュースを買わない 「自動販売機での不要な動作から考える」 ソシオメディア 上野 学 2006/6/2 Webアプリケーションのユーザーインターフェイスデザインに役立つさまざまなTips集。自動販売機でジュースを買うときの不要な動作から考える。(編集部) 今回からはWebアプリケーションのユーザーインターフェイスの続編の「Tips編」として、ウェブアプリケーションのユーザーインターフェイスをデザインするうえで役立つさまざまなヒントを、少し細かな視点から具体的に見ていきます。 複雑な構成物を作り上げるには、基本となるコンセプトやアーキテクチャといった抽象度の高い部分から考えていくトップダウン式のアプローチと、構成要素の細部から考えていくボトムアップ式のアプローチの両方が必要になりますが、前回までの経験則編はどちらかといえばトップダ
このサイトを閲覧するには、JavaScriptおよびMacromedia Flash Player8以降が必要です。 お手数をお掛けしますが、ブラウザのJavaScriptをオンにし、下記のリンクよりFlash Playerをダウンロードしてください。 また、プラグインの判定を回避するには、ここをクリックしてください。
上記画像のような小さなボタンバナー画像に見覚えはないでしょうか?これを簡単にオンライン上で作成できるのが無料サービス「Button Maker Online」です。80×15か88×31サイズの画像が簡単に作成できます。 Dynamic Drive online tools: Button Maker http://tools.dynamicdrive.com/button/ 使い方は以下の通り。 「Base Color is Transparent」:背景色を透過色にする 「Base Color」:背景色を決める。「Base Color is Transparent」のチェックを外すと選択できる 「Font」:文字のフォント。SilkscreenとSans-Serifの2種類。 「Border Color is Transparent」:境界線の色を透過色にする 「Border Colo
Thickbox - One box to rule them all. Thickboxを使えば簡単に画像やHTMLファイルの中身をLightBox風にカッコよくページ内表示できます。 画像の場合 必要なCSSファイルとJavaScriptファイルをインクルードした上で、次のように画像タグを<a>タグで囲います。 <a>タグには class="thickbox" を指定し、title属性に画像の説明文を入れます。 <a href="images/image2.jpg" title="画像と一緒に表示させたい文字列" class="thickbox"><img src="images/image2_t.jpg" alt="Image 2"/></a> たったこれだけで、次のようにLightBox風に画像を開くことが出来ます。 titleで指定した説明文が画像の下に入ってます。 次にHTML
Googleのロゴで使われているフォントは「Catull」という名前らしいです。書体のサンプルは IdentiFont にあります。(この書体自体は残念ながら有料です。)書体が手に入らなければ、別の書体で試してみてください。 次にGoogle風ロゴの作成ですが、想像していたよりも作り方は簡単です。慣れてしまえば5分で出来上がるはずです。どのように作っているかは下のPSDファイルを開いてみてください。今回はPhotoshopを用いて作りましたが、使っているフィルタは「ドロップシャドウ」と「ベベルとエンボス」の二つだけなので、フリーのソフトでもこの機能があれば十分作れると思います。上下のロゴはPhotoshopを使って実際に作成したものです。 → Google風SensitiveとGoogleロゴのPSDファイル ※フォント情報はラスタライズしてあります。 上のSensitiveのサンプルがト
About Stealing These Buttons It all began on October 22, 2002 when Jeremy Hedley posted the the original offering of buttons. I, as many others, were infatuated with these for quite some time and begun collecting as many as I could. Eventually my website became the depository for all things STB. The administration backend, which allows me to stay sane while keeping a database of 3700+ buttons, was
2006-05-05T20:05:06+09:00 Illustrator などを利用してベジェ曲線で書いた絵に Photoshop を利用してつややかな表現を加える方法は何通りもあり、すでにたくさんのノウハウが存在しますが、それなりのものならほんの少しの作業で実現できます。いつも違う方法でやってしまいあとで苦労する事があるので、自分自身の忘記録も兼ねてその Tips をまとめておきたいと思います。Photoshop CS で作成したデータですが、サンプルファイルも用意しているのでもしよろしければダウンロードして使ってみてください。 サンプルファイルをダウンロード(tsuyayaka-sample.psd) サンプルファイルはせっかく角丸の四角形で作成したので、Feed Icon として利用できるように、オレンジで描いたレイヤーと、アンテナ部分を描いたレイヤーも追加してあります。 レイヤー
This Week’s Weekly Links of the Week - Week 13 Aug13 abbr tag, acronym tag, adsense, AJAX, am deadlink, art, bully, bush, democracy, earthquake, flickr, flickrstorm, ford, gas, global warming, google, javascript, john powers, military themepark, online privacy, photo fraud, photorealism, programming, reuters, rockstar, semantics, topix, tripod, tsunami, tv, video, video games web design This week’
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く