タグ

2012年5月4日のブックマーク (23件)

  • スマートフォンサイトで好まれるユーザーインターフェイス【リサーチ】

    『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day

    スマートフォンサイトで好まれるユーザーインターフェイス【リサーチ】
  • 正規表現で最短マッチを知っとくとちょっと便利かも - (゚∀゚)o彡 sasata299's blog

    2012年05月01日21:34 Ruby 正規表現で最短マッチを知っとくとちょっと便利かも 正規表現ってあるじゃないですか。そうです。アレです。 とっても便利で、いろんな場面で役立つと思うんですが、ときどき最短マッチを使いたくなって「最短マッチってどう書くんだっけなぁ?」ってなってググることがあります(よね!) 通常は最長マッチになる 通常、正規表現内で * とか + とか付けると、直前の表現の0回/1回以上の繰り返しを表しますが、この書き方だとできるだけ長い要素にマッチしようとします。大事なことなのでもう一度言います。できるだけ長い要素にマッチしようとするんです。 大抵はそれで構わないんですが、ときどきそれでは困るケースがあります。例えばこんなケースを考えてみましょう(あんまり良い例が思いつかない)。 ・"名前(ニックネーム)"という形式 ・名前と(ニックネーム)の間には半角or全角ス

  • JavaScriptで、もう連想配列の最後のカンマに悩まない!(※追記あり) · DQNEO日記

    末尾に要素を増やしたい、または減らしたいときに問題が起こります 例えば" c : 3 "の行を単純に削除するとバグるので削除したいときに、" b: 2,"のカンマを削除する必要があります。 また、" d : 4 "を追加したいときに、" c : 3 "の後にカンマを入れる必要があります。 これは面倒くさいですね。 (エンバグについてはjslintなどのツールで防げばよいという指摘があったので修正しました。) より良いやりかた var x = { a : 1, b : 2, c : 3, dummy : null } このように最後に "dummy : null" というダミーの要素を書いておきます。 こうすれば、プロパティa, b, cはどれもカンマ付きで平等になります。 ぜひ一度試してみてください。 (もしかして常識だったらすみません。あとこの手法は for in で走査したいときはよく

  • 第1回 PHPでアセンブラを作ってみた | gihyo.jp

    最近、FPGAなどを使ってCPUを自作する記事を目にするようになりました。CPUの命令コードは数字ですから、アセンブラソースを1行1行手で命令コードに変換していく(ハンドアセンブルする)ことになります。昔は、このためにコーディング用紙というものが売っていました。 最近のPICなどのマイコンには開発環境が用意されており、アセンブラなど必要な道具はすべて入っています。ですから、用意されているアセンブラを使うことがあっても、アセンブラを自分で作るという機会はなかなかないと思います。ここでは、アセンブラを作ってみることにしましょう。 PHPでアセンブラを作る アセンブラをどの言語で作るかですが、今回もPHPを使ってみました。フォーム上にソースを入力すると、バイナリが出力されます。対応しているのはPIC16Fの命令セットで、今回のアセンブラプログラムを使って開発環境で作ったものとまったく同じバイナリ

    第1回 PHPでアセンブラを作ってみた | gihyo.jp
    clavier
    clavier 2012/05/04
  • 海外旅行に行く際に格安航空券が簡単に探せる「skyscanner」が超便利

    こんにちは@and_ex_です。 スマホアプリでも探せる航空券比較サイトskyscanner「スカイスキャナー 」をご紹介します。 シンプルでサクサク格安航空券が探せて、予約もそのままできて、ホテルもレンタカーも…。 相当気に入ってます。 格安航空券を検索する アクセスすると「さぁ!検索してくれ!」と言わんばかりに航空券検索フォームがあります。 実際に「大阪-台北」の航空券を検索してみました。 こんな感じでLCCを含む格安航空券が一覧で表示されます。 シーズンを通して期間中の航空券比較もしてくれます。 もう見やすいのなんのって。 旅に出る時の予算や時間などのプランニングは相当大事だと思います。 目的地に着いてからの行動も、選ぶ交通手段や予算でかなり変化しますよね。 スカイスキャナーを使えば、その点をスムーズに決めて旅の負担を減らしてくれるんじゃないでしょうか。 格安フライト|Skyscca

    海外旅行に行く際に格安航空券が簡単に探せる「skyscanner」が超便利
  • cdd を tmux, bash, multi session +α に対応した - @m4i's blog

    screen を使う上でほぼ必須とも言っていいコマンド cdd を tmux 対応にし機能をいくつか追加しました。 https://github.com/m4i/cdd オリジナルの cdd はこちら http://d.hatena.ne.jp/secondlife/20080218/1203303528 利用方法 cdd をすでに利用している方 ファイルを差し替えるだけで使えるようになります。 cdd をまだ利用していない方 まず cdd を適当な場所に置き、 zsh の場合、.zshrc あたりに以下を記述 autoload -Uz compinit compinit . ~/path/to/cdd chpwd() { _cdd_chpwd } bash の場合、.bashrc あたりに以下を記述 . ~/path/to/cdd cd() { builtin cd "$@" local

    cdd を tmux, bash, multi session +α に対応した - @m4i's blog
  • デスクトップが華やぐ美麗な壁紙50選 – Noupe | HAPPY*TRAP

    URL:50 Gorgeous Wallpapers to Spice Up Your Desktop – Noupe 50点もの美麗な壁紙が紹介されています。 いずれもクオリティが高いです。 いくつかピックアップしてみます。 Golden Dream Wallpaper+ Altitude City On The Brink Genesis このようなハイクオリティな壁紙がたくさん紹介されてます。 ぜひ「50 Gorgeous Wallpapers to Spice Up Your Desktop – Noupe」をご覧下さい。

  • 2012-04-08のJS: はてな教科書(JavaScript によるイベントドリブン)、CodeGrid、Qatrix

    JSer.info #64 - はてな研修用教科書というものが公開されて、その中でJavaScriptについて書かれてるJavaScript によるイベントドリブンが結構いいかなと思いました。というのも最初にデバッグ方法を書かれてるのが良いです。 ピクセルグリッドがCodeGridというフロントエンド開発向けの有料のメールマガジンサービスを始めたそうです。最近有料のメールマガジンというものは色々と増えていたりしますが(逆に廃刊も)、その中でCodeGridはChrome ウェブストアでWebアプリとしても配信している形という所が面白いかなと思います。 MozillaもWeb AppのStoreを開くので、そういったWebアプリケーションという形での情報配信が今後どうなるかが気になっています。 Mozilla の Web アプリケーションストア戦略 — 真にオープンなエコシステムを作る |

    2012-04-08のJS: はてな教科書(JavaScript によるイベントドリブン)、CodeGrid、Qatrix
  • curlコマンドの便利なオプションたち - カイワレの大冒険 Third

    curlコマンドのお話し。cURLって書くんですな。 対向のサーバとのやり取りを追いたいときに、通信内容を見たいわけですが、そういうときにcurlコマンドはちょくちょく便利なので、書いてみる。 要はtcpdumpとか使ってパケットまで見る必要はないんだけど、レスポンスとかは見たいときに便利だよって話し。 その1. 普通に使う $ curl 'http://www.normal.com' <<中略>> var k=/^http:/i;if(k.test(g)&&google.https()){google.ml(new Error("GLMM"),false,{src:g});delete i[f];return}d.src=g;h.li=f+1},lc:[],li:0,Toolbelt:{},y:{},x:function(a,b){google.y[a.id]=[a,b];return

    curlコマンドの便利なオプションたち - カイワレの大冒険 Third
  • zshでサブコマンドとファイル名を手抜き補完する - Glide Note

    hoge[tab]でサブコマンドが補完され、 サブコマンドの後はファイル、ディレクトリが補完されるように。 サブコマンドとファイル名を補完する 下記を.zshrcに記載してexec $SHELL やっていることは compdefで_hogecmdという補完用functionを定義し、hogeコマンドを実行したときに呼び出されるように。 function内のcmdsで補完したいサブコマンドを列挙 CURRENT == 2でhogeのあとに補完されるのはサブコマンドだけと指定 _describeで補完候補で表示されるときにsubcommandというグループになるようにしている サブコマンドのあとは_filesでファイルとディレクトリが補完されるように 参考になるサイト zshの補完関数の書き方がまとまっているところがほとんど無いので下記が非常参考になります。 zsh補完関数を自作すると便利 -

  • CPU とキャッシュのはなし - graphics.hatenablog.com

    別にグラフィックスに限ったことじゃないし、そもそも論文とか全然関係ないけど。GPU 周りでもたまに話題になるし、自分でもたまにわけわからんくなるから整理しとく。 メインメモリは遅い CPU からメインメモリにデータを読みに行く場合、これはとにかく遅い。例えばレジスタにあるデータを読みに行く場合と比べると、だいたい数倍から数100倍の遅さ。ヤバいからなんとかしよう。もっと早くアクセスできる場所にデータおいとこう。 キャッシュライン CPU がメインメモリからデータを読み出すとき、必ず小さなメモリチャンクをキャッシュ上にロードする。ロード単位はプロセッサによるけど、だいたい 8 ~ 512 バイト。このロード単位をキャッシュラインと呼ぶ。 アクセス対象のデータが既にキャッシュに載ってる場合は、メインメモリじゃなくてキャッシュを読みに行く。ない場合はメインメモリにアクセスするけど、そのデータはも

    CPU とキャッシュのはなし - graphics.hatenablog.com
  • JavaScript Style Guides And Beautifiers

    May 3, 2012 Today we're going to explore JavaScript style guides, specifically: their importance, style guides worth reviewing and tools that can assist in automated code beautification or style enforcement. What exactly is a style guide? Before we begin, let us remind ourselves exactly what a code style guide is: A style guide or style manual is a set of standards for the writing and design of co

    JavaScript Style Guides And Beautifiers
  • http://knk-n.com/2012/05/04/favorite_macapps_for_users/

    http://knk-n.com/2012/05/04/favorite_macapps_for_users/
  • nginx はデフォルトで merge slash する - kurainの壺

    久しぶり技術ネタを一つ。 問題 nginx を reverse proxy として使っていると original http://example.com/hoge/huga//path proxied http://example.com/hoge/huga/path みたいな感じに重なったslash を merge してから proxy される。path最後の '//path' が '/path' となって、状況によってはありがたい。これが default なのが良いかは分からないが。slash は 2 以上連続していると、1つになる。 さらに、 original http://example.com/entry/http%3A%2F%2Fwww.hatena.com%2F proxied http://example.com/entry/http%3A%2Fwww.hatena.com%

    nginx はデフォルトで merge slash する - kurainの壺
  • Hatena-Textbook/javascript-event-driven.md at master · hatena/Hatena-Textbook · GitHub

    JavaScript によるイベントドリブン アジェンダ JavaScript の言語について DOM について イベントについて jQuery について MVC アーキテクチャについて まずはじめに Just moment! Web で JS を使うとき、HTML の知識が前提となることが多い http://www.kanzaki.com/docs/htminfo.html 少なくとも「簡単なHTMLの説明」は押さえておきたい。 目的 講義時間は限られているので JS を学ぶ上でとっかかりをつかめること リファレンスを提示します。概念を理解 言語的部分、DOM 及びイベントドリブンなプログラミング 覚えようとするとクソ多いのでリファレンスひける部分は覚えない JS とはどんな言語であるか? 基クライアントサイド=ブラウザで動く 実装がたくさんある はてなエンジニアはみんな誰もがある程

  • ショートコードで文中に脚注を加えるWordPressプラグイン・Simple Footnotes - かちびと.net

    脚注リンクをショートコードで 加える事が出来るWordPressの プラグイン・Simple Footnotes のご紹介。ユーザビリティの 工場にもなりそうですね。専門 的な内容を扱うサイトでは導入 したいところです。 GW中なので軽めの話題。文中にショートコードで脚注を加えるプラグインです。複数加えても自動で順番どおり番号を振ってくれます。 こういうやつです。Wikipediaなんかでよく見かけますよね。 プラグインを有効化して以下のように書けばOK。 今日はカレー[ref]レトルトですけどね[/ref]をべようと思います。 [ref]で囲うと、その部分は数字とリンクが追加され、文章最下部に脚注が加わります。 プラグインのファイルを開けると分かりますが、複雑なコードで実装してるわけじゃ無さそうなので、functions.phpで管理してもいいかもですね。 Simple Footnot

    ショートコードで文中に脚注を加えるWordPressプラグイン・Simple Footnotes - かちびと.net
  • Illustrator(イラストレーター)で等間隔の渦巻きを描く方法 | 楽してプロっぽいデザイン | Forty-N-FiveBlog

    イラストレーターで渦巻きを作成しようとする場合、どのように作成するでしょうか?線ツールにスパイラルツールがありますが、スパイラルツールでは、中心にいくほど間隔が狭くなってしまいます。”等間隔”ということが意外と迷ってしまうところでもあります。今回は等間隔の渦巻きを描く方法を2パターンメモしておきたいと思います。 同心円グリットツールを使う方法 同心円グリットツールのオプションを設定 「直線ツール」を長押しすると、「同心円グリットツール」がありますので選択します。通常Shiftを押しながら描くとレーダーチャートのような円になってしまいます。そこで、「同心円グリットツール」を選択した後、画面上をワンクリックすると「同心円グリットツールオプション」が表示されます。値を上記のように設定します。(同心円の分割:これは線の数ですので、任意の値を入力します。円弧の分割:ここは0にしておきます。)実行する

  • CSSを書くとLESS形式にリアルタイムで変換するWebサービス・Css2Less - かちびと.net

    CSSを書くと即座にLESS形式に変換 するWebサービスCss2Lessのご紹介 です。使えるかどうかは別にして、 まだLESSに慣れてない方には練習用 になる・・・かもしれない。LESS も慣れるのが大変ですよね。 オンラインでCSS→LESSにするやつです。 左に普通にCSS書くと即座に右にLESS形式へと変換されます。尚、LESS側にも書けますが、CSS側は変化しません。 圧縮されたCSSでも整形、変換してくれます。 OSSにもなってます ruby製のOSSとしてGithubで公開されてるみたいです。 ライセンスはAGPL3だそうです。 以下よりどうぞ。 Css2Less / Github

    CSSを書くとLESS形式にリアルタイムで変換するWebサービス・Css2Less - かちびと.net
  • Gistに書いたCSSやJavaScriptのコードを表示し、その場で実行出来るjQueryプラグイン・Intelligist - かちびと.net

    デモの作成用のライブラリという感じですかね・・・動作サンプルの為に複数ページを作成しなくて済むし、コードも書かなくていいので楽と言えば楽な気がします。 以下動作サンプルです。 Sample 連続で表示させると微妙な挙動しますね・・ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script src="jquery.intelligist.js"></script> 体とライブラリを読み込みます。 <div id="demo" class="snippet"></div> で、空の要素を用意します。 $("#demo").intelligist({ "2576349": "黄色い背景にする" , "2576329": "CSS3でテキストエフェクト" , "

    Gistに書いたCSSやJavaScriptのコードを表示し、その場で実行出来るjQueryプラグイン・Intelligist - かちびと.net
  • フリーランスの為のお金にまつわる話

    お金にまつわること、とりあえず以下を見通しておけば、行きていけると思います。 フリーランス歴24年目のカグア!です。まあ最近は結局法人を清算して個人事業主になったので、シンプル会計で超らくチンでストレスフリーです。利益の半分強が手取りくらいになるので。超わかりやすくて見通し良いです。法人のときは全然見えなかったなー。 先日、保険の更新があり、改めて考える機会があったので、自分用として整理しつつ、さらせるところは晒します。参考になる人がいれば幸い!(税率や金額はあくまでザックリと、ですのでご注意を。)なお情報は2009年11月時点でのものです。 >>人気の「フリーランス」最新一覧はこちら。 Amazonで詳しく見る 楽天で詳しく見る 関連記事 >>独立しようかモヤモヤしている人へ >>やりたいことが見つかる5サイトと見つからないときの最後の方法 >>運動不足のデスクワーカーを無理矢理にでも健

    フリーランスの為のお金にまつわる話
  • sshを使いこなすための7つの設定 - 射撃しつつ前転 改

    五月病が抜け切らないIT系新入社員に贈るシリーズ第1段。 ~/.ssh/configにはいろいろな設定が書けるが、周囲を見渡した限り、あまり活用されているようには見受けられない。そこで、今回は便利な設定をいくつか集めてみた。 長いホスト名に短い名前をつける Host exp1 HostName verrrryyy.looooong.hostname.example.jp ssh verrrryyy.looooong.hostname.example.jpの代わりにssh exp1でログインできるようになる。 ちなみに、zshの場合、configファイルに登録されたホスト名はsshコマンドを打つときに補完されるので更に便利。 特定のホストへログインするときのユーザ名や鍵をカスタマイズする Host github.com User tkng IdentityFile ~/.ssh/id_rsa

    sshを使いこなすための7つの設定 - 射撃しつつ前転 改
  • 写真が語るUXとUIの違い - Nothing ventured, nothing gained.

    Windows XPのXPがeXPerienceだったことを覚えている人がどのくらいいるかわからないが、正直、最初にユーザーエクスペリエンスと聞いたときに、どのように日に定着させようかと悩んだ。略語を開くことなどあまり無いので、製品名などは大して心配はしなかったのだが、確か何かの設定画面かにも、Experienceというタブ名か何かがあり、どのように訳すか頭を痛めたように記憶する。 それから数年、すっかりUX、すなわちユーザーエクスペリエンスという言葉が定着したように思う。それでも、今でもUXUIを混同する場面に出くわすことがある。 すでに様々なところで説明はされているが、敢えて、ここでもUXUIの違いを説明しよう。 UX(ユーザーエクスペリエンス)は、製品やサービスに対して、ユーザーがどのように感じ、そして反応するかのことである。実は、UXは2010年にISO 9241-210とい

  • 配色の基本。メイン・サブ・アクセントカラーを極める!

    前回の[カラーデザインの基。トーンを理解する!]と[カラーデザインの基。色の三属性とは?]に引き続き、今回はメインカラー・サブカラー・アクセントカラーの基ルールについて解説させていただきます。このメイン・サブ・アクセントカラーの基ルール正しく理解すると、配色を考えるのが簡単になります。 頻繁に配色を悩む方や、デザインの途中で配色を変えてしまう方は、このメインカラー・サブカラー・アクセントカラーのルールを正しく理解できていない可能性があります。なので今回解説するこの記事を読んで、配色についての理解を深めましょう!(偉そうに書いちゃいました。すみません) ちなみに配色という言葉を辞書で引くと、『2つ以上の色を組合わせること。また、組合わせた色合いのこと』と書いてあります。 メイン・サブ・アクセントカラーの役割 まずは、メインカラー・サブカラー・アクセントカラーと呼ばれる、各要素の役割に

    配色の基本。メイン・サブ・アクセントカラーを極める!