HTML5 Conference 2013 in Gifuのデザイントラックで行なわれたセッションスライド。 アプリデザインについての講演。Read less
HTML5 Conference 2013 in Gifuのデザイントラックで行なわれたセッションスライド。 アプリデザインについての講演。Read less
商用利用も無料、変更もコピーも再配布もOK、汎用性に優れたレイアウトやUIエレメントをスタンダードなHTML5/CSS3で実装したフレームワークを紹介します。 ウェブサイトを構築する際に、ベースとして利用するのによさそうです。 Markup Framework Markup Frameworkの特徴 Markup Frameworkのサポートブラウザ Markup Frameworkのデモ Markup Frameworkの特徴 レスポンシブ対応、モバイルファーストのレイアウト。 再利用可能なUIエレメントのライブラリ。 最新のスタンダードなHTML5/CSS3を使用。 ピュアなHTMLとCSSで、Hackなし、JavaScriptなしです。 ミニマルなマークアップ。 ページの容量は小さめ。 サーチエンジンにフレンドリー。 アクセシブル。 セマンティックスとスタイルの明確な分離。 モジュー
[43] style要素で CSS を HTML文書内に書こう 最終更新日:2019年07月05日 (初回投稿日:2012年07月27日) 今回は <style>要素 を使ってみましょう。これもメタデータ・コンテンツです。 <link>要素は、外部CSSファイルを HTML内に読み込む時に使い、 <style>要素は、CSSを直接 HTMLに書く時に使います。 ずいぶん前に [6] 段落に<p>要素を使おう(ついでにCSSで整えてみよう)でも <head>内に <style>要素でCSSを書く方法を紹介していますが、今回はもう少し詳しく見ていきましょう。 使用する要素 本日のINDEX <style>要素のルール <style>要素の属性 type属性 media属性 title属性 ピンポイントでCSSを使いたい時に <style>要素を <body>要素の中に書く(5.2仕様) ● 2
CSS 3D Transform 対応ブラウザ (Chrome, Safari, Firefox) のみ Webkit 系 (Chrome, Safari) 推奨 Fullscreen: http://jsrun.it/akm2/b81C // forked from Event's "Web Creator's Contest Q the 2nd【vol.2】エントリー用コード" http://jsdo.it/Event/zojr (function(window, requestAnimationFrame, cancelAnimationFrame) { // Run $(initialize); //--------------------------- // CONSTANTS //--------------------------- var TOP_ID = 'qtop';
HTMLファイ部のほんだです。シュッ 「ページ遷移」、聞くだけでゾクゾクしませんか? 僕は大好きです。 Web Creator's Contest Q(HTML、CSS、JavaScript エンジニアのためのコンテストサイト)では、 ページ遷移・画面遷移をテーマにしたコンテストを開催中です。 とても好評で、5回目となった当コンテスト。 今回のテーマも、力の入ったコードがたくさん投稿されています! 魅力的な画面遷移エフェクトのコード集! Cubic Transition ※「▶Play」ボタンをクリック!
最近の「HTMLとかCSSとかAPIとか」、CSSがより便利に使える「実践Sass」~HTML5 Conference 2012 セッションレポート 9月8日、慶応義塾大学日吉キャンパス協生館にてHTML5 Conference 2012が開催されました。4トラック20セッションの講演が行われたのですが、本稿では次のセッションを中心に本イベントをレポートします。 「HTMLとかCSSとかAPIとか -2012秋編-」 「実践Sass -10を超えるプロジェクト運用で得たノウハウ-」 注 公式レポートは@ITにて順次掲載されていますのでそちらをご覧ください。イベントの公式サイトでは、本イベントに関する記事を収集しているので、こちらを確認してみると良いでしょう。また、各登壇者の発表資料もイベントの公式サイトに掲載されています。 基調講演 昨年開催されたChrome+HTML5 Conferen
弊社で作成したサンプルページをもとに、スマートフォンサイトをデザインする上での前提知識からHTML5/CSS3による実装方法、JavaScriptライブラリを利用したUIの実装まで、スマートフォンサイト制作に求められる一通りの知識を学んでいただける講座です。 概要対象となる方
JavaScriptで ごく普通にhttp通信をする 〜esp8266+espruinoでhttp getリクエストをするテスト〜Masakazu Muraoka
グリーがグローバル展開を加速している。米国や中国など世界5カ所に開発拠点を置き、グローバルプラットフォームの構築を進めているが、スマートフォン向けアプリ開発や世界展開には、さまざまな技術的課題や苦労があるという。8月28日、同社CTOの藤本真樹執行役員が開発の現状や苦労についてメディアに対し率直に語った。 HTML5かネイティブアプリか 「業界中悩んでいる」 ソーシャルアプリ開発は、ネイティブアプリとして開発する方法と、HTML5を使い、Webブラウザから利用できるようにする手法がある。HTML5でか、ネイティブ2Dアプリか、ネイティブ3Dアプリか……「業界中悩んでいる」と、藤本CTOは打ち明ける。グリーでは「どれかに絞り切れないので、全部押さえに行こうとしている」のが現状だ。 ネイティブアプリは表現力が豊かでレスポンスも速く、iOSならばApp Store、AndroidならGoogle
「HTML5タグの誤用で恥をかいた」「分厚い仕様書は読み切れない」コーダー&デザイナーのためのコーディングガイド。最終草案に対応したほか、商用サイトを意識したコーディング例を新たに書き下ろし。HTML5マークアップへ移行するために必要な知識を効率よく学べる1冊です。ネットで話題の「HTML5カルタ」付き! HTML5マークアップ 現場で使える最短攻略ガイド 定価:2,808円 (本体2,600円)/形態:B5変 (240ページ) ISBN:978-4-04-866070-9 HTML5では、新たに加わった要素だけでなく、従来とは意味や使い方が変わった要素もあります。HTML4.01やXHTML1.0から仕様が大きく変更された要素もありますので、しっかり確認しておきましょう。 各要素の解説では、冒頭に「カテゴリー」と「コンテンツモデル」という項目が登場します。カテゴリーとコンテンツモデルにつ
Developers love professionally designed HTML5 and CSS3 templates because these not only save their precious time and help them achieve their goal in a stress/hassle free way, but can help amateur developers learn coding in HTML5 and CSS3. New developments are being made in the field of web development very quickly, so it is very important for developers to stay updated with the fresh trends. Webs
AS3.0で「合成」のアニメーションを作って下さい HTML5, JavaScript, CSS3を使って、カード選択から合成アニメーションまでのUIを考えてください AS3.0で「合成」のアニメーションを作って下さい サンプルはソーシャルアプリで使われる合成演出のAS3.0テンプレートになります。このテンプレートをアレンジして新しい合成演出を作って下さい。素材はどのように使ってもらってもOKです、自分で演出を付け足してもらっても構いません。今までにない斬新な演出をお待ちしています。 【素材をダウンロード(zip)】 HTML5, JavaScript, CSS3を使って、カード選択から合成アニメーションまでのUIを考えてください サンプルは一般的なソーシャルアプリで使われている合成機能のUIです。ベースとなるカードと素材を選択し、合成を行います。これをHTML5, JavaScript,
HTML5 and CSS3 expanded the possibilities of web design. As a developer, HTML5 and CSS3 are now requirements. It allows compliance to be more efficient thanks to its consensus-based standards, among other things. Whether you’re new to HTML5 or quite an advanced coder, here are some HTML5 tutorials that you may find useful for your webpage. Fullscreen Slideshow with HTML5 Audio and jQuery Build a
Another HTML-lint 5は、無償でご利用できるHTMLの構文チェックツールです。 現在、以下サイトでWebサービスとして無償で公開されています。 ▲Another HTML Lint 5公開ページ Another HTML-lint 5とは・・・ 石野恵一郎氏が作成したAnother HTML-lintをベースに、株式会社ジゾンがHTML5に対応させたものです。基本的なロジックやHTML5以外のチェック機能は従来のAnother HTML-lintを利用しており、将来にわたって無償で公開を続けられる、との事です。 HTML構文をチェックできる便利なツール「Another HTML-lint」の開発者石野恵一郎さんが、新たにHTML5に対応した構文チェックツール Another HTML Lint 5 を開発されました。 本文訂正 箇所について ジゾン、HTML1~5の文法チェ
先日リリースされた「HTML5杯」は、なんとも不思議なウェブコンテンツです。「100m連打」と銘打たれたゲームをはじめ9つのミニゲームを楽しめます。 タイトルを見ればHTML5を活用していることが分かります。ドット絵が動き回るのも、見ていて郷愁を誘います。ただ、ひとつの想いがふつふつと胸に湧き上がります。 なんなんだ、これは。 分からないことは抱え込まずに人に聞きなさいという言葉もあります。そこで、先人の教えを守り、直接聞いてみることにしました。問い合わせたのは、開発を手掛けたカヤック。質問に対しすぐさま返ってきた答えは熱く、熱く、熱い開発者の想いでした。 以下、それぞれのゲームに対するコメントです。 ■キーボードを連打してライバルと競う「100m連打」には、漢(おとこ)のロマンがあるらしい 終わった後に息切れしてしまう。そんな競技となることを目指して、ライバル走者のレベル調整を何度も繰り
みなさんは、フルスクラッチでテトリスを作ることができますか? プログラマーといってもゲームを作る機会が少ないと、なかなかすぐには作れないと思います。 JavaScriptでなんとか作れそうな感じもしますが、すんなり実装はできない感じがします。 特にグラフィックやアニメーションをうまく使ったものを作るには、それなりの経験値が必要だと思います。 そこで、今回ご紹介するのが、教育目的で作られたHTML5製テトリスのプログラミング学習ムービーです。 HTML5 tetris - making of HTML5 tetris - making of 驚くべきことに、 たったの45分でテトリスが完成! それもフルスクラッチで、jQueryなどのライブラリーを一切使っていません。 Youtubeのムービーは早送りしていますが、動きを確認しながら実装しているのが分かります。 実際に、こちらでテトリスをプレ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く