クリエイティブなファビコンを設置しよう
2017年9月22日 Webサイト制作, 便利ツール Webサイトの制作時に、特に初心者さんが設置を忘れがちなファビコン。Webサイトをブックマークした際や、タブ表示した際にサイト名の横にちょこんと表示されている小さなアイコンのことです（Favourite + Icon = Favicon）。デバイスが増え、これまでとは設置方法が少し変わってきているのと、機能のついたファビコンも増えてきているので、その辺もあわせて紹介します！ ↑私が10年以上利用している会計ソフト！ ファビコンをデザインする ファビコンは16×16ピクセルとかなり小さいながらも、その存在は偉大です。複数のタブを開いている時や、ブックマークリストの中から、ひと目見てどのサイトか区別できるからです。 多くの場合、そのWebサイトのロゴマークを縮めたり、簡略化したものがファビコンデザインとして採用されています。CHANEL、A
ファビコン（favicon）とは？代表的なサイズと基本の作成方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
ファビコンはサイト閲覧時のタブ以外にも、多くの場所で使われていることがわかります。 また、上記以外にも検索結果画面にも表示されるため、そのサイトを表す適切なアイコンを設定するようにしましょう。 作成時のサイズは512px × 512pxのみでOK これだけサイズがあると、全て用意するのかと不安になってしまいますが、WordPress4.3以降のバージョンであれば512px × 512pxのPNG形式ファイルを作成すれば全てに対応してくれるようになりました。 複数作成する必要はないので安心してください。 WordPress以外の場合 WordPressを利用しておらず上記のような自動適用の機能がない場合、またはWordPressが4.3以前のバージョンの場合は、各サイズのアイコンを用意する必要があります。 各ブラウザのファビコン表示サイズは先ほどの表の通り16px × 16px が一般的です
jQueryでリンク先のファビコンをリンク脇にアイコンとして表示する方法
少し前にCSS-TricksにあったTipsを 見たんですが、利用している外部の サイトがあまり信頼性があると思え ないので代替案をいくつか書いてみ ようと思います。 この記事を見たんですが、 Favicons Next To External Links getFaviconっていうサービスを利用して短いコードでファビコンを取得する、っていう方法ですが、このサイトのサーバーが落ちたり、サービスが終了したら何も表示されません。GAE(Google App Engine)を使ってるみたいですけど、GAEはある程度無料だからどう、とかそういう意味ではなくてリスクの話。規模の大きな企業のサービスなら信頼できるんですけど・・海外サイトならgetFavicon.orgのほうがまだ信頼性はありそうですね。クライアントワークでは不安で使えない。と思った方も多いかと思います。 正直getFaviconって
これはお役立ち！リンク先のfaviconをリンクアイコンとして表示させる方法！ | バンクーバーのうぇぶ屋
よくリンクにアイコンを付けることってありますよね？アレをリンク先のfaviconを自動で表示させることってできればって思ったことってないっすか？ そんなWEB屋なら一度は（？）考えたことのあるfaviconのアイコン化がこんな感じで実装できることをつい先日知ることになり、びっくり感動してしまったので是非ご紹介させて頂ければこれ幸いです！ 元記事はこちら！ Favicons Next To External Links | CSS-Tricks これ実装すると、つまり下のような感じになるわけっすね！ これ、何をしてるのか気になって見てみたら、そもそもgetFaviconっていうサービスがあるらしいことをしりました。これはリンク先のURLをパラメーターとして渡すと、リンク先の<link>情報みて、faviconのURL引っ張ってくるって仕組みらしいですね。 http://g.etfv.co/h
16×16ピクセル箱ドットジェネレータ
ツイート どんどん宣伝してね！ このコンテンツを表示するにはFlashPlayerが必要です。 作った人：えいちぜろな（h071019） はてなハイク： Twitter： こちらの箱ドットジェネレータもよろしく。 *「箱ドット」はデザイン集団「NC帝國」がデザインしたペーパークラフト「グラフィグ」を元にした二次創作です。 ＜使い方＞ プルダウンメニューから各パーツを選択 ↓ 色を自由に変えられるパーツはメニューの右側にカラーピッカー（）が出るので、それをクリックして色を変更 （RGBの数値入力でも色を変更できます） ↓ 完成したら「画像を保存」ボタンを押して画像を保存 *16×16ピクセル、48×48ピクセル（3倍拡大）、64×64ピクセル（4倍拡大）の3種類のサイズで保存できます。 48×48ピクセルはTwitterアイコン、 64×64ピクセルははてなのアイコンとしてちょうどいいサイズ
faviconをアニメーションさせたりテキストを付与できるjQueryプラグイン「jQuery Favicon」:phpspot開発日誌
faviconをアニメーションさせたりテキストを付与できるjQueryプラグイン「jQuery Favicon」 2012年02月29日- jquery favicon faviconをアニメーションさせたりテキストを付与できるjQueryプラグイン「jQuery Favicon」。 faviconをダイレクトに書き換えることができ、既存のアイコンに文字をプラスして表示させることもできます 例えば、次のようなコードを書いたとしましょう すると次のようにアイコンが描画されます。 テキスト色で指定したカラーで XX という文字が描画されているのが分かります 更にアニメーションさせることも可能です。 細かい所ですが、より利用者の方に気づいてもらえるように、とこだわりたい場合に使えますね 関連エントリ ユーザへの通知UI全部のせなjQueryプラグイン「noty」 通知件数表示付きのメニュー実装j
getFavicon.org : 自動取得も可能なファビコン・ダウンロードサイト
getFavicon.org : 自動取得も可能なファビコン・ダウンロードサイト getFavicon.org 指定したサイトのファビコンがダウンロードできるサイト。 ファビコンはオリジナルの画像フォーマット以外に変換してダウンロードすることも可能です。 「get favicon」をクリックするとオリジナルのファビコンのリンクとその画像データ、そしてファビコン画像をクリックすると変換フォーマットでダウンロードできます。 さて、こちらのサイトでは、こういったGUIによる個々のファビコン取得サービス以外にも、ファビコンの自動取得が可能なAPIを公開しています。 これは以下のようなフォーマットでリクエストすると、指定したファビコン画像を返してくれるというものです。 http://www.getfavicon.org/?url=[domain]/[name].[resolution].[exten
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Free 18,000+ Animated Favicon Gallery
HTML5ホームページテンプレート無料配布 [Cool Web Window]
FreeFavicon - Your Favicon Source - FreeFavicon