Flat Surface Shader
Admit it, 3D is cool. But, you know what's cooler? 2D. I love WebGL, but unfortunately it doesn't work everywhere. This lighting simulation can be configured to use either the 2D context of a canvas element or an array of SVG polygons to draw the triangles. It also utilises native Float32Arrays to store numerical data for highly optimised calculations. This is a collaborative effort between Matthe
クリエイティブな動きがデザインが実装できる フリーjQueryプラグイン「30 Free jQuery Plugins for February 2014」
TOP > plugin > クリエイティブな動きがデザインが実装できる フリーjQueryプラグイン「30 Free jQuery Plugins for February 2014」 魅力的なwebサイトを実現させるためには、他にはないデザインや動きを取り入れることで、より理想に近づけることができます。今回はそんな魅力的な動きを実装できるフリーjQueryプラグイン「30 Free jQuery Plugins for February 2014」を紹介したいと思います。 （Drop） そのまま利用しても、自分のデザインと組み合わせて使っても、クリエイティブなwebサイトを作り出せるプラグインがまとめられています。 詳しくは以下 scrollReveal.js スクロールするとバーの動きを楽しむことができるプラグイン。個性的なデザインのサイトに仕上げたい時におすすめ。 leas
ネイティブアプリのようなWebアプリを作るために
※image via 003 FREE WEB GRAPHICSデバイスの多様化に伴い、拡張性の高いWebアプリの重要性が見直されています。サイバーエージェントのデカグラフを構成するサービスも基本的にはWebベースで作られていますが、これはアプリの改善スピードを上げたり、各サービス間の回遊性を高めるという狙いもあるようです。 ただし、スマートフォンユーザーはネイティブアプリ先行でサービスに触れているため、これまでのWebアプリでは当たり前だったことが、今ではストレスに感じてしまうことも多いです。HTML5の登場やJavascriptのライブラリの充実などにより、最近ではリッチなWebアプリを作る環境が急速に整ってきてはいますが、それでもスマートフォン向けに満足度の高いWebアプリを提供するハードルは非常に高いと言えると思います。 そこで、「もっさり＆カクカク」な印象のあるWebアプリの操作
スマートフォン向けのHTML5製フレームワーク・Lungo.js
今更ですけどLungo.jsを少し触って 見ました。Lungo.jsはHTML5+CSS3の スマートフォン向けフレームワーク です。jQueryやmootoolsなどを必要 としない非依存型のライブラリです ので覚えておいて損は無いかも。 スマフォ向けフレームワークです。GPLv3ライセンスでOSSとして公開されています。 スマフォ向けのフレームワークは相当出回っていますので珍しくないかもですけど・・触った感じはなかなか使いやすそうでした。コアファイルは非圧縮で40kbほど。 以下、公式サイトのサンプルです。 Sample スターターキット的にも使えそうです。 ↑ 実機でのスクリーンショット この手のは沢山あるので好みで選べばいいですね。詳細は以下でどうぞ。 Lungo.js
JavaScriptでWebアプリを開発できる「Node.js」活用入門 | OSDN Magazine
昨今注目を集めているWebアプリケーションプラットフォームの1つに、「Node.js」 がある。Node.jsはJavaScriptでWebアプリケーションのサーバーサイドプログラムを実装できる技術で、高いスケーラビリティが特徴だ。本記事ではNode.jsの基本的な知識やフレームワーク「express」を用いたWebアプリケーション作成方法を紹介する。また、Webブラウザ上で動作するIDE「Cloud9 IDE」を用いてNode.jsアプリケーションをWindows Azureで実行させる方法についても解説する。 JavaScript、そして非同期・シングルスレッドで注目を浴びるNode.js Node.jsはJavaScriptでWebアプリケーションのサーバーサイドプログラムを実装できる技術で、開発プロジェクトのスタートは2009年と、比較的その歴史は浅い。しかし、ここ数年でプロジェク
「汎用のUI技術」として広がるHTML5
連載を始めるに当たって どうもこんにちは。白石俊平と申します。今回から定期的に、HTML5をはじめとしたWeb標準、そして業界の動向をまとめた記事を発信していきます。 ぼくは、Web開発者向けコミュニティであるhtml5j.orgを運営しており、そのメーリングリストにほぼ毎日、HTML5関連のアップデートを投稿しています（また、投稿内容がメーリングリスト内で埋もれてしまわないよう、同じ内容を自身のブログにもポストしています）。 こうして、日々HTML5関連のアップデートを追いかけている身として実感するのは、HTML5を中心としたオープンなWebプラットフォームが、現在すさまじい勢いで成長しているということです。HTML5関連技術や関連APIは非常に数が多く、毎日そのどれかがアップデートされているような状況です。ブラウザのアップデートも速く、どのブラウザがどの機能を実装しているのか、もはや記
iPhoneアプリのようなリッチなUIをブラウザで実現！Web 2.0 Touchが凄すぎる！ » SHINGOLOG
iPhoneアプリのようなリッチなUIをブラウザで実現！Web 2.0 Touchが凄すぎる！ 2011年8月25日 in iPhone, Web Web 2.0 Touchは、WebKitエンジン上で動作するJavaScriptライブラリです。 2011/8/22に公開されたばかりの模様。 iPhoneアプリのようなリッチなUIをブラウザでも簡単に作ることができます。 iPhone・iPad・Androidに対応しています。 どんな動きが出来るのか、これを見ると一目瞭然です。 アニメーション 上下左右のフリップ(画面が反転する動き)、ポップイン、ポップアウト、上下左右のスライドが出来ます。 テーブル表示 お馴染みのテーブル表示もこの通り。角丸タイプのテーブルも作れるようです。 ボタンやタブ表示、吹き出し タブ表示は便利な機能ですが、自分ではとても作れないところなので、需要ありそう
犯してはいけないHTMLタグの過ち10個
【追記】 HTML5ではインラインとブロックの要素分類がなくなり、代わりに、メタデータ、フロー、セクション、ヘッディング、フレージング、エンベッディッド、インタラクティブというコンテンツの種類が定義されています。 2. 画像に代替テキストのalt属性が入っていない <img src="sample.gif" /> alt属性は、Webページに表示されるすべての画像に必須の要素ですので、必ず使用する必要があります。 <img src="sample.gif" alt="サンプル" /> 必須の要素ですので、特にテキストで表示する必要がない場合でも、alt=""としておく必要があります。 【追記】 HTML5では「Images whose contents are not known(どのような内容かわからない画像)」に限り、alt属性を省略することができます。写真共有サイトにユーザーが画像を
すぐに実施できる、あなたのウェブページのスピードを改善する10のチップス
ウェブページのスピードを改善することは最適なユーザエクスペリエンスを提供するだけでなく、Googleの検索結果にも影響を与える大切な要因です。 すぐに実施できる、あなたのウェブページのスピードを改善する10のチップスを紹介します。 10 Tips for Decreasing Web Page Load Times [ad#ad-2] 下記は各ポイントを意訳したものです。 1. 現在のスピードをチェック 2. 画像の最適化 3. 画像は実寸で配置 4. コンテンツを圧縮して、最適化 5. スタイルシートは上に配置 6. スクリプトは下に配置 7. スクリプトとスタイルシートは外部ファイルで 8. HTTPリクエストは最小限に 9. キャッシュの利用 10. 301リダイレクトは避ける 参考資料とツール 1. 現在のスピードをチェック まず、現在のあなたのウェブページのスピードの分析からはじ
スマートフォンサイトの作成術 - 大川洋一
2011年4月2日に開催されたPHPカンファレンス関西で使用した「スマートフォンサイトの作成術」のスライドです。Read less
jQuery事始め・コピペに頼らず、基礎知識を理解して実際に動かしてみる
人気のJavaScriptライブラリ、jQueryもかなり 情報が増えました。僕の様に知識が無くても 簡単に動きのあるWebサイトや、更なるユー ザビリティの向上を可能にしてくれましたが、 いつまでもコピペではいずれ困る事になります。 その前にそろそろ基礎から学んでみませんか。 という訳で、jQuery事始め。さほど知識が無い僕が書くのも微妙なんですが、一緒に学んでいきましょう、という事でご了承下さい。内容は基礎中の基礎です。 いつまでもコピペに頼っていては、何か問題が起こったときに対応できませんし、そもそもコピペするならjQueryである必要はありません。 でもjQueryはすごく便利なので、ちゃんと使いこなしたいところですよね。この記事が、誰かが勉強し始める切欠になれば幸いです。 jQueryを使うには まず、jQueryを利用するには本体を読み込む必要があります。方法は2つあって、本
コピペで使える言語・コマンドリファレンス - ITproリファレンス：ITpro
HTMLやCSS、DynamicHTML、JavaScriptやPerl、Windowsコマンド、ネットワークコマンド、Linuxコマンドといった、Webサイト構築やアプリ開発に欠かせないプログラミング言語とコマンドのリファレンスマニュアルです。各項目のサンプルコードは、コピーし貼り付けてすぐに使えます。入門講座も用意しました。ぜひブックマークしてお役立てください。 HTML HTMLは、Webコンテンツを作成する上で、最も基礎となる記述言語です。各タグについての概要や属性などをサンプルを交えて説明します。 HTMLリファレンス（107項目） HTMLリファレンスの使い方 HTML入門 CSS CSSは、Webページのレイアウトなどといったコンテンツの見栄えを指定する記述言語です。各スタイルの概要や使い方を説明します。 CSSリファレンス（73項目） CSSリファレンスの使い方 CSSの基
プログラマが1ヶ月でWebデザイナーに転身する方法 - やねうらおブログ(移転しました)
サイトを構築していると、プログラマはWebデザイナーと共同作業をしなければならない。 しかし高度なRIAを実現しようとすると思っているようにWebデザイナーに素材を作成してもらうだけでもとても骨の折れる作業だ。 そこで、一層、「すべてのプログラマはWebデザイナーになればいいんじゃね？」と思った。 今回は、私の実体験に基づき、「プログラマが1ヶ月でWebデザイナーに転身する方法」というのを考えてみた。 ■ HTML,CSSを覚えよう まず、HTMLとCSS。いくら私でもW3C( http://www.w3.org/ )のすべてに目を通せとは言わない。 ブラウザ間で挙動が違うのでそれぞれのタグがどのブラウザで使えるのか一覧がまず欲しい。手軽なのは詳解HTML & CSS & JavaScript辞典。このハンドブックは見やすいのでお勧め。また、よく使うタグに関してはすべて覚えよう。覚えている
JavaScriptist - javascript/ajax/サンプル/入門/リファレンス/ライブラリ
サイト更新情報 2006/12/06 よく使われているページを検索窓から簡単に辿れるようにしました。(検索窓に「prototype」と入力) 2006/11/27 JavaScript入門/応用サイトJavaScriptistオープン！ 2006/11/23 試して確認できるJavaScriptオンラインエディタを公開 2006/11/20 JavaScriptリファレンス、逆引きサンプル集を公開 2006/11/19 JavaScriptライブラリ活用ページ公開 2006/11/15 JavaScriptistベース機能の構築完了 過去のサイト更新情報
イヌでもわかるJavaScript講座
このJavaScript講座はプログラミング知識がない人もサンプルをただ埋め込めば使えるように作られています。ステップの段階で少しずつJavaScriptを説明していきますので、各ステップの内容がすべて把握できなくても、あとでわかってくると思います。えっ？と思う個所があっても、それはそのステップの趣旨ではないところですので、その個所はどこかのステップで説明します。深く考え込まずに、各ステップを適当にすすめていってください。 なお、本講座のサンプルを使ってＨＴＭＬファイルがぶっ壊れたり、マシンから煙や火が出ても一切責任を負いません。バックアップはこまめにしましょう。(^^; また、サンプルを無断で使用することを禁じるわけがありません。勝手に許可無く使ってください。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML5特集 の記事一覧 | DevelopersIO
http://www.designwalker.com/2009/08/wp-jquery.html
http://www.adamrocker.com/ra/read_after_bookmarklet.html