東京渋谷 “HTML5入門&jQuery” 勉強会(5/26)を行いました。 jQueryをおぼえよう!ということで、HTML5のざっくりとした解説と、jQueryの基本的な使い方を学習します!詳細:ATND そのときのスライドおよび資料を公開します。 今後も勉強会を開催する予定です。 twitterのハッシュタグ #gooyaHub で告知していきますので よかったら参加してみてください!
のようです。USからダウンロードしても、インストールするとしっかり日本語で表示されます。 このExtensionは、Adobe Extension Manager CS6を使ってFlash Professional CS6へインストールします。Flash Professional CS6が起動している場合は、一度終了してからインストール作業を行なってください。 使用方法 Extensionをインストール後、Flash Professional CS6を起動すると、「ウィンドウ>その他のパネル」に「Toolkit for CreateJS」が追加されていますので、選択してパネルを開きましょう。 そのパネルは、今後使いやすいようにドッキングしておくと便利です。 試しにタイムラインを使ってアニメーションを設定し、書き出してみましょう。 Toolkit for CreateJSは、Flashで作成
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からFlash ProfessionalでHTML5書き出しを可能にする拡張機能が2011年11月17日に公開されました。もともとGoogleは変換サービスSwiffyをオンライン上で公開していましたが、これを使えば作成したFlashの制作ソフト「Flash Pro」から直接HTML5に出力することができます。それでは使い方を下記にて説明します。 使い方の手順 次のサイトで拡張機能が配布されていますので、MXPファイルをダウンロードします。この拡張機能はお使いのFlash ProがCS4/CS5/CS5.5であればインストールできます。 http://www.google.com/doubleclick/studio/swiffy/extension.html ダウンロードしたMXPファイルを開き、エクステンションマネージャーでインストールします。 Flash Proを起動し、
HTML5 旋風、吹き荒れてますね!(^0^)/ さて、ものすごく突然で恐縮ですが、この度「HTMLファイ部」、設立しました! 株式会社カヤック(本社:神奈川県鎌倉市、 代表取締役CEO:柳澤大輔、http://www.kayac.com以下「カヤック」)は、HTML+CSSコーディング、JavaScript プログラムを担当する職種が所属する「HTMLファイ部」を発足いたします。 これまでHTMLおよびCSS、JavaScriptの担当者は、プログラマが所属する技術部、デザイナが所属する意匠部ME課(MEはMarkup Engineerの略)に分かれて所属していましたが、昨今のHTML5の進化と普及を受けて、HTML、CSS、JavaScriptの担当者は「HTMLファイ部」にて活動をスタートします。 そんなHTMLファイ部員が今回お送りさせていただくのは、 HTML5 について基礎から
この記事は賞味期限切れです。(更新から1年が経過しています) HTML5/CSS3で新たに使える機能がブワッと増えたわけですが、 新機能に対応している環境というのはまだまだごくわずかです。 ということは、機能が使えるor使えない場合に処理を分けたりしなければいけないわけで。 「Modernizr」は、それを支援してくれるJavaScriptライブラリです。 Modernizr 「Modernizer」ではなく、「Modernizr」。 eが欠けている点に注意。Flickrみたいな感じ。 Modernizrがしてくれる事は、ただ一つの単純な処理です。 閲覧しているブラウザが、或る機能に対応しているかどうかをJavaScriptで判別し、 その結果をhtml要素のclassという形で教えてくれます。 例えば、box-shadowに対応しているかどうかを知りたい場合。 Modernizrを読み込
Bookmark2016.10 「Naverまとめ」のまとめ:WEBデザイン編 Bookmark2016.10 「Naverまとめ」のまとめ:WEB PR・プロモーション編 HTML5 : <video>2011.09 HTML5:<audio>タグ。コントロールバーの幅の設定は CSSで。audio {width: ○○○px;} HTML5 : <video>2011.08 HTML5での動画<video>の取り扱い。— “html5media” — Facebook : OGP2011.06 Facebookにおける“Social Graph” — “Open Graph”の粗々なまとめ。 Facebook2011.06 Facebookページ、「iframe」で作ってみました。 東日本大震災2011.03 トイレットペーパー、ガソリン、電池…(みんなで分け合えば、できること。) H
ローソン、無印良品、テレビ朝日など、国内でもHTML5で企業サイトを制作する事例が増えてきました。今すぐではないにせよ、「次のリニューアルはHTML5で制作したい」と考えるWeb制作者も少なくないでしょう。本連載では、「XHTML 1.0/HTML 4.01からの移行」をテーマに、HTML5マークアップの基本から実務で使用するポイントまで、ライブドアのマークアップエンジニア 浜 俊太朗さんが解説します。(編集部) 「HTML5タグの誤用で恥をかいた」「分厚い仕様書は読み切れない」コーダー&デザイナーのためのコーディングガイド。最終草案に対応したほか、商用サイトを意識したコーディング例を新たに書き下ろし。HTML5マークアップへ移行するために必要な知識を効率よく学べる1冊です。ネットで話題の「HTML5カルタ」付き! HTML5マークアップ 現場で使える最短攻略ガイド 定価:2,808円 (
Adobe Labs に Adobe Edge のプレビュー版が公開されました。Edge は HTML5, JavaScript, CSS3 ベースのアニメーションやインタラクションを、描画ツールやタイムラインを使って制作できるオーサリングツールです。昨年秋の MAX でプロトタイプが紹介されて以来の更新となりました。 (Adobe Edge@Labs) Edge は、本格的なオーサリングツールというよりは、Dreamweaver や Flash Professional を補完する、軽量かつ高速なツールと位置づけられているようです。比較的単純なアニメーションの制作に特化したツールです。 実際に Edge プレビュー版を使って制作したサンプルがいくつか公開されています。 wordAnimation wordAnimation2 その他にも、Edge のソース付きでこちらのページに紹介されて
前回の大阪てら子で少しだけ触れた『enchant.js』と、少し前に話題になってたらしい『mario.js』について紹介したいと思います。 『enchant.js』ってなんですか? 『enchant.js』というのは、ファミコンの初代マリオやドラクエのような2Dゲームを作るのに便利な機能を備えたJavaScriptベースのゲームエンジンです。 enchant.js – HTML5 + JavaScript Game Engine 4Gamer.net ― ユビキタスエンターテインメント,無料で使用できるHTML5/JavaScriptベースのゲームエンジン「enchant.js」をリリース(ミドルウェア/開発ツール) 具体的には、以下の便利クラスなどが用意されています。 FlashのActionScriptベースな造りことがわかります。ざっと軽く見ていきましょう。 Gameクラス ゲームの
By Marcel Gordon, Product Manager, Swiffy Some Google projects really do start from one person hacking around. Last summer, an engineering intern named Pieter Senster joined the mobile advertising team to explore how we could display Flash animations on devices that don’t support Adobe Flash player. Pieter made such great progress that Google hired him full time and formed a team to work on the pr
iPhoneなどの小さいサイズのモニターをはじめ、2560pxの大きいサイズのモニターなど、それぞれの幅に適したレイアウトを自動的に適用するMedia Queriesをしっかりと身につけるためのスタイルシートのチュートリアルを紹介します。 Adaptive & Mobile Design with CSS3 Media Queries [ad#ad-2] 下記は各ポイントを意訳したものです。 デモページの確認 HTML CSS Media Queries 完成したデモの確認 デモページの確認 チュートリアルの前にまず、それがどのように見えるかデモページをチェックしてみてください。 このデモページはHTML5+CSS3 Media Queriesで作成されており、ユーザーが使用しているビューポートのサイズに適したレイアウトに自動調整して表示されます。 デモページ 左から、ノーマル、ナロウ、ス
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く