ファビコンに更新通知の数字バッジ等をアニメーション付きで表示させるスクリプト・favico.js
ファビコンに更新通知の数字バッジ等をアニメーション付きで表示させるスクリプト・favico.jsのご紹介です。メールやソーシャルサイトなどで最近よく見かける、ファビコン通知バッジを実装します。 メールを受信したり、投稿があったらファビコンに数字を表示させる、というもの。アニメーションエフェクトもあるので目が行きやすいかも。対応ブラウザは若干限られます。 更新があると数値が増える。増える時にアニメーションで数値が変わる、みたいなの。動作デモはスクリプトの配布サイトで確認出来ます。 var favicon=new Favico({ animation:'slide' //アニメーションエフェクトの指定 }); favicon.badge(1);エフェクトは上記のようにセッティングします。 var favicon=new Favico({ bgColor : '#5CB85C',//背景色 te
Favicon の指定方法 - それマグで！
favicon は便利な仕組みですよね。ブックマークやタブの判別にファビコンは無くてはならない。プログラムからfaviconを取得しようとしたら、faviconのアドレスがわからないと無理、でもってその仕組みがわからないとできない。 favicon指定２つの場所 ファビコンには２つの指定場所がある。 サイトのルートディレクトリ １：サイトのルートディレクトリに設置が基本 http://www.example.com/favicon.icoサイトのルートディレクトリにfavicon.icoを取得するとブラウザが自動的に取得に行ってくれる。 実例：Amazon.co.jpの場合 http://www.amazon.co.jp/favicon.ico でアクセスすると、ファビコンが取得できる。 ２：HTMLで指定 <link rel="shortcut icon" href="http:/ima
スマホサイト対策！ウェブクリップアイコンの設定を忘れずに | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは！サリーです。 昔は、設定していたら「あらオシャレ」くらいの感覚だったfaviconも、近頃はすっかり必須項目となってまいりました。 ▲ちなみにLIGのfaviconはこんな感じ その一方で、最近ではスマホ用の「ウェブクリップアイコン」というものがあります。 これがちゃんと設定してあると「おっ」て思います。とっても簡単なので設定してみましょう。 ウェブクリップアイコンって？ スマホではホーム画面にブックマークのアイコン（タップでブラウザが立ち上がり任意のサイトが開くアイコン）を置くことを、「ウェブクリップ」と呼びます。 そのときホーム画面で使用されるアイコンの事をそのまんま「ウェブクリップアイコン」と呼ぶのですね。 ウェブクリップアイコンをホーム画面に設置する方法 iPhoneなどの場合 iPhone/iPod touch/iPadでは、Safariでサイトを開き、下部中央の共有
これはお役立ち！リンク先のfaviconをリンクアイコンとして表示させる方法！ | バンクーバーのうぇぶ屋
よくリンクにアイコンを付けることってありますよね？アレをリンク先のfaviconを自動で表示させることってできればって思ったことってないっすか？ そんなWEB屋なら一度は（？）考えたことのあるfaviconのアイコン化がこんな感じで実装できることをつい先日知ることになり、びっくり感動してしまったので是非ご紹介させて頂ければこれ幸いです！ 元記事はこちら！ Favicons Next To External Links | CSS-Tricks これ実装すると、つまり下のような感じになるわけっすね！ これ、何をしてるのか気になって見てみたら、そもそもgetFaviconっていうサービスがあるらしいことをしりました。これはリンク先のURLをパラメーターとして渡すと、リンク先の<link>情報みて、faviconのURL引っ張ってくるって仕組みらしいですね。 http://g.etfv.co/h
faviconに数字のバッジを付けられるJavaScript「Tinycon」｜skuare.net
twitter facebook hatena google pocket faviconに数字を乗せられると新着記事数や日付など様々なお知らせをお知らせすることができます。 tommoor/tinycon - GitHubはそんなJavaScriptです。 sponsors tommoor/tinycon - GitHubからファイルをダウンロード。 <script type="text/javascript" src="tinycon.js"></script> <script> (function(){ Tinycon.setBubble(2); //()内の数字が表示されます。 Tinycon.setOptions({ //オプション width: 7, //幅 height: 9, //高さ font: '10px arial', //フォント colour: '#ffffff'
Mac でものすごく簡単に favicon.ico を作る方法
便利なんだけどあまり使われてないような気がするので。 ご存じだったらごめんなさいよ。 ウェブサイトに設置する favicon.ico ですが、 用意した画像を favicon ファイルに変換するの Mac だとものすごく簡単にできます。 画像を「プレビュー.app」で開く デフォルト設定なら普通に開けばプレビューで開かれると思います。 (必要なら)サイズを変更する 「ツール」→「サイズを調整」で16 px 四方のサイズに。 別名で保存 「ファイル」→「別名で保存」を選ぶ。 別のファイルにするんだから当たり前といえば当たり前。 「フォーマット」で「Microsoft アイコン」を選ぶ この表現がわかりにくいんだけど、要するに favicon です。 （Mac OS 10.7 Lion 以降でのやり方は後述） Favicon はもともと Internet Explorer 独自の仕様だったから
Apache2.2 on CentOS 5.5でfaviconを見えるように設定する - 積み重ねた日々
環境 CentOS 5.5 Apache 2.2.3 設定方法 CentOS 5.5では、favicon.icoを設置したとしても、そのままだと.icoファイルはデフォルトのMIMEタイプとしてtext/plainとして扱われます(/etc/httpd/conf/httpd.confのDefaultTypeに記載されています)。 Apacheの設定ファイル(httpd.conf)内でMIMEタイプのマッピングの設定は、以下のファイルを参照していることが分かります。 TypesConfig /etc/mime.typesということで、上記の設定ファイル(/etc/mime.types)に.icoファイル向けのMIMEタイプを追記すればよさそうです。 image/vnd.microsoft.icon icoただし、サーバのリプレイスなどが発生した際に設定し忘れる可能性が高いので、Apacheの
画像アップロードで簡単にfaviconが作れるサイト「Favigen」:phpspot開発日誌
Favigen - Favicon Generator 画像アップロードで簡単にfaviconが作れるサイト「Favigen」 favicon化したいファイルを指定して、サイズも指定後にSubmitを押せば出来るようです。 ちゃんとデザインしたいという方には使えないかもしれませんが、手っ取り早く作りたいという方は使ってみてもよさそう。
50 Free High Quality Icons Sets — Smashing Magazine
Feel free to make yourself a cup of tea or coffee right now because you’ll be investing an hour or so in today’s post. We’ve published our last icons round-up six months ago and since then we’ve collected over 50 new free high quality icon sets that you can use for your projects. While most freebies may be used for commercial projects as well, some of them may not. However, you could use all of th
favicon.jp - このウェブサイトは販売用です！ - favicon リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
16x16ピクセルの芸術的favicon集:phpspot開発日誌
Creative Favicons: When Small Is Beautiful | Smashing Magazine We love creative favicons. Their beauty lies in the approach a designer has chosen to put something really unique inside of the 16慯6px box.16x16ピクセルの芸術的favicon集。 次のようなfaviconアイコンがサイトとともに紹介されています。 faviconを作る際って小さいピクセルなので、どういったデザインにしようか、迷うところなんですが、こういったものを参考に作ればいいものが出来そうですね。 このサイトもfaviconが無かったのでインスパイヤされて作ってみました。 これは楽しいです。 なお、「PhotoShopをア
Forgot the Milk. - Faviconをサクサク作ってくれる８つの Faviconジェネレータ サイト
Favicon は、サイトオーナー（ブログオーナー）の自己満足だけではありません。そのサイトやブログの個性を表現することもさることながら、ユーザから「それなりに手をかけているサイトだな」と興味や安心を抱かせる効果もあるように思えます。 そんな Favicon ですか、あなたはどのように作成していますか？ここで紹介するサービスを利用すると、簡単に Favicon を生成することができます。元となる画像からicon形式のファイルを出力してくれるものもあれば、文字入力から作成するものまであります。中にはビットを塗りつぶして１から作成できるものも・・（それってオンラインでやる必要あるのかな・・）。 自分にあった簡単Faviconジェネレータを見つけてみてください。 1. FavIcon from Pics 日本のブログでも結構紹介されているサイトですね。基本的には画像をアップロードして icon
サイトを印象付ける芸術的なfavicon集:phpspot開発日誌
Inspire Yourself: More Creative Favicons | Smashing Magazine Below you’ll find over 45 more beautiful favicons, which can serve as a nice source for inspiration. サイトを印象付ける芸術的なfavicon集。 次のような目を引く favicon 集が紹介されていました。 favicon とサイトリスト 16x16ピクセルしかないキャンバス内でどれもよくデザインされています。 ブラウザのリンクバーについ表示したくなるようなデザインですね。 こういったものを参考に、自分も 目を引く favicon を作りたいものです。 関連エントリ ソーシャルブックマークのアイコン集 ブラウザからfaviconを即刻作成
favicon2dots
Joe Cole thinks Marcus Rashford shouldn’t start for England. Joe Cole thinks Marcus Rashford shouldn’t start for England. Former player clearly points out that the Manchester United star should not be a starter for the England team. Joe Cole , former playmaker for Chelsea and Liverpool ยูฟ่าเบท two giant Premier League clubs, has express his opinion that Manchester United ‘s England striker Marcus
Favicon（お気に入りアイコン）が簡単に作成できるWebツール :: Love & Design ::
Faviconとは、Favorite Icon の略でブラウザのブックマークや、サイトを開いた時のアドレスバーやタブに表示される 16×16 の小さなアイコンのことです。 （faviconに対応していないブラウザもあります） Faviconを設置するメリットは、個性をPRしたり目立つということでしょうか。 今回は、Faviconが簡単に作成できるサイトをご紹介します。 Favicon Japan!! -16×16の小宇宙ファビコン- お手持ちの画像からfavicon.icoを自動作成してくれます。 当ブログのキスマークFaviconもこちらのサイトで作成しました。 Favicon Japan!! -ファビコンの設置方法- Favicon Genereator こちらのサイトは、お好きな色を選んでテキストが入れられます。 さっそくこちらでも作ってみました。 +LOVE2.0+ はてなダイアリ
Favicon Generator
What is a favicon? Favicons are the little icons that show next to bookmarks and in the address bar of most browsers. Favicons are 16 pixels square. Upload a picture and click 'Make Favicon!' to create a favicon for your website. This favicon generator supports alpha transparency. Once you create your favicon.ico file, upload it to the root directory of your website and put the following code in y
サイトのFavicon(ファビコン)を作る無料サービス「FavIcon from Pics」
Favicon(ファビコン)というのは、IEのお気に入りに入れた時に標準のアイコン以外のアイコンが表示されていたりするアレです。そんなFaviconを元になる画像を用意してアップロードするだけで作成できる無料サービスが「FavIcon from Pics」というわけ。ふつうのFaviconだけでなく、アニメーションFaviconという一風変わったものも作成可能です。 FavIcon from Pics -- how to create a favicon.ico for your website http://www.chami.com/html-kit/services/favicon/ 使い方は簡単、「参照」をクリックして「Generate FavIcon.ico」をクリックするだけ。あとは生成されたFaviconをダウンロードして使うだけ。自動的にアニメーションするタイプのものも生成
Favicon Generator
A Quick FAVICON HOWTO Now that you generated your nice favicon you may want to know how to add it in your site following the right standards and rules in order to be sure most users will see it. The following is a quick guide extracted from the Favicon Wikipedia Page. What is a favicon A favicon (short for "Favorites icon"), also known as a page icon, is an icon associated with a particular websit
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Free business and data favicons to download. Business favicons starting with E