URLからfaviconを3Dドット絵に変換してくれる「favicon2dots」: DesignWorks Archive
使用方法は至って簡単でトップページに3Dドットファビコンを制作したい、サイトのURL入れ込むだけで簡単に作成する事ができます。また、はてなidにも対応していてid:○○○○ のようにユーザーIDを打ち込むとはてなユーザアイコンを3Dドット風に変換してくれます。 詳しくは以下 オプションもあり背景色の指定や透過色の指定もできますので色々なWEBの制作に使えそうです。試しに普段お世話になっているブックマークサービスの3Dドットファビコンを制作してみました。 ■はてなブックマーク ■Buzzurl ■del.icio.us ■livedoorclip こういった形でファビコンを見てみるのも面白いです。 なお制作したファビコンはfavicon2dots保存されますので、いままでどんなファビコンが変換されてきたかが分かります。また色検索も可能で画面右上のカラーパレットから色別にファビコンを検索する事
画像からfaviconを作成する「FavIcon from Pics」 - ネタフル
ブロガーに役立つ“情報源”120サイト（テンプレート・プラグイン・アクセス解析etc.）というエントリーで紹介したのですが、画像からfaviconを作成することができる「FavIcon from Pics」というサイトがありました。 使い方は簡単で、画像をアップロードして「Generate FvIcon.ico」をクリックするだけです。 ということで「ネタフルくん」をもとに作ったのがこちら。 プレビューもできるので、気に入らなかったらダウンロードしなくても良し、です。 そして、単純にfaviconを作成するだけでなく、テキストスクロールしたり、アイコンをアニメーションしたりといったオプションもあります。 次はネタフルのロゴ画像から生成してみました。 ロゴ画像の下に位置する「NETAFULL」というテキストは当然、見えなくなっていますが、ここまでできれば十分ですね。 下は「NETAFULL」
Web 2.0っぽいロゴがさくっと作れる『LogoCreatr』 | SiMPLE*SiMPLE
またかよ・・・という方もいらっしゃるかと思いますがｗ、Web 2.0風のロゴジェネレーターをご紹介。いろいろ設定できて便利ですよ。 ↑ 設定項目はこちら。フォントの色、サイズ、星の形などいろいろできます。文字ごとに色も変えられますね。 ↑ この設定で作ってみたのがこちら。 ↑ ちなみに別メニューでボタンジェネレータもありますね。こちらも便利。 似たようなジェネレータは他にもありますが、かなり柔軟に設定できるので個人的にはこれが今のところ一番かも。よろしければどうぞ。 » Web2.0 – Logo Creatr こちらもあわせてどうぞ。 » 簡単に2.0っぽいロゴがつくれるメーカー | i d e a * i d e a
無料で使えるベクターデータを配布しているサイト27選 | S i M P L E * S i M P L E
拡大縮小しても画質が劣化しないベクターデータは何かと便利です。 Tutorial Blogで無料で使えるベクターデータを配布しているサイトが紹介されていました。全部で27あります。 ふきだし風のパーツやアクア風のボタン、国旗やトランプなど、さまざまな用途に使えそうです。 ↑ こうしたサイトデザインに使えるようなものや・・・。 ↑ ちょっといいのかな、これ？というものとか・・・。 ↑ 自分ではとっても作れなさそうなやつとか・・・。 形式はAIやSVG、PDFなどさまざまですね・・・それってただのアイコンでベクターデータではないのでは？というのも若干混じっていますがそこはご愛嬌。 よろしければ下記サイトからどうぞ。 » Free Vector Downloads – Photoshop Tutorial
クールなアクア風ボタンのベクトルデータが無料で72個！ | SiMPLE*SiMPLE
クールなアクア風ボタンのベクトルデータが無料で72個！ すぐに使えそうなアクア風ボタンのベクトルデータが無料で公開されています。イラストレーターなんかで編集すればぱっと使えそう。 » 72 Free Vector Glass Buttons and Bars ファイル形式はAI、PNG、EPS、SVG。環境にあわせて必要なものを使うとよいでしょう。ただ手元のIllustrator 10ではAIが開けなかった・・・最新版じゃないとだめなのかな。 どちらにしろこういうベクトルデータの公開はうれしいですね。 CS3 で開けたので試しに Illustrator 10 形式で保存し直したところ、警告メッセージは出ますが特に何かが劣化するようには見えませんでした。(見落としているかもですけど) CS3 を持ってる人を探してファイル形式を変換してもらうと良いかもしれません。
CSSだけでイメージマップを作る有用サンプル:phpspot開発日誌
CSS Image Maps - Flickr-like Technique? Below is a sample image map that's built entirely using CSS and XHTML. CSSだけでイメージマップを作る有用サンプル。 画像の特定部分にカーソルを合わせると、説明を画像上に表示できるCSSとXHTMLサンプルが公開されていました。 JavaScript を一切使っておらず、CSSだけで実現されているところがすごいですね。 JavaScript が要らず、次のような綺麗なHTMLで実現できるところも嬉しいですね。 実装も簡単そうです。 <dl id="officeMap"> <dt id="monitor">1. Monitor</dt> <dd id="monitorDef"><a href="#"><span>Here's my 17" M
Forgot the Milk. - Faviconをサクサク作ってくれる８つの Faviconジェネレータ サイト
Favicon は、サイトオーナー（ブログオーナー）の自己満足だけではありません。そのサイトやブログの個性を表現することもさることながら、ユーザから「それなりに手をかけているサイトだな」と興味や安心を抱かせる効果もあるように思えます。 そんな Favicon ですか、あなたはどのように作成していますか？ここで紹介するサービスを利用すると、簡単に Favicon を生成することができます。元となる画像からicon形式のファイルを出力してくれるものもあれば、文字入力から作成するものまであります。中にはビットを塗りつぶして１から作成できるものも・・（それってオンラインでやる必要あるのかな・・）。 自分にあった簡単Faviconジェネレータを見つけてみてください。 1. FavIcon from Pics 日本のブログでも結構紹介されているサイトですね。基本的には画像をアップロードして icon
CSSとPNG画像を使ってクールなWeb2.0風ボタンを実現:phpspot開発日誌
Scalable CSS Buttons Using PNG and Background Colors?|?David’s kitchen There has been a lot of talk about CSS buttons lately. CSSとPNG画像を使ってクールなWeb2.0風ボタンを実現。 ボタン画像を作成する際に、毎回、画像編集ツールでボタンを作らずとも、次のようなカッコいいボタンをCSSを使って実現する方法が書かれています。 ボタンの文字列が変わってもHTMLを変更するだけで新しいボタンが作れます。 これは覚えておいて損はないテクニックですね。 但し、残念ながらIE6ではうまく表示することが出来ません。
class属性指定で簡単に画像エフェクトをかけられる「Corner.js」:phpspot開発日誌
Corner.js Corner.js 1.0 allows you to add corners to images on your webpages. It uses unobtrusive javascript to keep your code clean. class属性指定で簡単に画像エフェクトをかけられる「Corner.js」。 classに courner や ishadow40 , inverse などの値を指定＆組み合わせすることで次のように画像に簡単にエフェクトをかけられます。 javascriptファイルを読み込んで置くだけであとは class 名指定をするだけで画像にエフェクトをかけられるということでなかなか便利ですね。 ただし、ＩＥでは使えないようなので注意が必要です。 関連エントリ 注目！Flashを応用してHTML＆CSSだけでは通常作れない画像効果を得る「
透過PNG画像によるWEBデザインテクニック集:phpspot開発日誌
Digital Web Magazine - Creative Use of PNG Transparency in Web Design The PNG image has been widely overlooked by the web design community?and mostly for good reason. Until recently, it hasn’t been possible to take full advantage of the format and have it work reliably in all browsers.透過PNG画像によるWEBデザインテクニック集が色々公開されています。 透過PNGと画像を組み合わせることで、HTMLによる画像イメージの作成が色々可能になるんですね。 WEBデザインの際に活用することで、よりスマートなデザイン
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
貧乏ウェブデザイナーの無料写真素材サイト : HotWeb Magazine
Webmarket
日本語で吹き出し画像が作れる『Yet another make your own speech bubble!』 | POP*POP
FFFFOUND!