http://buchineko.website/google_styleguide_html/
HTML5 CanvasとWebGLの使い分け―CreateJS勉強会/池田発表資料 (前編) ― ICS LAB
2015年2月10日（火）、アドビシステムズ株式会社でCreateJS勉強会 (第5回)が開催され30名を超える方々が来場されました。勉強会のフォローアップとして、発表資料「CreateJSで制作するスペシャルコンテンツ」のスライドをブログ記事という形で公開します。本記事では口頭で発表した内容もできる限り記載しました。 なお、前編（CanvasとWebGLの比較）と後編(WebGLの最適化)の二部構成にしています。前編となる本記事ではスペシャルコンテンツ制作にあたり調査したHTML CanvasとWebGLの双方の利点・欠点をまとめています。 HTML CanvasとWebGL 今回のテーマは「HTML CanvasとWebGLの使い分け」です。皆さんもご存知の通り、HTML5のCanvas要素 (JavaScript ではCanvasRenderingContext2Dオブジェクト）は従
目指すのはぶっちぎりの速さ! なぜ HTML5 版CacooはSVGを採用するのか | 株式会社ヌーラボ(Nulab inc.)
こんにちは！ Cacoo チームの中原です。現在CacooチームはFlashで作られている図の編集画面(以下エディタと表現します)を* HTML5 で置き換える開発を進めています。このブログでは、 HTML5 版 Cacoo で図形の描画に使用される、SVGを選択した理由と経緯について説明したいと思います。 （*置き換える理由については「Good-Bye Flash ~ CacooはHTML5で生まれ変わります」をご覧ください） どの技術を使って図形を描く?重視したのは「パフォーマンス」 図形の描画にどんな技術を使うか。いくつか候補を上げました。 2D Canvas 3D Canvas (WebGL) SVG (これ以外に、Unityという意見もありましたが今回はWeb標準技術を使うことを前提にしました。) さて、どれを使おう。私たちがどの技術を選択するのか、基準を決める必要があります。そ
2017年大本命！HTML/CSSで表現できる、参考にしたいカード型レイアウト60個まとめ - PhotoshopVIP
Google が2014年に発表したマテリアルデザインは、ウェブだけでなくグラフィックデザインでもますます人気となっており、さまざまな方法で採用しているケースをよく見かけるようになりました。 今回は HTML と CSS、わずかな JavaScript で実装できる、今後の参考にしたいカード型レイアウト用コードスニペットをまとめてご紹介します。コードニペットは各レイアウト別にカテゴリ分けしているので、ウェブサイト制作に活用したものを見つけてはいかがでしょう。 【2017年版】HTML/CSSで表現できる、すごいテキストエフェクト66選 イメージスライダーを魅力的に！コピペ実装できるHTMLスニペット24個まとめ ウェブをもっと面白く！コピペ可能なHTML/CSSスニペット45個まとめ 2016年12月度 コンテンツ目次 1. ブログコンテンツ用レイアウト 2. 名刺型レイアウト 3. グリ
『フロントチューニンガソン 最速を目指すには』
11:10～ 課題ページの確認＆PageSpeed Insightsの実行目的：チューニング対象のウェブサイトの改善の余地を調査 上記のgruntプラグインをインストールする npm install コマンドを実行しながら、ブラウザやIDEでチューニング対象のウェブサイトを確認し始めました。 少し見ただけでもCSSの構文エラーがあったり、使っていないJavaScriptライブラリがインポートされていたり…。 まるで無茶な運用を数ヶ月続けたかのような、カオスなファイル群でした。 ここで実行した PageSpeed Insights に画像サイズの最適化をオススメされたので、まずはそこから行うことにしました。 11:20～ 画像ファイルの最適化目的：画像ファイルサイズの削減 30 x 30pxで表示している画像ファイルが実際には150 x 150pxで保存されていたりする画像がそこそこあったの
逆引き！フロントエンドのイマドキパフォーマンス改善 - 青空コメントアウト
WebアプリにしろWebサイトにしろパフォーマンスはとても重要です。どんなに高機能であっても、どんなにデザインが良くても、パフォーマンスが悪ければユーザーは離れてしまいます。 とは言え現場はキツキツのスケジュールで、パフォーマンスにまでこだわる余裕がないよ！パフォーマンスはひとまずできる限りのところまで頑張るよ！となってしまうこともあるかと…。 この問題の解決の糸口はパフォーマンスを良くする手段をどれだけ知っているかです。仕様を決めるとき、デザインを決めるとき、実装するとき、それぞれのフェーズでパフォーマンスを常に意識していると自ずとハイパフォーマンスに近づきます。 というわけで今回はフロントエンドの観点から、イマドキのパフォーマンス改善手法をまとめてみました。イマドキと謳っておきながら2年前くらいの技術が出てきたりして最新の話題でもないのですが。 ちなみに、本題に入る前にWebパフォーマ
こんなHTMLとCSSのコーディング規約で書きたい - Qiita
HTML と CSS のコーディングルールを作ろう HTML と CSS のコーディング規約を中心に、メンテナンス性の良い HTML や CSS をコーディングする際に重要だと思うポイントをまとめています。 誰に向けた記事か この記事には、HTML や CSS を書く人に役立ちそうな内容が書いてあります。 特に初級者から中級者の方で、HTML や CSS を一通り学習した方からの反応が良いです。 まだ HTML や CSS の学習を始めて間もないという方は、先に案件やプロジェクトをこなしコーディング経験を積むことをお勧めします。経験を積むとよりこの記事の内容への理解が深まるはずです。 HTML と CSS を書くときに大切なポイント2点 HTML と CSS を書くときに大切だと思うことを書きます。 1. HTML と CSS を書かない あなたがいま書いている HTML と CSS は、
2016年に見直したHTML5・CSS3コーディング手法6選 - ICS MEDIA
HTML・CSSコーディングを取り巻く状況は、数年前と大きく変わっています。最近では、2016年11月にHTML 5.1が勧告されたり、2015年8月頃にChromeのブラウザーシェアがInternet Explorerを抜いたりといったニュースがありました。また、2017年4月にはWindows Vistaのサポートも終了するため、今後対応すべきはWindows 7のIE 11以降となります（※）。当たり前だと思っていたコーディング技術を今一度見直す時期にきているのではないでしょうか。本記事では2016年に見直した、今の時代に即したコーディング技術を紹介します。 ※ 参考記事「Internet Explorerサポートポリシー変更の重要なお知らせ - Microsoft」 1. meta keywords設定は検索順位に関係がない ウェブコンテンツのキーワードを指定するmeta keyw
JavaScript Tutorial
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
ituore.com - ituore リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
HTMLタグで本格VRコンテンツが作れる！ Mozillaが開発した3DライブラリA-Frame - ICS MEDIA
HTMLタグで本格VRコンテンツが作れる！ Mozillaが開発した3DライブラリA-Frame WebXRフレームワークの「A-Frame」を使えば、JavaScriptを記述することなく、HTMLにタグを追加するだけでVRコンテンツが作成できます。 次のデモはA-Frameを用いてt作成したオリジナルのVRデモです。中央の円状のカーソルを牛の3Dモデルに重ねることでアニメーションします。 ※パソコンではドラッグ、スマートフォンではジャイロセンサーが検知した傾きで視点が変わります。右下のアイコンをクリックすると、HMDで閲覧できるモードへ切り替わります。 デモを別ウィンドウで開く HTMLをマークアップするようにVRコンテンツを作成しよう VRコンテンツをHTMLのマークアップのように作成するには、JavaScriptライブラリ「A-Frameエー・フレーム」を使用します。「やっぱりJa
DEFGHI1977のWEB技術まとめ・ツール等
written by DEFGHI1977 [重要] auonenetホームページ公開代理サービス終了に伴い、公開済みの各種ドキュメントをxdomainサーバーに移行しました. 旧アドレスへのアクセスは本ページにリダイレクトされます. お手数ですがブックマークやリンクなどのURL参照先の更新・変更をお願いいたします. You were redirected from old "dion(auonenet)" page which had been out of service. Please update URL settings of your bookmarks, links or more. Thank you. 突貫工事で作ったため, 抜けがあるかもしれません. ゲームツール等(game tools) 悪魔城ドラキュラHoD(Castlevania HoD)・アイテム早見表(Cas
これなら分かる！WEB制作を無料で「学べる」サイトまとめ
作成：2013/02/4 更新：2014/11/01 Web制作 > 基本的なところを簡単に、楽しく覚えたい 自分でサービス作ったり、会社や違う職種でも 色々と「基本」はおさえておきたい 今回はサイト制作に必要な「基本的な知識・情報」を、分かりやすいサイトを中心にまとめました。必ずおさえておきたいスキル・知識です。 エンジニア速報は Twitter の@commteで配信しています。 もくじ １．HTML5 ２．CSS ３．レスポンシブ ４．配色 ５．視線誘導 / 心理学 ６．インターフェース / ユーザビリティ ７．SEO ８．ディレクション ９．アクセス解析 １０．WEBマーケティング １１．コピーライティング １２．ソーシャル １．HTML5 HTML5って何？ HTML5とは何かを簡単にまとめてみた - Yahoo! JAPAN Tech Blog Canvasについて知っておく
Webサイト高速化・表示速度改善のために知っておきたい基礎知識 | ナイルのマーケティング相談室
Webサイトを高速化をすることによって得られるメリットは様々です。ユーザーエクスペリエンスの改善といった話とは別に、サーバーの台数を減らせることも大きなメリットでしょう。 サーバーの台数が減ればコストも下がるし、運用も楽になりますので、Webサイトの高速化はSEO対策に限定せずに実現したいところです。 しかし、「高速化しよう」「表示速度を改善しよう」といっても、実際に高速化を阻害するような要因を知っていなければ、どう取り組んで良いか分かるはずもありません。 今回の記事では非エンジニアの方でもサイト高速化のポイントがある程度理解できるように、大まかに要点をまとめています。 ＼ナイルがリードを増やした秘密を公開／ 高速化のための基礎知識 高速化という言葉の中には、大きく分けて２種類の概念が存在します。 フロントエンド側での高速化 サーバーサイド（バックエンド）側での高速化 フロントエンドとは
HTML5入門！超速でHTML5をものにするノウハウ
Enable JavaScript in your browser. このウェブサイトはJavaScriptをオンにしてご覧下さい。 HTML5とは、WHATWGおよびW3Cが、HTML4に代わる次世代のWEB環境として、策定を進めている仕様です。 HTML5を簡単に説明すると、今まで複雑だった処理を簡単にし、HTMLデータの意味をより具体的に表現できるようになります。 現状ではHTML5非対応のブラウザもありますが、少しずつ非対応ブラウザもバージョンアップによって対応されていっているようです。 ここでは皆さんがHTML5を超速で学ぶのに、もっとも効率的なノウハウサイトや便利ツールを紹介しています。 ※HTMLの基礎はこちらから学べます→HTMLを学ぼう！ HTML5入門サイトHTML5, きちんと。 ５分～10分ぐらいでHTML５というものが何なのかを理解できるようになります。 HTML
IDとclassを使わないで、HTML5とCSS3でコーディングしてみた。
IDとclassを使わないで、HTML5とCSS3でコーディングしてみた。 2011-05-02 Webサイトをコーディングする時に、IDとclassを考えるのが面倒臭くなったので、IDとclassを使わないでコーディングしてみました。 シンプルなサイトなら簡単でつまらないので、IDとclassを使っても難しそうなデザインにしています。 今回もJavaScriptは一切、使用していません。 完成したサイト ID, classなしで組んだサイトを見る。 サイトでやってみたHTML5 HTML5では、html, head, bodyタグを完全に省略しても構わないとされています。 省略してもDOMツリー上に存在しているので、 body {background:#f00;} というCSSの記述も認識してくれました。 サイトで使用したCSS, CSS3の簡単なまとめ Child Selector 結
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
アメブロ2016 アメブロフロント刷新にみる ひかりとつらみ
デザイナーこそ覚えておきたいCSS最新事情！ あなたの知らないfont-familyのイマ
ウェブパフォーマンスの基礎とこれから
Unity vs HTML5 -アドベンチャーゲームエンジンの開発手法 及び、２つの環境のメリットとデメリット-