googleアナリティクスで簡単にクリックカウント出来るコード - ファンブログハック
アクセス解析って使ってる人は多いと思うんですけど、クリック数の解析ってしてます？ とあるアクセス解析にクリックカウントしてるやつがあって、割と面白いなと思ったんでgoogle Analyticsでクリックカウントする方法を調べて、実装してみました。 調べてすぐ見つかる方法は、リンクにonClickを入れる方法だったんですが、全てのリンクにこれを書く、ってのは面倒過ぎるな～と思って、jQueryで自動で入れてもらおうと考えていたら、もっと簡単にjQueryで実装してるやつを見つけて、それを参考にしました。 一応外部リンクか、内部リンクか、ってのも判別出来るようにしてみました。 その実装したクリックカウントする為のコードを紹介します。14行程のjavascriptのコードを貼りつけて、少しだけ変更するだけなので、結構簡単なはずです。 クリックカウントしてどうすんの？ えっと、、別にどうする？
pjax (pushState + Ajax) jquery plugin 使用方法 などなど
このサイトは、只今WEB業界で活躍中のデザイナー、プログラマーの方々の情報を集めたweb統合情報サイトです。 web帳 pjaxとは pjaxはpushStateとajaxを組み合わせた造語（pushState + ajax = pjax）となります。 pushStateはhtml5に新実装されたHistory APIのひとつで、javascriptからブラウザの履歴に直接挿し込む為に用意されているメソッドとなります。 詳しい詳細はこちらの記事を参考によろしくお願い致します。 HTML5 History APIについて 再びPjaxに関してなんですが、ajaxを用いて表示内容を書き換え、さらにpushStateを用いてそれに対応するURLへと置き換えhistoryも辿れるようにする技術のことです。 ajaxによるパフォーマンス向上が期待できる他、よく使用されている#!（hashbang）を
ゆーすけべー日記
今週末の金曜日、3月15日に「JAWS DAYS 2013」のパネルディスカッションのパネラーとして呼ばれておりましてー。 風呂グラマーのmasuidriveさんとTreasure Dataの太田さんとお話をするらしく多少ビビってる僕です。 プログラム・スピーカー紹介 | JAWS DAYS 2013 | 2013/3/15（金）～16日（土）東京ビッグサイトで開催！ 実はこのAmazon Web Serviceユーザーにおける祭典「JAWS DAYS」のイベントに呼ばれた前日。 ちょうどボケてを某さくらVPSからEC2含むAWSへせっせと移行していましてー。 ま、つまりは「AWSでこれからバリバリ運用始めるぜ！」ってタイミングでのお呼ばれでしたw イベント自体はおもろい事話せればいいなーとは思いつつ、AWSへ移行して、もしくはAWSへの準備の段階で得たTipsを箇条書きでまとめてみます。
もうアイコン画像はいらない！ Webフォントを使って、iOS風タブバーとアイコンを作成する方法
こんにちは、鴨田です。 最近、アイコンがセットされたWebフォントを使うことで、 画像を使わずにアイコンを表示するという手法が流行っていますね。 すごく興味はあったのですが、なかなか使う機会もなく、 便利そうだなと思っていただけで、今まで使ったことがありませんでした。 しかし、先日、とある案件でやっと使う機会に恵まれたので、やり方をご紹介いたします。 (プロトタイプだけ作って、結局プロダクトとしては使いませんでしたが・・・) 最近話題になっていたこちらのサイトがとても便利です。 Fontello - http://fontello.com/ 使いたいフォントを選択します。 ここでは、「Entypo」フォントから5つ選択します。 選択が終わったら、上部のタブから「Edit codes」をクリックします。 アイコン画像の上部のバーをクリックして、アイコンに割り当てる文字列を決めます。 英語で頭
Google I/O で発表された GAS の新機能で Web アプリを作ってみた - WebOS Goodies
WebOS Goodies へようこそ！ WebOS はインターネットの未来形。あらゆる Web サイトが繋がり、共有し、協力して創り上げる、ひとつの巨大な情報システムです。そこでは、あらゆる情報がネットワーク上に蓄積され、我々はいつでも、どこからでも、多彩なデバイスを使ってそれらにアクセスできます。 WebOS Goodies は、さまざまな情報提供やツール開発を通して、そんな世界の実現に少しでも貢献するべく活動していきます。 Google I/O 、盛り上がってますね！ 2 日目の基調講演では新サービスの Google Compute Engine も発表されて、 Google のクラウドサービスはまさに死角なしです。 それはさておき、初日の発表で一番印象に残っているものはなんでしょうか。メガネも捨てがたいですが、私は Google Apps Script (GAS) の新機能が最も嬉
サイトに外部ブログのRSSを表示する方法と、記事タイトルが長すぎる場合に省略表示する方法メモ。
今更ですが、Google Feed APIを利用してRSSを取得・表示する方法と、そのタイトルをCSSで省略表示させる方法を学びましたのでメモメモ。 みんなだいすきGoogle Feed API サイト制作の際、トップページなどに外部ブログのRSSを表示させたいときってありますよね。 私は過去にバンドの公式サイトを制作していた時、メンバーのブログRSSを表示させてくれとよく頼まれたものです。 （その時は無料RSSサービスを使っていました・・・） そんなときに役立つのがGoogle先生による『Google Feed API』。 表示件数や表示させたい内容、それを囲むタグなどわりと自由にカスタマイズできるので多くのWEB屋さんに愛されているようです。 何かいい方法はないか呟いたところ、多くの方からこちらを薦めていただきましたヾ(*´∀｀*)ﾉ ちなみに、以前はAPIキーを取得する必要があったよ
Amazon EC2 を使った無限IPアドレスの作り方 - ぼくはまちちゃん！
こんにちはこんにちは！！ たまにIPアドレスがたくさん必要な時ってありますよね。 ぼくも先日そういう機会があって、ちょっと困りました。 で、「AmazonさんならIPいっぱいもってるのでは？」ってことで、 ちまたで話題のクラウドサービス Amazon Web Servise を試してみました！ あ、もちろんタイトルは煽りぎみで実際にはIPアドレスは有限なんですが＞＜ 正直、クラウドとかサーバーとかよくわかってなかったんですが、 とりあえず試してみたら意外と簡単にできたので、忘れないようにメモしておきます！ そうそう、Amazonのクラウドって高そうなイメージがあるけど、いまだと制限つきで無料らしいので、お得ですね！ もし無料枠こえても、無茶な使い方をしない限りはそれほど高くない。と思います。たぶん。 制限を見る限り、とりあえず一ヶ月がっつり試すだけならタダです！ 必要なもの： ・クレジット
15 Useful Code Snippets for Smartphone Website
2014年8月22日 Webサイト制作, スマートフォン スマートフォンが普及してきて、Webサイトを作る時、スマートフォンサイトも一緒に制作している方も多くなってきていると思います。私もスマホサイトを制作する機会が増え、だんだんEvernoteに保存していたスマートフォンサイトを作る時の小技がたまってきたので、iPhoneで使える小技を中心にまとめて記事にしてみます。いくつかサンプルも作っているので、スマートフォンからあわせてご覧下さい！ ↑私が10年以上利用している会計ソフト！ スマートフォンサイト用小技集 目次 いくつかサンプルも作ったのでスマートフォンから、もしくはブラウザーからユーザーエージェントをiPhoneなどに切り替えてご覧ください！ 横幅をデバイスの幅にあわせる 文字サイズの自動調整をオフ リストのクリック（タップ）範囲を広げる 画面の幅にあわせてCSSを変える リンクテ
30分、JavaScriptで作るWebサービスのモックアップ - ゆーすけべー日記
Instagramは日本のユーザーも多く、日常を切り取った写真がほとんどで、 またお洒落なものも混じっているのでたまに眺めると気持ちがホッコリしたりします。 特定のキーワードでInstagramの最新の写真を検索したい時があります。 例えば、みんなが今どんな「ご飯」を食べているのか、今日の「日の出」はどのような具合なのか、 がInstagramの写真を通して分かるかもしれません。 Instagramの写真検索サービスを探してみると、 Instagram自身が検索機能を提供してないので他の第三者が作ったサービスがいくつか出てきます。 使ってみたところ、もう少し自分で見た目やら機能を変えてみたいなーなんて思いました。 そこで、「Instagramの今の写真を検索できるサービス」といういわばWebサービスを作りたい欲求にかられます。 今回はこのようなちょっとした欲求から考えた「Webサービスのモ
1時間で携帯サイトをスマートフォン対応にする方法 | GREE Engineering
初めての投稿となります。エンジニアのmatsuです。 携帯向けウェブサイトを1時間でスマートフォン対応する方法を紹介します。 概要 2011年4月7日のニュースにて携帯電話の新規契約数のうち、スマートフォンが占める割合が50%を越え、スマートフォンが本格的に普及する兆しが見えてきました。 現在、スマートフォン向けサイトを新規構築するためのチュートリアルは数多く出ていますが、既存の携帯サイトをスマートフォンに最適化する方法があまり紹介されていないのでこの記事で紹介したいと思います。 このチュートリアルを行うと以下のようになります。 実装 全部で8ステップあります。 このチュートリアルではブログのトップページを例にとって説明します。 前半では文字コードの変更、HTMLの変更といった構造を変更します。後半では絵文字や文字スタイルを行い、仕上げとしてHTML5のバリデーションを行っていきます。最初
Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot
Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot Seperti yang kita pahami waktu ini ada sangat banyak permainan slot online paling sederhana yang dapat dimainkan dalam sekejap hanya cukup masuk di sana saja ojekslot terunggul. Di sini dapat ada sangat banyak bermacam permainan luar biasa yang pastinya dapat anda temukan dengan ringan. Beraneka permainan terbaik di sini dapat and
Pretty checkboxes with jQuery | Aaron Weyenberg
I'm Aaron and I make stuff that goes on the internets. We can be Twitter buds, and my feed is here. Stuff I've posted about lately Twitter film branding Facebook IE beer summit visualization cinematography Popular Tags IE howto jQuery Facebook cinematography beer summit visualization Helvetica marketing freebie Tropicana Wordpress packaging design branding film Twitter Learn how you can send me to
「色のバリアフリーに配慮した色見本」をRGB化してみた | Hinemosu
「カラーユニバーサルデザイン推奨配色セット」では、被験者実験による調整を重ね、どのような色覚の人にも比較的見分けやすい色を絞り込んだ配色セットを「色のバリアフリーに配慮した色見本」として公開してくれてるんだけど、今のところJPMA色表かマンセル値しか出てないのよね。 そのうちRGBも出してくれるんじゃないかと思うんだけど、その前に勝手に近似値を洗い出してRGB値を算出して見たよ。RGBは色範囲がせまくて厳密な「同じ色」ではないんだけど、1つの目安にはなるんじゃないかな？ 近似値は「カラーユニバーサルデザイン推奨配色セット」に掲載されている色を拾い出した値（ピッカー）と、色出し名人でマンセル値をRGB化した2種類を載せています。 自分で作っておいて何だけど、ちょっと色の組み合わせが微妙かも。本職推奨のRGBを待った方が得策かも知れません。 アクセントカラー 色の名前 ピッカー 色出し名人 赤
Parallax Background with Javascript and CSS
« back to inner.geek Parallax Backgrounds a multi–layered javascript experiment This work is licensed under a Creative Commons Attribution 3.0 License. First of all, try scrolling up and down thing page. Use your scroll wheel, use the scroll bar, use the arrow keys, page up, page down, space bar. Note how the text scrolls normally, but the green background scrolls slowly, and how the clouds scroll
kmuto’s blog
View this post on Instagram A post shared by kmuto (@mutokenshi) View this post on Instagram A post shared by kmuto (@mutokenshi) View this post on Instagram A post shared by kmuto (@mutokenshi) View this post on Instagram A post shared by kmuto (@mutokenshi) View this post on Instagram A post shared by kmuto (@mutokenshi) View this post on Instagram A post shared by kmuto (@mutokenshi) View this
ASIN入りアマゾン商品画像URLリダイレクトCGIの雛形
ASIN入りアマゾン商品画像URLリダイレクトCGIの雛形 2009-03-18-1 [Programming] アマゾンの商品画像のURLについて。 昔はアマゾンの商品ページにある商品画像URLには下記のようにASINが入っていました。 例：http://ec2.images-amazon.com/images/P/4822245772.01.MZZZZZZZ.jpg しかし、最近（って、もう何年もだけど）はASINが入らなくなりました。そのうえ、このURLをコピーして使っているとときどき無効になってしまったりします。 例：http://ec2.images-amazon.com/images/I/311qdsd1JaL._AA140_.jpg そこで、このブログで使うためにASINを渡すと商品画像URLへリダイレクトするCGIつくりました。CGIの雛形（テンプレート）を載せておきます。
はてなブックマークが重い件について、Page Detailerというツールを使って調べてみる - VTuberになったプログラマーの魂の残滓
JavaScriptの部分は というわけでid:amachangに任せましょう。 というわけでそれ以外の部分でいったいどこが重いのか 何が重いの？ということで重たい箇所を分析していきましょう。 IBM PageDetailer 解析ツールとしてIBM PageDtailerを利用します。 alphaWorks Community 解説するよりも見てもらうほうが早いと思うのでさっそく使ってみるよ。 ちなみに上記ソフトのダウンロードにはIBMアカウント（無料）が必要なので、使いたい人は登録しよう！ http://b.hatena.ne.jp/HolyGrail/ の結果 こんな感じのグラフが出てきます。 では、詳細を見てみましょう。 このグラフですが、長い部分が http://b.hatena.ne.jp/HolyGrail/ のHTMLそのもののロード時間になっています。 内訳としては 濃い
ECサイトをiPhone/iPod Touchに対応させてみた[制作編] - ECサイト運営開発記
ECサイトをiPhone/iPod Touchに対応させてみた。今回は制作編です。 そもそも、iPhoneユーザーが使いやすいサイトとは何か？ これが一番の悩みどころでした。 それで、iPhone/iPod Touchに最適化されたWebサイトのリンク集を一通り見てみる事に。 リンク：iPhone/touch便利リンク集、B5note touch ! これらに登録されているリンクを辿ってみると、確かに一般のPCサイトよりもずっと使いやすい印象を受けた。 まるで、iPhoneやiPod Touchに入っているアプリケーションを使うかのような操作感で、ストレスが非常に少ない。 これは一体どうなってるんだろうか？HTMLを見てみるとiui.jsやiui.cssなどの気になる文字が。 たぶん、この2人の仕業だな。早速、ググッてみた。すると、iuiに関する情報がいくつか出てきた。 iui.jsで構築
![ECサイトをiPhone/iPod Touchに対応させてみた[制作編] - ECサイト運営開発記](https://cdn-ak-scissors.b.st-hatena.com/image/square/b9eda1aff7b68855d72f595ab5591cd9c7574b4e/height=288;version=1;width=512/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fn%2Fnohohon_x%2F20080717%2F20080717010431.jpg)
javascript - のみでQRCode! # thanx, google! : 404 Blog Not Found
2008年07月05日02:30 カテゴリLightweight Languages javascript - のみでQRCode! # thanx, google! [を] Google Chart API で QRコードも生成してくれるようになった新たに QRコードを生成してくれるオプションができました。 - QR codes (Developer's Guide - Google Chart API) http://code.google.com/apis/chart/#qrcodes ほう、それはめでたい。 「QRコードブログ」とかが手軽にできそうです。 というわけで、手軽につくってみた。 Demo: Size: Text: Encoding: ラク過ぎですなあ。むしろ漢字まじりの場合、Shift_JISにしないとケータイで読む時文字化けするというのが一番引っかかったところだったり
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ウェブデザインのクオリティをアップする7つのポイント | コリス