Successfully reported this slideshow.

魅せるスマホ対応!?レスポンシブWebデザインセミナー

4

Share

1 of 66
1 of 66

魅せるスマホ対応!?レスポンシブWebデザインセミナー

4

Share

Download to read offline

■セミナー背景
近年、Webサイトはパソコンだけで閲覧されるものではなく、スマートフォンやタブレット型端末の急速な普及により様々なデバイスで閲覧されるようになりました。そのため、Webサイトも閲覧環境に応じてレイアウトを柔軟に切り替えられるよう「マルチデバイス対応」が必須になってきています。しかし、デバイス毎にレイアウトの違うHTMLファイルを複数用意していると、コストが多く掛かり管理もとても大変・・・
そこで、新しい手法として今国内・海外で注目を集めているのが【レスポンシブWebデザイン】という手法です!

レスポンシブWebデザインは、デバイスをWebサイトの表示基準にするのではなく、ブラウザの横幅サイズを、Webサイトの表示基準にすることで、ページのレイアウトを柔軟に美しく調整できる手法です。まさに、魅せるスマホ対応をすることができます。また、SEOの観点から見ても、URLが1つで済んだり、リダイレクト不要だったりと、とても大きなメリットがあります。

■登壇者
加藤 俊司(かとう しゅんじ) 株式会社クライマークス

取締役クリエイティブ部部長/チーフ・デザイナー
東京大学法学部を卒業後、大手通信会社、Webコンサルティング会社を経て2009年株式会社クライマークスに入社。大手企業クライアントを中心としたWebインテグレーションに携わりデザイン、アートディレクション、企画立案、情報設計などを手掛ける。
レスポンシブWebデザインのギャラリーサイト「Responsive Web Design JP」を運営。また、レスポンシブWebデザインに関する雑誌や書籍への執筆も行っている。
・株式会社クライマークス:http://www.climarks.com/
・Responsive Web Design JP(個人運営):http://responsive-jp.com/
・smart4me(簡単スマホ制作サービス/クライマークス社運営):http://smart4me.net/
■執筆活動
・雑誌記事:「Web Designing 2011年9月号」「Web Designing 2013年3月号」(マイコミ)
・書籍:「レスポンシブWebデザインテクニックブック」(エムディエヌコーポレーション)http://goo.gl/bKt9l3

■セミナー背景
近年、Webサイトはパソコンだけで閲覧されるものではなく、スマートフォンやタブレット型端末の急速な普及により様々なデバイスで閲覧されるようになりました。そのため、Webサイトも閲覧環境に応じてレイアウトを柔軟に切り替えられるよう「マルチデバイス対応」が必須になってきています。しかし、デバイス毎にレイアウトの違うHTMLファイルを複数用意していると、コストが多く掛かり管理もとても大変・・・
そこで、新しい手法として今国内・海外で注目を集めているのが【レスポンシブWebデザイン】という手法です!

レスポンシブWebデザインは、デバイスをWebサイトの表示基準にするのではなく、ブラウザの横幅サイズを、Webサイトの表示基準にすることで、ページのレイアウトを柔軟に美しく調整できる手法です。まさに、魅せるスマホ対応をすることができます。また、SEOの観点から見ても、URLが1つで済んだり、リダイレクト不要だったりと、とても大きなメリットがあります。

■登壇者
加藤 俊司(かとう しゅんじ) 株式会社クライマークス

取締役クリエイティブ部部長/チーフ・デザイナー
東京大学法学部を卒業後、大手通信会社、Webコンサルティング会社を経て2009年株式会社クライマークスに入社。大手企業クライアントを中心としたWebインテグレーションに携わりデザイン、アートディレクション、企画立案、情報設計などを手掛ける。
レスポンシブWebデザインのギャラリーサイト「Responsive Web Design JP」を運営。また、レスポンシブWebデザインに関する雑誌や書籍への執筆も行っている。
・株式会社クライマークス:http://www.climarks.com/
・Responsive Web Design JP(個人運営):http://responsive-jp.com/
・smart4me(簡単スマホ制作サービス/クライマークス社運営):http://smart4me.net/
■執筆活動
・雑誌記事:「Web Designing 2011年9月号」「Web Designing 2013年3月号」(マイコミ)
・書籍:「レスポンシブWebデザインテクニックブック」(エムディエヌコーポレーション)http://goo.gl/bKt9l3

More Related Content

More from ec-campus

Related Books

Free with a 14 day trial from Scribd

See all

Related Audiobooks

Free with a 14 day trial from Scribd

See all

魅せるスマホ対応!?レスポンシブWebデザインセミナー

  1. 1. 2013.11.12 る 魅せ スマホ対応 !?   レスポンシブWebデザイ ンセミナー 2013年年11⽉月12⽇日 株式会社クライマークス  加藤  俊司 セミナー資料料
  2. 2. まず、⾃自⼰己紹介をさせてください Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 2
  3. 3. ⾃自⼰己紹介 加藤  俊司 株式会社クライマークス 取締役クリエイティブ部部⻑⾧長/チーフ・デザイナー Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 3
  4. 4. ⾃自⼰己紹介 株式会社クライマークス ①  Webインテグレーション事業 ②  Webサービス事業 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 4
  5. 5. ⾃自⼰己紹介 ① Webインテグレーション事業 ⼤大⼿手企業を中⼼心に、Web戦略略策定やWebサイト構築のお ⼿手伝いをしています。 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 5
  6. 6. ⾃自⼰己紹介 ② Webサービス事業 スマホサイト作成サービス「smart4me」 スマート・フォー・ミー   無料料版 ビジネス版 ベーシック ビジネス版 プロ スマホサイトが10ページまで 無料料で公開! 30,000    サイト突破! ページ数無制限! 独⾃自ドメインで公開できる 4,980円/⽉月 作ったサイトをダウンロード 公開するサーバーは⾃自由! 2万円/⽉月 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 6
  7. 7. ⾃自⼰己紹介 http://smart4me.net/ スマホサイト作成 検索索 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 7
  8. 8. ⾃自⼰己紹介 個⼈人活動 ①  ギャラリーサイト運営 ②  書籍・雑誌への執筆 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 8
  9. 9. ⾃自⼰己紹介 ① ギャラリーサイト運営   レスポンシブWebデザインの ギャラリーサイト 「Responsive  Web  Design  JP」 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 9
  10. 10. ⾃自⼰己紹介 http://responsive-‐‑‒jp.com/ レスポンシブ 検索索 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 10
  11. 11. ⾃自⼰己紹介 ② 書籍・雑誌への執筆  ●「レスポンシブWebデザイン       テクニックブック」(MdN)  ●「Web  Designing  2011年年9⽉月号」     (マイコミ)  ●「Web  Designing  2013年年3⽉月号」     (マイコミ) Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 11
  12. 12. ここから本題 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 12
  13. 13. 本⽇日のゴール ① レスポンシブWebデザインとは何かを知る ② カラーミーショップの レスポンシブ Webデザインテンプレートの メリットを知る Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 13
  14. 14. ⽬目次 1 スマホサイトがなぜ必要なの? 2 スマホに対応する5つの⽅方法とは? 3 レスポンシブWebデザインとは? 4 レスポンシブWebデザインは何がいいの? 5 レスポンシブWebデザインは効果があるの? 6 レスポンシブWebデザインに向いているサイトとは? 7 カラーミーショップのレスポンシブWebデザイン     テンプレートは何がいいの? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 14
  15. 15. スマホサイトがなぜ必要なの? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 15
  16. 16. スマホサイトがなぜ必要なの? スマホの契約数は、来年年にはガラケーを超える⾒見見込み。 スマートフォン契約数の推移・予測(2013年年3⽉月予測) (万件) 12,000 10,000 スマートフォン 契約数 8,000 6,000 フィーチャーフォン 契約数 4,000 2,000 0 2008 2009 2010 2011 2012 2013 2014 2015 2016 2017 (年年度度末) 【出典】MM総研「スマートフォン市場規模の推移・予測(2013年年3⽉月)」 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 16
  17. 17. スマホサイトがなぜ必要なの? 5割超の場合も。 BtoCサイトは、スマホからのアクセスが BtoCサイトのスマホからのアクセスの割合 55% 35% 37% 54% エステサロン 整体院 ハウスクリーニング インテリア情報 【出典】集客チャンネル(エステサロン、整体院、ハウスクリーニングのみ) Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 17
  18. 18. スマホサイトがなぜ必要なの? 4割がスマホから。 楽天もZOZOも売上の スマホ売上⽐比率率率 スマホ出荷⽐比率率率 60% 60% 40% 40% 20% 20% 0% 0% 2011末 2012末 2013末 【出典】2013年年7⽉月楽天カンファレンス発表 2012.3 2013.3 【出典】スタートトゥデイ2014年年度度第⼀一四半期決算短信  説明会資料料 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 18
  19. 19. スマホサイトがなぜ必要なの? 倍に。 スマホEC市場は、2015年年には2013年年の (兆円) 3 2兆6,677億円 2兆413億円 2 1兆3,469億円 1 0 8,450億円 2012 2013 (⾒見見込) 2014 (予測) 2015 (予測) 【出典】国内スマートフォン・コマース市場規模予測(⽮矢野経済研究所) Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 19
  20. 20. スマホサイトがなぜ必要なの? すでに ECサイトのスマホ対応は 売上を⼤大きく左右する段階 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 20
  21. 21. スマホサイトがなぜ必要なの? スマホ対応しない場合 l  テキストが読みにくい l  リンクが押しにくい l  フォームが⼊入⼒力力しにくい 離離脱につながる! Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 21
  22. 22. では、どうやって対応するの? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 22
  23. 23. スマホに対応する5つの⽅方法とは? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 23
  24. 24. スマホに対応する5つの⽅方法とは? Webサイトをスマホに対応する⽅方法は、⼤大きく分けて5種類。 ①  イチから作る ②  スマホサイト簡易易作成ツール ③  スマホサイト変換コンバーター ④  システムでPCサイトとスマホサイトを出し分け ⑤  レスポンシブWebデザイン   Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 24
  25. 25. スマホに対応する5つの⽅方法とは? ①  イチから作る ②  スマホサイト簡易易作成ツール ③  スマホサイト変換コンバーター ④  システムでPCサイトとスマホサイトを出し分け ⑤  レスポンシブWebデザイン   Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 25
  26. 26. スマホに対応する5つの⽅方法とは? ① イチから作る メリット デメリット l  スマホ専⽤用のとことんこだわったサイトが できる l  制作や運⽤用が⼤大変 l    コストが⾼高い Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 26
  27. 27. スマホに対応する5つの⽅方法とは? ①  イチから作る ②  スマホサイト簡易易作成ツール ③  スマホサイト変換コンバーター ④  システムでPCサイトとスマホサイトを出し分け ⑤  レスポンシブWebデザイン   Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 27
  28. 28. スマホに対応する5つの⽅方法とは? ②  スマホサイト簡易易作成ツール (例例)smart4meなど コンテンツを⼊入⼒力力 出⼒力力 管理理画⾯面 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 28
  29. 29. スマホに対応する5つの⽅方法とは? ②  スマホサイト簡易易作成ツール メリット l  素早く簡単にスマホサイトを作成でき、        運⽤用も楽 l  コストが安い   デメリット l  既存のPCサイトとコンテンツを⾃自動的に 共有することはできない l  PC⽤用/スマホ⽤用で同じURLにできない Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 29
  30. 30. スマホに対応する5つの⽅方法とは? 同じURLだと何がいいの? l  SEOに有利利。 → 異異なるURLの場合、重複コンテンツとみなされる!? l  Twitter/Facebookなどで共有しやすい。 → 異異なるURLの場合、 ① 共有数が分散!? ② スマホ⽤用のURLを共有すると、PCでアクセスして も、スマホ⽤用の画⾯面が表⽰示!? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 30
  31. 31. スマホに対応する5つの⽅方法とは? ①  イチから作る ②  スマホサイト簡易易作成ツール ③  スマホサイト変換コンバーター ④  システムでPCサイトとスマホサイトを出し分け ⑤  レスポンシブWebデザイン   Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 31
  32. 32. スマホに対応する5つの⽅方法とは? ③  スマホサイト変換コンバーター (例例)Mobifyなど アクセスしてきた 端末に応じて変換 変換システム 既存のPCサイト Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 32
  33. 33. スマホに対応する5つの⽅方法とは? ③  スマホサイト変換コンバーター l  既にPCサイトがあれば、スマホ対応できる    メリット l  PC⽤用/スマホ⽤用とでコンテンツを共⽤用でき、    運⽤用も楽 l  PC⽤用/スマホ⽤用とで同じURLにできる デメリット l  導⼊入までに時間がかかる   l  コストが⾼高い     ⼤大規模サイト向き Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 33
  34. 34. スマホに対応する5つの⽅方法とは? ①  イチから作る ②  スマホサイト簡易易作成ツール ③  スマホサイト変換コンバーター ④  システムでPCサイトとスマホサイトを出し分け ⑤  レスポンシブWebデザイン   Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 34
  35. 35. スマホに対応する5つの⽅方法とは? ④  システムでPCサイトとスマホサイトを出し分け (例例)カラーミーショップ、その他CMS コンテンツを⼊入⼒力力 コンテンツ ⽣生成システム 管理理画⾯面 アクセスしてきた 端末に応じて変換 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 35
  36. 36. スマホに対応する5つの⽅方法とは? ④  システムでPCサイトとスマホサイトを出し分け メリット l  PC⽤用/スマホ⽤用とでコンテンツを共⽤用でき、 運⽤用も楽 l  PC⽤用/スマホ⽤用とで同じURLにできる   デメリット l  PC⽤用/スマホ⽤用の2種類のテンプレートが 必要で、導⼊入・管理理が⾯面倒 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 36
  37. 37. スマホに対応する5つの⽅方法とは? ①  イチから作る ②  スマホサイト簡易易作成ツール ③  スマホサイト変換コンバーター ④  システムでPCサイトとスマホサイトを出し分け ⑤  レスポンシブWebデザイン   Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 37
  38. 38. ここでやっと レスポンシブWebデザイン登場! Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 38
  39. 39. レスポンシブWebデザインとは? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 39
  40. 40. レスポンシブWebデザインとは? 1つのサイトを、画⾯面幅に応じてレイアウトを変えることで、 PC/スマホに対応させる技術。 (例例)株式会社グローバル  ブレイン  スクエア(http://www.gb-‐‑‒s.com/) Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 40
  41. 41. レスポンシブWebデザインとは? 今までの⽅方法 ① PCサイトとスマホサイトを、 ② PCサイトとスマホサイトを、 端末を判別して転送。 端末を判別して出し分け。 sample.com m.sample.com 端末を判別して 転送 sample.com 端末を判別して 出し分け Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 41
  42. 42. レスポンシブWebデザインとは? 2010年年、⽶米国の開発者、イーサン・マルコッテ⽒氏が提唱。 【出典】イーサン・マルコッテ⽒氏による「A  List  Apart」の記事「Responsive  Web  Design」(2010.5.25) Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 42
  43. 43. レスポンシブWebデザインとは? CSS3という新規格によって実現。 レスポンシブWebデザインを実現する3つの技術 ① メディアクエリ(Media  Queries) 画⾯面の幅などに応じて、レイアウトを変更更することが できるCSS3の機能 ② フルードグリッド(Fluid  Grid) 画⾯面の幅に合わせ、レイアウトを変えることなく  グ リッド幅のみを可変させる⼿手法 ③ フルードイメージ(Fluid  Image) 画⾯面の幅に合わせ、画像サイズを可変させる⼿手法 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 43
  44. 44. レスポンシブWebデザインとは? ⽇日本でも、2012年年頃からレスポンシブWebデザインを採⽤用 したサイトが急増。 「Responsive  Web  Design  JP」の掲載サイト数 (サイト数) 400 300 200 100 0 5 6 2012 7 8 9 10 11 12 1 2 2013 3 4 5 6 7 8 9 10 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 44
  45. 45. レスポンシブWebデザインとは? ECサイトでの採⽤用も増えてきた。 その他のECサイトの例例 ■ Zound  Industries  Tokyo http://zoundtokyo.com/■ セレクトスクエア http://www.selectsquare.com/ ■ AGATHA  E-‐‑‒SHOP http://www.agatha.jp/ ■ エアアジア・ゴー https://www rasiago.com/ja-‐‑‒jp/ .ai ■ GALAPAGOS  STORE http://galapagosstore.com/ ■ ホテルオークラ東京ベイ http://www .okuratokyobay ■ .net/ THE  STABLES http://thestables.jp/ ■ LADER http://www.lader.jp/ (例例)ミンネ(http://minne.com/) Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 45
  46. 46. レスポンシブWebデザインは 何がいいの? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 46
  47. 47. レスポンシブWebデザインは何がいいの? メリット l  PC⽤用/スマホ⽤用とでコンテンツやデザイ ンを完全に共⽤用できる l  PC⽤用/スマホ⽤用とで同じURLにできる l  SEOに有利利(Googleも推奨) l  ⼀一からつくると設計が⼤大変   デメリット l  スマホでもPC⽤用のデータを読み込むので、 ページが⻑⾧長くなったり、表⽰示が遅くなる l  利利⽤用シーンに応じてPC⽤用/スマホ⽤用のコン テンツや設計を分けたい場合には向かない Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 47
  48. 48. レスポンシブWebデザインは何がいいの? なぜSEOに有利利なの?(Google推奨なの?) l  Googleからみたら、URLが同じでソースも1つなので、 1回クロールすればよく、効率率率的。 → 出し分けや、別々のURLを使⽤用している場合、         別ページがあることを伝える必要があり、設定が煩雑。 【注意】レスポンシブWebデザインにすると、 検索索順位が上がるわけではない。 下がるリスクを減らせるということ。 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 48
  49. 49. レスポンシブWebデザインは何がいいの? レスポンシブWebデザインはページが⻑⾧長くなる!? l    ユーザーはPCサイトの簡略略版は⾒見見たくない。 l    ユーザーはスマホでのスクロールに抵抗がない。 l    スマホサイトでの頻繁なページ移動は離離脱につながる。 1ページが⻑⾧長くても、PCサイトと同じ情報が ⾒見見られるスマホサイトが好まれる。 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 49
  50. 50. レスポンシブWebデザインは 効果があるの? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 50
  51. 51. レスポンシブWebデザインは効果があるの? ① TIME(ニュース誌) l  モバイルユーザーが  23%  増加 l  モバイルユーザーの直帰率率率は  26%  減少 【出典】LukeW「Data  Monday:  Impact  of  Responsive  Designs」 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 51
  52. 52. レスポンシブWebデザインは効果があるの? ② Skinny  Ties(ネクタイ販売) l  iPhoneでの収⼊入が  377.6%  増加 l  iPhoneでのコンバージョンが  71.9%  増加 【出典】LukeW「Data  Monday:  Impact  of  Responsive  Designs」 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 52
  53. 53. レスポンシブWebデザインは効果があるの? ③ Fathead(壁⽤用ステッカー・シール販売) l  モバイルでの収⼊入が  538%  増加 l  モバイルでのコンバージョンが  90%  増加 【出典】LukeW「Data  Monday:  Impact  of  Responsive  Designs」 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 53
  54. 54. レスポンシブWebデザインに 向いているサイトとは? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 54
  55. 55. レスポンシブWebデザインに向いているサイトとは? 向いている サイト l  PCとスマホとでコンテンツを完全に共⽤用   したいサイト 例例: 企業サイト、製品サイト、ニュースサイト、 ブログ、ECサイト l  ⼤大きな画像を多⽤用したサイト   例例: キャンペーンサイト   向いていない サイト l  PCやスマホの利利⽤用シーンに応じて異異なる     コンテンツにした⽅方がよいサイト 例例: 飲⾷食/ホテル/テーマパークのサイト   l  スマホユーザーに特化したサイト   Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 55
  56. 56. カラーミーショップのレスポンシブ Webデザインテンプレートは何が いいの? Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 56
  57. 57. カラーミーショップのレスポンシブWebデザインテンプレートは何がいいの? カラーミーショップのレスポンシブWebデザインテンプレート Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 57
  58. 58. カラーミーショップのレスポンシブWebデザインテンプレートは何がいいの? 従来のテンプレート レスポンシブテンプレート l  PC⽤用とスマホ⽤用とでデザ   インの統⼀一感がないもの が多い。 l  ワンテンプレートでPCに   もスマホにも対応するの で、デザインも統⼀一。 l  タブレットに未対応。   l  タブレットにも対応   l  別々に設定を⾏行行う必要が   あり、導⼊入や管理理が⾯面倒。 l  別々に設定を⾏行行う必要が   ないので、管理理が簡単。 本来、⼀一から作ると⼤大変 だが、テンプレート化さ れているので、導⼊入も楽。 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 58
  59. 59. まとめ Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 59
  60. 60. まとめ l    すでにECのスマホ対応は売上を⼤大きく左右する段階。 l    スマホ対応⽅方法にはいろいろあり、レスポンシブWeb デザインはその⼀一つ。 l    それぞれの⽅方法にメリット/デメリットがある。 l    レスポンシブWebデザインにもメリット/デメリット があるが、カラーミーショップのテンプレートには、 メリットが多い。 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 60
  61. 61. ご清聴ありがとうございました Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 61
  62. 62. 2013.11.12 セミナー資料料
  63. 63. カラーミーショップ公式レスポンシブ テンプレート  好評発売中!! Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 63
  64. 64. 統一デザインでブランド力の強化! ひとつのテンプレートで、パソコン、スマホやタブレット など様々な画面に自動で対応することができます。 スマホ・タブレットに自動対応! レスポンシブテンプレートは、画面の大きさにあわせて 自動でデザインを調整しますので、どんなデバイスにも 対応可能です。 メンテナンスがとても簡単! レスポンシブテンプレートなら、少しのデザインを変える 時も、一つのデザイン変更ですべてに対応することが できます。 Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 64
  65. 65. 有料テンプレート30%OFFキャンペーン開催中!! 明日11月13日(水)17時まで 通常価格29,800pt⇒ セール価格20,860pt Copyright  ©  2013  Climarks  Inc.  All  Rights  Reserved. 65
  66. 66. 2013.11.12 セミナー資料料 本日はご来場ありがとうございました!

×