タグ

ブックマーク / amachang.hatenablog.com (27)

  • Facebook 向けウェブサービスは IE6 に対応すべきか ( 2011年12月の Facebook のブラウザシェア ) - IT戦記

    はじめに みなさん、お元気ですか><リリースも終わって、一息ついたあまちゃんです! ヽ(´ー`)ノわー さて今日は、最近「お花サプライズ!」というサービスをリリースしたのですが、そのときにちょっと面白いデータを見つけたのでそのいきさつも含めて紹介したいと思います。 (今日のテーマはこの円グラフ) フェイスブック系のサービスはどのブラウザに対応すれば良い? よく、ウェブサービスを開発するときの悩みとして「古いブラウザでのデザインをどのくらいケアするか?」というものがあります。 「お花サプライズ!」でも、割と短い期間で実装することを目標としていたり、番の HTML を書いた経験があまりないメンバーが多くいたことで「IE6 や IE7 への対応が鬼門なんじゃないか?」という心配が常にありました。 そこでよぎる甘い誘惑 このご時世、 IE6 とか IE7 に特別対応する必要なんてないんじゃね?

    Facebook 向けウェブサービスは IE6 に対応すべきか ( 2011年12月の Facebook のブラウザシェア ) - IT戦記
  • WebKit サーバーというものを作ってみた - IT戦記

    みなさん お久しぶりですヽ(´ー`)ノ夏休みの宿題終わりました? 毎日が夏休みの最終日みたいな生活してるあまちゃんです! さてさて 今日は WebKit サーバーというものを作ってみたので、紹介してみます。 WebKit って何? WebKit っていうのは Chrome や Safari の中に入ってるブラウザのエンジンのことです! 実はブラウザっていうのは、エンジン部分と見た目の部分(タブとかボタンとかね)に別れていて、意外と違うブラウザでもエンジン部分は同じものを使ってるってことも多いんですよ(*´ー`) ブラウザのサーバーってどういうこと? 要は、サーバーサイドでブラウザを起動して JavaScript を実行したり、 JavaScript が実行されないと読めないページから値を持ってくるのに使ったりしようという魂胆です。 今まではそういうのなかったの? 実は、今までは JavaS

    WebKit サーバーというものを作ってみた - IT戦記
    y-kawaz
    y-kawaz 2011/08/31
    これは便利そう
  • フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か - IT戦記

    みなさん、こんにちは お元気ですか?僕は元気です。 さて 最近よく、「いいね!」ボタンや「ミクシィチェック」ボタンによって、ウェブページを紹介し合う文化が少しずつ定着してきたなーと思います。 そんな中で、今後重要になってくるんじゃないかと思われる OGP (Open Graph Protocol)と言われる仕様があります。今日はそのことについて書いてみたいと思います。 OGP? おーじーぴー??とはなんでしょうか。 OGP とは 簡単に言うと「このウェブページは何のことを書いているか」という情報を、プログラムから読める形で HTML に付加する記述方法のことです。 まあ、普通のウェブページは人間が読めばだいたい何のことが書いてあるか分かりますよね。 ですが、プログラムは人間ほど頭が良くないので、そのウェブページ内の文章だけではそのページが何のことについて書かれているページなのか正確に識別す

    フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か - IT戦記
  • はてなダイアリーにいいねボタンを置く方法 - IT戦記

    たっち! みなさん、こんにちは お元気ですか、僕はアイスのあとラーメンべて気持ち悪い状態ですが元気です。 さてさて 最近は、フェイスブックやミクシィやツイッターなどの SNS で面白いと思ったモノを紹介し合う文化が定着してきているような気がします。 そんな中で、ウェブページを紹介するために使われるためにウェブページに置かれるものが「いいね!」ボタンだったり、「ツイート」ボタンだったりするわけですね。 というわけで、はてなダイアリーにそういったボタンを配置する方法を紹介したいと思います。 ここで紹介する方法は、ちゃんと理解して置きたい人向け、 XML や HTML を分かっている人向けとなります。 はてなダイアリーには自由な HTML を貼り付けられない まあ、普通に自由に HTML を貼り付けられる環境であれば、ただ単に提供されるボタン用の HTML を張り付けるだけなので簡単です。

    はてなダイアリーにいいねボタンを置く方法 - IT戦記
    y-kawaz
    y-kawaz 2011/01/09
    自分も結構前に作ってサイドバーに置いてるけどあまちゃんが作るとかっこ良く見えるw
  • フェイスブックの新 API でフェイスブックアプリのテストを自動化しよう。 - IT戦記

    みなさま お久しぶりです。最近フェイスブックアプリを作ったりしてますが、やっぱりテストが大変ですよね>< と思っていたら、今日以下のような API が公開されたみたいです! Test User - グラフAPI - ドキュメンテーション - 開発者向けFacebook アプリをインストールしている、テストユーザーを API で作ってそのユーザーを使ってテストできるようになるんですね! すばらしい! と、いうわけでさっそく試してみた。 まずはアプリの access_token ゲット! まずは、アプリの access_token を取得します。 以下のように POST してください。 $ curl -F grant_type=client_credentials -F client_id=ここにアプリケーションのID -F client_secret=ここにシークレットキー https://

    フェイスブックの新 API でフェイスブックアプリのテストを自動化しよう。 - IT戦記
  • Effective Java 読書会 1 日目「static メソッドの使い方などなど」 - IT戦記

    はじめに 社内で「Effective Java を 20 日で読もう」という勉強会が企画されて、今日がその一日目。 ノリノリな感じで。 どーん 今日読んだところ 5 ページ 〜 19 ページ という訳で いろいろ出た話題を残しておく 毎日続けるために、なるべく適当に書いていこうと思う あと、自分が勝手に解釈してる部分も多々あると思うます>< static ファクトリーメソッド static ファクトリーメソッドとは、コンストラクタの代わりに使われる static メソッドのことらしい。 コンストラクタは、名無し たしかに String コンストラクタとかごちゃごちゃしてて一個一個名前付けたほうがいいんじゃね?と思うなーと http://java.sun.com/javase/6/docs/api/java/lang/String.html#constructor_summary Strin

    Effective Java 読書会 1 日目「static メソッドの使い方などなど」 - IT戦記
    y-kawaz
    y-kawaz 2010/02/16
  • ウェブページから NG ワードを消すグリースモンキー - IT戦記

    id:otsune さんの RT 論を読んで あと「公式RTだろうが非公式だろうが返信だろうが何でもいいけど、オレはタイムラインに◯◯の文字が見えるのが嫌なんだ」って要望は3年前から存在する。オレの持論は何十回も言ってるけど「すべてのブラウザはNGワード機能を搭載すべき」 @otsuneさんのRT論 - Togetter なるほどー、たしかしー というわけで グリースモンキーを書いて見たよ! こんな感じです 良かったら使ってください! NG ワードのところに好きな単語を書き込むと、その単語を含む要素が消滅します!*1 // ==UserScript== // @name NG Filter! // @namespace http://d.hatena.ne.jp/amachang/ // @include http://* // ==/UserScript== (function() {

    ウェブページから NG ワードを消すグリースモンキー - IT戦記
    y-kawaz
    y-kawaz 2010/01/24
    それよりもJavascript内でCDATAでヒアドキュメントっぽく書いてるあるのが凄い発想だと思った。
  • Jython がおもしろい - IT戦記

    仕事で Jython を使う機会があって ほぼ、初めて Jython を触ったんですけど、めっちゃおもしろいJava のクラスが何も考えずに使えちゃう。 たとえば、 HTML (not XHTML) をパースして XPath で取得するコードとかを nekohtml と xalan で以下のように書ける from java.io import FileInputStream from org.xml.sax import InputSource from org.cyberneko.html.parsers import DOMParser from org.apache.xpath import XPathAPI # input source = InputSource(FileInputStream('test.html')) source.setEncoding('UTF-8')

    Jython がおもしろい - IT戦記
    y-kawaz
    y-kawaz 2009/12/02
    関係ないがプロフィール画像が花輪乗せてるのに今気がついた。URLについてる数字からして先週末くらいからかぶってるのかな。
  • 文字の情報を調べるためのブックマークレット - IT戦記

    ウェブで見かけた文字が、やたら気になることがあるので 作ってみました javascript:location.href = 'http://www.fileformat.info/info/unicode/char/' + (function(r){ var n = r.startContainer; var p = r.startOffset; return (n.nodeType == 3) ? n.nodeValue.charAt(p) : n.childNodes[p].textContent.charAt(0); })(getSelection().getRangeAt(0)).charCodeAt(0).toString(16) + '/index.htm'; void(0); 使い方は簡単 気になる文字を選択してブックマークレットを実行するだけ! 対応ブラウザ HTML5 t

    文字の情報を調べるためのブックマークレット - IT戦記
    y-kawaz
    y-kawaz 2009/11/25
    これは便利
  • 早速 Go 言語を試してみる! - IT戦記

    はじめに Google から新プログラミング言語 The Go Programming Language が発表されましたね! というわけで、さっそく試してみたいと思います。 環境は Mac OS X 10.6 インストール さっそくインストール Getting Started - The Go Programming Language を見ながら 環境の準備 ディレクトリを作る amacbook% cd ~ amacbook% mkdir go amacbook% mkdir bin環境変数の設定をする。~/.zshrc に以下を追加 # Go 用 export GOROOT=$HOME/go export GOOS=darwin export GOARCH=amd64 export GOBIN=$HOME/bin export PATH=$GOBIN:$PATH Mercurial を

    早速 Go 言語を試してみる! - IT戦記
    y-kawaz
    y-kawaz 2009/11/11
    乗り遅れたーw/今日は休暇とって1日外で遊んでたから知ったのが今なんだよな。/後で超試す!
  • 実名も捨てたもんじゃない - IT戦記

    実名匿名論争が話題ですね 勝間和代のクロストーク - 毎日新聞 ネットで実名を出せない理由:Geekなぺーじ 実名推進派は人の気持ちがわからない人が多い。 : ひろゆき@オープンSNS 404 Blog Not Found:匿名発言者は、自分の気持ちがわからない人が多い 匿名推進派は誰が自分を守ってるのかわかってない人が多い - 狐の王国 で たぶん、実名か匿名かってのはネットの利用の仕方とリアルでの人のつながりに大きく依存するんと思います。 実際は、多くの人はネットでは匿名でいたほうが得だと思います。 でも、 僕は今まで実名を公開していて良かったと思うことってけっこうありましたよ! たとえば、 出身校の先生が「あいつ、最近がんばってるみたいね」と噂しているのを間接的に聞いた 出身校の修学旅行にゲストとして呼ばれた 名刺交換したとき*1に自分の名前を知っている人がいて、話が弾んだ リアルで

    実名も捨てたもんじゃない - IT戦記
    y-kawaz
    y-kawaz 2009/10/06
    実名とか匿名って余りこだわってないけど、ひょんなことで「あのサイトの人ですかーお世話になってます」とか言われることはたまにある。/親戚とかには「お前のブログは意味分からんくて詰まらん」と言われる。
  • HTML5 のセクションアウトラインを取得する JavaScript - IT戦記

    id:vantguarde さんが HTML5 のセクション 3 箇条を書かれて紹介しています スタイルシートやスクリプトの都合には使わないこと。それらにはdivを使うこと。 article, aside, navが適切な場合には、そちらを使こと。 セクションの先頭に見出しが自然に存在してない場合には使わないこと。 sectionの使い方とセクション三箇条 - vantguarde - web:g すばらしいですね! 便乗して セクションのアウトラインを求める JavaScript(YAPC 前夜祭で紹介したやつ)を公開します http://amachang.sakura.ne.jp/misc/outliner.js この JavaScript は 以下のアルゴリズムをそのまま JavaScript で実装したものになっています 4.4.11.1 Creating an outline

    HTML5 のセクションアウトラインを取得する JavaScript - IT戦記
  • PHP で引数をそのまま返す関数を作っておくと便利 - IT戦記

    PHP では以下のように new してすぐメソッドを呼べない <?php new DateTime()->getOffset(); なので、引数をそのまま返す関数を作ってやると <?php function expr($a) { return $a; } expr(new DateTime())->getOffset(); // OK! 便利だなー おまけ 配列アクセス用のも作っておくと便利 <?php function expr($a) { return $a; } function idx($array, $i) { return $array[$i]; } echo idx(idx(expr(new DateTimeZone('Asia/Tokyo'))->getTransitions(), 0), 'abbr') . "\n"; おまけ2 無名関数をそのまま呼ぶときにも使える。 <

    PHP で引数をそのまま返す関数を作っておくと便利 - IT戦記
    y-kawaz
    y-kawaz 2009/08/04
    同じこと考える人はやっぱ居るよな
  • Google Wave 私的まとめ - IT戦記

    正直わからないことが多いです。突っ込み歓迎 以下、箇条書き Google Wave という言葉が曖昧に使われている Google Wave というサービス(これはオープンソースではない) プロトコルでもない Google Wave Provider に接続するためのアプリ メールでいうところの、メーラーのこと Google Wave Provider Google Wave Federation Protocol (XMPP Extension) のやりとりを実装したサーバー Wave Proxy と Wave Gateway を持つ Wave Gateway (配信用サーバー) Wave Proxy (受信用サーバー) Wave (Proxy|Gateway) とは別に何かしらの Frontend を持つ場合が多い(たとえば Comet みたいな) Google Wave Federat

    Google Wave 私的まとめ - IT戦記
    y-kawaz
    y-kawaz 2009/06/02
    自分がドキュメントから読み取れてたことと大体一致、ざっと用語を理解するのに良いまとめ。
  • デフォルトのはてなスター強制置換えグリモンを書きました。

    トラックバックに気が付いた! ということで、 id:amachang さんあたりがグリモンを作ってくれるハズ。他力願でごめんなさい! 色覚異常によるカラースターの色の見え方 - no.10 という訳で書いてみた こんなのが こんな感じになります ソースコード // ==UserScript== // @name Replace star // @namespace http://d.hatena.ne.jp/amachang/ // @include http://* // ==/UserScript== (function() { translate(document.body); document.addEventListener('DOMNodeInserted', function(e) { translate(e.target); }, false); document.add

    デフォルトのはてなスター強制置換えグリモンを書きました。
    y-kawaz
    y-kawaz 2009/04/09
    javascriptのtipsとして参考になる。/よく見たら代替アイコンが酷いw
  • Windows Vista 搭載パソコンを買ってきてやったことまとめ - IT戦記

    日曜日です ところで、今の Windows XP 機 4 年前の 12 月に買った ちょうど 4 歳 ノートなのにバッテリ 5 分くらいしかもたない 買い替えよう というわけで、 Windows Vista 搭載パソコンを買いにいきました。 いざ、秋葉原! 秋葉原にて ネットブックとかイーモバイルの勧誘に目もくれず、安いパソコンを探す。 で、結局 \99,800 + ポイント 10% で http://www.acer.co.jp/products/notebook/tm5730/index.html を買った。 買った理由としては、 比較的安かった メモリが 2 GB で 1 スロットしか使ってない 2GB 足して、 2 GB + 2 GB のデュアルチャンネルで動作させたい メモリはパソコンのポイントで買える という感じ。 どのメモリが、デュアルチャンネルで動作するか分からなかったので

    Windows Vista 搭載パソコンを買ってきてやったことまとめ - IT戦記
  • JavaScript 内で無圧縮 ZIP を作って Data URI を生成するライブラリを作りました - IT戦記

    ちょっと思うところあって JavaScript 内で、複数のファイル情報を作って Zip で固めて、 Data URI を生成するライブラリを作ってみました。 ソースは以下の zip.js です。 http://svn.coderepos.org/share/lang/javascript/Zip/ 使うには 以下の base64.js が必要です。 http://svn.coderepos.org/share/lang/javascript/Base64/trunk/ この base64.js は弾さんが作ったものです。 今回 Zip で使うように、ちょっとチューニングさせていただきました。 こんなことができます // zip オブジェクトを作る var zip = new Zip; // 文字列をファイルとして追加する zip.addString('Hello, world!!', '

    JavaScript 内で無圧縮 ZIP を作って Data URI を生成するライブラリを作りました - IT戦記
  • はてなブックマークのコンテンツの JavaScript を高速化する - IT戦記

    はじめに 「新はてなブックマーク」になったということで、とっても便利になったのですが、ブックマーク一覧ページ*1が若干 JavaScript に時間が掛かっているみたいです。 というわけで 調査してみたいと思います。調査して、改善できそうなところは後で纏めて「はてなアイデア」にでも登録しようと思います。 この日記は調査しながら、過程を書いていくつもりです。 準備 まずは、人のサイトの JavaScript を書き換えて試してみるための環境を作ります。 作業用ディレクトリを作る とりあえず、ホームに HatenaJS というディレクトリを作ります。 $ mkdir HatenaJS $ cd HatenaJS CocProxy をダウンロードしてくる 以下から CocProxy というツールをダウンロードしてきます。 http://coderepos.org/share/wiki/CocPr

    はてなブックマークのコンテンツの JavaScript を高速化する - IT戦記
  • JavaScript はどのように実行されるか - IT戦記

    JavaScript はどのように実行されるか Safari*1 の実装を例に JavaScript はどのようにして実行されているかを書く。自分用のメモ。日語の出来は気にしない 1. ブラウザを起動して以下のようなページを開いたとする <html> <head> <script> var a = 1; var b = 2; alert(a + b); </script> </head> <body> </body> </html> 2. インターネットからデータが到着する そうすると WebCore::FrameLoader::write という関数に生の文字列が渡される。型は char* だ。 http://trac.webkit.org/browser/trunk/WebCore/loader/FrameLoader.cpp#L990 この関数の中では、到着した文字の文字コードを解

    JavaScript はどのように実行されるか - IT戦記
  • Safari4 と IE8 で実装された DOM Storage とは何か - IT戦記

    はじめに 皆様 JavaScript のスピード競争が激化し、 ECMAScript 3.1 の仕様の策定が進むなど、激動の JavaScript 時代をいかがお過ごしでしょうか。 さて今日は、今、ちまたで大ブレイクの兆しを見せている DOM Storage という仕様を紹介したいと思います。 DOM Storage とは何か まず、 DOM Storage とはどんなものなのでしょうか。 とても簡単に言ってしまえば、とてもたくさんのデータが保存できてサーバーに自動で送られない Cookie みたいなものです。 さらに、 Cookie とは違って JavaScript からとても扱い易く作られています。 では、この DOMStorage の具体的なソースコードを見てみましょう。 <!DOCTYPE html> <html> <head><title>DOMStorage の使い方</tit

    Safari4 と IE8 で実装された DOM Storage とは何か - IT戦記