Google Drive に Web ページから簡単にファイルを保存するボタン
Google Developers Blog で、Web ページ上にある画像やファイルを、ワンクリックで Google Drive に保存できるボタン、「Save to Drive」 ボタンが紹介されていました。 ボタンを設置する簡単なコードを追加するだけで、すぐに自分の Web ページに、このボタンを設置することが可能です。 An easier way to save files to Google Drive ： Google Developers Blog Starting today, Drive users can use the "Save to Drive" button to do exactly that. The "Save to Drive" button is an easier way to save files directly from a website.
Selectors Level 4 の Working Draft が更新される
5月 2日付けですが、Selectors Level 4 の Working Draft （草案） が更新されました。 Selectors Level 4 自体は 2011年 9月 29日の Selectors Level 3 仕様の勧告とあわせて最初の Working Draft が公開されていますが、そこから今回で 2回目の更新となります。 Selectors Level 4 W3C Working Draft 2 May 2013 Working Draft 内の、「Selectors Overview」 に Selectors Level 4 を含めた、セレクタの一覧がありますので、下記に引用しつつ簡単に日本語での解説も付け加えておきましたが、Selectors Level 4 ではセレクタがより一層便利になっていますので、早いところブラウザ側で実装されるといいですね。 ちなみに、
HTML5 勧告候補に main 要素が追加、hgroup 要素は予定通り削除
ちょっと前に 「hgroup 要素が HTML5 の勧告候補 （Candidate Recommendation） から削除されるようです」 って記事を書きましたが、実際に削除されたみたいですね （Editor's Draft では）。 ついでに、すでに HTML 5.1 Nightly にはすでに追加されていた、main 要素が、HTML5 勧告候補の方にも追加されたようです。 HTML5 W3C Candidate Recommendation 17 December 2012 hgroup 要素が HTML5 勧告候補から削除される main 要素とは？ main 要素は元々、Steve Faulkner 氏 （Web アクセシビリティ関連の方） が HTML5 の拡張仕様として提案し、HTML 5.1 に正式に取り入れられた要素で、その名の通り、文書内の、「主要な部分」 をマークア
特定の範囲内にのみスタイルを適用できる scoped 属性
HTML5 で追加された scoped 属性は特に目新しい属性ではありませんが、ここまで正式に対応したブラウザが存在しなかったため、使う機会がありませんでした。ところが、ここにきて Firefox Nightly が対応したそうなので、ちょこっと試してみます。 HTML5 で style 要素に追加された scoped 属性は特に目新しい属性ではありませんが、ここまで正式に対応したブラウザが存在しなかったため、使う機会がありませんでした。ところが、ここにきて Firefox Nightly Builds が対応したそうなので、ちょこっと試してみます。 Firefox Development Highlights - Windows での H.264 & MP3 サポート、スコープが設定されたスタイルシート など ： Mozilla Developer Street (modest) sco
jQuery Core 1.9 アップグレードガイド 日本語訳
ちょっと話題としては乗り遅れた感が漂いますが、先月末に jQuery 1.9 の正式版、および jQuery 2.0 のベータ版がリリースされました。 jQuery 1.9 final, jQuery 2.0 beta, Migrate final released ： Official jQuery Blog これに際して公開された、jQuery 1.9 への移行ガイド 「jQuery Core 1.9 Upgrade Guide」 を翻訳してみたので下記に公開してみます。 jQuery 1.9 / 2.0 とは？ jQuery 2.0 は IE 6/7/8 への対応をやめることで、より軽量で高速、そして安定化を目指した jQuery のメジャーバージョンアップ版ですが、jQuery 1.9 は 2.0 と 完全な互換性を持ちつつも、レガシーブラウザへの対応が可能なバージョンで、IE 8
Facebook コメントにしたら荒らしと同時に有益なコメントまで減ったらしい
数日前に TechCrunch がコメントシステムを Facebook コメントから、Livefyre に変更しましたっていう記事を上げてて、その理由が、荒らし対策に記名制の Facebook コメントを導入して、「荒らしを減らす」 って意味では効果は出たんだけど、同時にそれまで寄せられてた有益なコメント、コメント欄での活発な議論的なものまで減っちゃったから って書いてて、そういうこともあるのねと興味深かったので紹介してみます。 Commenters, We Want You Back ： TechCrunch It was early 2011 and TechCrunch's comment section was overrun with trolls. Bullies and asshats were drowning out our smart commenters. We ha
meta 要素に対する Microdata の指定
meta 要素に対する Microdata の指定について、過去に書いた記事に間違いがあったので修正とその解説。また、itemprop 属性もつ meta 要素や link 要素の body 要素内での使い方に関しても解説してみます。 もうちょっと早く書こうと思ったんですけどこんなに間が空くとは…… 去年の末、HTML5 Advent Calendar 2012 の記事として、「Microdata を使ってみよう。サンプルソースで学ぶ Microdata」 を書いたんですが、その中で 2箇所ほどサンプルソースに間違いがあるのをご指摘頂いて修正したんですね （ご指摘感謝です）。 そのうち、1つの間違いは単純な記述抜けというか、ミスだったんで置いといて、もう1つ、私が meta 要素に対して itemprop 属性を指定したサンプルで、同じ要素に name 属性をあわせて指定してたのをご指摘頂
IE 6/7/8 に脆弱性。セキュリティパッチは近日、Fix it は公開済み
新年あけましておめでとうございます。 さて、新年早々というか、去年末にですが、Internet Explorer 8 以前 （IE 6/7/8） が対象になる脆弱性が発見され、それを利用した攻撃に関して Microsoft から発表がありました。 Vulnerability in Internet Explorer Could Allow Remote Code Execution ： Microsoft Security Advisory (2794220) The vulnerability is a remote code execution vulnerability that exists in the way that Internet Explorer accesses an object in memory that has been deleted or has not
Microdata を使ってみよう。サンプルソースで学ぶ Microdata
HTML5 Advent Calendar 2012、7日目の記事として、Microdata （マイクロデータ） に触れてみます。サンプルソースを中心に、実際のページでどのように使えるのかを示しました。これから Microdata を使ってみたいという人に少しでも参考になればと思います。 HTML5 Advent Calendar 2012、7日目の記事です。なんか軽い気持ちで書いてみますとか言ってしまったんですが、緊張しますね… さて、タイトルの通りなのですが、HTML Microdata （マイクロデータ） について簡単に触れてみようかなと思います。この辺の話題に関して、Microdata とは何かとか、詳しい解説はすでに色々な方が書かれていますのでそちらを見ていただく （文末にまとめてあります） として、この記事では、そういう解説は置いといて、Blog や、企業の Web サイトなど
改行削除するくらいなら gzip したらいいじゃない
CSS や JavaScript ファイルなどを gzip 圧縮して転送量の削減や Web サイト表示速度の向上を実現する方法を解説。既存 Web サイトのソースには一切手を加えない方法でまとめています。おまけでキャッシュ関連の記述もあり。 いや、1バイトの無駄もゆるせねぇんだよとか、難読化したいとかなら別にやればいいんですけど、CSS や JavaScript ファイルの改行やスペースを削除しただけでファイル容量圧縮、読み込み速ーい的なこという人がいるので今さらですが書いてみます。すでに色々なところで書かれてるのでかぶるのは承知の上で。 改行や無駄なスペースなどを削除すること自体が悪いと言ってるわけではありませんのでその辺は誤解ないようにお願いします。ただ、gzip 使って圧縮するのに比べたら、改行削除して削れるファイルサイズなんて微々たるものです。もちろん、両方やれば最大限ファイルサイ
iPad 用にスタイラス自作してみた
iPad や iPhone で使える静電容量式タッチパネル対応のスタイラスを買いたいなと思っていたのですが、タップは問題なくても文字を書いたりという操作に適した物がなかなか見つからなかったので、自作してみました。 iPad の手書き系アプリでメモなどを書く際、指でもいいんですけど、手元が見にくかったりして書きにくいことがあったりするので、スタイラスが欲しいなと思っていました。 ところが、iPad や iPhone のような静電容量式タッチパネル用として市販されているスタイラスは、キーボードのタップなどには向いていても、文字を書いたりすると画面に引っかかってスムーズに行かなかったり、なかなかいい物が見つかりませんでした。 そこで、もう面倒なので自分で作ることに。要はスタイラスの先端から自分の指に電気が流れさえすればいい訳ですから、市販の導電スポンジ（IC とか CPU とか刺しておく導電性の
Web フォントでアイコン表示。 Font Awesome 使ってみた
Blog のデザインをリニューアルしました報告でもちょっと書いたんですが、アイコン関係を Web フォントを使ってやってみました。その時に利用させてもらったのが 「Font Awesome」 でして、今回はその簡単な使い方について書いてみようと思います。 Font Awesome, the iconic font designed for use with Twitter Bootstrap Font Awesome は簡単に言ってしまえば、Twitter Bootstrap のアイコンを Web フォントで扱えるようにしたもの。Twitter Bootstrap のアイコンは CSS Sprite で利用できるようにひとまとめになった 「画像」 として提供されていますが、Web フォントとして提供されることで、よりサイズ、カラーなどを柔軟に扱えるようになっています。 Font Aweso
HTML5 開発者向け iPhone 5 / iOS 6 での変更点等まとめ
iPhone 5 / iOS 6 における変更点などを、開発者向けにまとめた海外記事がありましたので、簡単にですが日本語にしてご紹介。対訳ではなくて、内容だけ伝わるようにかなり変更していたり、省略もしていますので、詳しくは原文をご確認ください。 iOS 6 がリリースされましたがアップデートされましたか？私はマップアプリをよく使うのですが、早速アップデートした方々の、マップがぁぁという叫びにびびってまだアップデートできておりません… で、まだ私の手元の iPhone 4S では iOS 5 が元気に動いている今日この頃ですが、iPhone 5 / iOS 6 における変更点などを、開発者向けにまとめた海外記事がありましたので、簡単にですが日本語にしてご紹介。対訳ではなくて、内容だけ伝わるようにかなり変更していたり、省略もしていますので、詳しくは原文をご確認ください。 原文 iPhone 5
Firefox 15 （現 Nightly） にレスポンシブモードがついたよ
現在、Nightly として提供されている、Firefox 15 ですが、デベロッパー向けツールに、「Responsive Mode （レスポンシブモード）」 と 「Layout View （レイアウトビュー）」 という 2つの便利そうな機能がついたそうなので紹介。 Responsive Mode and Layout View in Firefox 15 ： by Paul Rouget レスポンシブモードに関しては動画で紹介されていましたので貼っときます。「ツール （Tools）」 メニューの「Web 開発 （Web Developer）」 から選択できます。 レスポンシブ Web デザインで、ブレークポイントごとにデザインの変化を確認したければ、単純な話、ブラウザのウィンドウサイズをぐりぐり動かせばいいんですが面倒だし、正確なウィンドウサイズもわからないですが、このモードに切り替えれ
iframe 要素の seamless 属性を試してみた
WebKit Nightly Buildsが iframe 要素に追加された seamless 属性に対応したとのことなので、早速どんな感じになるのか確認してみました。 Last week in WebKit: Inspector's sources panel and private names ： Surfin' Safari Add seamless layout code (and pass most of the remaining seamless tests) ： Changeset 118291 WebKit 現在公開されている WebKit Nightly Builds の最新版、及び Google Chrome も、開発者向けビルド （Dev channel） の最新版 「21.0.1155.2」 で動作しているのが確認できました。インストール済みの方は下記にデモページ
Google ドキュメントとの連携なら Insync が便利
SkyDrive のアップデート、Google Drive のリリースと、オンラインストレージサービスがにわかに活気づいていますが、Google ドキュメントとの連携機能を売りにした Insync が使い方によってはかなり便利なのでご紹介。 なんか、オンラインストレージサービス Blog 的なノリになってますが… 昨日立て続けに SkyDrive、Google Drive とオンラインストレージサービスがアップデート / リリースされました。 特に、Google Drive の方は、Google ドキュメントにある文書ファイルがローカルに同期されるって聞いて期待してたんですが、実際に同期されてみたら、ローカルに保存されるデータは単なるショートカットで、編集はあくまで Google ドキュメント、つまりブラウザでやってねという作りになっててちょっとがっかり。というのも、今回紹介する Insy
placeholder 属性と jQuery で IE にもプレースホルダを
フォームの入力コントロール （input とか textarea） に対して、初期値として入力例などをうっすら表示し、ユーザーへのガイドとして使用するプレースホルダ。HTML5 では、placeholder 属性が新たに追加され、プレースホルダの提供が簡単に行えますが、この属性の値を活かして、未対応環境にもプレースホルダを提供する jQuery プラグインを紹介します。 フォームの入力コントロール （input とか textarea） に対して、初期値として入力例などをうっすら表示し、ユーザーへのガイドとして使用する （プレースホルダ） なんてことはよくやります。 HTML5 では、プレースホルダを指定する属性として、まさにそのままの名前が付いた、placeholder 属性が新たに追加され、ブラウザさえ対応していればとても簡単に実現可能になっていますが、今のところ IE が対応していな
CSS で作るスマートフォン向け片手操作メニュー
ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。 久々にこの手のネタ書いた気がしますけども… ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。多分言葉で言っても伝わりにくいと思いますので実際のサンプルをまずは見てみてください。 CSS で作るスマートフォン向け片手操作メニュー サンプル 現在最新版の Firefox
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
