HTML5のアニメーションを簡単に作成できるサイト「HTML5 MAKER」 | ライフハッカー・ジャパン
「HTML5 MAKER」はHTML5のアニメーションを簡単に作成できるサイトです。HTML5でアニメーションを作るのが簡単に行えますよ。ドラッグ＆ドロップで画像やテキストを追加し、アニメーションをつけることができます。PowerPointと似たような動作でHTML5のアニメーションが完成します。 以下に使ってみた様子を載せておきます。まずHTML5 MAKERへアクセスしましょう。登録不要で作成できるので、早速「CREATE ANIMATION」からアニメーションを作ってみましょう。 このように、画像やテキストを追加していきます。下部にアニメーションの設定がありますよ。開始時のアニメーションや終了時のアニメーションが設定できます。左側にスライド一覧があります。一つ前のスライドを複製できるので、連続したアニメーションを使うときに便利ですね。完成したら、「Save」するとHTML5形式でまる
第40回 HTML5とか勉強会 HTML5マークアップ ビギナーの良くある質問にズバリ答えます
This document discusses HTML5 elements like <article>, <section>, <header>, <footer>, and <div> tags for structuring web pages. It recommends using semantic HTML5 elements to build a modern website layout with sections for wrappers, headers, main content areas, and footers. The document also mentions supporting HTML5 in different browsers like Internet Explorer, Firefox, Chrome, and Safari.Read le
HTML5 CARNIVAL FUKUOKAに参加してきた。【スライド・Ustreamまとめあり】
Tweet※この記事は2月9日に開催されたHTML5 CARNIVAL FUKUOKAのレポート記事です。 スライドやUstreamのまとめだけ見たいという方はこちらからどうぞ！ → クリック！ 福岡の大規模HTML5イベント開催！ 先月カルタ大会を手伝っていただいた@akase244さんが、なにやら福岡のでっかいHTML5イベントの運営に携わっていると教えてもらっていて楽しみにしていたHTML5 CARNIVALが九州産業大学にて開催されたので参加してきました。 HTML5 CARNIVAL FUKUOKA 2013年2月9日＠九州産業大学 直前にチケットをプリントアウトするためにZusaarのイベントページを覗いたのですが、 参加人数500人近くなってる。。。すごっ！ でっかいイベントとは聞いていたのですが、これだけの規模になるとは開発者、デザイナーのみなさんのHTML5に対する関心の
「Flashじゃなくて HTML5で ビュンビュン動くサイトを 作ってと言われたら」資料公開しました
2013-02-09 「HTML5 Carnival Fukuoka（HTML5カーニバル福岡）」 お時間を頂いて「Flashじゃなくて HTML5で ビュンビュン動くサイトを 作ってと言われたら」というお題でお話しさせていただきました。 使用したスライドをSlideshareで公開しました。 http://www.slideshare.net/taikiken/flash-html5-16435861 話した内容は、このブログの書きかけの投稿が元になっています。 1年ほど前から、何度も書いては書き直しを続けていたものです。 なかなか話がまとまらず、このままお蔵入りかと思ったのですが、おかげさまでこうやって公開することができ嬉しく思っています。 JavaScript でスペシャルサイト制作をすることが増え、その時に感じたことをまとめたつもりです。 HTML5とFlashの関係性について自分
【パンクズ超重要】Googleに認識されるパンクズとされないパンクズ
久々にコーディングの仕事を本格的にしているのですが、パンクズの重要性が気になる今日このごろ。 Googleの検索エンジンのロボットにパンクズとして認識されるパンクズと、そうでないパンクズがあることを割とさっき知りました。 Googleのロボットに認識されないパンクズ <ul> <li><a href="/">ITかあさん</a></li> <li><a href="/archives/category/html5マークアップ術">HTML5マークアップ術</a></li> <li>HTML5×CSS3ベースのPC版スマートフォン版共通テンプレート </li> </ul> Googleのロボットに認識されるパンクズ パンくずリスト – ウェブマスター ツール ヘルプ <a href="http://www.example.com/dresses">洋服</a> › <a href="http
HTML5--押さえておくべき10のタグ
HTML5では、ウェブ開発時に強力なパワーや効率性、柔軟性を発揮するタグと属性が新たに追加されている。本記事では、そういったタグを10個選んで紹介する。 HTML5では、他のシステム（特に検索エンジン！）がドキュメントをより容易に解析できるようにしたり、今までにないデータ表示を可能にしたり、複雑なJavaScript、あるいは「Adobe Flash」や「Microsoft Silverlight」といったブラウザのプラグインを必要としていた機能に取って代わるような数々の新たな要素や属性が追加されている。以下では、HTML5を用いてあなたのウェブサイトを構築する際に役立つ10個の新たなタグを紹介する。 ＃1：<video>タグと<audio>タグ FlashやSilverlightといったテクノロジを用いる最大の理由は、マルチメディアコンテンツの再生にあると言ってもよいだろう。HTML5で
もうこれで迷わないHTML5新要素の使い方 (1/3)
「HTML5タグの誤用で恥をかいた」「分厚い仕様書は読み切れない」コーダー＆デザイナーのためのコーディングガイド。最終草案に対応したほか、商用サイトを意識したコーディング例を新たに書き下ろし。HTML5マークアップへ移行するために必要な知識を効率よく学べる1冊です。ネットで話題の「HTML5カルタ」付き! HTML5マークアップ 現場で使える最短攻略ガイド 定価：2,808円 （本体2,600円）／形態：B5変 (240ページ) ISBN：978-4-04-866070-9 HTML5では、セクションに関連する要素以外にも、新しい要素が追加されたり、意味が変更されたりしています。今回から数回にわたって、HTML5で新たに登場する要素や、変更された要素について解説します。第6回は、一般的なWeb制作で使用頻度の高い要素と、ルビ関連の要素を取り上げます。 各要素の解説では、冒頭に「カテゴリー」
MdN Design｜総合情報サイト
Webデザイン 1-01 HTML5が与えるインパクト（前編） HTML5の存在感がいよいよ増してきた。HTML5はWebブラウザを表示する言語という枠を超えて、Webアプリケーションという広大な環境への最適なプラットフォームとして急速に認知され、デジタルコンテンツを表現するツールとして無視できない存在へと大きく前進している。 制作・文／芳賀淳志（Suika Cube Inc.） HTML5が高評価である理由 HTML5が多くの制作者や開発者に受け入れられた大きな理由は、オープンWebテクノロジーというWebブラウザに限定しない開発環境を提供するプラットフォームとして、現在のところ最も柔軟性が高く拡張性があり、なおかつ制作が容易という点にあるだろう。 特に既存のWebテクノロジーが高度で複雑化していくなか、Webデザイナーでもある程度の知識があれば大概の機能を盛り込める制作の容易さは、現場
フルスクリーンでぼかしがカッコいいHTML5ギャラリーを作るサンプル:phpspot開発日誌
Fullscreen Image Blur Effect with HTML5 | Codrops フルスクリーンでぼかしがカッコいいHTML5ギャラリーを作るサンプルが公開されています。 画像切替の際のぼかしアニメーションがなかなかいい感じです。サンプルをダウンロードできるので写真を置き換えればそれっぽく利用することができそうです FlashかHTML5なんていう話にもなったりしますが、画面のデザインがある程度CSSででき、画像の指定もHTMLでかけちゃうっていうのはデベロッパー側としては嬉しい場面も多そうですね 関連エントリ HTML5で綺麗でインタラクティブなグラフが描けるライブラリ「Flotr2」 HTML5のブラウザ対応状況がサクッと分かる「HTML5 Please」 HTML5ゲームに使えるローディング表示機能付きプレロード用JSライブラリ「PxLoader」 Flash使って
50代でも分かったHTML5の基礎知識
おとそ気分で社内を暇そうにウロウロしていたら「HTML5の常識、わかっていますよね」と怖い怖い一回り年下の編集長から叱られてしまいました。この後、HTML5関係の仕事がくることは間違いがありません。 しかし、ワタクシは50代。困ったことに、この編集長の「わかる」とワタクシの「わかる」とは程度が違います。これは困りました。正月早々、首筋がすーっと寒くなってしまったので、優しいけど仕事に関しては編集長よりも厳しい二回り年下のデスクに相談。 「HTML 4と比較しながらHTML5の違いをまとめて記事にするところから、始めてみてはどうですか」と先手必勝のようなお題を与えてくれました。どこまでこのお題をこなせるのか。65歳定年になれば、あたりまえの日本企業の縮図のなかで、50歳を過ぎての「HTML5の基礎知識」をまとめてみました。 DOCTYPE宣言が超簡単に DOCTYPE宣言が超簡単になったのは
jsdo.it
Come creare il miglior gioco da casinò Quando si progetta un gioco da casinò, la prima cosa che devi considerare è che tipo di gioco sarà. Ci sono molti diversi tipi di giochi da casinò, dalle slot e video poker ai giochi da tavolo e giochi di carte. Dovrai decidere quale tipo di gioco si adatta meglio alle tue esigenze. Ogni tipo di gioco ha il proprio set di regole e regolamenti, quindi dovrai a
HTML5に踏み出せない人に捧げる、HTML5を使う10の理由
HTML5、使ってますか？ このサイトも未なのですが、これからHTML5を使い始めるぞっとなる10の理由を紹介します。 Top 10 Reasons to Use HTML5 Right Now [ad#ad-2] 下記は各ポイントを意訳したものです。 10. アクセシビリティ 9. ビデオとオーディオのサポート 8. Doctype 7. よりクリアなコード 6. ストレージ 5. インタラクション 4. ゲームの開発 3. 古いブラウザのサポート 2. スマートフォンへの対応 1. これからはHTML5 10. アクセシビリティ HTML5は「セマンティック」「ARIA」の2つの理由でサイトをアクセシブルにします。header, footer, nav, section, adiseなどのような要素はスクリーンリーダーにもコンテンツに容易にアクセス可能なようにします。また要素にrole
【Google Developer Day 2011 Japanレポート】 HTML5で今までにないサイトを作る
HTML5による最新Webアプリ 2011年11月1日、パシフィコ横浜で「Google Developer Day 2011 Japan」が開催されました。Google Developer DayはGoogleの開催する開発者向けカンファレンスで、Googleの展開するサービスの説明や最新技術のセッションがあります。今年は世界8カ国で開催され、日本では2007年から5年連続で開催されています。 Android、Chrome & HTML5、Cloud、Tech Talks/Generalといったテーマのセッションが行われ、デベロッパーサンドボックスと呼ばれるブースではさまざまなコミュニティや企業が展示を行っていました。 本稿では主にHTML5に関する内容をご紹介します。HTML5関連のセッションでは立ち見が出るほど盛況でした。 セッションではいくつかのサンプルが紹介されました。サンプルの動
HTML5 は SEO に有効なの？
「HTML5 でコーディングしたら SEO （検索エンジン最適化） 的に有利になりますか？」 っていう質問、たまに聞かれるんですけが、それに対する答えとして私がまとめて書こうと思っていた内容をすべて言ってくれてしまっている記事が Impressive Webs で投稿されましたので、便乗して簡単に訳しつつ紹介してみようと思います。 「HTML5 でコーディングしたら SEO （検索エンジン最適化） 的に有利になりますか？」 っていう質問、たまに聞かれるんですけどね。 個人的には "SEO のために" HTML5 にするか XHTML にするかなんて悩んでる暇があったら利用者に役に立つコンテンツの 1つでも考えた方がいいよと思うわけですし、聞かれたときはそのように答えているわけですが、折角なので簡単に考えをまとめて Blog に書いておいてみようかなと思ってダラダラと書き始めていたら、自分が
ゼロからはじめるHTML5でのサイト制作／第9回 XHTML1.0とHTML5のコーディングの違いを確認してみよう - MdN Design Interactive
これまでの連載では、HTML5での新要素の説明やHTMLから使用方法が変更になった要素、ブロックレベル要素とインライン要素の変わりとなった「コンテンツ・モデル」や「アウトライン」などについてまとめてきましたが、ここからは今まで解説したことのまとめとして、簡単なレイアウトをxhtmlとHTML5でのマークアップを比較しながら実際に作成してみたいと思います。 解説：（有）ムーニーワークス 林 豊／田崎一成 ●HTML5の基本の書き方 XHTML1.0とHTML5の基本のHTMLの違いを再確認してみましょう。HTML5といっても基本の書き方が大きく変わるわけではありません。極端なことを言えば、DOCTYPE宣言だけをHTML5の書き方にし、コンテンツのコードを既存のままにしてもHTML5になります。今回は新要素などを適切に使用して「コンテンツ・モデル」や「アウトライン」を意識してマークアップして
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
small 画面でも、 BIG 画面でも、 今すぐ使えるレスポンシブ活用術
Loading...
Loading...
Loading...
フリーのオープンソースなHTML5動画プレイヤーいろいろ:phpspot開発日誌