タグ

2014年1月24日のブックマーク (5件)

  • 今年こそついにSVG元年?まだ間に合う!SVGの学習に役立つサイト紹介 - 聴く耳を持たない(片方しか)

    先日AdobeからこのようなJavaScriptライブラリが公開されました Snap.svg http://plus.adobe-adc.jp/post-4817/ 以前から人気の高かった、IE6でもSVGを表示できるJavaScriptライブラリRaphaelの作者 Dmitry Baranovskiy氏による新たなライブラリで、Raphaelとの違いはSnap.svgではIEなら9以上対応とモダンブラウザを対象にしたこと。さらに自由度と表現力の高いことができるようになっているのが大きな特徴です。 こうしたJavaScriptライブラリがオープンソースで、そしてAdobeから公開されたのは大きなことでこれからSVGもどんどん普及していくのではないでしょうか。 まさに2013年こそついにSVG元年と言えるかもしれません*1。 ……とは言え、そもそもSVGってなに?という人もまだまだ少なくな

    今年こそついにSVG元年?まだ間に合う!SVGの学習に役立つサイト紹介 - 聴く耳を持たない(片方しか)
  • Advent Calendar 3日目:SVG画像を1バイトでも削るためのコードゴルフ - 聴く耳を持たない(片方しか)

    このエントリーはGraphical Web Advent Calendar 2013 への参加記事です。 今日は12月3日、ということで Advent Calendar の3日目は私id:rikuoが担当します。今回はSVG画像ファイルを1バイトでも削るためのコードゴルフのTipsを紹介していきます。 コードゴルフって? まずコードゴルフとはなにか?の説明から。 コードゴルフとは任意のソースコードを出来るだけ短く書くことを目的にしたものです。そのコードの動作を損なわなず、かつ可能な限り短縮して記述する手法を試行錯誤していく様子が、ゴルフのように少ない打法で競うところに似ていることからこのように呼ばれています。 またそれを競技としたコンテストも催されていますね。 画像のファイルサイズ低減策 JPEG、GIF、PNGといったビットマップ画像であればファイルサイズを低減する方法やソフトウェア・ツ

    Advent Calendar 3日目:SVG画像を1バイトでも削るためのコードゴルフ - 聴く耳を持たない(片方しか)
    chalcedony_htn
    chalcedony_htn 2014/01/24
    超ボリューム記事。Illustratorでの作成段階で心がける点について→最適化ツールについて→スタイルシートの最適化→SVG文書構造の最適化
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
    chalcedony_htn
    chalcedony_htn 2014/01/24
    要素のdata-*属性にキーワードを入れておいて、JSで絞り込み。全文入れておくことも可能。文章系には使いづらそうだな
  • クライアントサイドの全文検索エンジン·lunr.js MOONGIFT

    lunr.jsはJavaScript製のオープンソース・ソフトウェア(MIT License)です。 Webサイトを運営していて、煩雑な仕組みになりがちながらも実装を考えなければならないのが全文検索エンジンです。もし作ろうとしているのがWebアプリケーションであれば、いっそのことクライアントサイドで提供してみるのはいかがでしょう。lunr.jsを使えば手軽に実現できます。 デモアプリケーションです。左上に検索ボックスがあるのが分かるかと思います。 検索はインクリメンタルに行われます。ただし全文と言ってもタグとして指定された文字だけに限定されるようです。 インデックスの作り方です。まずindexとしてフィールドを作り、その後addメソッドを使ってオブジェクトを追加していきます。 lunr.jsではテキスト処理部分を別で設ける事ができますので非英語圏では別途分かち書きを行ってインデックス化でき

    クライアントサイドの全文検索エンジン·lunr.js MOONGIFT
  • 優れたユーザーインタフェース(UI)を実現するチェックリスト36項目

    【img via tabletop assistant by MattHurst】 優れたユーザーインタフェースとは何か。どのようなデザインを「優れたユーザーインタフェース」と呼ぶのに相応しいのだろうか。 GoodUIというサイトに優れたユーザーインタフェースを実現するために確認しておきたい36項目をイラスト付きで解説していた。とても分かりやすく納得できる内容が多かったので、紹介しておく! 1.マルチカラムではなく、シングルカラム 複数カラムだとユーザーの目線が左右に逸れてしまう可能性があるため。 2.まずはギフトを渡してみる 最初から買うことを促すよりもまずはこちらから何かを与えることによってユーザーに喜ばれる。 3.似た機能や項目は1つにまとめて表示する 似た機能を分散させる必要はない。 4.ユーザーからの反応を載せる 実際に使っている「ユーザーの声」を参考に買い物をする人は少なくない

    優れたユーザーインタフェース(UI)を実現するチェックリスト36項目
    chalcedony_htn
    chalcedony_htn 2014/01/24
    ダメな例のほう、いつもイラッと来るようなのがいくつも並んでてすごく納得した