Web 開発してると、ソースを編集して、ブラウザーをリロードして、という作業の繰り返しになりがちだ。ソースを編集したら、自動でブラウザーをリロードしてくれるような夢のツールがあれば便利そうだ。 この分野では CodeKit や LiveReload などが有名なんだけど、もれなく有料だったり GUI だったりする。そこで、LiveReload のオープンソースな部分を参考にしつつ、コマンドラインで使える LiveReloadX というものを作ってみた。 特長はこんなところ。 Node.js を使ってるので Windows/Mac/Linux 問わずに動かせる 開発環境のブラウザーだけでなくスマートフォンのブラウザーもリロードできる 無料 インストール方法 インストールは超簡単! Node.js をインストールする。 コマンドラインで npm install -g livereloadx を
CA App Synthetic Monitor monitors your web sites and servers CA App Synthetic Monitor offers you: Up to date information about the reachability of your website. Alerts are sent by e-mail, SMS (text message), or RSS. A continuous quality check of the accessibility of your web server, 24 hours per day, 7 days a week. Periodic reports are sent by email. Sign up for a free trial now and CA App Synthet
斉藤さん(@cssradar)が紹介していた20 Mobile/Desktop Browser bugs and tricks any Senior Frontend Web Developer should knowがおさらい的に参考になったので各項目の表題だけ訳しておきました。ほとんど邦訳するということがないのでおかしい部分などありましたらご指摘頂けると幸いです。 各内容の詳細については訳していません。本文とサンプルのソースを見れば大体わかると思います。 また、Gistにも置いています。 20 Mobile/Desktop Browser bugs and tricks any Senior Frontend Web Developer should know Link outlines / highlights are misaligned on the Kindle Fire リン
モバイルバッテリーとは呼べない。「ほぼポタ電」なコレ1台で有事の時もアウトドアも大活躍!【AmazonスマイルSALE】
iOS版の Chrome がリリースされましたね。 アプリとしての使い勝手どうこうというところよりも、JavaScript エンジン周りをどうしているのかに興味があったのだけど、TechCrunch の記事 (http://techcrunch.com/2012/06/28/hands-on-with-googles-chrome-for-ios-just-like-chrome-for-android-only-slower/) を見る限り v8エンジンは搭載されていないし、当然 UIWebView での JIT コンパイラも有効にはなっていないように見えました。つまり、JavaScript の実効速度に関して言えば、Mobile Safari のそれを上回ることはない。(厳密に言えば、純粋な JavaScrpit の実効速度以外のところの実装が良くてトータルとして速い、というようなこと
デザイン要素を固定しないリキッドレイアウトは、未知の端末にも対応するというコンセプトのもとに実装するレスポンシブウェブデザインには必須だと考えています。そのリキッドレイアウトを実装する際に理解しておきたいのが、パーセント値で幅や高さを指定した際に小数点以下になるピクセル値(10.5pxとか9.2pxなど)に対するブラウザの挙動です。 たとえばグリッドシステムを構築する際、計算上はあっているのにブラウザでは思った通りに表示されないといったことが起こります。これは、各ブラウザのサブピクセル(小数点以下のピクセル値)の扱いの挙動差により生まれます。 まずはパーセント指定の基本から まずは前提となるパーセント指定の際の計算の基本のおさらいから。。。 CSSでパーセント値を使って幅や高さ指定をすると、指定した要素を含む親要素をベースにピクセル値が計算されます。 たとえば100pxの親要素の中にある子
Google Chromeがブラウザの世界シェア1位になりましたが、ここでGoogleのライバルであるYahoo!から新たなブラウザ「Yahoo! Axis」がリリースされました。Windowsの各種ブラウザ向け拡張機能としてのほか、iOS向けにもリリースされています。 Yahoo! Axis - A new way to search and browse http://axis.yahoo.com/ Yahoo to Launch "Chrome Killer" Tonight - LAUNCH - こちらがそのデモムービー。 Yahoo! Axis is a new kind of browser that redefines what it means to search and browse the web. Watch this video to see how Axis wo
html5Web フォントは「Web サイトにオリジナルのフォントを埋め込む」ための技術です。現行のブラウザーは全て Web フォントに対応している状況です。そんな状況であるため、絶対にコピペできない文章を作ったったwwww は Web フォントに依存したコンテンツでしたが、特別な配慮はせずに公開しました。しかし、公開後、Web フォントが適用されなかった複数の方から「コピペできるんだけどどういうこと?」「意味が分からない」というコメントがよせられました。そこで、Web サーバーのアクセスログを解析して「Web フォントに対応していない環境」がどの程度あったのかを調べてみました。4種類のフォーマット一口に Web フォントといっても、フォントのフォーマットは WOFF・TTF・EOT・SVG の 4 種類あります。今後は WOFF フォーマットが標準になっていくのですが、現在ではサポートし
ある ニュース記事を同僚に教わった。 この記事によるとタッチデバイスの会社は WebKit2 に対応しているのに検索の会社は旧バージョンにとどまっており、HTML5 に課題は多いのだそうな。 そりゃ課題は常に山積みだよね…と思っていたら記事は誤解だと別の同僚が説明を書いている。 リンク先の記事はさておき、世間の関心をいまいち集められていない気がする WebKit2 についてざっと説明をしてみたいとおもう。 この記事を読み終われば WebKit2 と Chromium WebKit, Webkit1 の違いを知ったかぶれるようになる予定。 WebKit2 は 2010 年の 4 月にアナウンスされた WebKit の新しい API レイヤで、Mac 版 Safari などが使っている。 大きな特徴はレンダリングエンジンを別プロセスで動かせること。 Chromium でやっているのと同じような
リキッドデザインとかレスポンシブウェブデザイン流行ってるけどやっぱりPC,スマートフォン,携帯(ガラケー)は別に別にコンテンツ用意したほうが良い時もありますよね。 でも「SEOとか考えると…」「URLがばらばらになっちゃって…」なんてお客様のお悩みを解決する為にいまさら感がすごいですが魔法の設定をご用意いたしました! apacheの設定を書き換えよう httpd.confで以下を書くだけでOKです。 virtualhostとかしてるときは適切に気書き換えてね。 ##################################################################### #(C)makoto@2ch.to LoadModule rewrite_module modules/mod_rewrite.so LoadModule setenvif_module mod
Your browser scores 0% Determined by passing tests out of total for features
Internet Explorer の自動アップグレードについて | TechNet 長かった… 本当に長かった… やっと、IE 6, IE 7 が居なくなるのですね… uupaa.js ver 0.8 に埋まっている処理から情報を抜き出し IE 6, IE 7, IE 8 が居なくなった未来では何が可能になるのか抜粋してみました。 IE8 でやっと使えるようになる機能 一部は IE 6 や IE 7 でも使えるのですが、対応が限定的だったり不具合が多かったりと、安心して使えなかった機能も含まれています。 display: inline-block display: table, table-cell など position: fixed; E:active {...} E:focus {...} E::first-child {...} E:lang(C) {...} E::after
ワーキングドラフトが公開されたり、IEBlogでも言及されるなど、注目度が一層高まってきた感のあるWeb RTC (Web RealTime Communication)仕様について、改めて調べてみました。 Web RTCは、Webアプリからカメラやマイクでメディアデータを取り込んたり、リモートホストとのP2Pのデータ送受信を行うためのJavaScript APIです。 Web RTCは、以前はWHATWG HTMLの一部として仕様が提案されていましたが、分離して一つの仕様になりました。分離したのはつい最近です。 API自体は単純なので、これまでは仕様書流し読みしてわかった気になっていたのですが、「ローカルからのメディアデータの取り込みとP2Pがなんで同じ仕様にあるんだろう?」とふと疑問に思って、きちんと仕様書を眺めて見ました。同じように疑問に思う方が居らっしゃれば、お役に立つ記事かと思い
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック','MS PGothic',sans-serif; 同じフォントを日本語表記とアルファベット表記の両方で指定しているのは、各ブラウザの解釈や挙動が異なるなどの理由からです。ただ、最近のブラウザはどうなんだろうかとちょっと気になったので調べました。 結果としては下記の表になりました。詳細はデモページを見てください。 Parallels上のWin7: IE6-8(IE6,7はIETester), Chrome15, Firefox8, Safari5, Opera11 Mac OS X 10.6.8: Chrome15, Firefox8, Safari5, Opera11 文字コード: UTF-8 指定方法 IE Chrome Saf
Web開発者のためのサードパーティCookieやらトラッキングやらの問題点について三回ぐらいに分けて書きます。 この文章は個人的に書いていますので、おい、お前のところのサービスがサードパーティCookieに依存してるじゃねーかというツッコミがあるかもしれないが、そういうことを気にしているといつまで経っても公開できないという問題が出てしまうので、そんなことはお構いなしに書く。ちなみに例外なく自社サービスに対してもサードパーティCookieに依存するな死ねと言っている。これはWebプログラマー観点で、自分がサービス開発に関わる上で知っておかねばならないだろう知識として十数年間だらだらとWebを見ていて自然に知っていたものと、あるいは興味を持って率先して調べたものが含まれている。ググッて直ぐに分かる程度の用語の定義的なことは書かない。あくまでWebサイト制作者側からの観点なので、ブラウザ開発関係
日本時間で昨晩、Amazonが発表したデバイス「Kindle Fire」には、クラウドとデバイスのあいだで分散処理を行う全く新しいWebブラウザ「Amazon Silk」が搭載されています。 Amazon Silkはローカルのデバイス上で動作するWebブラウザの背後に、クラウドであるAmazon EC2で動作するサービスがつねに存在し、両者が連動して高速なWebブラウジングを実現すると説明されています。Amazonはこれを「Split Browser Architecture」と呼んでいます。 これまでWebブラウザの高速化、高機能化の競争は、PCやモバイルデバイスなどで動作するソフトウェアの進化を意味していました。しかしAmazon Silkの登場で、この進化がクラウドを巻き込むものに広がりました。 グーグルやマイクロソフト、モジラ、オペラなどのWebブラウザベンダの戦いに、Amazon
みなさん お久しぶりですヽ(´ー`)ノ夏休みの宿題終わりました? 毎日が夏休みの最終日みたいな生活してるあまちゃんです! さてさて 今日は WebKit サーバーというものを作ってみたので、紹介してみます。 WebKit って何? WebKit っていうのは Chrome や Safari の中に入ってるブラウザのエンジンのことです! 実はブラウザっていうのは、エンジン部分と見た目の部分(タブとかボタンとかね)に別れていて、意外と違うブラウザでもエンジン部分は同じものを使ってるってことも多いんですよ(*´ー`) ブラウザのサーバーってどういうこと? 要は、サーバーサイドでブラウザを起動して JavaScript を実行したり、 JavaScript が実行されないと読めないページから値を持ってくるのに使ったりしようという魂胆です。 今まではそういうのなかったの? 実は、今までは JavaS
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く