ドリル式やさしくはじめるWebデザインの学校―講義+BiNDを使ったチュートリアルによる短期マスターコース

  • ただいまウェブストアではご注文を受け付けておりません。
  • サイズ B5判/ページ数 223p/高さ 24cm
  • 商品コード 9784839958541
  • NDC分類 547.48
  • Cコード C3055

出版社内容情報

プロではないけれどWebサイトを作ったり運営したりしなければいけない人のための、Webデザインの学校の開校!考えながら、作りながら、習得する。
プロではないけれどWebサイトをデザインしたり運営したりしなければいけない人のための、Webデザインの学校です。

たとえば、こんなこと、ありませんか?

●会社やお店のWebサイトを作ったけれども、「デザインのセンス」がなくイマイチ見栄えがしない。集客のためにもサイトのデザインをどうにかしたい!
●費用をおさえるため、テンプレートを使ってWebサイトを作ってみたが、更新しているうちにレイアウトが崩れてしまったまま……どうしよう!
●Webサイトのスマートフォン対応がよく言われているが、実際どのように作ればいいのか、サイトの作り方や対処法を優しく教わりたい
●最近流行のWebデザインやトレンドについて、いまひとつつかめてない。まとめて読める、やさしく教えてくれる本はないのかな?

……そういう悩みに、本書はばっちり効きます。

本書は3つのコースでできています。
Part 1「Basicコース」では、Webサイトが表示されるしくみや、現在のWeb制作・運営者が知っておきたい基礎知識をコンパクトにまとめ紹介します。
Part 2「Drillコース」は、問題形式でWebデザインのコツを掴んでいきます。「リンクがわかりやすいのはどちら?」「見やすいナビゲーションはどちら?」「文字が読みやすいのはどちら?」などの問題が出されますので、2つのデザインを見比べて、ぜひ考えてみてください。問題を自分で考え、その後で解説を読むことで、単に解説を読むだけよりも、深く納得感を持って理解でき、「デザインを考える力」が身につくようになっています。
そしてPart 3「Tutorialコース」は、チュートリアル素材を使って、レスポンシブWebウェブを制作する、誌上ハンズオンセミナーとなっています。
本書で使用するのはデジタルステージが販売しているBiNDというソフトです。BiNDは、HTMLを書く知識がなくても、洗練されたデザインのWebサイトが短時間で作れるホームページ作成ソフトです。
自動でスマートフォンサイトに最適化するレスポンシブWebにも対応しています。
「Drillコース」で学んだWebデザインのノウハウの実践編となっていますので、ぜひ取り組んでみてください。
チュートリアル用の素材は、本書サポートサイトからダウンロードできます。

Part1 Basicコース:Webデザインの基本を覚えよう
  1-01 Webサイトが見えるしくみ
  1-02 Webサイトのデータ構造
  1-03 モバイル時代のWebサイトはこう違う
  1-04 詰め込み型サイトからコンパクトなコンテンツへ
  1-05 Webサイト制作の流れ
  1-06 サイトの制作1 構造を練る
  1-07 サイトの制作2 コンテンツの準備
  1-08 サイトの制作3 サイトの公開と更新

Part2 Drillコース:Webデザイン力をアップしよう
category:ページのレイアウト
  2-01 Webページの横幅の設定
  2-02 ページの分割とサイト構成
  2-03 カラム数とレスポンシブデザイン
  2-04 テンプレートの選択
  2-05 写真の配置
  2-06 デザインに広がりを感じさせる
category:文字の扱い
  2-07 Webフォントの効用
  2-08 見出しの表現
  2-09 文字のバランスとジャンプ率
  2-10 インターフェースとしての文字
category:ナビゲーションとリンク
  2-11 ナビゲーションの位置とアニメーション
  2-12 グローバルナビの役割
  2-13 ナビゲーションの存在感
  2-14 ナビゲーションの整理
  2-15 クリックを促すリンクの設定
  2-16 フラットデザインでも押したくなるボタン
  2-17 スマートフォン向けのナビゲーション
category:写真とグラフィック
  2-18 写真のスペース
  2-19 好感度の高いスライドショー
  2-20 コンテンツへのリンク
  2-21 ビルボードのデザイン
  2-22 PCでもスマホでもクリックしやすい画像
  2-23 コンバージョンが上がるバナー
  2-24 写真のトリミング
  2-25 複数写真を並列に扱う
  2-26 組み写真によるデザイン
  2-27 人物写真の扱い
  2-28 ピクトグラムやアイコン
  2-29 背景写真の加工
  2-30 シンボルマークとしてのファビコン
category:配色
  2-31 読みやすい配色
  2-32 食欲をそそる配色
  2-33 ターゲットに合った配色
category:SEO、コピー
  2-34 検索エンジンに登録するWebページ情報
  2-35 新規客を獲得するためのコンテンツ
  2-36 Web原稿の編集
  2-37 長い文章の扱い
  2-38 altの設定をする
  2-39 フォームで情報を集める

Part3 Tutorialコース:BiNDでレスポンシブサイトを作ってみよう
  3-01 テンプレートの選択
  3-02 背景やカラーの設定
  3-03 SiGNとSHiFTで作るロゴとビルボードのデザイン
  3-04 ナビゲーションの設定
  3-05 Webフォントによる見出し・本文の設定
  3-06 SiGNProで作るバナー
  3-07 CSSテキストボタンの作成
  3-08 スクリーンサイズに追従する画像幅の設定
  3-09 フッタの作成
  3-10 サイト名、ページタイトル、ディスクリプションの設定
  3-11 レスポンシブの設定
  3-12 フォームのデザイン
  3-13 サイト公開の設定

佐藤 好彦[サトウヨシヒコ]
Webデザイナー、グラフィックデザイナー。Webなどのデザイン・プランニングを中心に、デザイン関連の書籍や雑誌記事の執筆、講演なども手がけている。著書に『デザインの教室ー手を動かして学ぶデザイントレーニング』、『デザインの授業ー目で見て学ぶデザインの構成術』(以上MdN)、『ビジネス教養としてのデザイン』、『フラットデザインの基本ルール』(インプレス)、『ウェブサイト制作のワークフローと基礎技術』(技術評論社)など。東京造形大学非常勤講師。

坂本 典子[サカモトノリコ]
コハルデザイン代表。フリーランスWebデザイナー。PC・スマートフォンサイトの制作を中心に、ロゴやイラスト、キャラクターデザインなども行う。やわらかい女性向けのデザインが得意分野。共著『WordPressではじめるかわいいウェブサイト』(ビー・エヌ・エヌ新社)がある。

そうま かおり[ソウマカオリ]
4ReaL Design主宰。Web制作プロデューサー/デザイナー。Webデザインや紙物のデザインを中心にフリーランスとして4ReaL Designで活動中。BiND3からビジネスアイテムとして使い続けており、フルカスタマイズ化をつねに研究し、クライアントにフィードバックしている。

栗谷 幸助[クリヤコウスケ]
1990年代後半よりWebデザイナーとしてのキャリアをスタートし、2000年からはクリエイター養成スクール「デジタルハリウッド」や「デジタルハリウッド大学」をはじめとした様々な教育機関でWebデザインの講師として活動を行う。現在はクリエイティブセンター福岡に所属し、クリエイターの育成やコミュニティーの活性化などに従事。著書に「デジハリ・デザインスクール」シリーズ各種(共著、技術評論社)などがある。

アマルゴン[アマルゴン]
宮崎綾子。編集者。ひとり編プロ、アマルゴンを運営。ITを中心に幅広いジャンルのコンテンツ企画・制作を行う。編著に『EPUB3スタンダード・デザインガイド』(マイナビ出版)、『WordPressではじめるかわいいウェブサイト』(ビー・エヌ・エヌ新社)、共著に『Amazon Kindleダイレクト出版 完全ガイド』(インプレス)など。

デジタルステージ[]

内容説明

考えながら、作りながら、習得する。プロではないけれどWebサイトを作らないといけない人のための、Webデザインの「学校」です。HTMLの知識無しで、レスポンシブWebサイトまで作れる「BiND」を使えば、簡単にキレイなサイトを作れるようになります!

目次

1 Basicコース―Webデザインの基本を覚えよう(Webサイトが見えるしくみ;Webサイトのデータ構造;モバイル時代のWebサイトはこう違う ほか)
2 Drillコース―Webデザイン力をアップしよう(ページのレイアウト;文字の扱い;ナビゲーションとリンク ほか)
3 Tutorialコース―BiNDでレスポンシブサイトを作ってみよう(テンプレートの選択;背景やカラーの設定;SiGNとSHiFTで作るロゴとビルボードのデザイン ほか)

著者等紹介

佐藤好彦[サトウヨシヒコ]
Webデザイナー、グラフィックデザイナー。Webなどのデザイン・プランニングを中心に、デザイン関連の書籍や雑誌記事の執筆、講演なども手がけている。東京造形大学非常勤講師

坂本典子[サカモトノリコ]
コハルデザイン代表。フリーランスWebデザイナー。PC・スマートフォンサイトの制作を中心に、ロゴやイラスト、キャラクターデザインなども行う。やわらかい女性向けのデザインが得意分野

そうまかおり[ソウマカオリ]
4Real Design主宰。Web制作プロデューサー/デザイナー。Webデザインや紙物のデザインを中心にフリーランスとして4Real Designで活動中

栗谷幸助[クリヤコウスケ]
1990年代後半よりWebデザイナーとしてのキャリアをスタートし、2000年からクリエイター養成スクール「デジタルハリウッド」や「デジタルハリウッド大学」をはじめとした様々な教育機関でWebデザインの講師として活動を行う。現在はクリエイティブセンター福岡に所属し、クリエイターの育成やコミュニティーの活性化などに従事

アマルゴン[アマルゴン]
宮崎綾子。編集者。ひとり編プロ、アマルゴンを運営。ITを中心に幅広いジャンルのコンテンツ企画・制作を行う(本データはこの書籍が刊行された当時に掲載されていたものです)
※書籍に掲載されている著者及び編者、訳者、監修者、イラストレーターなどの紹介情報です。

最近チェックした商品