XMLHttpRequest Standard
Participate: GitHub whatwg/xhr (new issue, open issues) Chat on Matrix Commits: GitHub whatwg/xhr/commits Snapshot as of this commit @xhrstandard Tests: web-platform-tests xhr/ (ongoing work) Translations (non-normative): 日本語 Abstract The XMLHttpRequest Standard defines an API that provides scripted client functionality for transferring data between a client and a server. 1. Introduction This sect
Screen size tests
x Variants With viewport width set to 380 With viewport width set to device width Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph. Test paragraph.
開発者によるWeb標準化を可能とする「Extensible Web」とは？
といったところが代表的でしょう。例えば、セレクタを用いたDOM操作は jQuery で実践的に有効性が示され、querySelectorとして標準化されました。これにより、jQueryのパフォーマンスは向上し、さらに Zepto.js のような軽量化ライブラリが登場・・・といったWebの好循環を起こしました。 一方、ユースケースの考慮が浅いまま実装されてしまったAPIは、 結果的に実践にそぐわず、憂き目にあってしまうケースが多々見受けられます。(その代表的な例が、Application Cache です) これまで説明してきたフィードバックループを、 Webを構成するHTML・CSS・JS等の様々な分野で更に展開できるといいのですが、 現在のWebを取り巻く環境では限界があります。なぜならば、 「Web開発者が、拡張(extend)できるポイントが少ない」 ためです。 例えば、CSSの構文
dresscording.com
dresscording.com 2019 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
Webアニメーションを高速化するために知っておくべき10のこと（前編）
Webアニメーションを高速化するために知っておくべき10のこと（前編） 斉藤 祐也（株式会社リッチメディア） アニメーション／トランジションは身の回りに当たり前にあるものです。 むしろ普段の生活では「0」が「1」に変化するものの方が珍しいでしょう。 アニメーション／トランジションはデジタルなWebに対して自然な変化を提供する大切なツールです。 今回はそんなアニメーション／トランジションをより自然にスムーズに動作させるために知っておきたいことを前・後編の2回に分けて紹介していきます。 アニメーションを高速化する理由 アニメーションは先ほど書いたように普段の生活にも存在しています。だからこそ、我々はスムーズではないアニメーションを見つけるのが得意です。 アニメーションに限定した話ではありませんが、FacebookのShane O’Sullivan氏が、ページロード後のレンダリングパフォーマンス
JavaScript でのローカル ファイルの読み込み - HTML5 Rocks
Read files in JavaScript Stay organized with collections Save and categorize content based on your preferences. Selecting and interacting with files on the user's local device is one of the most commonly used features of the web. It allows users to select files and upload them to a server, for example, when sharing photos or submitting tax documents. It also allows sites to read and manipulate the
モバイル時代のWebパフォーマンス
2014/8/30に開催された「HTML5とか勉強会 in IWATE 2014」のセッション資料です。Read less
CodeGrid - フロントエンドに関わる人々のガイド
HTML/CSS 387 CSS仕様 121 CSS設計 53 HTML仕様 40 SVG 25 スタイルガイド 14 HTML/CSSの実践 135 HTML/CSSドリル 4 フォント 3 データ形式 6 性能と品質 49 セキュリティ 16 パフォーマンス 12 アクセシビリティ 21 デザイン 65 ディレクション 50 ドキュメンテーション 7 JavaScript 593 ECMAScript 45 ライブラリ 71 ブラウザAPI 38 WebGL 42 テスト 36 JavaScriptの実践 64 JavaScriptの設計 9 JavaScriptドリル 15 非同期通信 5 Vue.js 73 DOM 9 Angular 30 Electron 4 Web Components 14 jQuery 24 Backbone 17 TypeScript 24 Coffee
レスポンシブデザインを制作するなら頭に入れておくべき基本事項7つ | 株式会社LIG
どうも〜こんにちはぁ！ 最近レスポンシブなサイトを作ることが多いライターの、のび太です。 モバイル、タブレットユーザーが最近どんどん増えてきているので、Web制作者にとってレスポンシブなサイトが作れるってことが必須になるんじゃないかなぁ〜って感じますね。 レスポンシブデザインを制作するときに意識しなきゃいけないことはいろいろありますが、今回は「これはぜったいに知っておきたいよね！」って感じた基本的なことを7つご紹介させていただきたいと思います。 レスポンシブデザインを制作するときに意識しておきたい基本項目7つ 1. 画像の代わりになるべくCSSで表現すべし レスポンシブデザインで画像を使うと、モバイル端末ではPCに比べて回線速度が遅いため、読み込み時間が余計にかかってしまいます。 そのため、画像ではなくCSSで表現可能なものはどんどん代替していったほうがいいと思います。 立体ボタンや矢印だ
CSS3のFlexboxを基本から理解して、使い方をマスターしよう！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、王です。デザイナーやってます。 今回は「Flexboxを基本から理解して、使い方をマスターしよう！」ということで、初耳の方でもざっとFlexboxで何ができるか分かるように短い動画を用意しました。 動画の中で使ってたデモをアップしたので、確認してみたい方は以下のリンクをどうぞ！ デモ 昨今では、当然ながらデジタルデバイスサイズの多様化でレスポンシブデザインとやらが流行っています。 同じサイトをさまざまなスクリーンサイズに応じたデザインをしなければならない上に、コーディングにも手間がかかります。制作側からしたら何かと厄介ですよね。 「なるべく手間をかけずに作りたい！」という世界中のデザイナーの声に応えて、「Twitter Bootstrap」をはじめとした数多くのフレームワークが徐々に脚光を浴びはじめて久しくなります。 ただ、これらはあくまで古い技術の組み合わせで、革新的な技術で
パララックス効果を使ったウェブデザイン | | DesignWalker
パララックス効果って、あまり聞き慣れない言葉ですが…。 初期の横スクロール型のテレビゲームなどでよく使われていた視差効果を使って奥行きを出す技法だそうです。 いくつかのレイヤーを、それぞれ違った速度でスクロール（奥にあるレイヤーはゆっくり、手前にあるレイヤーは早くスクロール）させる事で、視差効果を与えて奥行きがあるように見えるのだそうです。 今回は、このパララックス効果を上手にウェブデザインに応用サイトをいくつかまとめてみました。 How to recreate Silverback’s parallax effect まずは、パララックス効果をウェブデザインに応用する方法から。ブラウザの横幅を変えてみると、４つのレイヤーに配置されているPNG画像がそれぞれスクロールの速度が違って奥行きがあるように見えます。サンプルコードも公開されているので、挑戦してみてはいかがでしょうか。CSSのbac
はじめてHTML5でコーディングする時に注意したいアウトラインとかいろいろ
先日このブログを HTML5 で作り直しました。その時に思った、HTML5 でコーディングするときの基本的な注意書きです。なので、HTML5 をこれからやってみようかなーという人向けです。canvas、video、audio などには触れていません。もっと基本の文章構造、アウトラインについての記事です。また、後半は実際に HTML5 でコーディングする時の tips になってます。 先日このブログ – Webデザインレシピを、HTML5で作り直しました。HTML5 … クライアントさんのページでは、まだ一度も使ったことがないし、勉強のためのサンプルはいくつも作ってみたんですけど、実際に運営しているページで試したいなーと思い、思い切って HTML5 にしました。 とりあえず作ってはみたものの、まだまだ分からないことだらけ。これから HTML5 でコーディングをする時に、とても大事だなーと思っ
2014年のリセットCSSとレスポンシブ対応の初期CSS
スマホ・タブレット対応、レスポンシブ対応が一般的な現在、CSSの扱いは非常に重要になっているように感じています。今回こそはと思ってサイト制作を始めても気が付いたらグチャグチャなCSS。 2014年もCSSを上手く綺麗に扱うのに苦労しそうです。そこで、ここではリセットCSSに合わせて、効率良くスマートに扱うための初期CSS、HTMLを大公開。 年末ということで、過去のデータを整理してみました。 個人的な資産ですが、まぁ何と言うか誰かの役に立てたら幸いです。紹介するCSSは大きく分けて下記の4つです。 2014年もきっと大活躍のリセットCSS よく使うCSS3 WordPress用の初期CSS レスポンシブ対応、どんなサイトでも使えるレイアウト早組CSS リセットCSSというか、もはやフレームワークです。 2014年のリセットCSS 色々なリセットCSSが出回っていますが、個人的には下記で十分
html5doctor, helping you implement html5 today
What a brilliant idea! For the longest time HTML5 specified, and advised developers, that it no longer mattered what the number (1 to 6) was in a heading element (when used in conjunction with sectioning elements). What mattered was the nesting level of the H1-h6 in sectioning elements, just like the X<H>TML promised land, but […] Read full post HTML5 Element Index Head doctype html head title bas
並列処理を実現！Web Workersを使いこなそう
連載目次 HTML 4が登場したころは、シングルコアのCPUしかなく、HTMLとJavaScriptで実現できる処理も限定的であったため、処理を逐次実施するシングルスレッドでの処理に不満を抱くことは少なかった。もっとも、HTMLとJavaScriptは同一のUIスレッド上で処理を行うため、JavaScriptで動的にHTMLコードを生成する処理や、高負荷の処理がある場合、HTMLレンダリングが遅延したり、最悪の場合はブラウザがフリーズしたりしてしまうということがあった。 近年では、マルチコアの端末が大多数を占めるという物理的な環境の改善のほか、HTML5の台頭により、HTMLとJavaScriptを高度に活用したWebアプリケーションが増えてきている。そのため、JavaScriptコード自体をマルチスレッドで処理したいという要件も多くなりつつある。 例えばファイルにアクセスする際のI/Oや
can I use... Support tables for HTML5, CSS3, etc
Test a feature Our partnership with BrowserStack now lets you test your website for compatibility across 2,000+ real browsers and devices. Test on: Did you know? Next If a feature you're looking for is not available on the site, you can vote to have it included. Better yet, if you've done the research you can even submit it yourself! You can import usage data from your Google Analytics account and
Offline resources in Firefox - MDC
このアプリケーションキャッシュ機能を使用しないでください！これはウェブプラットフォームから削除する手続中のものです。 Firefox 84 以降、この機能は削除されました (バグ 1619673)。 Chomium 90 でも削除が予定されており、 Safari でも非推奨になっています。 Firefox 60 以降、および対応しているブラウザーの一部またはすべてにおいて、安全なコンテキスト (HTTPS) でしか利用できません。 Firefox 44 以降ではオフライン対応のためにアプリケーションキャッシュを使用すると、代わりにサービスワーカーを使用するよう開発者に案内する警告メッセージをコンソールに表示します (バグ 1204581)。 非推奨 この機能は非推奨になりました。まだ対応しているブラウザーがあるかもしれませんが、すでに関連するウェブ標準から削除されているか、削除の手続き中で
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML5で音を扱う3つの方法
モダンなCSS設計パターンを考える
Frontrend Advent Calendar 2013 - Adventar
