ドットインストール代表のライフハックブログ
スクロールしても常にサイドに要素を固定で表示できるjQueryプラグイン「JQuery Sidebar Plugin」 2010年11月10日- Amit Patil's Blog スクロールしても常にサイドに要素を固定で表示できるjQueryプラグイン「JQuery Sidebar Plugin」。 サイドに常に表示されている「Follow Me」みたいなツイッターのフォローボタンは最近よく見かけますね。 これをjQueryで簡単に実装してしまおうというもの。 使い方は次のようにオプションを渡してあげるだけです。 $(function() { $("body").sidebar({ text : "Follow Me", // 表示テキスト size : "30px", // 幅 length : "200px", // 高さ margin : "130px", // マージン p
「Yahoo!JAPAN」が12月中旬から順次、Internet Explorer 6(IE6)のサポートを終了する。“脱IE6”の動きは昨年ごろから世界で強まっているが、国内ポータル最大手がサポートを終えることで、国内でも動きが加速しそうだ。 11月10日現在、Yahoo!JAPANトップページにIE6でアクセスすると、「12月中旬より、正しく動作しなくなる場合がございますので、最新のブラウザのダウンロードをおすすめします」という告知が表示される。 トップページ以外のヤフーの各サービスも順次、IE6のサポートを終了する予定。ヤフー広報部は、「IEも7、8が出、9もβ版が出ている状況。新しい方がユーザーにとっても便利で安全面でもすぐれており、切り変えを促すため」IE6のサポートを終了すると説明している。 IE6は2001年リリース。現代のWebブラウザとしては機能やセキュリティが不十分と指
ウェブサイトのワイヤーフレームやモックアップ、サイトマップ、フローチャート、ダイアグラムなどを無料で作成できるオンラインサービス・アプリケーションを紹介します。
brush lovers [ad#ad-2] brush loversは当サイトで何度も紹介したWeb Designer Depotの姉妹サイトです。ブラシのデザインは全て、Liora Blumによってデザインされたものです。 ブラシは個人でも商用でも、無料で利用可能なものが数多く揃っています。 一部、「Buy」のアイコンがついたものは有料ですが、かなり安価($3くらい)です。 ブラシはカテゴリ、登録順、人気順、レート順に表示することができ、以下にカテゴリからいくつか紹介します。
パンくずは何要素で実装していますか? ul要素? ol要素? p要素? パンくずをどのように実装するのがよいかの考察を紹介します。 Exploring Markup for Breadcrumbs [ad#ad-2] 先日紹介したCSS-Tricksの「画像を使用しないでApple風のパンくずを作成するチュートリアル」に寄せられたコメントから考察されたもので、各ポイントを意訳したものです。 パンくずのマークアップの考察のきっかけ -ul要素で同列配置 パンくずのマークアップの考察 -ul要素で親子 パンくずのマークアップの考察 -ol要素で順序づけ パンくずのマークアップの考察 -セパレーターの使用 パンくずのマークアップの考察 -Googleを参考に パンくずのマークアップの考察 -HTML5の使用 パンくずのマークアップの考察 -おわりに パンくずのマークアップの考察のきっかけ -ul
ガントチャート(線表)のサービスは、以前にも紹介してきましたが、無料で使える日本のガントチャートサービスは初めての紹介ですね。 「ブラビオ・プロジェクト」は純国産の工程管理&コミュニケーションツール。ガントチャートやタスク管理、連絡に役立つコミュニケーション機能が、1グループにつき、5ユーザーまでであれば、何個のプロジェクトを作っても無料で使えます。 1アカウントに対する、グループ数の制限はありません。つまり、5人以下のグループで使うのであれば、ずっと無料で使えてしまいます。フリーランスの人や小さな単位でたくさんの案件を抱えているプロジェクトマネージャーには、ちょうどいいサービスですね。 追記:「ブラビオ・プロジェクト」では「グループ>プロジェクト」という階層になっていて、1つのグループに無料で登録できるのは5人(5ユーザー)まで。5人以上を一つのグループに登録すると有料プランへの登録が必
最近はWebSocketで遊びたくてしかたがないfujimotoです、こんにちは。今回は、本日(2010/11/12)発売されている(はずの)待望の書籍、「パーフェクトPHP」の書評をお届けします。 僕は今週ひと足お先に献本をいただいて目を通したのですが、様々なPHP関連の書籍で「こういうことにも言及してほしいなぁ」「このサンプルを鵜呑みにされてしまうと困るかも...」というところをきちんとカバーしていたり、最新版の仕様や、PHPを使い倒しているユーザの考え方が反映されていて、今までにない書籍だな、というのが第一印象で、初心者のかたから上級者のかたまで、全員が買って損はない(少なくとも、書店で手にとってみる価値はある)一冊だと思います。 これは、いずれもPHPのヘビーユーザであり、よいところもわるいところも知り尽くしている著者のかたがたが、執筆するにあたって最初に考えたであろう「既にPHP
ディスプレイサイズ(ブラウザサイズ)いっぱいに背景画像を表示する方法はいくつかありますが、最近見つけた jQuery のプラグインを使って、いろいろ試してみたりしたのでレビューをまとめてみました。 背景に画像を使った Webサイトってたくさんありますよね。大きくてキレイな画像は、見た目にもインパクトがあってとても印象的です。でも Webサイトを閲覧している人の環境は様々で、ディスプレイのサイズが違ったりするもの。ディスプレイ(ブラウザ)のサイズにあわせて、画像を拡大表示する方法はいくつかありますが、その中からいくつかをサンプル付きでご紹介します! 画面いっぱいに背景画像 目次 CSSのみで画面いっぱいに背景画像 jQuery プラグイン fullscreenr を使ってみた Full Size Background Image jQuery Plugin を使ってみた jQuery max
builder読者の皆さん、こんにちは。 金曜日担当の山田井ユウキです。 突然ですが、私服のコーディネートって、難しいですよね。 ね。 めちゃくちゃオシャレになりたいってわけでもないんだけど、人からそれなりに見られる程度にはきちんとしたい、でもどうコーディネートをすればいいかわからない。 ……で、そういう悩みをどう解決するかというと、一番楽で確実なのは、マネできそうなコーディネートを見つけて、そのままコピーすることだと思うんですよね。 といってもパリコレみたいな奇抜なやつとか、ファッション誌で外国人モデルが着ている「それめちゃ人を選ぶから!」と言いたくなるコーディネート(極端な短パンとか)はもうお腹いっぱいなんです! 「普通にオシャレなコーディネート」が知りたいんです! 僕は! ところがですよ。 ストリートスナップを掲載しているサイトはたくさんあるんですけど、そういう「普通の人」が着る「普
Photoshop、Illustratorでつくるタイポグラフィのチュートリアルの紹介です。 ※明記の無いものはPhotoshopです。
今回のテーマ:1人でビジネスを始める Kim氏は、これまでにも定期的に売り上げを報告していて、そのたびにAndroidマーケットからの収入に満足していると書いている。Kim氏は自分がラッキーだったとも書く一方で、「もし今までにもAndroid開発を検討していたのなら、思い切って始めてみることをおすすめする。個人開発者には理想的なプラットフォームだと確信している」と書いている(@IT「個人開発のAndroidアプリで月収116万円に」) iPhoneアプリやAndroidアプリ、Webサービスなどを開発して、独立してビジネスを始めるエンジニアが増えているようです。1人でビジネスを始める際には、プログラミングスキルはもちろんのこと、業務で必要とされるものとは異なる種類の会計知識が必要です。 そこで、今回から2回にわたって、「1人ビジネス」における税務について気を付けるべき点を解説します。今回は
Google Docs のスプレッドシートに表データをコピペする方法です。 Google Docs 便利ですね。Excel に比べると多少操作性や機能は劣りますが、どこからでも共有できるというのはそれを補って余りあります。 そんな便利なスプレッドシートなのですが、コピーしたCSVを表形式でスプレッドシートに貼る機能がありません。 もちろんCSVをファイルに書き出してインポートすれば良いのですが、今画面上に表示しているCSVをそのままコピペしたい時ってありませんか。 例えば、以下のようなCSVをコピペしてスプレッドシートに貼り付けると、1行が1つのセルに文字列として格納されてしまいます。 1,原田哲也,TZM250 2,加藤大治郎,NSR250 3,青山博一,RS250RW タブ区切りならいける 何とかならないかなーと試してみると、なぜかタブ区切りだと各セルに値を入れることができました! 先
ApacheでX-Sendfileが利用できるmod_xsendfileをPHPと連携して使ってみました。 PHPで認証してから、許可したユーザのみにファイルを出力する、という処理を実装する場合、ファイルはdocument_root外に配置しておいて、readfile()やfpassthru()でファイルを出力するという手法を良く使います。 この方法でも問題無い場合が多いのですが、容量の大きいファイルを出力する際は思ったようなスピードが出ない時があります。 そのような時はmod_xsendfileを使って、ファイル出力の部分をApacheに任せてしまう方法が有効です。 ここでは2010/11/12時点の最新版であるmod_xsendfile 0.12を対象としています。またインストール環境はRHEL、CentOSを想定しています。 mod_xsendfileのインストール mod_xsen
1. プロパティ項目が異なるエンティティを登録 App Engineのデータ・テーブル*1には、RDB(Relational Database)にはないデータ構造上の主な特徴が、2つあります。その1つが、今回紹介する「プロパティ項目の可変性」で、もう1つは次回紹介予定の「プロパティ項目のコレクション・フィールド定義」です。 [*1] App Engineでは、ユーザー・データを格納するテーブルを「kind」と呼ぶことがありますが、ここではテーブルの名称を統一して使用します。 1.1. プロパティ項目の可変性 それでは、プロパティ項目の可変性とは、どのようなものでしょうか。 RDBの場合、テーブルの列項目は、スキーマ(概念スキーマ)で定義されています。テーブルに登録されるレコードごとに列項目の種類や属性、列項目数を変えるようなことはできません。 この一方で、データ構造がキー・バリュー型になっ
twitter facebook hatena google pocket LightBoxが流行り始めていくらかの時が流れ亜種がますます増えています。 今回紹介するThumboxもそんな一つではありますが、読み込まれている画像の数を明示できるなどナビゲーションが分かりやすくなっているのが特長です。 sponsors 使用方法 Thumboxからファイル一式をダウンロードします。 ※jqueryは1.4.3+で動作するようです。 <link rel="stylesheet" type="text/css" href="thumbox.css" /> <script type="text/javascript" src="jquery-1.4.3.min.js"></script> <script type="text/javascript" src="jquery.thumbox.js">
最近あまり見なくなってきたし、個人的にも使う機会も減ったLightbox系のプラグインを久しぶりに探したついでにメモ。またいつか使うときのために・・・ライセンス形態と対応メディアも付けたのでそれなりに見やすいかもかもかも。 (デモもつけようと思ったけどめんどくさいからやめた・・・ jQuery LightBox plugin いつものLightbox。お世話になった人も多そう。 ページ
こんにちは、鴨田です。 前々回、Photoshopで壁紙を作りながら、基本的な使い方を覚えるという記事を書き、その続きをまだ書いていなかったので、今回はそのお話をしたいと思います。 いくつかのフィルタの使い方について、ご説明出来ればと思いますが、メインはカラーハーフトーンフィルタです。 ■カラーハーフトーン 個人的に、一番使うことの多いフィルタな気がします。(シャープを除く) どのようなフィルタなのかということを、何となく説明すると、 ある面積における色のトーンを分解して、チャンネル毎に円を作成して重ねる っていうんでしょうかね。いまいち分かりませんね。詳しい説明はwikipediaの網点を参照してください。とりあえず、実際に使ってみたいと思います。 わかりやすくするために、モノトーンのグラデーションファイルを用意します。 これに対して、フィルタ→ピクセレート→カラーハーフトーン、を適用し
こんにちは、小川です。 今朝届いたPHPプロ!TIPS+ ダイジェストメールにも書いてありましたが、本日11月12日より「パーフェクトPHP」が発売となります。 ◆パーフェクトPHPとは パーフェクトPHPは、PHPをこよなく愛す(?)3人のPHPエンジニアが執筆した書籍です。以下のような構成です。 ・Part 1 「PHP ~overview」 PHPの基本 ・Part 2 「PHPの言語仕様」 PHPの言語仕様を詳細に解説 ・Part 3 「実践Webアプリケーション」 Webアプリケーション開発の基礎知識や、さらに先へ行くためのより現代にあったノウハウの解説 ・Part 4 「PHPセキュリティ」 サンプルコードを交えた様々なセキュリティの解説 ・Part 5 「テクニカルなPHPの活用」 SPLやPDOなどPHPが提供する便利なライブラリなどの解説 ・Part 6 「PHPレシピ」
mysql の procedure を使っていて、重複してなかったら insert して、重複している場合は何もしない(ORMとか使うと insertOrUpdate みたいな感じ?) 的なのをどうやって実装しようかなーと思っていて (中略) ということで、こんなテーブルがあったとして CREATE TABLE area ( area_id INT UNSIGNED NOT NULL AUTO_INCREMENT, country VARCHAR(2) NOT NULL, prefecture VARCHAR(100) NOT NULL, city VARCHAR(200) NOT NULL, PRIMARY KEY(area_id), UNIQUE KEY(country, prefecture, city) ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
前回に引き続き MySQL の procedure 関連 MySQL の procedure を使っていて、重複があったときだけ、処理を変更したいなぁ。って思っていて、 今までは、INSERT しつつ unique でレコードが被ったら(duplicate したら) INSERT ... ON DUPLICATE KEY UPDATE とかを使いながら、duplicate を避けていた(REPLACE 構文は 行が増えまくってると DELETE遅そうなので避けてた)し、DUPLICATE KEY UPDATE で 更新できるものが、対象のテーブルに限る(DECLARE で宣言した変数の SET は行えなさそう) だったりして、 どうにかして重複したことを判定できないかなーと思ってた。 (中略) そこで、Handler が SQLState を使うことができるそうなので、 duplica
ライセンス: フリーソフト おすすめ度: おすすめ度 ( 3.50点 ) 著作権者: Kevin Freitas 動作環境: 2000/XP/Vista/7 私は定規が好きです、定規が大好きです。常に手元に定規とストップウォッチと裁ちバサミを置いておきたい、そんな人間です。私のお気に入りは、ステンレス製の30cmのタイプ。この剛性感がいいのです。つぶしが効くと言うかなんというか安心感が素晴らしい。プラスチックの定規とかで端から目盛りが振ってなくて、1cmぐらい置いてから目盛りが始まる奴がありますが、アレは駄目でしょ、アレは甘え。私の定規はしっかり端から目盛りがスタート、角とか鋭角、かっこいい。時々取り出しては、ためつすがめつしてみたり、振り回してみたりしながら日々生活しております。そんな定規を愛してやまない私ですら認めた一品、それが今回のMeasureItです。WEBサイト上の長さを測定
ユーザ登録時にパスワード強度表示を入れてと言われた場合にサクッと実装できるjQueryプラグイン 2010年11月15日- SelectBox Plug-in ユーザ登録時にパスワード強度表示を入れてと言われた場合にサクッと実装できるjQueryプラグインのご紹介。 ユーザ登録の際に、パスワード強度を表示するサイトが多くなってきていますが、利用者がパスワードを決める場合に注意が働くためサイト全体としての安全性が高まるという点で効果がありそうですね。 仕事でサイトをつくっていて、あの機能入れてくれといわれた場合に、瞬時に実装できそう。 パスワードが弱い場合は次のように表示されます。 いい感じの場合はGoodが表示されます。 出し方は次のようにメソッドに渡すオプションを変更するだけでかえられます。 IDとパスワードが同じでもエラーを出せたりします。 関連エントリ パスワード生成や年齢計算等、P
はじめに 企業情報システムの多くは、(1)Webアプリケーション・サーバー(画面や業務ロジックを担当する)と(2)データベース・サーバー(データを格納する)で構築されています。これらのサーバー・ソフトに対する不正アクセスや操作ミスを防ぐことが、企業のデータを守るうえで重要です。 本連載では、2回にわたり、Webアプリケーション・サーバーのセキュリティ(第1回)と、データベース・サーバーのセキュリティ(第2回)を解説します。 Webサイトにおける脆弱性の現状 Webアプリケーション・サーバーのセキュリティ対策を考える前提として、 脆弱性の現状 脅威(攻撃)の現状 を知っておく必要があります。脆弱性と脅威の両方が揃うと、企業のデータは安全ではなくなります。 まずは、脆弱性の現状から説明します。 IPA(独立行政法人情報処理推進機構)のセキュリティセンターでは、経済産業省の告示に基づき、ソフトウ
PANTONE Spring 2011(PDF) [ad#ad-2] 需要があるか分かりませんが、Photoshop用のスウォッチファイル(.aco)を作成してみました。
こんにちはこんにちは。最近お腹痛いばっかり言ってることで有名なiwanagaです。 DeNAは外部的にはプラットフォーム的な部分の方がフィーチャーされることが多いですが、実はソーシャルゲームの提供も行っています。怪盗ロワイヤルとか、どこかで聞いたことがあるのではないでしょうか。 僕はDeNAでソーシャルゲームが誕生した辺りからずっとサーバサイドを見てきましたが、そんな運用の中で自分が貯めてきた知見とかTIPSをご紹介したいと思います。 かれこれ10タイトル近くはレビューしたり運用したりしてるため結構言いたいことはいっぱいあるので、小出しにしつつ評判よければ次も書きます。 ソーシャルゲームのためのMySQL入門一覧 ソーシャルゲームのためのMySQL入門 - Technology of DeNA ソーシャルゲームのためのMySQL入門2 - Technology of DeNA 「MySQL
1.データベースと暗号化 データベースにかかわる暗号化については、その対象とする脅威とその対策によって以下のようなポイントがあります。 ネットワーク上の盗聴に対して通信経路の暗号化を行う OSレベルでのファイル盗難、バックアップメディアの盗難などに対して格納データの暗号化を行う。 バックアップメディア内のデータのみ暗号化を行う。 「2.」と「3.」は似ていますが、データベースを取り巻く実際の脅威と、既に実施されている各種のセキュリティ対策を合わせて考えたとき「稼働しているサーバー自体は十分保全されていてリスクは小さいので性能優先にしたいが、バックアップメディアの輸送中や倉庫管理などについては対策が必要」といったような場合に「3.」を選択するケースもあると考えられます。 今回はこの中で特に「2.」の「格納データの暗号化」について取り上げてみたいと思います。 2.データベースの暗号化が対応する
はじめに この文書は、 Steven Bird, Ewan Klein, Edward Loper 著 萩原 正人、中山 敬広、水野 貴明 訳 『入門 自然言語処理』 O'Reilly Japan, 2010. の第12章「Python による日本語自然言語処理」を、原書 Natural Language Processing with Python と同じ Creative Commons Attribution Noncommercial No Derivative Works 3.0 US License の下で公開するものです。 原書では主に英語を対象とした自然言語処理を取り扱っています。内容や考え方の多くは言語に依存しないものではありますが、単語の分かち書きをしない点や統語構造等の違いから、日本語を対象とする場合、いくつか気をつけなければいけない点があります。日本語を扱う場合にも
もはやこの業界ではかなり浸透しつつあるjQuery。 今回はそんなjQueryにスポットを当て、本年度紹介された中でも、ホットなトレンドプラグインをご紹介します。 ※プラグインつかってないのもあります。 1)3D表示プラグイン サンプルデモ 今年のトレンドと言えば3D。 というわけでこちら。まずはサンプルデモを確認。 触ってわかる通りですが、2枚の画像が3D表示されます。 呼び出す $(function() { $('#mindscape').smart3d(); }); HTML <ul id="mindscape"> <li><img src=".../mindscape1.png" /></li> <li><img src=".../mindscape2.png" /></li> </ul> CSS #mindscape { width: 720px; height: 170px;
最近は朝飯を、家を出る前に摂っている、tanaka です。 さて、Lithium というPHPのフレームワークを触ってみました。 Lithium はPHP5.3以上専用のフレームワークで、構造がCakePHPに似ています。そして非RDBのMongoDBが標準で使えるようになっています。今回は勉強を兼ねて簡単なブログ作成チュートリアルの内容に、キーワード検索の機能を付けてみましょう。 チュートリアルが終わったら Lithium のサイトにはよくあるブログ作成チュートリアルのドキュメントがあります。ブログ記事の追加・一覧の作成までが解説されています。この解説に沿った日本語の説明もいくつかのサイトで読むことが出来ます。 ウノウラボ Unoh Labs: Hello,Lithium! 最先端PHPフレームワークLithiumのチュートリアルを実際に体験してみました。 - camelmasaの開発日
複数のメールアドレスを一括管理したり、送受信時の面倒なログイン作業の手間を省いてくれるメールクライアントソフト。その存在は、ビジネスシーンにおいても個人の趣味の世界においても、もはや欠かせないものになっている人も多いはず。中でも、アドオンと呼ばれる拡張機能によって強力にカスタマイズでき、開発も盛んに行われているThunderbirdは特に人気の高いクライアントの1つです。 今回は、そんなThunderbirdに入れておきたい必須アドオン13個をまとめてみました。私も長い間メールクライアントソフトにThunderbirdを使っており、同時にアドオンも気に入ったものをいくつか入れていますが、ここではその備忘録としての意味も兼ねて、個人的に愛用しているものから定番のアドオンまで、「Thunderbirdユーザーならこれだけは知っておきたい!」というアドオンをまとめて紹介してみます。 Minimi
Base64 Encoding for Images. 画像自体をBase64エンコードしてHTML内に埋め込んで高速化するPHPコード例。 Googleがインスタントプレビューや画像検索で導入してその読み込み速度に驚いた方も多いかもしれません。 その手法をPHPで実現するコードが掲載されていましたのでご紹介。 PHPでやるにはそんなに難しいわけではなさそう。 <?php $img_src = "image/sample.png"; // 画像ファイルの指定 $imgbinary = fread(fopen($img_src, "r"), filesize($img_src)); // バイナリデータを読み込み $img_str = base64_encode($imgbinary); // base64エンコード echo '<img src="data:image/png;base6
2010/11/13 に出たらしい http://bakery.cakephp.org/articles/markstory/2010/11/13/cakephp_1_3_6_and_1_2_9_released を読んでびっくりしたんですが、 Twitter を軽く検索した限りだと CakePHP ユーザでない僕が気づいているのに (日本の) CakePHP ユーザさんたちがどうも気づいていないっぽいのでわかりやすくまとめてみることにしました! CakePHP には任意の PHP コードが実行できる致命的な脆弱性があります! 影響のあるサイト結構ありそうですが悪用厳禁です! ※通常リリースの告知のなかにこんな致命的な脆弱性に関する情報を思いっきりわかりにくく書いちゃうのはひどいなあと思うので、ユーザの方は CakePHP に文句を言うといいと思います。僕は CakePHP ユーザじゃない
AJAXコンテンツが増えるにつれて問題になるのは、SEOというか、検索エンジンにどうクローリング、インデックスさせるのか、という点ですよね。 この前JavaScriptの実装を担当した松本クリニックは、AJAXでほぼ全てのページを切り替えるっていうのが最大のポイントなんですけど、これの良いところはWordPressで全てのページを生成してて、JSオンでもオフでも見られるんですね。つまり、クローラはオフのコンテンツを見るような作りにしてあります。 で、こういうのって小規模~中規模なサイトならまだいいと思いますけど、大規模なサイトになってきたりするとページは存在しないでデータだけが存在したりする(ハンドラにリクエストをかけてJSONだけを返してもらって内容を入れ替える、など・・・)わけで、実現が難しくなるんですね。 この問題に対してGoogleが現在公表している方法は、HTML snapsho
更新履歴 2010-11-25 jQuery Alert Dialogs との併用例を追記しました。 HTML5 のサポートブラウザで実装されてる autofocus 属性をクロスブラウザで使用できるようにする jQuery プラグインです。適用したい要素に autofocus 属性を記述した状態で JS ファイルを読み込むと、画面表示時に自動的に autofocus 属性を持つフィールドにフォーカスがあたるようになります。 ただ autofocus の標準機能だけだとあまり実用性がないので、「入力エラーがあった場合はそちらのフィールドへのフォーカスを優先する」といったちょっとした拡張を、オプションで使用できるようにしてあります。 機能概要 クロスブラウザで HTML5 の autofocus 属性を機能させることができるようになります。また、拡張機能を有効にすると以下の優先順位でフォーカ
canvas 3 テクスチャ素材の利用にあたっては個人でも商用でも無料で、リンクなども必要ありません。 ただ、このサイトを広めてくれるとありがたい、とのことです。
RESTの時代がやってくるのだ、という記事を1つ前の「時代はRESTへ。SOAPの終わりを象徴する、Webサービス標準化団体のWS-Iが活動終了」で紹介しましたが、そのRESTも使われ方が進化してきているのだ、ということを、その記事の中でとりあげたProgrammableWebのJohn Musser氏が公開しているの資料の中で解説しています。 3つ紹介しましょう。 バージョン番号の組み込み 最近のREST APIにはバージョン番号がURIに埋め込まれるようになったとのこと。 利用者に状況報告 レイテンシーがどうなっていて、正常稼働しているかどうかといった報告を利用者に対してきめこまかく報告するようになったと。APIに依存した外部サービスが増えたためでしょうね。
チャイルドセレクタや隣接セレクタなど、あんまり馴染みのないちょっと小難しい CSS のセレクタなどをまとめてみました。 これからクロスブラウザの照準を、IE7 に合わせるなら、ちょっとお役立ちかもです! そろそろ IE6 のことは忘れて、IE7 からのクロスブラウザを目指せばいいのかなーという気がしています。CSS のプラパティーの中には、今まで IE6 のことを考えて使わなかったものがたくさんあったりします。それらを改めて確認してみると、コーディングの幅が広がるなーという気になったりもします。 これから使う事が増えるかもしれない、CSS のセレクタやプロパティを、もう一度振り返ってみると同時に、IE7 で注意したい事などを簡単にまとめてみました。 IE6 ではサポートされていませんでしたが、IE7 からは使ってもOKなセレクタやプロパティには、どんなものがあるのか確認してみます。後半は
今日の内容 JavaScriptを勉強し始めくらいの人を対象にしたJavaScript入門講座的なもの 文法とかは調べればわかるのでふれません 一人で勉強してもわからなそうな概念などを重点的に説明します ライブコーディングするのでJavaScriptってこんな感じて作るんだなーというのがわかってもらえればと アジェンダ JavaScriptを勉強する前に JavaScriptの基礎知識 ライブコーディング part1 jQueryの基礎知識 ライブコーディング part2
7 Useful Tools for Mobile Website Testing | Tools スマートフォン用のサイト作成に役立つテスティングツールが7つ紹介されており、便利そうなものをピックアップしてみました。 サイトチェッカー W3C mobileOK Checker W3Cのモバイルサイトチェッカー。サイトのURLを入れるだけで、対応状態を〜%として表示してくれます。 何を改善すればポイントを上げられるか?についても詳細にレポートしてくれるところがいいですね。 mobiReady URLを入力するとサイトのモバイル対応状態をレポート結果として表示してくれる。 レポート結果は次のようになります 機種が微妙ですが、JAVAをつかったシュミレーターで動作確認できたりします Gomez Mobile Website Readiness Test URLのほか必要情報を入れるとサイトのモ
Facebookが新しいサービス「Messages」の基盤として、NoSQLデータベースの「HBase」を選択したことを、先日の記事「Facebookが新サービスの基盤にしたのは、MySQLでもCassandraでもなく、HBaseだった」で紹介しました。 HBaseは、Facebookによると次のような特徴を備えていると説明されてます。 負荷に対して非常に高いスケーラビリティと性能を発揮 CassandraよりもシンプルなConsistency Model(一貫性モデル)を備えている 自動ロードバランス、フェイルオーバー、圧縮機能 サーバーごとに数十個のシャードを割り当て可能、などなど このHBaseはどのようなデータベースなのでしょうか? 情報を集めてみました。 HBase入門のプレゼンテーション 最初に紹介するのは「HBaseエバンジェリスト」Tatsuya Kawano氏のプレゼン
春山 有由希 / ハルヤマ ユウキ UX / UI Design HTML / CSS Graphic Design Photography Designer & Front-end developer 福岡でプログラマとして就職後、Web制作会社に転職し、デザイナーになりました。 ECサイト、テレビ局や番組サイトのデザイン、執筆や講師業などで経験を積んだのち上京し、株式会社Fablicで フリマアプリ フリル(現ラクマ)のUI/UXデザインを担当。 その後、楽天株式会社でデザインチームマネージャを担当したのち、 フリーランスのデザイナーを経て、現在は株式会社スマートバンクでデザイナーをしています。 MORE PROFILE
こんにちは、今週はモテキDVD-BOXの到着が待ち遠しいinoueです。 さて、携帯の冬モデル発表でちょっと活気づいているAndroid周辺ですが、 Xperiaもやっとバージョン2.1へのアップデートが可能となりアプリ開発 をそろそろ本腰入れないと、という状況になっています。 そこで、Androidアプリ開発に役立つサイトを簡単にまとめてみました。 私も夜なべプログラミングしようっと。こたつ欲しいなあ… まずはここ!本家サイト Android 総合情報はこちらから。 Androidマーケットの情報にもアクセスできて便利です。 (ただしchrome、Firefoxでは表示が崩れて見づらかったです。) Android Developers 開発者向け情報はこちらにまとまっています。 SDKのダウンロードもここから。 サイトを英語と日本語で読むことができますが、切り替えると若干情報が異なること
これまでの記事でWebサイトのセキュリティについてお伝えしてきましたが、実際にWebサイトの診断を行っていると、脆弱(ぜいじゃく)性が発見されるパターンが非常に似通っていて、同じ脆弱性が同じような画面で発見されることがあります。 最終回となる今回は、実際に診断していて発見されるケースについて、紹介したいと思います。 1. こんな場所に発見されるケースが多い (1)検索画面(トップページや全画面共通) ・発見される脆弱性:XSS(クロス・サイト・スクリプティング) 検索結果を表示する画面で、入力されたキーワードを表示しようとして、XSS(クロス・サイト・スクリプティング)が発生するケースがあります。 汎用的なモジュールを使用する場合は問題がないケースもありますが、自社内や開発業者のハンドメイドの場合には、脆弱性が作り込まれているケースが見受けられます。 (2)入力フォーム(問合せフォームや会
リンクをクリックしてページを遷移する際に、フェードやスクロールのアニメーションを加えるスクリプトを紹介します。 デモページ Pageswitchの実装 実装は簡単です。 HTML 既存のHTMLに、特に手を加える必要はありません。 idに使用している「example」は適当なものに変更できます。 <div id="example"> <a href="//coliss.com/">Example #1</a><br /> <a href="http://www.example.com">Example #2</a><br /> </div> [ad#ad-2] JavaScript PageswitchはjQueryのプラグインのため「jquery.js」と当スクリプトを外部ファイルにし、下記のように各リンクにエフェクトを指定することができます。 $(document).ready(fun
twitter facebook hatena google pocket これは簡単に導入できてよさげなプラグインです。 本をめくるような表現をさくっと導入できるViewbook - jQuery Pluginを紹介します。 また、オプションも色々あるので、オリジナルなコンテンツになりそうです。 sponsors 使用方法 Viewbook - jQuery Pluginからファイル一式をダウンロード。 <script type="text/javascript" src="jquery-1.4.3.min.js"></script> <script src="jquery.easing.1.3.js" type="text/javascript"></script> <script src="jquery.viewbook.1.0.0.js" type="text/javascript
SitePoint: New Articles, Fresh Thinking for Web Developers and Designers PHPを使ってWebサイトやWebアプリケーションを構築する場合はデータベースも併用することが多い。そしてその場合に採用されることが多いデータベースのひとつにMySQLがある。PHPはすぐに利用できるようになるプログラミング言語といわれているが、MySQLやSQLはそうではない。堅牢で信頼できるデータベースを設計し、それを扱うSQLクエリを作成するにはそれなりの学習時間と経験が必要だ。 こうした話題がSitePointにおいてTop 10 MySQL Mistakes Made By PHP Developersとして掲載されている。PHPデベロッパが犯しがちな10のMySQLミステイクという内容になっている。どういった間違いをしてしまうか簡単に
twitter facebook hatena google pocket 画像をマトリックスにできます! ・・・いまさら何でって感じですが。 jQuery Matrixを使用すると画像をモザイク化できるので、ひと味違う様に見せるのにはいいのではないでしょうか。 sponsors 使用方法 jQuery Matrixからファイル一式をダウンロードします。 <script type="text/javascript" src="jquery-1.4.3.min.js"></script> <script src="jquery.matrix.js" type="text/javascript"></script> <script> $(function() { $("#id名").matrix({ colors: "green", //モザイク化させる色 animated: true, //
詳しくはコチラ→ position ボックスのレイアウト方法を指定するpositionプロパティ topプロパティ topプロパティは、ボックスを配置する場合に上からの距離を指定します。基準位置の上端から配置するボックスの上端までの距離を示します。positionプロパティが「static」以外のときに有効となるプロパティです。 詳しくはコチラ→ top ボックスを配置する場合に上からの距離を指定するtopプロパティ bottomプロパティ bottomプロパティは、ボックスを配置する場合に下からの距離を指定します。基準位置の下端から配置するボックスの下端までの距離を示します。positionプロパティが「static」以外のときに有効となるプロパティです。 詳しくはコチラ→ bottom ボックスを配置する場合に下からの距離を指定するbottomプロパティ leftプロパティ leftプ
デフォルトではXML形式の空要素を出力しますが、PHP 5.3.0から第2引数にfalseを指定すると<br>として出力できるようにもなりました。 この関数はもはやPHPerなら常識でしょうか? ■mb_strimwidth 文字を丸める関数です。 <?php $string = "アシアルは今、より多くのお客様にサービスを提供していこうと考えています。業務内容には多くの範囲が含まれますが、自身のアイデアを活かしたい、今までにないWebサービス を作りたい、PHP言語に興味がある、といった方は、アシアルで一緒に頑張ってみませんか?"; echo mb_strimwidth($string, 0, 60, '...', 'UTF-8');
WPZOOM Developer Icon Set (154 free icons) [ad#ad-2] アイコンは全部で154種類、フォーマットはPNG, PSD, AIが揃っています。
こんにちは、id:stanakaです。昨日開催された、はてな技術勉強会 #2の資料&動画を公開します。今回は、翌日に公開できました。今後もこのスピード感を維持したいものです。 「TitaniumによるiPhone/Androidアプリ開発」 id:r_kurain いま最も注目をあつめる、スマートフォンアプリ開発環境であるTitaniumについて解説します。 インストールなどの導入から、簡単な Twitter クライアントの作成までの一通りの開発について実際に動く様子を確認しながら説明していく予定です。 TitaniumによるiPhone/Androidアプリ開発View more presentations from kurain. サンプルコード: https://github.com/kurain/TitaniumMobileSample 「iPhoneアプリ開発講座Web連携アプリ
WindowsアプリのツリービューっぽいUIをWEB上で簡単実装できるjQueryプラ... 次の記事 ≫:シンプルさがいい感じの154種類のアイコンセット Top 10 MySQL Mistakes Made by PHP Developers PHP開発者のMySQLの間違いトップ10。 手慣れている人にとっては知ってることも多いかもしれませんが、初心者が役立ったり、知らない部分のカバーとしてメモとして書いてみます MyISAMを使っている デフォルトはストレージエンジンにMyISAMだけどInnoDBを使おう リカバリ可能でオンラインバックアップ機能、外部キー利用可能なInnoDBおすすめ 詳細:Open database life: MyISAMとInnoDBのどちらを使うべきか PHPのMySQL関数を使っている mysql_* 関数を使わず、PDO等でストレージ変更に対応しよう
最近のトレンドの一つでもある背景画像をブラウザの枠いっぱいに表示する実装方法はたくさんあります。その中から、理にかなった最新のテクニックや、より多くのブラウザに対応させるテクニックを紹介します。 Perfect Full Page Background Image [ad#ad-2] 下記は各ポイントを意訳したものです。 各デモはページ下部のDownload Files」で、まとめてダウンロードできます。 背景画像をブラウザの枠いっぱいに表示するテクニックとは CSS3を使ったテクニック CSSだけで実装するテクニック:その1 CSSだけで実装するテクニック:その2 jQueryを使ったテクニック 背景画像をブラウザの枠いっぱいに表示するテクニックとは 前提として、下記のポイントが挙げられます。 画像でページをいっぱいにします。 空きは無いようにします。 画像のサイズは必要があれば調整しま
詳しくはコチラ→ position ボックスのレイアウト方法を指定するpositionプロパティ topプロパティ topプロパティは、ボックスを配置する場合に上からの距離を指定します。基準位置の上端から配置するボックスの上端までの距離を示します。positionプロパティが「static」以外のときに有効となるプロパティです。 詳しくはコチラ→ top ボックスを配置する場合に上からの距離を指定するtopプロパティ bottomプロパティ bottomプロパティは、ボックスを配置する場合に下からの距離を指定します。基準位置の下端から配置するボックスの下端までの距離を示します。positionプロパティが「static」以外のときに有効となるプロパティです。 詳しくはコチラ→ bottom ボックスを配置する場合に下からの距離を指定するbottomプロパティ leftプロパティ leftプ
twitter facebook hatena google pocket ページ遷移の際に何らかのエフェクトが発生するサイトがありますが、今回紹介するjQuery Animated Pageswitch Pluginを利用することで、それを簡単に再現可能です。 sponsors 使用方法 jQuery Animated Pageswitch Pluginからファイル一式をダウンロードします。 <script type="text/javascript" src="jquery-1.4.3.min.js"></script> <script src="jquery.pageswitch.js" type="text/javascript"></script> <script> $(function() { $('#id名 a').pageswitch({ url: '/test/', //
こんにちは nakamura です。今年もヒートテックのありがたい季節になってきましたね。サムイサムイ、、、 バージョン管理と言えば Subversion や CVS, 最近でいうと git や mercurial といった分散型のシステムも人気ですが、今回紹介する RCS はそんな高機能なバージョン管理システムとは対照的にとにかくシンプル!機能は限られてるけどその分お手軽なツールなのです。サーバの設定ファイルなんかを管理するのにとても便利ですよ! インストール CentOS の場合は以下のコマンドでインストールできます。他のディストリビューションでも、大体パッケージがあるはずなので探してみてください。 yum install rcs インストールしたら、特に設定もいらずそのまま即使えます。デーモンを常駐させる必要もなければリポジトリもいらないので楽ですね〜。 使ってみよう! ではさっそく
こんにちは、亀本です。 本当は今日はアシアルの日常を書く、という名目のブログ当番なんですが、どうせエンジニアの日常なんてコード書いてますよね。 ということで、最近使ってみたTitaniumについて書いてみる事にしました。 さて、最近ちまたでTitanium Mobileがあつい!という話が出ていて、入門記事もいろんなところで上がり始めていますね。 Titaniumをご存じない方のために簡単に説明しておくと、JavaScriptを使ってiPhone/Androidアプリを作ってしまおう、という物です。 果たしてどんなもんか!と、手元で作成中だったアプリをTitaniumを使って再実装してみたのですが、世間で言われるとおり所々で凝った事をしづらいものの、想像していたよりはずっと、リッチ・簡単・高速に作れる印象でした。 早い、安い、うまいなんてぎゅうどn(ry その開発の際に、Objective
はてブ ツイートする シェアする 他のギャラリー ファビコンギャラリー 見出しデザイン ウェブコレクション このサイトについて いろんなWEBサイトのフッター(ページ下部も含む)部分を集めました。デザインの参考に。掲載サイトがリニューアルした場合はご紹介のフッターが使用されていない場合があります。 連絡先:manage.hp+footer@gmail.com copyright © footer-design.com All Rights Reserved.
人物写真や顔写真など、好きなポートレイトを選んでから数回クリックするだけで自動的にヒストグラムが調節されて、ポートレイトをより一層魅力的にすることができるフリーソフトが「Glamour」です。 また、スライダーを動かすことで「エフェクトの増減」「彩度」「ソフトフォーカス」の三種類を細かく調節し、その変化する様子をビフォーアフターとしてオリジナル画像と比較できます。そうして出来上がった画像はクリップボードへコピーしたり、さまざまな画像フォーマットでの保存が可能です。なお、このソフトはすべてのWindowsに対応しています。 具体例、ダウンロード、実際の使い方などの詳細は以下から。まずは実際にこのソフトで加工した例を紹介します。すべて左がオリジナル、右が「Glamour」で加工したものです。 それではダウンロードを始めましょう。 IDimager - Power up your photo m
サンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキスト サンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキストサンプルテキス
BlueStack Systems社が、WindowsPCからAndroidアプリをシームレスに使える世界初のソフトウェア「BlueStacks for Windows」が発売予定であることを発表しました。 発表によれば「BlueStacks for Windowsによって、ビジネスの世界での必需品であるWindowsアプリケーション(Internet Explorer、 Excel、Outlook、PowerPoint、Word等)を使いながら、Android のエンターテインメント系アプリケーション(ゲーム、音楽・動画、写真等)や日常生活に必要なアプリケーションを、一台のPCで同時に楽しめるようになる」とのことで、シーンによっては非常に便利なソフトとなるかもしれません。 というわけで、製品発表に関する詳細な資料は以下から。BlueStacks http://www.bluestacks
サーバ監視に超使える〜topコマンドのまとめ サーバを運用しているとよく使うtopコマンドですが、標準のtop以外にも色々便利なものがあるのでまとめてみました。 ボトルネックといえば、ネットワーク、ディスクIO、スワップ、CPU、メモリといったものが関連しますが、ツールで視覚化することでより分かりやすい対策がとれますね。 htop こちらも、通常のtopよりもさらに多数の情報を表示してくれるツール。 CPUやメモリの状態が視覚的にグラフで表示されていたり、複数CPUがある場合もそれぞれに利用率を表示してくれてわかりやすいです。 pstreeで表示するようなツリー+topコマンドのような表示も t を押せば切り替えられます。 公式サイト上にある128コア積んだマシンのhtop結果が面白い。 次のようにすべてグラフで表示されているため、128コアあったとしても瞬時に負荷が把握できますね。 io
以前、デザインとか加工とか出来ないから なんかいいの教えて、と言われて教えたツ ールいろいろという記事で、ブログを始めた 彼が今度はブログをパワーアップさせたい 的な事を言い出したので教えたWebサービ スです。知識がないから簡単に出来るやつ がいい、とのことでしたのでそんなWebサー ビスになっています。 パワーアップさせたい、としか聞かれなかったのと、僕もあまり時間がなくてさほど数は探せませんでしたが、喜んでくれていたので需要があるかと思って記事にしてみます。パワーアップって言われても、どうしたいのかよく分からないので機能を追加できる的なものを探してみました。 基本的にコピペで済むものがほとんどです。僕自身、あまり導入経験が無いので使用感抜きで書いていますがご了承ください。 zenback 国産(シックス・アパートさんですね)のWebサービスです。かなり色々なところで見かけますが、申請
はじめまして、株式会社はてなでアプリケーションエンジニアをしている倉井龍太郎(id:r_kurain)と申します。この連載では、今もっとも注目集めているスマートフォンアプリ開発環境であるTitanium Mobile(以下Titaniumと省略)を使ったiPhone及びAndroidアプリケーションの開発方法について解説していきます。 Titaniumとは TitaniumはAppceleratorが開発しているスマートフォンアプリ開発環境です。本来iPhone/iPod/iPad であればObjectice-Cを使用して、AndoridであればJavaを用いて作成するネイティブアプリケーションが、どちらの環境でもJavascriptのみで開発できるようになるものです。Titanuiumは無料で利用することができます。サポートを受けるにはAppceleratorの有料プランに入会する必要が
今年も残すところあと30日間を切り、もうそろそろ年賀状を用意して送らないといけない時期ですね。そこで今回は年賀状作成ソフトについて書きたいと思います。ちなみにみなさん年賀状はどんなソフトで作成していますか?未だに有料の年賀状ソフトを使っているというあなたには、日本郵便が提供している無償の年賀状ソフト「はがきデザインキット2021」をお勧めしたいです。 この「はがきデザインキット2021」は、日本郵政グループが無料公開しているもので年賀はがきのデザインや宛名を手軽に作成し印刷できるソフトです。フリーにしては非常に出来が良く、市販のソフトと比べても遜色がありません。ちなみに動作にはAdobe AIRを用いておりWindows/Mac/Linuxで動作するほか、iOS/Androidなどのスマートフォン版も用意されています。 はがきデザインキット2021とは? はがきデザインキットは日本郵政グル
2011年卯年の年賀状と年賀状パーツ素材がまとめてフロップデザインからフリーダウンロード可能になっており、個人的な年賀状目的であれば画像の変型や加工もOKとなっています。また、使いやすいように高画質なJPEG画像データで収録されており、そのまま使えるハガキデータから、ワンポイントのアイコン、マーク、背景画像、文字など、山ほど素材がてんこ盛り状態です。 どういったデザインがあるかという一覧は以下から。 無料年賀状イラスト素材集2011年|うさぎウサギJPEG画像デザイン兎 まずはハガキデザインのサンプルから。 文字データもこのようにいろいろな種類が入っています
動作が軽く、デバイスやOSの垣根を超えたマルチプラットフォームでの連携ができるシンプルなメモアプリが「Simplenote」です。iPhoneやAndroidを始めとした各種スマートフォンだけでなく、WindowsおよびMac OS Xなどの各OSでもウェブブラウザ経由でメモを簡単に共有できるのが特徴です。 「TO DOリストや備忘録として」「家族と共有する買い物メモ」「会議や教室で」「ブログへ投稿前の下書き」「ブレインストーミングに」「日誌替わりとして」「映画やレストラン、本などのリストアップ」など自分に合った自由な使い方ができます。 アカウント登録、使い方の詳細は以下から。Simplenote. An easy way to keep notes, lists, ideas, and more. http://simplenoteapp.com/ ◆基本的な使い方 上記ページ内の「Cr
印刷する メールで送る テキスト HTML 電子書籍 PDF ダウンロード テキスト 電子書籍 PDF クリップした記事をMyページから読むことができます 【ラウンドアップ】 長い間使い続け、すっかり手に馴染んだつもりのマシンとOSでも、ちょっとしたワザを新しく覚えたり、今まで知らなかったフリーソフトを入れてみたりするだけで、大幅に作業効率が上がることがある。今回、これまで「IT業界を生き抜く秘密10箇条」に掲載された記事の中から、特に即効性の高い「裏技」「フリーソフト」の紹介記事をプラットフォーム別に集めてみた。まだ試していないものがあったら、ぜひトライしてみてほしい。この記事では、近年人気のウェブブラウザである「Firefox」と「Chrome」に関するものを紹介する。
カッコよく動くポップアップでより分かりやすくメッセージを表示出来る「JQUERY BUBBLE POPUP」 2010年11月29日- JQUERY BUBBLE POPUP v.2.3.1 - display animated and shadowed "bubble" popups with few lines of code in jQuery カッコよく動くポップアップでより分かりやすくメッセージを表示出来る「JQUERY BUBBLE POPUP」 カーソルを合わせた際に、単にポップアップするのではなく、ポップアップ自体がフェードインアニメーションしながら動きをもって表示されることでより、利用者の注意をひくことができそうです。 見た目も影付きでカッコいいのが特徴です。 デザインは選べます。 何かにカーソルを合わせた時だけじゃなくて最初から特定のエレメント上に表示しておくこともでき
重要顧客の前でデモを行う際にバグが発生すると大変です。顧客だけでなく、自社の社長まで同席していたいたときなどは、さらにものすごく焦るのではないでしょうか。「バグ検出ドリル」の第7回では、そんな状況を想定しつつ、いろんなところに潜むバグを見つけ出してください!
Wijmo - jQuery UI Widgets 30近いウィジェットがセットになったjQueryプラグイン集「Wijmo」。 jQueryといえばプラグインによって様々なことが出来るのはご存じだと思いますが、Wijmoはこれ1個で30ものウィジェットが実装できるパックです。 UIのデザインをそろえたいような場合に使えそうです。 アコーディオン カレンダー 各種グラフ コンボボックス オーバーレイ 独自フォームデザイン グリッド リスト まだまだあります・・・。 よくここまでそろえたなという品ぞろえですね。 関連エントリ YoutubeやUstream等の動画埋め込みが超簡単になるjQueryプラグイン「jquery.mb.mediaEmbedder」 jQueryでYoutube埋め込みビデオをブロックの幅に合わせるコード 再生ボタン等も変更できちゃうYoutube操作jQueryプラ
複数のJSファイルの管理、CSSのサポートが異なるブラウザへの対応、ブラウザとバージョンの自動検出、スクリーンサイズの自動検出など、headで制御したい便利な機能がつまった超軽量(2.3KB)スクリプトを紹介します。 Head JS [ad#ad-2] 下記に、Head JSでできることを簡単に説明します。 詳しい使い方は下記ページで解説されています。 Usage: Head JS 外部JSファイルの読み込み JavaScriptの管理 CSSのサポートが異なるブラウザへの対応 HTML5非対応ブラウザへの対応 スクリーンサイズに合わせた表示 Dynamic CSS CSSを特定のページのみに CSSをブラウザごとに指定 外部JSファイルの読み込み 通常、複数のJavaScriptファイルを外部ファイルとして読み込ませるとブロッキングが生じます。 そのブロッキング解消し複数のファイルを並列
個人的に気に入ってよく使っている、又は いつか役に立ちそう、いずれ使いたい的な Lightbox風に拡大実装出来るjQueryプラグ インのまとめです。使うときにいちいち引っ 張り出しているのが面倒なのでまとめにして ついでにシェアしようと思って記事にします。 オーソドックスなものから、やや特徴的なもの、Twitterで「こんなのない?」って聞かれて探したものなど10個厳選です。特徴も一緒にメモしておきます。 なお、画像を使うjQueryプラグインにご興味が有るようでしたら、以前書いた画像を使ったいろいろなjQueryプラグイン224個まとめも参考にして頂けるかと思います。 colorbox 一番よく使っているかもしれません。MITライセンスで、グループ化⇒スライドも可能。また、iPhone、iPadでも動いて表示も崩れません。エフェクトも変更可能で、YoutubeやIframe、Flas
カッコいい管理画面のHTMLテンプレート総まとめ。 これまで紹介したエントリや、新しく発見したエントリで紹介されているものを全てマージしてみました。 有償のものも混じってますが、カッコいい管理画面を作りたいといった際にカタログ的に使ってみてもいいかも。 独断ですが、クオリティ順に並べ替えてます。 Simpla Admin Boxie Admin Complete Liquid Admin InAdmin Admin (FREE) Adminizio Lite – Admin Template Admin Templates - Professional XHTML Back-end Template Spring Time – Simple Admin Template Internet Dreams Admin Skin Visual Admin ThePixelDeveloper Ad
CakePHPのModelに悩む人が多いようなので、自分なりの付き合い方(考え方)をご紹介します。 CakePHP Advent Calendar 2010の3日目です。 前日の k1LoW さんのエントリ、参考になりますね。GETのフォームをdata[]でやるとURLがすんごいことになるので、ウチでは別途対応できるライブラリを作ったりしてます。 さて、3日目の今日は書きたいネタは幾つかあったのですが、「君の当たり前に僕らは感嘆させられるんだ」の精神に従って、自分なりのModelの使い方、考え方を書いてみます。 1. 適正なインターフェイスを用意して処理をカプセル化 まず基本的な考え方。 Model(に限らずですが)では、処理単位でインターフェイス(メソッド)を用意して、実装はカプセル化しておきます。 こうすることによって、Modelを利用する側(Controllerや他のModel等)は
twitter facebook hatena google pocket 昨今VAで画像を切り替えるのが多くなっていますが、Awkward Viewline -- A jQuery Pluginを使用するとウィンドウ幅100%で画像切替が可能になり、印象的なVAが導入できそうです。 sponsors 使用方法 Awkward Viewline -- A jQuery Pluginからファイル一式をダウンロード。 <script src="jquery-1.4.4.min.js" type="text/javascript"></script> <script src="jquery.viewline.js" type="text/javascript"></script> <script> $(function () { $("#id名").viewline({ auto_play: t
こんにちは。プログラマ定年を迎えたのであとは悠々自適に日々過ごそうと思ってるはせがわです。 JavaScriptで記号プログラミングを行う基本的な取り組を説明します。 jjencodeなどで使っているテクニックです。 まず最初は数字の作り方。 +[] // 空の配列にプラス演算子で数値の 0 ~[] // 空の配列にビット反転で -1 ~{} // 空のオブジェクトにビット反転で -1 -~[] // 空の配列にビット反転で-1、-1に単項マイナスで +1 -~-~[] // +1 にビット反転で -2、-2 に単項マイナスで +2 このように、空の配列や空のオブジェクトに数値用の演算子を適用することで、任意の数値を記号だけで生成することができます。 次に文字の作り方。 ![] // 空の配列に論理否定で false !![] // 空の配列に論理否定を2回で true (![]+"")
Notobiは11月1日(米国時間)、PhoneGapの最新版であるPhoneGap 0.9.2をリリースした。PhoneGapはクロスプラットフォーム・モバイルアプリケーションの開発フレームワーク。デベロッパはHTML+CSS+JavaScriptを用いて、iPhone/Android/BlackBerry/Symbian/Palmのネイティブアプリケーションを開発できる。各デバイスのモーションセンサやカメラ、GPSにはPhoneGapにて提供されているJavaScript APIをもちいて操作する。同ライブラリはThe "New" BSD LicenseおよびThe MIT Licenseのデュアルライセンスのもとで公開されているオープンソースソフトウェア。 PhoneGapでのスマートフォン別機能対応表 - PhoneGap Supported Featuresより抜粋 iPhone
こんにちは、「夜になると体温38度」が二日連続で来たinoueです。 こういうのも風邪なんでしょうかね。ただの知恵熱? さて、前回「Androidアプリ開発に役立つサイト7つ」というエントリーを書きましたが、 webサイトのスマートフォン対応についてもお客様にご提案させていただく機会がぐんと増えてきています。 そこで、今回はスマートフォン対応サイトの提案をする際に役に立ったサイトをご紹介します。 参考資料 2つ 実例でわかる!スマートフォンサイトの画面設計 「実践!iPhone&Androidサイト制作ガイド」という連載の第6回目の記事です。 タイトルどおり、実際のwebサイトをスマートフォンの特徴に沿ってリデザインしていく手順を解説しています。 画面設計の際に考慮するポイントについて基本をおさえられる記事です。 iPhone アプリと Web デザイン Part.6 iPhone アプリ
「Feedly」の概要とインストール 「Feedly」 「Googleリーダー」は、最も人気のあるRSSリーダーのひとつだろう。Googleアカウントでログインすれば、場所や端末を選ばずに利用できるのが魅力だ。しかし、多くの記事をチェックする場合、Googleリーダーの単調な記事配置に飽きてくることもあるかもしれない。いや飽きる。そんな時に便利なFirefoxアドオンが今回紹介する「Feedly」だ。ニュースサイトや雑誌のように記事の見出しが配置されるので、ずっと見ていても飽きることがない。また、Twitterと連携しタイムラインをページ内に表示することも可能なのだ。 注意:本稿では、Firefoxのアドオンのインストールを行っていますが、ソフトウェアの利用は使用者の責任で行ってください。 「Feedly」をインストール それでは、「Feedly」をインストールしよう。Firefoxのアド
最初に必要なものだけ効果的に見せるAppleサイト風エフェクト実装jQueryプラグイン「Apple Effect」 2010年12月06日- jQuery Apple Effect 最初に必要なものだけ効果的に見せるAppleサイト風エフェクト実装jQueryプラグイン「Apple Effect」。 最近Appleのサイトを見たことがある方なら分かると思いますが、最初に1枚の画像を表示しておいて、ナビゲーションなんかは少し待たせて、フェードインしながら表示するというカッコいい効果を作れます。 最初に1枚の画像を表示 フェードインしながらナビゲーションを表示する こちらのデモで動きを確認 実装は1行。 $('#target').appleEffect(); オプションを渡すことでアニメーション開始までの時間を設定したり、コールバック関数を指定できたりします。 ちょっとめんどくさそうなこの機
■編集元:スマートフォン板より「Androidアプリ総合 Part33」 1 名無しさん@名無し変更投票、詳しくは議論スレへ :2010/12/06(月) 18:46:06 ID:F1I7EQWF Android用アプリケーションの総合スレです。 質問する前に必ず自分で調べましょう。 ■前スレ Androidアプリ総合 Part32 http://hibari.2ch.net/test/read.cgi/smartphone/1291134480/ 名無しさん@名無し変更投票、詳しくは議論スレへ :2010/12/06(月) 18:46:38 ID:F1I7EQWF ■アプリ紹介サイト ・ピックアップ オクトバ http://octoba.net/ アンドロイダー http://androider.jp/ mobile ASCII http://mobilea
JavaScript Advent Calendar 2010 8日目担当のid:os0xです。 JavaScriptネタは案外範囲が広くて色んなネタがあるので、毎回が楽しみですね。 さて、私はデバッグをネタにしたいと思います。テストではなくデバッグです。誰かが書いたコードをメンテナンスしなきゃー、とか。jQueryプラグイン導入しようとしたけど、なんかうまく動かないーみたいなケースのおはなしです。 JavaScriptのデバッグは大変なので、多くの方が日々苦労されていると思います。なぜJavaScriptのデバッグが大変なのか少し整理してみましょう。 ブラウザ依存 まず、なんといってもJavaScriptはウェブブラウザ上で実行されるので、環境が一定ではありません。特定の環境だけを対象にJavaScriptを書くことは滅多にありません。PC向けではIE、Firefox、Chrome、Sa
Archive by month 2010年12月 (16) 2010年11月 (52) 2010年10月 (54) 2010年9月 (47) 2010年8月 (59) 2010年7月 (49) 2010年6月 (43) 2010年5月 (35) 2010年4月 (48) 2010年3月 (53) 2010年2月 (51) 2010年1月 (45) 2009年12月 (65) 2009年11月 (38) 2009年10月 (49) 2009年9月 (58) 2009年8月 (35) 2009年7月 (69) 2009年6月 (78) 2009年5月 (66) 2009年4月 (59) 2009年3月 (75) 2009年2月 (72) 2009年1月 (78) 2008年12月 (65) 2008年11月 (68) 2008年10月 (69) 2008年9月 (57) 2008年8月 (7
twitter facebook hatena google pocket 面白い動きで印象に残る画像スライダー「FancyMoves a new jQuery Product Slider」を紹介します。 ECサイトなど商品を見せる時に有効ではないでしょうか。 sponsors 使用方法 FancyMoves a new jQuery Product Sliderからファイル一式をダウンロードします。 <link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8"> <script src="jquery-1.4.4.min.js" type="text/javascript"></script> <script src="slider.js" type="text/javasc
「Chrome Web Store」がいよいよ開店! そこで米Lifehackerでは、Chromeユーザさんなら、ぜひゲットしておきたいオススメアプリを、5つリストアップしてみました。 ■TweetDeck ツイッター、Facebook、Foursquare、Google Buzzを使っている人なら「TweetDeck」のようなソーシャルネットワーククライアントを既に利用していらっしゃるでしょう。「TweetDeck」の開発チームは、ゼロベースからChromeアプリを開発。インライン画像プレビューやドラッグアンドドロップによる整理など、素晴らしい機能を実装し、インターフェイスもスムーズです。 [無料インストールはこちら] ■Aviary 「Aviary」は「ウェブブラウザにあるPhotoshop」のようなもの。これまでならPhotoshopでやっていた、画像処理や色調整などの作業が、ウェ
あまりカジュアルではなかったwという説もありますが、結構面白かったです。 1人の発表が10分と、LT(Lightning Talks)風な感じだったこともあり、聴くのに必死だったのですが、少々メモを取ったので貼り付けておきます。(取れたところは少ない...) # 間違っている部分もあるかもしれませんが、そこはご了承を。 # きっと近いうちに皆さんの発表資料が出揃うだろうとは思いますが。出揃ったらリンク付けようw ちなみに、余談ですが懇親会も、かなり盛り上がって楽しかったですね! 個人的には、前から色々お世話になっていた、"刺身☆ブーメラン"の金子さん(id:a666666 / @kyanny)と色々お話できたのは良かったです。 show innodb status (@myfinder) show innodb status from Tatsuro Hisamori 呼び方: いのでーび
先日、現物とドキュメントの乖離に嫌気がさし、テーブル定義書の和名や説明文を、DBのメタ情報として保存できるようにする Web アプリを作りました。(オラクルのデータディクショナリを利用してます) テーブル定義書イメージな画面から Ajax + In-Place-Editor で直接編集できるようにしたのですが、編集量が多い時など、キー操作による上下左右のフォーカス移動ができないとどうにも不便だったので、これを可能にする jQuery プラグインを書いてみました。 機能概要 テーブル要素内の INPUT、TEXTAREA、SELECT、A のいづれかの要素にフォーカスした状態で、[Shift] + 移動したい方向の[矢印キー]の入力で、セルを跨いだフォーカス移動ができます。 Opera の空間ナビゲーション機能 Opera にはもともと テーブル要素に限定せず、同様のキー操作でフォーカス移動
先日、Web サーバ勉強会 #2 が開かれました。内容は、Apache のチューニングということで、参加したかったのですが、他の予定があって参加できませんでした。 そこで、僕が個人的に行っている Apache のチューニングを紹介したいと思います。最初、スライドで作成しようかと思ったのですが、ブログにまとめたほうがよさそうなのでブログにまとめていきます。 まず、大前提として Apache をチューニングするうえで、大事なことはその Apache が提供する Web サービスの種類のよって大きくチューニングする内容が異なるということです。例えば、動画・写真共有サービスと株価情報のサービスを比較すると、当然のことながら大きくサービスの内容が異なりますし、HTTP レベルでみるとクライアントからのリクエスト数、データサイズ、などがかなり違ってきます。 ですので、まずは自分が扱っているウェブサービ
twitter facebook hatena google pocket 長い文章を読んでいると、どこを読んでいるかわからなくことがあります。 そんな時、読んでいるところをハイライト表示してくれるとわかりやすくなります。 jQuery HighTabler Pluginはそれを実現するjQueryプラグインです。 sponsors 使用方法 jQuery HighTabler Plugin | JB is Programmingからjquery.hightabler-0.0.1.jsをjQueryからjquery.jsをダウンロードします。 <script src="/test/js/jquery-1.4.4.min.js" type="text/javascript"></script> <script src="/test/js/jquery.hightabler-0.0.1.js"
twitter facebook hatena google pocket iPhoneの数字スクロールはインターフェースが変わり、設定すら楽しいUIになります。 これをjQueryで実現したmobiscrollを紹介します。 sponsors 使用方法 mobiscrollからファイル一式をダウンロードします。 <link href="jquery.scroller-1.0b.css" rel="stylesheet" type="text/css" /> <script src="jquery-1.4.4.min.js" type="text/javascript"></script> <script src="jquery.scroller-1.0b.js" type="text/javascript"></script> <script> $(function () { $('#i
ジャンルは左上から順に セッティング ラベル メディア 電子機器 ディスプレイ CMS アロー モバイルデバイス シグナル コミュニケーション パワー ツール ロケーション ファイル ID チャート [ad#ad-2] ダウンロードできるアイコンのフォーマットはPSDで、シェイプで作られたベクターデータとなっています。サイズは16x16, 32x32, 64x64の3種類がセットになっています。 アイコンの利用にあたっては個人でも商用でも無料で、カスタマイズもOKとのことです。
日経LinuxとITproは、総計約700項目のHTML/スクリプト言語リファレンスを公開しました。「HTML」(295項目)、「CSS」(73項目)、「Dynamic HTML」(98項目)、「JavaScript」(295項目)、「Perl」(125項目)あわせて698項目。各項目にサンプルコードを掲載しており、コピーし貼り付けてすぐにお使いいただけます。JavaScriptは「この用例を実行する」という文字をクリックすれば、その場でサンプルコードを実行してみることもできます。 ファンレンスを使いこなすための記事や、「JavaScript入門」「Perlの使い方入門」「CSSの基本」「Linuxコマンド道場」「シェル・スクリプト工房」といった入門記事もご用意しました。 これらのリファレンスはここ2~3年かけて作成してきたものです。そのため一部に内容の古いものもありますが、順次更新してい
サーバ上で動いてるどのphpが重いか?を調べられる「PhpTop」。 「サーバ監視に超使える〜topコマンドのまとめ」というエントリで様々なtopコマンドを紹介したのですが、phptopなるものを新たに発見したのでご紹介。 具体的に出来ることは、今サーバで動いているものを指定した期間で、もっともアクセスが多いphp、CPUを多く消費しているphp、メモリを多く使っているphpといったものを降順にソートできるというものです。 サーバ上で多くのphpが動いており、どうも負荷が高いけどどれが重いのかよくわからないという場合に使えます。 top コマンドでは httpd が動いてるぐらいしか分からないので phper な方で負荷にお悩みの方は使ってみるのもよいかも。 たとえば、 $ phptop -t 15 -s mem のように実行すると、15分以内で、メモリを多く使っている順にソートが可能。
Sticky Notes with CSS3 デモ:左、デモ:右 [ad#ad-2] 付箋紙はどんな背景にも適用できます。 デモ 画像無しで付箋紙 Sticky Notes with CSS3 by accidental hacker 付箋紙の実装 上記の当サイトに設置したデモのコードを紹介します。 リスト要素で実装します。p要素は付箋紙には必要ありません。 <ul id="notes"> <li> <p>画像無しで付箋紙</p> </li> <li> <p>Sticky Notes with CSS3<br />by <a href="http://www.accidentalhacker.com/sticky-notes-with-css3/">accidental hacker</a></p> </li> </ul> [ad#ad-2] CSS3のグラデーション、ボックスシャドウ、回
先日、ドコモのAndroid端末である「GALAXY S」を予約したわけですが、そうなると気になるのが、ずーっと前から気になってたHTML5について。これからスマートフォンが普及するにつれて、無視出来ない技術であるのは誰の目にも明らかなのではないでしょうか。 てことで、HTML5について調べてみたメモです。 HTML5の概要まずは難しいことは抜きにして、概要を読んでみると分かりやすいです。 HTML5, きちんと。この記事だけで十分です。長くもなく、文字も少ないので非常に入りやすいです。 HTML5仕様関連一応ですが、仕様について。 HTML5.JP - 次世代HTML標準 HTML5情報サイトHTML 5 ― HTML 4 からの変更点 (http://www.w3.org/TR/html5-diff/ 日本語訳) 必要に応じてみればいいので、細かくは見てません。 基礎知識概要が理解出来
プラグインだけど公開してないものだったり、いつも使ってるプラグインとの組み合わせだったり、ショートコードとかなんだか色々。どれもCodaにスニペットで登録してて一発変換で使ってます。 コードはアレなんですけど、ひょっとしてひょっとすると誰かの役に立つかもしれないので恥ずかしながら公開します。対象はちょっとだけJS書けるとかそういう人ですかねたぶん。書ける人はもっとキレイなやつ使ってるでしょうし。(もっときれいに書けとか何そのコードとかも歓迎) 紹介してるスニペットたち ページトップにスクロールするだけ テキストボックスにラベル表示するやつ 要素のサイズを取得するやつ タブきりかえるやつ IEで透過pngをフェードしたときに黒くなるやつ対策のshow()とhide() Google Analyticsのトラックイベント一括bind Ajaxサイトにするときに使うリンク置き換えプラグイン スク
こんばんは、JavaScript Advent Calendar 2010、15 日目担当の nanto_vi (なんと) です。12 月 15 日が何の日か調べてみると東北本線が宮城県に到達した日とのこと。当時は上野から仙台まで 12 時間 20 分かかったそうです。それから 123 年を経た現在では同じ時間で鹿児島中央から新青森まで行けるようになり、鉄道の速度にも JavaScript の実行速度にも日進月歩を感じる今日この頃です。 さて、アプリケーションを作っていると、見た目はリンクのようだがリンクでない UI 部品を使いたくなるときがあります。ここで「リンクでない」とは、クリックしてもページ遷移が発生しないということです。このような UI 部品は、ページ遷移の代わりにメニューの表示といった何らかのアクションを引き起こす、すなわちボタンとして振舞います。 ユーザーインターフェース記述
twitter facebook hatena google pocket リストって概して味気ないですよね。 そんな部分を印象に残せたら、クリックしていただきやすくなるかもしれません。 jQueryプラグインのmobilyblocksなら、クリック時にエフェクトを伴い、華麗に表示できます。 sponsors 使用方法 mobilyblocksからファイル一式をダウンロードします。 <script src="jquery-1.4.4.min.js" type="text/javascript"></script> <script src="mobilyblocks.js" type="text/javascript"></script> <script> $(function () { $('.class名').mobilyblocks({ animateTime: 500, // アニメ
HTMLやCSS、DynamicHTML、JavaScriptやPerl、Windowsコマンド、ネットワークコマンド、Linuxコマンドといった、Webサイト構築やアプリ開発に欠かせないプログラミング言語とコマンドのリファレンスマニュアルです。各項目のサンプルコードは、コピーし貼り付けてすぐに使えます。入門講座も用意しました。ぜひブックマークしてお役立てください。 HTML HTMLは、Webコンテンツを作成する上で、最も基礎となる記述言語です。各タグについての概要や属性などをサンプルを交えて説明します。 HTMLリファレンス(107項目) HTMLリファレンスの使い方 HTML入門 CSS CSSは、Webページのレイアウトなどといったコンテンツの見栄えを指定する記述言語です。各スタイルの概要や使い方を説明します。 CSSリファレンス(73項目) CSSリファレンスの使い方 CSSの基
全画面をスライドギャラリー風にするダイナミック なナビゲーションをjQueryを使って実装するサン プルです。透過処理が必要ですが、IE6、IE7の 両問題児でも問題なく動いてくれますので、実践 でもプロモーションなどに利用できるっぽいですね。 スライドするとロゴが平行してスライドする事で視差 効果も出しています。 クロスブラウザ対応なので使いどころも出て来るかもしれませんね。ダイナミックに動いてくれますのでプレゼンテーションやポートフォリオ、キャンペーンなどに使うのも面白そうです。 Awesome Scrolling Navigation 全画面がスライドします。背景に画像を指定しているのでテキストなんかも入れられるっぽいですね。試していませんけどこれは結構使えそうです。 動作確認していただくと分かるかと思いますが、左上のロゴ部分も微妙なスライドをして視差効果を出しています。 マークアッ
Moleskine Notebook with jQuery Booklet | Codrops jQueryでリアルな本をペラペラめくるUI作成チュートリアル。 デザインの美しさも素晴らしいのですが、アニメーションしながらめくれる感じもちゃんと出てるところがすごいです。 デモページ jQueryベースというのはあまり見たことがなかったのですが、これを参考に作れそうですね。 CSS3なんかも使われているので、総合的に学習できる資料として役立ちそうです。 関連エントリ Flashで本をペラペラめくる感じのUIを実装する「Dynamic Page Flip v2」 Flashで本をペラペラするUI実装いろいろ
2010年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年は、アニメーションのエフェクトやレイアウト、後半は背景画像関連のプラグインが特に目立っていたように思います。 [ad#ad-2] コンテンツスライダー・カルーセル関連 ギャラリー・画像拡大関連 ナビゲーション関連 タブ関連 パネル・ボックス関連 ツールチップ関連 レイアウト関連 背景画像関連 その他UI関連 アニメーション関連 スクロール・ドラッグなど操作関連 テーブル・リスト・データ関連 フォーム関連 コンテンツ生成 その他 コンテンツスライダー・カルーセル関連
HTML5分かりにくいですよね。 初めまして。11月からME課で働いている久保田(@ta2_o2p)です。よろしくお願いします! 自分の仕事としては、携帯サイト中心にコーディングを行っているのですが、BMKidsの縁起物と笑い袋の紹介ページのコーディングを行ったり、他にも色々とPCサイトのコーディングをしています。 さて、実はカヤックで働き始めてHTML5を本格的に触ったのですが、触れていくうちに「HTML5はややこしい所があるなー」と思い、この記事を書きました。 そういう訳で、HTML5でコーディングするに当たって間違いやすいポイントについて、書いていきたいと思います。 まずその前に 本題とは反れますが、HTML5でコーディングするにあたって、押さえておきたいポイントを2つ書きます。 文字コードの指定はmeta要素のcharset属性で 今までは以下のようにmeta要素の中に長々と属性を
Photoshopのチュートリアルというと英語が多いですが、日本語の方がサクサク読める(私の場合)ので、日本語で解説してくれているチュートリアル集をまとめてみました。 フォトショップでつくるキラキラに輝く人物の作り方 フォトショップでリアルな炎を出しながら走るバイクの作り方 フォトショップで夕日に輝く幻想的なライティング効果を作る方法 映画のタイトルロゴのような光と文字を描画するPhotoshopチュートリアル フォトショップでキラキラに輝く背景画像を作る方法 布地テクスチャーにペイント フォトショップでキラキラに輝くライティングエフェクトをつくるチュートリアル Photoshopで六角形のキラキラに輝く背景画像をつくる方法 フォトショップでオーロラが輝く地平線に太陽が沈む様子を描く方法 基本的な光の作り方2 基本的な光の作り方3 Photoshopで美女の画像に効果を入れる方法 フォトシ
画像を使用せずに、スタイルシートで紙を折ったようなエフェクトを矩形の角に適用するチュートリアルを紹介します。 Pure CSS folded-corner effect [ad#ad-2] 対応ブラウザはCSS3と:before疑似要素を使用しているため、Firefox 3.5+, Chrome 4+, Safari 4+, Opera 10+, IE 8+です。 デモページ 紙を折ったようなエフェクトの実装 紙を折ったようなエフェクトは、全部で4種類あります。 HTML HTMLはdiv要素を使用するだけで、class名を変更するだけです。 <div class="note"> コンテンツ </div> 適用するclassは「note」です。 全てのベースとなるスタイルシートです。 .note { position:relative; width:480px; padding:1em 1
[読了時間:1分] 先日、リリース間近とお伝えしたHTML5ゲームエンジン「IMPACT」が12月21日未明、正式に公開となった。同エンジンで開発されたゲームは、iOS上では60フレーム/秒を実現するとされており、HTML5対応のウェブブラウザであればプラグインなどをインストールする必要なく実行できるという特徴を持つ。サイトには、効率の良い開発スタイルを説明するビデオやサンプルソースコードなどが公開されている。ライセンスは価格は99ドル。 エンジンを開発した独Dominic Szablewski氏は、HTML5に対応したモダンブラウザ上で高速に動作するゲーム「Biolab Disaster」を公開、その開発のために使用したエンジンを一般に提供すると告知していた。今回の正式リリースで、このゲームもアップグレード。公言通り、iOS上でも快適に動作するようになっている。 lMPACTは、HTML
連載企画「今年ありがとうを言いたい○○」 2010年も残り僅かとなりましたが、いかがお過ごしでしょうか。 デザイナーズブログでは今年を振り返って、 それぞれが「ありがとうを言いたいもの」を紹介する連載企画をはじめます。 第一弾は「今年ありがとうと言いたい『html5の本』」です。 それでは続きからどうぞ! 徹底解説HTML5マークアップガイドブック タグが一つ一つ解説されています。 html5を勉強するならまず最初に読んでおくべき。 常に手元に置いておきたい1冊です。 HTML5&API入門 html5で何ができるようになったのかが広くまとめられています。 Google API Expertが解説するHTML5ガイドブック HTML5のAPIについての詳細な解説。 応用的な使い方も。 2冊目、3冊目に読んでおきたい本です。 HTML5+CSS3で作る 魅せるiPhoneサイト 最近発売され
データベースの世界でいま注目されているのがNoSQL。特にキーバリュー型データストアは、グーグルのBigTable、FacebookやTwitterが内部で利用しているCassandraやAmazonクラウドが提供しているSimpleDBなど、すでに実際に使われ始めています。 ではそのNoSQLをリレーショナルデータベースの代わりに使ってシステムを構築するとどうなるのか? 身をもって体験したことを記したShinya Kawanaka氏によるプレゼンテーション「間違った方向にCassandraを使ってみた」が公開されています。 NoSQLを用いたシステム構築は、リレーショナルデータベースによる構築どう違うのか? とても分かりやすくまとめられています。ご本人の承諾もいただいたので、その内容を紹介しましょう。 NoSQLを使ったときに起こる恐ろしい事例 プレゼンテーションのテーマは「NoSQLを
2010年を振り返る意味で、自分がCakePHPで開発する際に良く使うプラグインをまとめてみました。 誰かのお役に立てれば幸いです。 1.cakeplus ■ よく使うバリデーションをまとめたBehaviorであるadd_validation_rule モデルでバリデーションする際に本当に使います。 var $validate = array( 'hoge' => array( "rule1" => array('rule' => array('katakana_only'), 'message' => 'hogeにカタカナ以外が含まれています' ), ), ); ■ 自動でhiddenタグを生成するヘルパーformhidden 確認画面を挟む際にhiddenに入力情報をまとめて出力してくれます。 echo $formhidden->hiddenVars(); このプラグインを知ってから、
ツイート私:仕事はシステムエンジニアをしていますが、サーバー構築、phpなどは初心者、ドメインの取得などもってのほか。という立場です。 当時評判だったさくらインターネットのVPSを使い、CentOS + Apache + Tomcat + MySQL + Java という環境で自分用のWEBサービスを作ったときに参照したサイトを備忘録をかねてまとめたいと思います。 さくらのVPSを使いはじめる – アカベコマイリ SSH,Apache,Ruby,MySQL,Subversionなどについて。 おそらくここさえ読めば大体のことはできます。 CentOSをサーバーとして活用するための基本的な設定 – さくらインターネット創業日記 さくらインターネットの田中社長のブログ。 パフォーマンスについての設定を参考にしました。 CentOSで自宅サーバー構築 – CentOSで自宅サーバー構築 もう説明
ディテールの強化やテクスチャの作成に便利な、ドットやラインのピクセルベースのPhotoshopのパターン素材を紹介します。
Windows標準のタスクマネージャと同じように使え、さらにそれ以上に多彩な機能を搭載したフリーソフトが「System Explorer」です。タスクやプロセスにスタートアップといったさまざな情報をまとめて管理することができ、標準で日本語に対応しています。 数回のクリックで簡単に動いているプロセスのウイルスチェックが可能な上、ソフトウェア上でアプリケーションの一覧を表示してアンインストールの実行などもできるので「何か変だな」とPCの動作に疑問を持ったときにはこのソフトウェアを立ち上げると役に立ちます。なお、Windows XP以降のOSに対応したソフトウェアです。 ダウンロードにインストール、機能の紹介などは以下から。 System Explorer - Keep Your System Under Control http://www.systemexplorer.net/ 上記
同人誌のタイトルやセリフ、クリスマスカードや 年賀状の文字書きに使えそうなフォント紹介記事をまとめました。 2010年にはてなブックマークで人気だった記事が中心です。 ※フォントは、ライセンスを各配布サイトで確認してお使いください。 【フォント紹介記事】 漢字も使える手書き風の日本語フォントのまとめ ドケチなのに良質な無料漢字フォントを探している人向けフォント大全集 ダウンロードしておきたい100個のフリーフォント保存版まとめ ベーシックで高品質で完全にフリーな日本語フォント 2010年総まとめ:商用利用も無料、日本語・英語の高品質なフリーフォント集 商用でも無料で利用できる高級感のある細字のフォント集 萌え系フォントのまとめ 最近リリースされた高品質なフリーのデザインフォント -2010年10月 オシャレデザインの極太フリーフォント、31個あつめました。 第二水準漢字にも対応、油性マジッ
See related links to what you are looking for.
iPhone・Androidアプリ等に使えるアイコンセット総まとめ:2010 年末に暇な時間にアプリを作ろうなんて思っている方の参考になれば幸いです。 iconSweets 2 Even more free icons by Yummygum iPhone・Android・WEBに使える400以上のアイコンセット「iconSweets 2」 app-bits.com | Slick user interface and icon design 次のようなアイコン64個セット DEFAULT iCON ::: Free Elegant Icons 173のシンプルなアイコンセット 108 Mono Icons: Huge Set of Minimal Icons | Tutorial9 108個のシンプルデザインアイコン Free iphone toolbar icons | Blog |
2010年の要チェック人気記事を発表! あなたはあの良記事を見逃していませんか? 解説記事、ニュース記事、ユーザー投稿などの種類ごとに、人気記事を紹介します。 解説記事トップ20 | ニュース記事トップ10 | ユーザー投稿記事トップ10 解説記事の2010年人気記事トップ20殿堂入り:Webマーケッター瞳 ―― マンガ記事として、各回人気を集めました。第1話からどうぞ 滅べばいいのにと思うSEOの10の迷信(都市伝説)(SEOmoz) SEO業界にはびこる間違った情報、それも正しいSEOの妨げとなる情報について見ていこう。 あなたの著作物をパクったサイトをGoogle八分に追いやる正しい手順(編集部ブログ) そもそも盗用されたコンテンツは、検索エンジンで探せない状態にしてしまえばいい 客はバカでちょうどいい。販促サービスにおける鉄則(企業ホームページ運営の心得) 販促サービスを成功させる
今年も多くのFirefoxアドオンが公開され、ユーザーの皆さんはそれぞれお気に入りのアドオンを導入して自分だけのブラウジング環境を構築されたことと思いますが、アドオンだけでなくGreasemonkeyスクリプトでも優秀なものが数多く公開されました。 そこで今回は、2010 年末まとめ記事シリーズとして、そんな多くのGreasemonkeyスクリプトの中から管理者が現時点で導入しているもの25点をまとめてご紹介したいと思います。 過去から使い続けているもの、今年になってから導入したものなど様々なユーザースクリプトを長々とご紹介しますがおつきあいください。 1.Google Calendar Display Current Time Line Googleカレンダーの日・週表示時に現在時刻を赤いラインで表示します。 カレンダーを表示した際、「いまここ」がすぐにわかって便利です。 参考記事:Fi
配色に関する、おすすめのサイト・講座を集めました。 今までよりも色塗りがぐっと楽しくなりますよ! 【配色関連サイト】 日本の伝統色 和色大辞典 落ち着いた和のカラーパレット 世界の伝統色 洋色大辞典 鮮やかな洋のカラーパレット kuler 配色パターン集。美しい組み合わせが盛沢山 [ws] Color Scheme Designer 一つ色を指定すると、それに合わせて相性のいい色を選んでくれる COLOR SCHEMER こちらも選択した色に合う色を表示してくれるジェネレータ pictaculous 画像から色を抽出してくれるサイト。好きなイラストの色を調べたいときに Web Site Color Picker Webサイトで使われている"色"を抽出、分析してくれる ColorSelector 画面上に表示されている色をスポイトで調べることが出来るフリーソフト 背景色と文字色を入力すると、
はじめに この連載では、今日のウェブ業界の流行語となっている「HTML5」をとりあげ、全6回に分けて、これまでの技術とどのような違いがあるのか、具体的にサンプルのコードを示しながら解説していきます。 過去の連載も読む 第1回:HTML5が注目を浴びる理由とは? 第2回:HTML4から変化したHTML5のマークアップ 第3回:HTML5で再定義された要素と属性 第4回:HTML5で実現できるマルチメディア系機能 新たに導入されたフォームコントロール これまでウェブにおける入力フォームコントロールは、非常に限られたものしかありませんでした。皆さんがよくご存じのテキスト(パスワード)入力フィールド、ラジオボタン、チェックボックス、セレクトメニュー、テキストエリア、ファイル選択です。お問い合わせフォームであれば、ほとんどのシーンで十分といえるでしょうが、ウェブアプリケーションにおいては、不足してい
こんにちは、中川です。 今年も残すところあと1週間をきりましたね。 このところ色々と忙しかったので年末年始はゆっくりとしたいと思います。 さて、今回の話題ですが、node.jsを使ってサーバサイドでCanvasが利用できるということで試してみました。 それでは、早速使ってみましょう。 ■今回の環境 Ubuntu 10.10 node.js v0.3.1 npm 0.2.12-1 node-canvas v0.4.1 ■インストール node-canvasでは、cairoを利用しますので、事前にインストールします。 // sample.js var Canvas = require('canvas') , http = require('http'); http.createServer(function (req, res) { var canvas = new Canvas(200,20
Checkerboard, striped & other background patterns with CSS3 gradients [ad#ad-2] 対応ブラウザはFirefox 3.6+, Chrome, Safariです。 デモページでは画像を使用せずに、ストライプなど計6種類の背景パターンが紹介されています。 デモページ [ad#ad-2] スタイルシートは下記のようになります。 CSS:ストライプ 全てのベースとなる指定です。 L.8-10で、ストライプのサイズを指定します。 .stripes { height: 250px; width: 375px; float: left; margin: 10px; -webkit-background-size: 50px 50px; -moz-background-size: 50px 50px; background-siz
Photoshopでつくるタイポグラフィのチュートリアルを紹介済みのものから未紹介のものまで、2010年の総まとめです。
連載企画「今年ありがとうを言いたい○○」 前回書いた記事が予想外の評判で驚いています。 読んでいただいた方ありがとうございます! さて、自分がありがとうを言いたい物ですが、Google Chromeのエクステンションに対して「ありがとう!」と言いたいです。 という訳で、感謝の気持ちを込めて、自分が使っているGoogle Chromeのエクステンション10個を紹介していきたいと思います。 Awesome Screenshot Awesome Screenshot: キャプチャーと注釈 これは仕事でというよりも、自分が運営している4sqWalkerというブログで記事を書く時に役立っています。 選択範囲や1ページ全体をスクリーンショットとして保存出来るだけでなく、注目してほしい所には丸で囲ったり文字を入れたりする事が出来るのが便利です。 これを入れてからPhotoshopを立ち上げる回数が減りま
コリス [ad#ad-2] 当サイトの購読は、RSS Feedをご利用すると便利です。 コリスのRSS Feed Twitterでは、サイトに掲載していないウェブ関連の話題、クリエイティブなもの、面白いものを数多く紹介しています。 Twitter@colisscom 2010年、ブックマークが多かったエントリー 漢字も使える手書き風の日本語フォントのまとめ ウェブサイトのパフォーマンス改善やセキュリティに役立つ.htaccessの設定 2010年総まとめ:商用利用も無料、日本語・英語の高品質なフリーフォント集 jQueryの日本語の解説サイトと国産のプラグイン集 たった一行を追加するだけでIE6/7/8をCSS3対応にする -CSS3 PIE ウェブデザインに黄金比やフィボナッチ数列など数学的な要素を取り入れる方法 商用でも無料で利用できる高級感のある細字のフォント集 無駄なdiv要素やc
ユーザーが自分で作成したサイトテンプレートやWordPressなどのCMS用テーマなどを有料で販売したり、逆にユーザーがそれらのファイルを購入したりできるサイトが「ThemeForest」です。現時点では3300個以上の有料テンプレートやCMSテーマがあり、どれもこれもかなりプロフェッショナルですごいクオリティのものばかりですが、そんなプロフェッショナルレベルのサイトテンプレートを無料でゲットする方法があるので、試してみました。 ほかにもPHPのメールフォームやロイヤリティフリーBGM・テクスチャファイル・AfterEffectsのプロジェクトファイル・3DCGモデル・Flashファイル・Photoshopを使うチュートリアルファイルなど、有料のファイルを無料でダウンロードしてゲットできます。今回実際に試してみたところ、全部で総額5000円以上のファイルをゼロ円で入手できました。 手順
ドットインストール代表のライフハックブログ
CSS2の疑似要素を使用することで、HTMLを汚さずに、さまざまなデザインのドロップシャドウを簡単に適用することができます。 その美しいドロップシャドウのスタイルを適用するチュートリアルを紹介します。 画像の使用は一切ありません。 CSS drop-shadows without images デモページ [ad#ad-2] デモの対応ブラウザは:before, :after, box-shadowなどを使用しているため、Firefox 3.5+, Chrome 5+, Safari 5+, Opera 10.6+ です。 下記に、デモにある5つのドロップシャドウを紹介します。 HTML HTMLはdiv要素にスタイルシートを適用します。 5つのドロップシャドウはclass名を変更するだけです。 <div class="drop-shadow round"> <h1>CSS drop-sh
クラウドというキーワードがブームの昨今、オンラインで動作するさまざまなウェブサービスは以前にも増して注目を浴びるようになりつつある。これまで個人が業務効率アップのために使うレベルにとどまっていたのが、会社をあげて導入するケースも珍しくなくなった。また海外のウェブサービスが日本語対応したうえで国内市場に参入してくるケースも目立つようになってきた。 今回は本誌連載「ウェブサービスレビュー」で2010年に紹介したウェブサービスを中心に、計10個のサービスを独断と偏見でセレクトして紹介する。文字通り定番のウェブサービスから、2010年に新たに登場した有望株、また今後ブレイクすることが期待されるサービスまで、内容はさまざま。まだ使ったことがないサービスがあれば、新たな年のスタートにあたってぜひ試してみてほしい。 2010年に大幅な進化を遂げた“定番”ウェブサービス4選 クラウドサービスの特徴として、
モバイルバッテリーとは呼べない。「ほぼポタ電」なコレ1台で有事の時もアウトドアも大活躍!【AmazonスマイルSALE】
2007年に米Appleが発表した「iPhone」が、モバイル業界に衝撃とともに受け入れられてから3年――。2010年は「iPhone 3G」「iPhone 3GS」「iPhone 4」と世代を重ねるごとに進化するiPhoneに追いつけ、追い越せと言わんばかりに、Android搭載端末を中心に多数のスマートフォンが登場した。まさに「日本でのスマートフォン元年」といっても過言ではないだろう。 そんな2010年を振り返り、「スマートフォンオブザイヤー2010」を選定すべく、アスキー総合研究所 所長の遠藤諭氏、慶應義塾大学大学院 政策メディア研究科 特別招聘教授の夏野剛氏、通信ITSジャーナリストの神尾寿氏に集まっていただき、スマートフォン談義に花を咲かせていただいた。さまざまな視点からモバイル業界に関わる3人が見た、2010年のスマートフォン事情とは――。 iPhone 4の優位性が目立った2
諸事情で、WindowsのPCを使わざるをえない状況だったので・・・。簡易な感じで。 > for /l %i in (1,1,254) do ping -w 50 -n 1 192.168.1.%i && arp -a 192.168.1.%i >> ping.log↑を実行すると、192.168.1.1 〜 192.168.1.254に対して連続してping(ICMP echo)を実行して、ログファイルに結果(応答があったノード)を書き込みます。タイムアウトは念のため50msecにしました。LAN内だったら、もっと小さくても良いと思います。 (対象IPアドレスは"dynamic"とか"動的"とか書かれている行になります。←でgrepしてやるとIPアドレスの一覧が取れます。ちなみに余談ですが、arpの実行結果なので、MACアドレスも記録されます。) # Windowsのコマンドプロンプトな
Ruby を知らない人に Ruby の話をして欲しいと言われてないけど、ブログを書きました。(*1) 難しい話は抜きにしたいんだけど、抜きにしちゃうとまったく訳わかんないから簡単に説明する。 今回は Ruby の erb ってのを使って元ネタ同様のことを実現する。 mod_ruby が動くサーバなんて自分でつくらないとないだろうけど、 その辺はどうにかしてもらう。 erubyが導入されていれば、ファイルの1行目に #!/usr/bin/eruby -McKuCutf-8 とする。(*2) そんなこんなで、どうにかしてもらったら、 <%= と %> で囲めば動きます。 どうにかしてもらったサーバで example.html というファイルの拡張子を example.rhtml すれば良いだけです。 <%= Rubyスクリプト %> 拡張子を変えずに動かすこともできます。 .html ファイル
ユーザーが自分で作成したサイトテンプレートやWordPressなどのCMS用テーマなどを有料で販売したり、逆にユーザーがそれらのファイルを購入したりできるサイトが「ThemeForest」です。現時点では3300個以上の有料テンプレートやCMSテーマがあり、どれもこれもかなりプロフェッショナルですごいクオリティのものばかりですが、そんなプロフェッショナルレベルのサイトテンプレートを無料でゲットする方法があるので、試してみました。 ほかにもPHPのメールフォームやロイヤリティフリーBGM・テクスチャファイル・AfterEffectsのプロジェクトファイル・3DCGモデル・Flashファイル・Photoshopを使うチュートリアルファイルなど、有料のファイルを無料でダウンロードしてゲットできます。今回実際に試してみたところ、全部で総額5000円以上のファイルをゼロ円で入手できました。 手順は以
Node's goal is to provide an easy way to build scalable network programs. JavaScriptフレームワークやHTML5テクニックの紹介とともにNode.jsが取り上げられることが増えている。Node.jsはChromeのJavaScriptエンジンV8を活用して開発が進められているサーバサイドプラットフォーム。JavaScriptを使ってサーバサイドで動作するアプリケーションを簡単に開発できる。Node.jsには次のような特徴がある。 JavaScriptを使ってサーバサイドアプリケーションを開発できる。 スケーラビリティの高いネットワークプログラムを高いスキルを要求されずに開発することが可能。 高い並列性を実現。内部の実装はepoll(7)、kqueue(2)、/dev/poll、select(2)などOSごとに
あと6時間ほどで2010年も終りですので、そろそろ2010年をまとめておきます。 Do You PHPはてな 基本統計はこんな感じ。去年よりPVは倍以上に増えました。それも、あるつの1エントリの影響と思われます。あと、1エントリ完結ですので、直帰率相変わらず高いです。 ページビュー:129,049 (2009年:61,655) ページ別セッション:114,171 (2009年:138,514) 直帰率:85.00% (2009年:81.98%) 全体のアクセスTOP10は以下のとおり。 書籍「PHPによるデザインパターン入門」の原稿テキストを公開します - Do You PHP はてな Paros使ってみた - Do You PHP はてな 出力バッファとflush()・ob_flush() - Do You PHP はてな CF-R4のメモリを増設 - Do You PHP はてな 「m
あけましておめでとうございます。昨年に引き続き、今年もJavaScriptの近い未来についてちょっとだけお話させて頂きます。 最初に昨年の予想を見返しておきましょう。昨年は次の3つを2010年の鍵として取り上げました。 ウェブ標準 ブラウザ拡張 サーバーサイドJavaScript この3つを軸に2010年を振り返ってみます。 2010年のJavaScript界隈でのニュース ウェブ標準 2010年最初のビッグニュースはなんといってもIE 9のPlatform Preview版の登場でした。これまでの独自実装路線から一転して(正確にはIE 8の時点でJSONやWeb Storageのサポートなど、その徴候はあったのですが)、HTML5などのウェブ標準のサポートを進めることを表明しました。そして実際に8週おきにPlatform Preview版をアップデートして、ECMAScript5・S
タイマーのなかで仕事していますか? ふだんから何がしかのタスクを時間にあわせて実行するためにいろいろなタイマーアプリを iPhone 上で利用していますし、すでにどのような時間の使い方をしたのかを可視化するという目的でも iPhone のアプリを利用します。 時間は放っておけばただ流れるだけですので、意識できない時間の流れに棹差すこうしたアプリは非常に重宝します。 ここでは普段私が利用することの多い6種類のアプリを紹介して、新春の習慣化特集の締めくくりとしたいと思います。よーい、どん! 簡単なマルチタイマー、Due 以前も紹介したシンプルでエレガントなタイマーアプリ、Dueですが、その後開発者の方からのお誘いでベータ番なども利用させていただき、すっかり日常に定着しました。 Due の魅力は、ここで説明するよりもすばやくリマインダを設定したりタイマーを設定できる手軽さです。設定したリマインダ
明けましておめでとうございます! 近年、個人でWebサービスを開発するのが流行っていますね。「今年こそは俺もWebサービスを作ってモテモテになるぜ!」と思っている人も多いのではないでしょうか。 そんな人のために、Webサービスを開発・運営するにあたっての心構えやノウハウ、体験談などの書かれたエントリーを集めてみました。 ▼誠 Biz.ID:田口元の「ひとりで作るネットサービス」探訪 個人でWebサービスを開発している人たちのインタビュー集。ヒットしたサービスを手がけた個人開発者達のバックグランドや考え方を垣間見ることができ、モチベーションアップにもなります。恥ずかしながら、私のインタビューも載っています。 ▼Web2.0ナビ: 個人サービスを作るコツ 個人がWebサービスを作るための、実践的な8つのコツが書かれています。 ▼個人でネットサービスを運営するための5つのコツ(momose版):
モバイルバッテリーとは呼べない。「ほぼポタ電」なコレ1台で有事の時もアウトドアも大活躍!【AmazonスマイルSALE】
HTML5にはオフラインアプリケーション機能があり、オフラインに対応したWebサイトを作ることができます。Webブラウザでいちど表示させれば、あとはネットワークとの接続が切れてもそのままエラーを起こさずに利用し続けられるWebサイトです。 iPod TouchやiPhoneに搭載されているWebブラウザの「Safari」はHTML5のオフラインアプリケーション機能に対応しているそうなので、HTML5を使っていつでも参照できる超簡単なアプリを作れるのではないか、そう思ってお正月休みに試してみることにしました。 単に路線図を表示するだけのアプリ iPod Touchを僕は利用しているのですが、いつでも参照できる地下鉄の路線図があるといいなと思っていました。iPod TouchはWifi機能しかないため、外出中はずっとオフラインでの利用なのです。 そこで、起動すると路線図の画像を表示するだけの超
データベースには,「トランザクション分離レベル」というものがある。 以下では,それが なぜ必要なのか? デフォルトのレベルでは,どうして駄目なのか? PostgreSQLでは,どうやってレベルを変更・確認するのか? などを取り上げる。 トランザクション分離レベル トランザクション分離レベルとは: 複数のトランザクションが同時に実行された場合に、他のトランザクションからの影響がどのくらい「分離」するか,のレベル。 ANSI規格では,4つのレベルがある。 READ UNCOMMITTED (一番低い) READ COMMITTED REPEATABLE READ SERIALIZABLE(一番高い) 徹底比較!! PostgreSQL vs MySQL 第3回:トランザクションの比較 http://thinkit.co.jp/free/article/060... トランザクション処理に詳しく
いよいよ2011年がスタートしました。 今年も去年同様、勉強することが 沢山あります。まだモチベーションが そこそこあるうちに勉強になりそうな 国内の記事をリンク集にしました。 迷ったときに見てみようかなと思い ます。 より最適な方法というのはあると思いますが、まずは扉を叩かない事には何が悪いかも分かりません。ということで、内容に拘らず、否の意見をスルーしてここに色々まとめさせて頂きました。 勉強したい気持ちはあるけど出来ない理由は「何を始めればいいのか分からない」という方も、何が出来るのか、どういった勉強法で出来るようになるかが分かればやる気が起きるかも知れません。 5分で分るシリーズ 以前も流行ったんですね。Web関連以外も含めてここにまとめられています。 5分で分かる PHP を知らない人が PHP の便利さを学べる記事を書いたよ 5分でわかる Ruby を知らない人が Ruby の
年末年始に一切webからはなれてしまった人向けの、非常にマニアックな年末年始ハイライト記事となっております。 内容はモバイル系、フリーソフト、webサービス系、ライフハック、5分でわかるプログラミングシリーズ、web制作系、web屋のための時事記事、そして今回の年始を騒がせたグルーポン騒動のまとめです。 極力ハイライトなのでそぎ落とすのが地味に大変でした・・・。 モバイル iPhoneユーザがGALAXY Sと過ごした7日間をまとめてみました Android端末を、WiFiのみで運用してみた結果がここにあります。Androidユーザーにお勧め。 Androiderが押さえておきたいブログ・サイトまとめ 様々なAndroidユーザー向けのサイトが紹介されて居ます。 人生の調律をしてくれる iPhone アプリ6選 | Lifehacking.jp 人生を調律してくれるという言葉に引かれて・・
最近では、エントリーフォーム最適化(EFO)という施策も広まってきましたが、特に購入やサンプル請求、お問合せ等がコンバージョンとなっているサイトではフォームで離脱されてしまってはせっかくの広告や施策が水の泡になってしまいます。 ここではユーザーを離脱させないために気をつけたいポイントとそれを実現するために便利なjQueryのプラグインを紹介します。 まず、入力フォームを作成する際のポイントは、ユーザーにストレスを感じせない事です。ストレスの原因となるものは大きく言うと 入力しづらい、エラーメッセージがわかりづらい、といった操作に関するもの。 どこまでやれば完了なのかわかない、個人情報の扱いが心配、といった心理的なもの。 です。なのでこの点を解消させてあげるフォームを作成すればユーザーが離脱する可能性は下がりますね。 具体的なポイントは以下のような項目になります。 必須入力か
CSS3で何ができるの? という時にみておきたいサイト集 ベーシックなものから実践的なテクニックまで、サンプルやコードなど実装例が掲載されているサイトをご紹介。
twitter facebook hatena google pocket 独断と偏見で選ぶ白ベースのECサイト8つです。 白ベースにすると写真が映え、またアクセントカラーも効いてきます。 ただ、シンプルがゆえに難しいのも事実。 取り上げるサイトはどれもsimple is coolに仕上がっていて、デザインの参考になります。 sponsors 北欧家具・雑貨のインテリア通販ショップ - morphica 個人的に一番好きなサイト。 訴求したい商品が映える綺麗なデザインになっています。 ■URL:http://www.morphica.jp/ デザイン雑貨とポスターの店 THE STORE [ザ・ストア ] 割と色の多い商品が多いですが、白ベースかつ部分的に黒を使用することで、うまくまとめています。 ■URL:http://store.focusdesign.jp/ BIGI online
webサイトにおけるユーザーの視線は、なかなか見る事が出来ない代物ではあります。 実際に企業や、あなたが作成したwebサービスが、ユーザーに訴えたい事を、ユーザーにきちんと届ける為に、どのような方法があるのかを考えて見ましょう。 1)全ての情報を遮断する 手っ取り早い方法としては、あらゆる情報を遮断する方法があります。 つまりその言いたい事意外の情報をあえて隠蔽するわけです。 実にシンプルな方法です。 ただし、シンプルであるがゆえに非常に難易度が高いです。 なぜなら、配置するテキスト選びは慎重にしなければなりませんし、訴えたい事が多い場合、何をまず訴えるべきかをしっかりと考えて、ユーザーが迷う事なく、そして的確な操作が出来るように誘導して上げる必要があるからです。 1)サービスに対して興味を少しだけ持ってもらう情報を書く 2)サービス開始はちょっと・・・という人のためにクリックしやすいリン
原文: Firefox 4: hardware acceleration (2010/09/07 公開) Firefox 4 Beta 5 が公開されました。このベータ版では、Direct2D アクセラレーションが初期設定で有効になっています。 ハードウェアアクセラレーションとは? 「ハードウェアアクセラレーション」とは基本的に、可能であれば (CPU に代えて) GPU を使用する、ということです。これにより、ページの描画動作が高速になります。 2 つのレベルのアクセラレーションがあります。 コンテンツアクセラレーション: 文字、画像、CSS ボーダーなど、実際のページコンテンツのレンダリングを高速化します。また、2D HTML canvas を高速化することもできます。Windows Vista/7 では、コンテンツアクセラレーション用に Direct2D が使用されますが、この新しい
Gmailには、デフォルトの機能だけでは物足りない人のために、様々な実験的機能を追加できる「Gmail Labs」があります。Gmailユーザーなら説明不要だとは思いますが、念のために説明しますと、Gmailの上部にある「設定」の左の緑のフラスコが、Gmail Labsのアイコンです。そこをクリックすると、Gmail Labsの機能一覧を見られます。 今回は、数あるGmail Labsの機能の人気TOP10をご紹介しましょう。 10位:送信取り消し 怒りに任せて、もしくは思いのままに、思いのたけを込めた長文メールを書き上げ、「これでどうだ!」とメールを送信した直後に「やっぱりこれはマズイかも...」と思い直して、メールを取り消したくなること、ありませんか? 「送信取り消し」機能を有効にしておけば、メールを送信した後でも、ちょっと待って! とメールの送信を取り消せます。 送信を取り消せるまで
エクセルには、便利な補完機能がついている。例えば、 こうなってるとき、セルの右下をドラッグしてカーソルを下へ移動させると、 こんな感じで勝手にエクセルが補完してくれる。超便利! ここで、ふと思った。エクセルは、どんなものでも補完してくれるのだろうか。 早速実験してみた。 ■実験1 「青い空」 まずは、「青い空」というワードを補完させてみた。 あ、そうなるんだ。 そっちへ行きますか。 もうその方向で確定なのね。 うん。 分かったよ。 なんかテンション上がってる。腹立たしい。 ■実験2 「犬も歩けば棒に当たる」 次は、ちょっと長めの文を試してみよう。これがどう補完されるのか。 あ、へえ。 そうなるんだ。 そんなことわざはねえよ。 あっ またテンション上がった。 うぜー。 ■実験3 「新宿」 最後は、「新宿」で試してみた。もしかして、駅名が補完されるかも…… だとしたらエクセルすげー。 山手線だ
最近のモダンなWebブラウザがサポートしている、セキュリティに関連しそうな X- なHTTPレスポンスヘッダをまとめてみました。それ以外にもあったら教えてください。 X-XSS-Protection 0:XSSフィルタを無効にする。 1:XSSフィルタを有効にする。 XSSフィルタを有効にすることでエンドユーザがXSSの被害にあう可能性が低減するが、まれに誤検知することで画面の表示が乱れることもある。IE8+、Safari、Chrome(多分) で有効。IEでは「X-XSS-Protection: 1; mode=block」という指定も可能。 2008/7/2 - IE8 Security Part IV: The XSS FilterBug 27312 – [XSSAuditor] Add support for header X-XSS-Protection X-Content-Ty
このブログ、Webデザインレシピのデザインをリニューアルしました。 この機会にデザインを勉強したことがない人でも、楽しくデザインをすることができるかもしれない、基本原則 4つをご紹介します。 この原則は「ノンデザイナーズ・デザインブック」著者 Robin Williams で詳しく解説されています。 古い本ですが、とっても素晴らしい本で今では新装増補版となって発行されているようです。 今回、このブログ – Webデザインレシピのデザインを、ガラッと変えてみました。これを機会にちょっとデザインの基本というか、デザインをするときにガイドとなる、4つの原則をおさらいしておきます。Webデザインに限らず、会社で提出する報告書や学生さんのレポート、レストランのメニューなど、ページと呼べるものには全部当てはまると思うので、Webサイトを作るとかじゃなくても、知っておいて損はないかもしれませんね。 せっ
2017年6月30日 便利ツール アイデアのメモも、画像も、音声も、とにかくなんでも保存できちゃうメモツール「Evernote」。有名すぎる便利ツールですね!逆に自由度が高すぎてどうやって使えばいいのかわからない、という方も多いと思います。今回は「Webデザイナー」をキーワードに私のEvernoteの使い方を紹介します。 ↑私が10年以上利用している会計ソフト! Evernoteってなあに? Evernoteの機能を簡単に説明します。 画像・音声・PDFファイルなどが保存できる アップロードできる容量は月に無料アカウント:60MB、プレミアムアカウント:1GB プレミアムアカウントは月額5ドルまたは年額45ドル ノートに対して一つだけ設定できるノートブックを大カテゴリとして使用 ノートに対して複数設定できるタグを小カテゴリとして使用 ノートブックもタグも階層化させて整理できる 携帯電話・ス
twitter facebook hatena google pocket 昨今ミニマムな1ページのデザインが増えています。 その際にJavaScriptを使用し、セクションごとにスムーススクロールさせるケースが多いです。 それを簡単に実現するのが「OnePage jQuery Plugin」です。 sponsors 使用方法 OnePage jQuery PluginからOnePage.jQuery.Plugin.1.2.jsをjQueryからjquery.js、jQuery Easing Pluginからjquery.easing.1.3.jsをダウンロードします。 <script src="jquery-1.4.4.min.js" type="text/javascript"></script> <script src="jquery.easing.1.3.js" type="tex
最近リリースされたものを中心に、デザイン、スタイルシート、ワイヤーフレーム、データベースなどに役立つオンラインサービス・ウェブアプリケーションを紹介します。
個人的によく使っているブックマークレットのご紹介。どれも便利で役立つので手放せないものになっています。Web制作をしている人なのでそれ系に偏っているかも知れませんが、多少でも参考になれば幸いです。ほとんど有名なものだとは思いますが・・・ というわけで、便利なお役立ちブックマークレットをいろいろとご紹介。手軽なのが素敵ですよね。以前書いてから大分経ちますので改めてエントリーしますが、少々Web制作系に偏っています。順不同です。 CSS構成を一目で確認出来るXRAY 何かと便利なXRAY。クリックした要素の詳細を教えてくれます。Web屋さんはご存じの方も多いのでは。 XRAY 今見ているページをiPhoneで「後で見る」KeepItWith.Me 最初の設定がすごくストレスだったのですが、設定後の便利さが感動したのでご紹介。PCで見ているページでブックマークレットを使って自分のiPhoneに送
An HTML5 Logo It stands strong and true, resilient and universal as the markup you write. It shines as bright and as bold as the forward-thinking, dedicated web developers you are. It's the standard's standard, a pennant for progress. And it certainly doesn't use tables for layout. We present an HTML5 logo. The Technology Imagination, meet implementation. HTML5 is the cornerstone of the W3C's ope
人気のデザイントレンドの一つに、ヴィンテージ・レトロスタイルがあります。デザインにこれらを取り入れるために使いこなしたい6種類のエレメントを紹介します。 The Elements of Retro Web Design [ad#ad-2] 下記は各ポイントを意訳したものです。 元記事にはサンプルやチュートリアルなど豊富に掲載されています。 はじめに 1. サークルを使った形状 2. ツートンカラー、限定されたカラースキーム 3. タイポグラフィエレメントとトレンド 4. ブレンディングスタイル 5. テクスチャとノイズ 6. イメージクロップとレイヤーマスク はじめに ヴィンテージ、レトロといったスタイルは今日のデジタルアートワークにおいて、日々人気が高くなっています。社会が完全にデジタル化した後、デザインにおけるヴィンテージ、レトロをテーマにしたものはトレンドの一つと言えるでしょう。 こ
2011年1月| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 集めた情報を速やかに引き出せる方法はないものか真剣に考えてみた。 企画やら書籍の執筆やらで日々半端なく情報収集しているのですが、集めた情報は執筆時に速やかに引き出せるものでなくてはならず、集めただけで終わって、PCのHDD内で埋もれてしまっては、そもそも苦労して収集する意味がありません。 さて、集めた情報の整理といえば、最近はEvernoteが有名ですが、いまひとつブックマークの仕方がなじめませんので、他の方法を真剣に考えてみました。そういえば僕はFirefoxの拡張機能であるTomblooで気になるページをTumblr(タンブラー)にクリップしてたなぁ。単にリンクではなくWebページをキャプチャしてTum
Amazon.comのクラウドコンピューティング事業Amazon Web Servicesが今朝(米国時間1/19)、AWS Elastic Beanstalkというサービスの提供を発表した。サードパーティが作るAWSのクラウドアプリケーションの、配備と管理を簡素化することが目的だ。 AWS Elastic Beanstalkを利用してデベロッパが自分たちのアプリケーションをアップロードすると、あとはシステムが展開過程の細部…キャパシティの確保、ロードバランス(負荷均衡化)、スケーリングの自動化、ヘルス(システムの健康)監視など…を自動的に処理する。ただし、それらの処理を構成する要素はいつでも、デベロッパがアクセスして全面的にコントロールすることも可能である。 この発表の最良の部分は、その料金だ。つまりAEBを使っても、新たな料金は発生しない。顧客は、自分のアプリケーションを動かすために必
皆さん、こんばんは。笹亀です。 ご挨拶が遅くなりましたが、明けましておめでとうございます。 今年も良いブログを皆さんにご提供できるように頑張ります! 先日のニュースでAppleCEOのスティーブ・ジョブスさんが病気で休暇に入るとの心配なニュースをみました。急なことでとても心配です。1日も早い復帰をお祈り致します。 さて、本日はSubversion(svn)の基本コマンドからよく使うコマンドやこだわりの使用方法まで一気にご紹介します。いろんなサイトを観て確認しながら使うことが多いので、よく使うコマンドやこだわりの方法をメインにご紹介できればと思います。 まずは基本コマンドの紹介です。 ーーーーーーーーーーーーーーーーーーーーーーーー ■基本コマンド 1.バージョン管理されているモジュールを取り出す
最近PS3とPSPを買いましたが、モンスターハンターをプレイするのではなくtorneで番組を録って見る用です。tanakaです。 今日はAjaxでよく書く処理を共通化させるコードを紹介します。 CakePHPでJSON出力する CakePHPでAjax処理を実装するとき、楽に実装できるように次のヘルパーやコンポーネントが用意されています。 JSON出力に使えるJavascriptヘルパー JSON用HTTPヘッダーの送出で使えるRequestHandlerコンポーネント Ajaxによるリクエストに対してJSONで応答するときは決まった手順で処理するだけなのでそこをひとまとめにしたいと考えます。配列を受け取ってJSONとしてController::render()するメソッドを考えます。必要な処理をAppController::_renderJson()にまとめてみました。 app/app_
スマートフォンにてソーシャルゲームを作ろうとすると、HTML5を中心にブラウザで動作するもの、もしくはネイティブアプリでの提供ということになります。モバゲータウンやグリーはその両方をサポートしています。ネイティブアプリの作り方は既に文献も多数なのですが、HTML5となるとまだ十分とは言えません。この資料は必見です。 「HTML5@iPhoneゲーム開発」はディー・エヌ・エーのスマートフォン開発グループの岸弘倫氏が「DeNA Technology Seminar #3」での講演用に作成したものになります。同社では北米のMiniNation向けにiPhone『Pirate Nation』(海賊トレジャー)をHTML、CSS、JavaScriptで開発して提供していて、そのノウハウを凝縮したものです。 『Pirate Nation』は冒頭の括りで分けるとブラウザで動作するアプリということにな
先日予告したSNBinderのオープンソース化、GitHubに簡単なREADME付きでアップロードしたのでご覧いただきたい。 https://github.com/snakajima/SNBinder SNBinderは、ひと言で言えば「ブラウザー上でView(テンプレート)とData(JSON)を結合して HTML を生成するテンプレートエンジン」である。 90年の半ばから急速に広まったインターネット。サーバー側でダイナミックに生成したHTMLページをブラウザーで閲覧するだけ、というシンプルでエレガントなアーキテクチャゆえの成功だ。しかし、ブラウザーの高機能化に伴い、JavaScriptを駆使して使いやすさを向上しようという試みが色々なウェブサイトで行われている。GMail、Google Docs、Facebookなどは良い例だ。 その方向性を究極にまで突き詰めると、サーバー側は(MVC
みなさん、Pythonってご存知でしょうか? ニシキヘビ。。ではないです。 プログラミング言語のPythonです。 ↓Pythonのロゴ。蛇が2匹です。 このPython。日本国内では、それほど知名度は高くないのですが、2010年で最も成長したプログラミング言語にも選ばれるなど、急速に人気の高まりつつある言語です。2011年にはPHPとC++を抜かして3位になれそうな勢いです!では、このPython、どうして急に人気がでてきたのでしょうか?理由は大きくわけて3つあると思います。 Pythonが急に普及し始めた理由 GAEで動作する これが最大の理由だと思います。Googleのサーバを使って簡単にサービスを提供できます。1日あたり1GBまでの転送なら、料金は一切かかりません ※1。無料利用分を超えて使った場合も、課金設定(1日当たりの支払い額の上限)を設定するだけで、簡単にサーバを増強できま
スマートフォン向けサイトの作り方 2011年1月22日 iPhoneとAndroid両方に対応するスマートフォン向けサイトの作り方をまとめてみました。 スマートフォン向けサイト作成にあたっての基本概要 まず最初にスマートフォン向けサイトを作成する際に気になる点は画像の扱いだったりすると思います。 横幅ですが、解像度は機種によって様々ですが、縦向きで320px~640px、横向きで480px~960pxが主流となります。 標準となるものを設けるとなると、320px(横)/480px(縦)を標準として良いかなと思います。 ※iPhone4、4Sは640px/960pxの解像度ですが、内部解像度で320px/480pxと解釈してくれるため。 ですので、クライアントに見せるデザインカンプなどを作成する際も縦を標準とする際は320px(横)で作成すれば問題ないといえますが、iPhone4、4SやAn
2011/01/23 "第9回 データマイニング+WEB 勉強会@東京−2nd Week−方法論・ソーシャル祭り−"を開催しました。 第9回 データマイニング+WEB 勉強会@東京 ( TokyoWebmining 9)−2ndW−方法論・ソーシャル祭り−: ATND Google グループ ※会場参加者ID写真(id:bob3 さんに感謝) 1st Week内容まとめ: 第9回 データマイニング+WEB 勉強会@東京 ( #TokyoWebmining #9) −1st Week− 大規模解析・機械学習・クオンツ 祭り− を開催しました - hamadakoichi blog 会場提供し運営を手伝って下さった ニフティ株式会社 のみなさん、どうもありがとうございました。素敵なトークを提供してくれた講師メンバーに感謝します。会場参加、USTREAM参加ともに多くの方々の参加を嬉しく思ってい
一般的に ImageMagick のサムネイル画像生成は遅いとされており、パフォーマンスが求められるシーンでは Imlib2 などのより高速な画像処理ライブラリが使われることが多いです。 Imlib2 の高速さについては、以前「Imlib2でImageMagickより3倍高速かつ美しいサムネイル画像の生成 - 床のトルストイ、ゲイとするとのこと」という記事で紹介しました。この記事のベンチマークにおいて、Imlib2 によるサムネイル画像の生成は、 ImageMagick の3倍程高速でした。 しかし、 ImageMagick は Imlib2 より画質がよく、高機能で使いやすく、今も頻繁にメンテナンスされており、とてもよく出来ています。その点 Imlib2 は、2004年からメンテナンスされておらず、セキュリティホールが見つかっても、各Linuxディストリビューションがそれぞれパッチを当て
フォントをWindows、Mac、Linuxでも使用できるように、TrueType, PostScript, OpenTypeなどにフォントのフォーマットを変換できるオンラインサービスを紹介します。 Free Online Font Converter [ad#ad-2] 対応しているフォントのフォーマットは下記のようになっています。 フォントの対応フォーマット pfa, pfb, pt3, sfd, ttf, otf, otb, t42, cef, cff, gsf, ttc, svg, ik, mf, dfont, bin, suit and bd Free Online Font Converterの使い方 使い方は簡単です。 登録など面倒なことはありません。 「Select a file to convert:」にフォントファイルを指定して、アップロードします。 「Select a
モバイルバッテリーとは呼べない。「ほぼポタ電」なコレ1台で有事の時もアウトドアも大活躍!【AmazonスマイルSALE】
Windowsのアップデートや、自動通知のあるソフトウェアのアップデートはきっちり行っていても、デバイスドライバなどのアップデートはなかなか行わないし、そもそもアップデートがあるのかどうかも分からないという人も多いのではないでしょうか。「SlimDrivers」はコンピューターをスキャンして、アップデートすべきドライバを検出してくれる無料のソフトウェアです。 スキャンもワンクリック、そこからアップデートをダウンロードするのもワンクリックという非常にシンプルな操作が特徴の「SlimDrivers」。システムの復元も簡単に行えるので、普段ドライバのアップデートを行っていない人は、これで一気に更新してみるのもいいかもしれません。 「SlimDrivers」のインストール方法と実際に使ってみた様子は以下から。 DriverUpdate.net - Update Easily 上記ページ左の「
HTML5“とか”アプリ開発入門(5):(文書構造編:後編)HTML5 Outlinerで文書の“アウトライン”を確認する (1/2) 文書の「アウトライン」とは 前回の「HTML5のセクションで“文書構造”を理解する」で説明した「セクション要素」(<section><article><nav><aside>)は文書構造を表すために用いられます。セクション要素によって作成されたブロックは、文書の「セクション」と呼ばれます。そして、セクションの入れ子構造によってでき上がった論理構造を、文書の「アウトライン」と呼びます。 言い換えると、「セクション要素を用いてマークアップしていくことは、文書のアウトラインを構築していく作業である」ということになります。そのため、セクション要素を<div>要素と同じように乱用することは許されません。それはつまり、「文書の論理構造を無造作に取り扱っている」というこ
SEOで重要な要素の一つに、内部リンクがあります。これはあなた自身のサイトの内部リンクを適切にすることで、サイトをSEOの面で改善・強化します。 すぐに作業できる内部リンクを改善する5つの方法を紹介します。 5 Fast Tips to Improve Internal Links [ad#ad-2] 下記は各ポイントを意訳したものです。 1. キーワードを使う 2. 絶対パスを使う 3. パフォーマンスの改善 4. テキストのメニューを使う 5. リンクの整理整頓 1. キーワードを使う リンクのテキスト(アンカーテキスト)には、キーワードを含めるようにします。 例えば、「内部リンク」というキーワードに注目する場合、そのページへリンクを貼る場合はアンカーテキストに「内部リンクの説明」とキーワードを含めるようにします。これにより、検索エンジンのスパイダーはリンク先のページが何についてのもの
HTML5 Templateのデモページ Easy HTML5 Templateの特徴 汎用性の高いシンプルなつくり HTML5の新しい要素に重点をおいて設計 HTML5対応ブラウザはもちろん、IE6, IE7, IE8も考慮 モバイルデバイスも考慮 jQuery, Google Analyticsなどよく使用されるものを配置済み [ad#ad-2] Easy HTML5 Templateの外部ファイル Easy HTML5 Templateで使用している外部ファイルです。 screen.css Reset CSSには「Eric Meyer's reset」が使用されています。 modernizr-1.6.min.js 「Modernizr」。HTML5やCSS3をサポートしているか調べ、CSSの場合はエレメントにclassを加えます。 html5.js 「html5.js」。IE9未満(
Modernizr [ad#ad-2] ツールの概要 JavaScript ドキュメント 利用できるプロパティ @font-face border-image border-radius box-shadow text-shadow opacity Multiple backgrounds CSS Animations CSS Gradients など CSS3 PIE ツールの概要 ビヘイビア スクリプト(htc) デモページ 利用できるプロパティ border-radius box-shadow border-image multiple background images linear-gradient as background image
本連載では、オープンソースの分散KVS(Key-Value Store)である「okuyama」と、その関連技術について、4回にわたって解説します。 okuyamaは、クラウド時代のデータ・ストレージと言われる、「NOSQL」と呼ぶ部類に属するデータ・ストレージです。連載では、NOSQLが登場した背景や関連ソフトウエアの特色を整理したのち、okuyamaの概要と機能の紹介、そして実際にどのように配置・運用するか、などを解説します。 第1回: NOSQLは「知る時代」から「使う時代へ」 - NOSQLの登場した背景や特性、NOSQLの種別を紹介します。 第2回: NOSQLの新顔、分散KVS「okuyama」の機能 - 分散KVS「okuyama」の概要から機能の詳細までを解説します。 第3回: 分散KVS「okuyama」の使い方 - 実際にokuyamaを起動してから利用までの手順と運用
イーコマース用のアイコン「Kaching」、子ども向けウェブサイト用のアイコン「Childish」、各種ソーシャルメディアのアイコンをベクター形式で揃えた「Buddycons」、モノクロベースで208種類もある実用アイコン「Reflection」、ベクター形式のソースファイルを同梱したRSS用のアイコン「Supra」、ブルーとブラックを基調にしたベクター形式も収録済みのアイコン「Primo」、ベクター形式とPNG形式の両方を揃えたTwitter用各種アイコンセットなどなど、とにかく山ほど無料で商用利用も可能なオリジナルデザインのアイコンを配布しているのがウェブデザインを扱うブログ「Webdesigner Depot」です。 というわけで、各種アイコンのダウンロードは以下から。 Kaching - Exclusive Free eCommerce Icons | Webdesigner De
OAuth 2.0で Webサービスの利用方法はどう変わるか ソーシャルAPI活用に必須の“OAuth”の基礎知識 株式会社ビーコンIT 木村篤彦 2011/2/2 TwitterがOAuth 1.0を採用したのを皮切りに、今では多くのサービスがOAuth 1.0に対応しています。国内でも、例えば、マイクロブログ型コラボツール「youRoom」、小規模グループ向けグループウェア「サイボウズLive」、「はてな」のいくつかのサービス、「Yahoo!オークション」、リアルタイムドローツール「Cacoo」などがOAuth 1.0に対応したAPIを公開しています。 ここ数年でOAuthはさまざまなWebサービスのリソースを利用する際の認証方式として普及してきました。これは大きなプレーヤーがサポートしたことも一因ですが、OAuthの持つ以下の2つの特徴によって、「OAuthを使うと、サービスプロバイ
こんにちは、「検索と発見のためのデザイン」(オライリー・ジャパン)を買いました。同じ著者の「アンビエント・ファインダビリティ」は発見可能性の広い枠組みを考える読み物でしたが、こちらは実際に検索システムをデザインするときの枠組みを提供してくれる本って感じです。 さて、今日はそんなユーザー寄りのデザインの話ではなくjQueryの実装の話です。 最近のjQueryライブラリには、Ajax通信でサーバーから取得したデータをハッシュ(JavaScriptのオブジェクト)として利用できるようにするためにjQuery.parseJSON() というメソッドがついています。(1.4.1〜)これ以前はXMLHttpRequestの処理とセットになっていて、JSONのパースだけ単体で利用できないようになっていました。(…といってもJSON文字列をevalしているだけだったようですが…) jquery-1.2.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く