タグ

WEBデザインとASCII.jpに関するwasaiのブックマーク (4)

  • 本格バナー制作で学ぶGoogle Web Designerの使い方 (1/4)

    Google Web Designerの基からアニメーションの作成までを学ぶ連載。第3回では、Google Web Designerを使って実際の業務を想定したクリエイティブバナーを作成します。 基操作については前回の記事で解説しましたので、今回は主にアニメーションモードの詳しい使い方を中心に学びましょう。 Google Web Designerで実際にクリエイティブバナーを作成しよう 今回作成するのは、次の2つのバナーです。 1つ目は、「クイック」アニメーションモードで制作した不動産会社のバナーで、夜景の写真が横にスライドするシンプルなものです。2つ目は、「詳細」アニメーションモードで制作したカフェのバナーで、スライドとフェードを組み合わせて、複数ページを切り替えます。 「クイック」アニメーションモードで作る不動産会社のバナー 最初に、背景が横方向に流れるような動きのバナーを作りまし

    本格バナー制作で学ぶGoogle Web Designerの使い方 (1/4)
  • HTMLの用意とリセットCSSの作成 (1/4)

    連載で紹介したレスポンシブWebデザインの基礎に加えて、画像や動画のレスポンシブ対応、パフォーマンス改善といった商用サイト構築のノウハウを大幅に加筆。さらに、解像度に依存しないレスポンシブWebデザインの考え方やスマートテレビ対応などの応用テクも盛り込みました。 レスポンシブWebデザイン マルチデバイス時代のコンセプトとテクニック 定価:2,625円 (体2,500円)/形態:B5変 (232ページ) ISBN:978-4-04-886323-0 連載第2回では、レスポンシブWebデザインの設計と素材の準備をしました。今回は、ページの基となるHTMLCSSの初期設定を記述します。 ベースHTMLの記述 最初に、「枝豆隊」の基となるHTMLを用意しましょう。このサイトでは、XHTMLではなくHTML5を採用しています。HTML5はオフライン機能や現在地特定機能などのモバイルデバイ

    HTMLの用意とリセットCSSの作成 (1/4)
  • レスポンシブWebデザインとは (1/5)

    スマートフォンやタブレット、PCなどあらゆるデバイスに対応する制作手法として注目されている「レスポンシブWebデザイン」。レスポンシブWebデザインの概念からサイト制作の基まで、レスポンシブWebデザインによる制作案件を数多くこなす菊池 崇氏が解説します。(編集部) 連載で紹介したレスポンシブWebデザインの基礎に加えて、画像や動画のレスポンシブ対応、パフォーマンス改善といった商用サイト構築のノウハウを大幅に加筆。さらに、解像度に依存しないレスポンシブWebデザインの考え方やスマートテレビ対応などの応用テクも盛り込みました。 レスポンシブWebデザイン マルチデバイス時代のコンセプトとテクニック 定価:2,625円 (体2,500円)/形態:B5変 (232ページ) ISBN:978-4-04-886323-0 レスポンシブWebデザイン(Responsive Web Design)

    レスポンシブWebデザインとは (1/5)
  • スマホサイトを作る前に見たい国内38社の実例 (1/7)

    この記事で取り上げているスマートフォンサイトの「BEFORE & AFTER」を以下の記事で紹介しています。合わせてご覧ください。 日のスマホサイトは2年間でこんなに変わった iPhoneAndroidの普及を背景に、スマートフォンのブラウザー向けにコンテンツや表示を最適化した「スマートフォンサイト」(スマホサイト)を開設する企業が増えている。当初はiPhone(iOS)の標準UIに倣った画一的なデザインが多かったが、最近では独特のレイアウトや斬新な色使いの個性的なスマートフォンサイトも増えてきた。 好評だった前編に引き続き、Web制作者が見ておきたいスマートフォンサイト(日語/企業サイト限定)を業種別に分類して紹介する。スマートフォンサイトの制作に入る前にチェックしておこう。

    スマホサイトを作る前に見たい国内38社の実例 (1/7)
  • 1