vol.20

デザイニングインザブラウザ実現のCSS3講座

開催日 11月12日(土) 10:00〜18:00
定員 8名
*定員に達し次第募集終了
開催状況 未決定:あと2名で開催
申込期限 2016年10月20日(木)
受講料 50,000 円

講座の特徴

CSS3はCSS2.1の次のレベルのCSSです。角丸やアニメーションなどCSSで多彩なことができます。

そのデザイン表現の幅が広がるCSS3をキチンとマスターするための講座です。CSSのプロパティをコピー&ペーストすればある程度の事は実現は可能ですが、むやみやたらに利用するのは危険です。特にスマートフォンでの実装はパフォーマンスが命ですので、CSS3利用して逆効果になる場合があります。

この講座では、スマートフォンでの実装のポイントブラウザによるCSS3プロパティのサポート差異の吸収方法を含め、プログレッシブエンハンスメントの 概念を理解し実践的なデザイン方法を学ぶことができます。

CSS3を利用して自分の思う通りにデザインする技術と、ブラウザでのアクセルフルな技術をマスターしましょう。CSS3の事は全然知らない方でもCSSの基本を理解していれば受講する事ができます。

Curriculums

カリキュラム

  1. プログレッシブエンハンスメントとIE
  2. アグレッシブデグレデーション
  3. CSS3ブラウザサポートの確認方法
  4. CSS3の色のプロパティ
  5. colorとディベロッパーツール
  6. text-shadowの基礎1
  7. box-shadow
  8. transformプロパティの基礎
  9. transitionプロパティの基礎
  10. Webフォントと生成ツール
  11. バックグラウンドプロパティ
  12. マルチコラムレイアウト
  13. CSS3のボックスモデルの変更
  14. modernizrの実装によるCSS3の適用

学べる内容

CSS3の基本からブラウザの中でデザインができる「デザインイングインブラウザ」を意識した勉強方法をご紹介いたします。CSS3の基本がわかれば、オンラインツールなどを利用することができる画像や意味のあるイラスト制作以外はPhotoshopなどのツールを使わずにデザインが実装できます。

  • 画像とCSSの比較イメージ
    デザイニングインザブラウザの知識や実装の工夫などの情報を得ることができます
  • Webインスペクタでの編集イメージ
    上位表示にも役立つ軽量化のため重くなりがちな画像を使わなずCSSでのデザインを学びます
  • ブラウザの対応イメージ
    CSS3に対応していないブラウザでの対応方法を学びます

こんな方におすすめです

授業スタイル

  1. ハンズオンでの学習スタイル

    ひとり一台のパソコンを利用し、手を動かし実習をしながら学んでいただけます。

  2. ブラウザについて

    CSSサポートの良いブラウザで正しいCSSを勉強します。

  3. 開発環境

    秀丸(win)、mi(mac)などのエティタを利用して開発します。

授業風景

受講特典

  1. スライド・サンプルのプレゼント

    授業中に利用したスライド、サンプルコードを受講後にプレゼントいたします。

  2. テストで学びきれなかった内容を確認

    受講後のテストで学びきれなかった内容を、確認と復習することができます。

  3. 再受講制度で分からないところも確実に

    受講後半年間は、同じ講座を最大無料で受講することができます。

担当講師

菊池 聡[肖像]

菊池 (きくち さとし)

CSS3は手打ちでコーディングすることはほとんどありませんが、コツを掴んでおく必要があります。 ツールで生成されるコードもどこが無駄でどこが必要なのか?カスタマイズ方法も含めてCSS3の基本を理解しておきましょう。デザイニングインブラウザを行う上でもCSS3を理解するポイントをご紹介いたします。

受講生の声

犬飼浩子

犬飼浩子さん

Webデザイナー

受講して一番わくわくしたのは、あれも?これも?CSSだけでできるんだ!と思いました。すごーい使ってみたいな〜。と思ったまま、受講してから一年、IEへの実装状況などで現場の理解が進められずにいました。
機会があって再受講したとき、やはり、クライアントや現場などとも、プログレッシブエンハンスメントの考え方をまず共有している事が大事なんだと実感しました。今までのようにIE対策に時間がかかっていたのでは、開発は進まない。そして、重要なのは「情報を伝えること」。情報が解りやすい事はもちろん、デザイン的にも優れたサイトを作って行きたいと思いました。

土屋健治さん

ディレクター

CSS3講座を受講する前はCSS3でなにができるかさえ知らなかったのですが、いろいろなことができるのでビックリしました。 JSで制作するよりパフォーマンスが良かったり、高解像度ディスプレイに対応できるってことでもっと勉強しなくてはいけないのだと感じました。

井上久美子さん

Webデザイナー

CSS3は角丸くらいしか使ったことがなかったのですが、バナー作成やアニメーション、パララックスまでできるとは 思っていませんでした。陥りがちなミスや覚える必要のあるもの、覚える必要のないもの、使えるテクニックなどより現場で使える方法を教えてもらったので凄くためになりました。

河内純也

河内純也さん

ディレクター

ツール群も含めて、実践で「使える」「使えない」「将来性はある」みたいな切り分けで各プロパティを整理出来たところが非常にありがたかったです。Webフォントの使い方がやBackground-sizeで画像の使い方が広がったり、Multi Columnで電子書籍がCSSで作ることができるようになってよかったです。

中村正吾

中村正吾さん

Webデザイナー

思い込みで使い方を制限していたことが、考え方を一つ変えるだけで使い道が大幅に広がるのがとても面白かったです。当日習えなかった部分や、すでに自分が持っている技術でも応用していけば手持ちの武器でやれる幅は広がると実感させられました。

木下久美子さん

Webデザイナー

わたしはデザイナーなのですが、Photoshopで行っているようなデザインをCSSで置き換える感じで教えていただいたので 凄く解りやすかったです。
単純にデモサイトを作るのではなく、理解を進めながら実習を行うのでスムーズに理解することができました。 プロパティの勉強はネットでもできると思っていましたが、デザイン例をご紹介していただいているので利用できるデザインのイメージができ 実務でそのまま使えそうです。

この講座が含まれるコース

CSS3講座が入ったコースです。コースでお申し込みされると割引されます。

Page Top