「Adobe Edge」で HTML5 + CSS3アニメーションをオーサリングする - スタジオ・アルカナ技術ブログ
はいどうも～。 今月から「プロフェッショナル」というよくわからない職種を与えられたエンジニアの吉田です。 2011年7月31日に「Adobe Edge」のプレビューが公開されました！ 「Adobe Edge」とは、一言で説明すると、Webサイトのモーションや インタラクションをGUIでオーサリングできるツールです。 ここ最近は、HTML5、CSS3、JavaScriptなどのWeb標準技術を使って インタラクティブな動きを表現するサイトを見かけるようになりました。 しかし、HTML5やらCSS3やらJavaScriptやらでアニメーションを作るとなると まだまだプログラマがコードを書かなければならない状況ではないでしょうか。 しかし、Adobe Edgeを使えばそんなお悩みも解決できるかもしれません！ Adobe Edgeではタイムラインにキーフレームをポチポチ打ってアニメーションを 創っ
HTML5 and CSS3 - Adobe - The Expressive Web - Beta
The Expressive Web is an Adobe-curated resource website for the advocacy, support, and advancement of HTML5 and CSS3 web development.Copyright © 2011 Adobe Systems incorporated. All rights reserved. Use of this website signifies your agreement to the Terms of User and Online Privacy Policy. Resources About Adobe and HTML5
基礎から理解するためのCSS3に関するサイトのまとめ｜Webpark
CSS3はIEが対応できていないこともあって、今まであまり紹介してませんでしたが、使いこなせると面白そうなのでまとめてみました。 CSS3リファレンス 有名なサイトですね。CSS3に限らず、HTMLやJavaScriptなど膨大な情報量です。 CSS-EBLOG 各ブラウザで先行実装しているCSSプロパティがまとめられています。 CSS3 Files 【2010.4.25 追加】海外サイトですが非常に見やすいです。各ブラウザの対応状況の載っていて重宝します。 次にブラウザごとの対応状況を確認するサイトを紹介。 HTML5 & CSS3 READINESS HTML5とCSS3のブラウザごとの適応状況を視覚的に見ることができます。2008年からの年別でも見ることができます。 HTML5 & CSS3 Support こちらもブラウザごとの対応状況がまとめられています。CSS3はプロパティ、セ
[CSS]今、そして近い将来に使用するであろうスタイルシートのテクニック集
CSS3のテクニックはさまざまなものがありますが、その中からまさに今、そして次のプロジェクトに使用したくなるテクニックを紹介します。 The Bright (Near) Future of CSS [ad#ad-2] 下記は各ポイントをピックアップして意訳したものです。 はじめに Styling HTML5 Classing like HTML5 Media Queries Styling Occasional Children Styling Occasional Columns RGB Alpha Color HSL and HSL Alpha Color Shadowy Styles Multiple Backgrounds 2D Transforms はじめに ここでフォーカスするのは、今、そして近い将来に使用するであろうスタイリングのテクニックです。HTML5の要素のスタイリング
Adobe - Adobe Creative Suite 4 Webエディション
生成AIでコンテンツを制作するAdobe Fireflyで、想像力の赴くままにクリエイティブを創造できます。
Sencha - Sencha Animator
Sencha Animatorを使えば、これまでのリッチメディア広告に匹敵するCSS３広告を作成することができます。文字や画像をスムーズに遷移させるアニメーションを作成したり、グラデーションがかかったボタンをデザインしたり、さらに分析用のトラッキングコードを埋め込んだりすることがSencha Animatorの中で行えます。また、これらは全てWeb標準技術を使ってできることです。 これらの標準技術を使えば、現在デスクトップ用のブラウザ向けのリッチメディア広告で使われているほぼ全ての機能は、Apple iOS、BlackBerry Torch、そしてGoogle Android向けに移植・再現することが可能です。 CSS３広告について企画・検討されている広告代理店、広告制作会社の皆様、Sencha Animatorの広告作成者向けオプションについてお問い合わせください。 Contact Us
MdN Design｜総合情報サイト
Web制作が楽しくなるCSS3/JavaScriptのテクニック50 - 海外デザイン事情第6回 新規会員登録 ログイン管理 Twitter facebook はてなブックマーク RSS 2024.6.23 SUN 第6回「Web制作が楽しくなるCSS3/JavaScriptのテクニック50」 2010年02月15日 ブラウザ対応が進み、本格普及が間近となったCSS3。海外ではすでに多くのCSS3を使ったデザインテクニックが公開されている。ここではSmashing Magazineに掲載された「50 Brilliant CSS3/JavaScript Coding Techniques」をもとに、CSS3に関する海外の最新テクニックを紹介しよう。 翻訳元サイト：Smashing Magazine http://www.smashingmagazine.com/ 原文：50 Brillian
HTML5/CSS3で作るスマートフォンサイトの基本 (1/5)
スマートフォンサイトのサイト設計、画面設計に続き、今回はデザインとHTML/CSSの制作です。前回作成したワイヤーフレームをもとにデザインカンプを作成し、HTML/CSSをコーディングしていきます。 Photoshopでデザインカンプを作成する 最初に、グラフィックソフトを利用してデザインカンプを作成します。今回はPhotoshop CS5を使いましたが、FireworksやIllustratorなど使い慣れたツールで構いません。 デザインにあたっては、スマートフォンのブラウザーの画面領域を定義したテンプレートを用意してからデザインパーツを作成、配置していきます。画面領域はサイズを測ってガイドを引いてもよいですが、本連載の第5回で紹介したデザインテンプレートを利用するのが手軽です。
HTML5+CSS3 Samples
About This Pages! HTML5とCSS3の勉強をかねて、サンプルとして作成しています。 まだまだ作成途中なので、あまり突っ込まないでください。 SafariかChrome、Firefoxで見てください。 IEは確認してません。いや、だってCSS3まともに対応してないブラウザだs(ry ぜひソースとCSSファイルを見てほしい ソースを見てもらえれば分かりますが、このページで使用している画像は、↑のタイトルの部分で使用した飾りと、背景に使用した４つの画像（青いグラデと紫のグラデ、模様が２つ）だけです。 角丸とか、角丸にさらにドロップシャドウ付いちゃったり、よく見れば背景画像透けてます。 全部CSSで指定してます。 長いのが、難点ですね。 CSSファイルは、「css/common.css」と「css/layout.css」になります。 参考になるか分からないですけど、気になった
CSS3が日本語の禁則処理、傍点、縦書きなど対応へ、ドラフト公開
スタイルシートの新たなWeb標準として現在策定が進められているCSS3に対して、日本語に対応した禁則、傍点（圏点）、縦書き仕様などの機能が追加されたドラフトが公開されました。 9月28日にPublickeyで公開した記事「電子書籍フォーマット「EPUB」で縦書きとルビのサポート、来年5月には仕様完成の見通し」では、EPUBでの縦書きやルビ、傍点などの仕様を策定中であることを紹介しましたが、EPUBはXHTMLやCSSをベースにした仕様であるため、仕様策定の作業はEPUBとCSSのそれぞれのグループが協力してCSS3に対して機能を追加する方法で行われていました。 これが最終的にCSS3の仕様として策定されれば、Webブラウザ上での禁則処理、傍点、縦書きなどの組み版処理が充実することになります（ルビはまだ作業中ですが）。大げさではなく、世界中のWebブラウザに対して日本の日本語文化に対応した表
CSS3 buttons by Chad Mazzola
This is a collection of CSS3 buttons that use the simplest possible markup. They look best in WebKit-based browsers, almost as good in Firefox, with all other browsers falling back to a less-styled button. These buttons are now implemented using Sass, with help from Bourbon. The generated CSS for all the buttons is also available. Classic buttons This is the original set of buttons, showing a vari
HTML5+CSS3 入門
Webを記述する言語の標準の現状 昨年度であれば、HTMLを記述する授業では自信をもって以下の基準を推薦していました。 HTML (文書の構造を記述する言語) – XHTML 1.0 もしくは XHTML 1.1 CSS (文書の体裁・デザインを指定する言語) – CSS 2 しかしながら、ここ数年で、とくに去年あたりから状況は大きく変動しつつあります。現状の変化を理解するには、ここに至るまでの歴史的な経緯について簡単に理解する必要があります。ここまでの経緯を整理した上で、将来の展望を探りたいと思います。その上で、この授業ではどのような基準にのっとって「正しい」ということを定義するのか決めていきたいと考えます。 HTML (Webサイトの記述言語) の標準化巡る闘争の歴史 AppleInsider: なぜ Apple は HTML 5 に賭けているのか： ウェブの歴史 [Page 2] よ
Text Shadows
This is some preview text - you can paste more text in here (Safari) text-shadow was included in CSS2, removed from CSS2.1 and returns in CSS3. It has been supported in Safari since version 1.1, and is supported in Chrome, Firefox 3.5 and Opera 10. CSS Shadows take three length values, and a color. The length values are a horizontal offset, a vertical offset and a blur. Offsets may be negative or
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Redirecting to Animate.css
IBM Developer
http://www.css-lecture.com/log/css3/css3-gradient.html
Edit fiddle - JSFiddle - Code Playground
http://shoonm.com/2010/03/html5css3.html
[CSS]CSS3で何ができるの？ という時にみておきたいサイト集
汝の隣人のブログを愛せよ | LOVELOG