CSSとJavaScriptのインライン化
CSSやJavaScriptをインライン化してみている。速い。ラスター画像もBase64で埋め込めみたくなる。しかしインライン化はやはり気持ちが悪く、落ち着かない。この気持ち悪さはウェブサイトと言う単位に意味が薄くなってしまうことにあるのではないか。 ウェブサイトは全体で一冊の本になっているようなイメージが漠然とある。フレーム全盛期を体験していることが大きい。このイメージではそれぞれのウェブページはその本のページにあたり、それぞれから参照されるCSSやJavaScriptファイルはそのページ群を留める接着剤やひもにあたる。それらをインライン化してしまうと、本のページそれぞれを切り離し、ペラペラな紙にしてしまっているような印象を持ってしまう。 実際にはそれぞれのウェブページは半ば独立したもので、ユーザーからも様々なウェブサービスからもそう扱われるようになって久しい。直帰率が限りなく100%に
Web Componentsを構成する4つの仕様 ー Web Components基礎編
我々Web開発者がWeb Componentsという言葉を耳にしてから、もう2年程経ったでしょうか。Web Componentsが変えるWeb開発の未来という記事に、「今のWeb開発がどのような課題を抱えているか、それをWeb Componentsがどう解決するか」を書きました。これを踏まえて、本連載ではWeb Componentsの仕様から実装、PolymerやX-TagといったWeb Componentsを支えるライブラリなどの周辺知識まで解説していきます。 Web Componentsを支える4つの仕様 連載第1回目となる本記事では、Web Componentsを支える4つの仕様について解説します。Web Componentsは以下の4つの独立した仕様から構成されます。 Custom Elements – 独自のカスタム要素をユーザーが定義することを可能にする Shadow DOM
Client-side full-text search in CSS
How do we design, develop, and run websites and web applications today? A blog by François Zaninotto Using data- attributes for indexation, and a dynamic stylesheet with a CSS3 selector for search, it is straightforward to implement a client-side full-text search in CSS rather than JavaScript. Here is an example. The Searchable List The Search Code The search is very straightforward: it relies on
【GDC 2013 Vol.33】HTML5+JavaScriptで容易にWii Uでのゲーム・アプリ開発が可能に・・・「任天堂ウェブフレームワーク」発表 / GameBusiness.jp
今回のGDCで任天堂は2つの開発者向けセッションを予定。最初に行われたのは「Nintendo Wii U Application Development with HTML and JavaScript」(HTMLとJavaScriptを使ったWii Uアプリケーション開発)と題したセッション。講師は任天堂の環境制作部の島田健嗣氏です。 Wii Uの最大の特徴であるWii U GamePadは、手元にある第2のスクリーンとして、テレビ画面と連携することによって、多くの人々と体験を共有しながら、操作性の良さを同時に実現することができます。任天堂は昨年末の発売から、ゲームソフトだけでなく、『YouTube』や『ニコニコ動画』、あるいは『Wii Street U』といったアプリケーションをリリースしてきました。これらは元々、ウェブサービスとして提供されているものですが、リビングでの体験へと変化
Graphical Webの拡がり；HTML5とその周辺技術で実現する | gihyo.jp
もちろん、すべてHTML5を中心とする標準技術であるため、JavaScriptを通じてそれぞれを組み合わせて利用できます。 注目されるGraphicalWeb こうした新しいWebのグラフィックス技術の拡大もあり、2012年にはThe Graphical Webというカンファレンスがスイス開催されました。 The Graphical Web2012のWebサイト 実はこのカンファレンス、2002年から10年以上も続いているカンファレンスで、2011年まではSVG Openという名前で開催されていました（ちなみに、2007年には日本で開催されました）。しかし、2012年からカンファレンス内で扱う技術はSVGのみにとどまらず、HTML5 media、CSS3 Animations、2D Canvas、WebGLなどの技術も取り上げることとなり、こうした技術の総称としてカンファレンスのタイト
Webパフォーマンス ベストプラクティス - Make the Web Faster
Webパフォーマンス ベストプラクティス Last updated: 02 October 2012 翻訳：@t32k WebページをPage Speedで調べるとルールに準拠していないものが提示される。このルールというのは、一般的にあなたが開発段階において取り入れるべきフロントエンドのベストプラクティスだ。あなたがPage Speedを使用しようとしまいと、私たちはこの各ルールについてのドキュメントを提供する（たぶんちょうど新しいサイトを開発中でテストする準備が整ってないだろう）。もちろん、これらのページはいつでも参照することができる。私たちはあなたの開発プロセスに取り入れてもらうために、このベストプラクティスを実装するための明確なティップスと提案を提供する。 パフォーマンス ベストプラクティスについて Page Speedはクライアント側からの観点でパフォーマンスを評価し、一般的にペー
Learn HTML5, CSS3, Javascript - video style tutorials
Learn HTML5, CSS3, Javascript and more... Video style walkthroughs showing cool stuff being created from scratch
スクリプトが無効の場合のスタイル
たとえばホームページのビジュアル要素など、いったん非表示にしておいてスクリプトでふわっとフェードインさせたい、みたいなことはよくある。そのとき非表示にする操作も JavaScript にやらせると一瞬見えてしまうことがあるので CSS で非表示化したいが、それだとスクリプトが無効の場合に何も表示されなくなってしまう… というような、スクリプトによる操作を前提にしたスタイルのフォールバックをどうするかという問題。 ここのところよく使っていたのは、JavaScript で html 要素の class 属性を操作し、それをもとに CSS を書くという手。Modernizr でも使われてるあれ。 (function () { var root = document.documentElement; root.className = root.className.replace(/\bno[-_]
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
W3Schools Online Web Tutorials
W3Schools offers a wide range of services and products for beginners and professionals, helping millions of people everyday to learn and master new skills. Free Tutorials Enjoy our free tutorials like millions of other internet users since 1999
Monaca
Mobile App Development Fast, Easy and Flexible.Cross-platform hybrid mobile app development platform and tools in the cloud GET STARTED FREE Monaca makes HTML5 hybrid mobile app development with Apache Cordova simple and easy. Monaca is the most open hybrid app development platform available and ready to be immediately plugged into your existing workflow and development environment. From Cloud IDE
Opera News
Desktop Opera One updates with new webpage Translator and improved Split Screen July 3rd, 2025 We're introducing a new built-in webpage translator to Opera One following your requests. We're also adding improvements to Split Screen. Mindfulness, Opera Air Opera Air’s redesigned Boosts now smoother, more intuitive June 4th, 2025 Hey all, Today we have another update for Opera Air, our browser built
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
今までああ書いてたアレ、これからはこう書けそう 2022 - DevFest Tokyo 2022
Hexagons grid - responsive
NameBright - Coming Soon
hanatoweb.jp
DOM 要素の実際に使用されているスタイルを取得 - Qiita
短期間＋大規模ゲーム開発でも破綻しないHTML・SCSS
Cached Home & Property
CSS 20 stunning examples of CSS 3D transforms