WebKitがsrcsetを実装！レスポンシブイメージの問題が大きく前進
WebKitがWebKitが、img要素のsrcset属性を実装したとのニュースが、海外のWeb開発者たちの間で話題になっています。 srcset属性は、レスポンシブイメージを実現するために、WHATWGが提案していた仕様です。 この機能を用いると、ブラウザのスクリーン要件(幅、高さ、ピクセル密度)に応じて、異なる画像を読み込む事ができるようになります。 例えば以下のコードでは、ピクセル密度が2倍の(Retinaディスプレイのような)スクリーンを備えたデバイス上ではhigh-res.jpgを、それ以外のデバイスではlow-res.jpgを読み込みます。 この件について詳しく報じている“WebKit Has Implemented srcset, And It’s A Good Thing | Smashing Mobile”という記事によれば、srcset属性はレスポンシブイメージが必要と
サーバサイドの開発不要。Webブラウザを使ったデジタルサイネージ·WINT MOONGIFT
WINTはJavaScriptを使うデジタルサイネージシステムです。 駅やビル内にある大型スクリーンに映し出される広告、いわゆるデジタルサイネージはシステム化もその配信システムも複雑なものに感じられますがWINTを使うとサーバとブラウザだけで簡単に組み上げることができます。 読み込み中。コンテンツ部とニュース部の二つに分かれているのが特徴です。 HTMLコンテンツを表示している例。 画像を表示している例。 WINTは予め用意してあるJSONファイルを読み込み、指定した時間ごとにコンテンツを切り替えながら表示します。Webブラウザだけあれば動くのに加えて、JavaScriptだけで作られているのでサーバサイドの複雑な仕組みは一切不要で動かせるのが利点です。 WINTはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る Webブラウザ
Webサービス運営で覚えておきたい、登録フォーム作成の7つのポイント
ニーハオ！カヤックのHTMLファイ部のしんちゃんアル！ 中国出身の新卒です。 入社して二ヶ月になりますが、 日本語を一生懸命勉強しています。 よろしくお願いいたします。 さて、現在jsdo.itでは第二回HTML5実技コンテストを絶賛開催中！ こんどのお題は「思わず登録したくなる登録フォーム」です。 Webサービスの制作においてついつい疎かにしがちな登録フォーム。 実はとても大事なものです！ 今日は、登録フォームをつくる際に気をつけるべきポイントを7つにまとめました。 これだけは欠かせない基本の要素6つ 登録と無関係の要素はなるべく表示しないように！ 聞きたいことは最小限にして不安にさせない OpenIDを利用して登録手続きを超簡単に！ バリデーションは色や動きでみせると効果的 登録のメリットを表示しましょう アドバイスに縛られないで、そのサイトの個性に適した手法を使いましょう！ これら一
もう、Webはブラウザという制約に縛られなくていい ─ ＠IT
えーじ 2012/7/10 10年前、旅行先で道に迷わず目的地に辿り着くのがこんなに簡単になるなんて思わなかった。スマホとHTML5が、Webを自由に解き放つ まずは、食事のシチュエーションというUXの話から 唐突ですが、あなたはレストランでアルバイトをしたことがありますか？ 経験のある方なら、分かるかもしれませんが、レストランでアルバイトしていると、賄いで食事を出してもらえる場合があります。もちろん、お店によるので、一概にいえませんが、ちょっとしたファミレスでも、通常、顧客に出すものとほぼ同じ料理を食べられます。 そのとき、味はどうだったでしょう？ 1000円以上の価値があるものを無料で食べられるのだから、店によっては、実にうらやましい話だろうと思いきや、筆者の場合、そうでもないという感想を持った経験があります。 確かに、同じ料理なのですが、いわゆるバックヤードと呼ばれる従業員専用の、お
Dev.Opera — Responsive Images: What’s the Problem, and How Do We Fix It?
Responsive Images: What’s the Problem, and How Do We Fix It? IntroductionResponsive images is a surprisingly complicated topic, and one that's been steadily gaining attention over the last year as more developers discover they need them and then discover there's no good solution yet. This article aims to give an overview of the problem itself, and show the different proposals in the works to addre
AngularJS ― Superheroic JavaScript MVC Framework
AngularJS support has officially ended as of January 2022. See what ending support means and read the end of life announcement. Visit angular.io for the actively supported Angular. Why AngularJS? HTML is great for declaring static documents, but it falters when we try to use it for declaring dynamic views in web-applications. AngularJS lets you extend HTML vocabulary for your application. The resu
これが決定版？フォルダを監視してCSS/JavaScript/HTMLを生成·Fire.app MOONGIFT
Fire.appはフォルダを監視してSass/Compass/CoffeeScriptを自動変換するソフトウェアです。 最近はCSS/JavaScript/HTMLをそのまま書くのではなくSassやCoffeeScript、Haml/Markdownを使ってそれぞれのフォーマットに変換するのが当たり前になってきています。そこで使ってみたいのがFire.app、自動ファイル変換ソフトウェアです。 起動します。 メニュー常駐型です。 設定画面です。 Growlを使った通知に対応しています。 Livereloadに対応しています。 履歴です。 フォルダを指定しました。 プロジェクトテンプレートを生成してくれる機能があります。 生成しました。後は修正すると自動的に別フォーマットファイルを生成してくれます。 Fire.appはSass/CompassからCSSを、Haml/ERB/Markdownか
The Shapes Of CSS | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! CSS is capable of making all sorts of shapes. Squares and rectangles are easy, as they are the natural shapes of the web. Add a width and height and you have the exact size rectangle you need. Add border-radius and you can round that shape, and enough of it you can turn those rectangles into
Qual è la migliore tecnologia per i casinò online - Casino slot online software
Esistono molte tecnologie diverse che possono essere utilizzate per i casinò online. Ogni tecnologia ha i suoi vantaggi e svantaggi, quindi è importante scegliere quella giusta per le tue esigenze. Alcune delle tecnologie più popolari includono Flash, Java e HTML5. Flash, Java e HTML – che cos’è e perché viene utilizzato per i casinò online? Flash è una tecnologia popolare per i casinò online perc
高度なゲームも作れる。HTML5/Canvasフレームワーク·CasualJS MOONGIFT
CasualJSはCanvasタグを使ったアニメーション/ゲーム作成用JavaScriptフレームワーク。 CasualJSはJavaScript/HTML5製のオープンソース・ソフトウェア。JavaScriptはHTML5の登場によって大きく花開こうとしている。位置情報の利用、ストレージ、WebSocket（今は切り離されているが）、Canvasタグ等様々な新技術が盛り込まれている。 ボタン Canvasタグを使うことで、アニメーションを行ったりグラフィックを描くことができる。それもJavaScriptからインタラクティブに扱えるものだ。だが全てを作り込むのは大変だ。そこで使ってみたいのがCasualJSというJavaScriptフレームワークだ。 CasualJSはHTML5のCanvasを利用するためのフレームワークだ。ActionScript3ライクという説明がついている通り、アニ
HTML5花火大会から学ぶcanvasの表現力
HTML5花火大会が始まりました！ jsdo.itに集まった400以上の花火コードが、夏の夜空に打ち上がっています！ 本当にどの花火もクオリティーが高くて、見るだけでも楽しめます。 HTML5花火大会 花火のコードから学ぶcanvasの表現力 花火のコードの大半はHTML5のcanvas要素を使って描画されています。 canvasってなんだっけ？ javascriptから自由にグラフィックを描画できる要素です。 以下のエントリーにわかりやすくまとまっています。 図を書き込めるhtml要素です。 OpenGLやDirectXのような面倒な設定を書くことなく、 手軽にグラフィック描画が行えます。 ブラウザだけでローカルアプリケーションのような グラフィカル（かつ動的な）表現が行えるわけです。 今更聞けないcanvasの基礎の基礎 canvasで花火を描くには？ 花火のお手本コードから見ていきま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「RAIZIN JAPAN」HTML5 CANVASを使用した冷気の表現が話題に 【@maskin】 | TechWave（テックウェーブ）
ELLIE GOULDING
HTML5 Coding assessment test - jsdo.it - Share JavaScript, HTML5 and CSS