MdNCORPORATION

XHTML+CSSデザイン|基本原則、これだけ。

XHTML+CSSデザイン|基本原則、これだけ。

こもりまさあき、神森勉、小林信次、矢野りん
本体 2300円(税別) ※電子書籍の価格は各販売ストアにてご確認ください。
発売日 2008-03-31
仕様 B5変/200P
ISBN 978-4-8443-5977-7
XHTML+CSSデザインの基本の作法とヒントを見開き完結でコンパクトにまとめました。CSSの基礎を学びたい人、Web標準に沿ったデザインの考え方と手法を最短で知りたい人のために、現在のWebデザインの状況や基本的な考え方、よく使われるレイアウト手法やトラブル対策まで、やさしい語り口と明解な切り口で解説。

XHTML+CSSデザインの基本の作法とヒントを見開き完結でコンパクトにまとめました。CSSの基礎を学びたい人、Web標準に沿ったデザインの考え方と手法を最短で知りたい人のために、現在のWebデザインの状況や基本的な考え方、よく使われるレイアウト手法やトラブル対策まで、やさしい語り口と明解な切り口で解説したガイドブック。


※この本の一部をご覧いただけます。
019.pdf【PDFダウンロード】
039.pdf【PDFダウンロード】
057.pdf【PDFダウンロード】
080.pdf【PDFダウンロード】



■ページ見本





目次

Chapter 01 基礎知識
000 これからWebサイト制作を行うために

Chapter 02 情報整理・設計
001 Webデザインとは、情報を整理してユーザーに提供するということ
002 情報構造を設計することの大切さを常に頭の片隅においておく
003 ターゲットユーザー、ペルソナ、ユーザーシナリオの違いとは
004 多くのユーザーにとって使いやすいWebサイトを提供しよう
005 環境に左右されずアクセスできるWebサイトを提供しよう

Chapter 03 情報のマークアップ ─ 基本編
006 HTMLとXHTML、その違いを把握しておこう
007 自分のマークアップしたWebページにあった文書型を選択しよう
008 これからのWebサイトの文字コードは何を指定すべき?
009 XHTMLの冒頭に含まれる要素も実は重要な部分と考えよう
010 ヘッダに含まれるtitle要素はどのように記述するのか
011 meta要素にはWebページの文書情報などを記述しておく
012 head要素に含まれるlink要素についても理解しておこう
013 link要素をうまく活用して利便性を高める
014 JavaScriptやCSSの記述と現実的な利用方法
015 bodyの中の書き方次第でWebページの価値は変わる
016 文書上における意味を持たせるため、HTMLタグを的確に使う
017 情報構造を明確にし、それをうまく配置することも大事な仕事
018 アクセシビリティの向上とSEOの効果も得られるWeb標準準拠
019 見えない部分での操作性の向上を図ることもときには必要
020 id属性はページ中の特定の要素に名札を付けるものと考えよう
021 class属性は意味的に共通化できる要素にラベルを付けると考えよう
022 属性を用いて内容に意味づけできるmicroformatsの今後にも注目しよう

Chapter 04 情報のマークアップ ─ 応用編
023 ブロックレベル要素とインライン要素
024 サイトIDのマークアップは一貫性を重視しよう
025 ナビゲーションメニューはリストとしてマークアップする
026 見出しのマークアップは適切な意味づけが大事
027 本文のマークアップは文書構造を意味づけするための基本
028 より意味的にテキストや欧文をマークアップするには
029 リンクテキストをマークアップするには
030 特殊文字を使用する場合に気をつけたいこと
031 img要素のマークアップについて
032 必要に応じたイメージの活用とは
033 リスト項目を正しくマークアップするには
034 引用と引用元をマークアップするには
035 サイト運営者の連絡先や情報をマークアップするには
036 フォームに構造を持たせるには
037 テーブルをマークアップするには
038 div要素とspan要素について

Chapter 05 デザインの実装 ─ 基本編
039 CSS(カスケーディング・スタイル・シート)を使った視覚表現
040 CSSによるデザインを始めるならモダンブラウザを使う
041 CSS使用時はWebブラウザのレンダリングモードを確認しよう
042 CSSをXHTMLに適用する場合、基本は外部スタイルシートにする
043 メディアタイプを指定すれば、デバイスごとに違うCSSを適用可能
044 スタイルをXHTML内の要素に適用するために使うセレクタを知る
045 スマートなCSSを書くにはさまざまなセレクタをうまく使う
046 さまざまな疑似クラスと疑似要素をうまく利用して表現力をあげる
047 CSSの継承・スタイルの上書き・セレクタの個別性に注意しよう
048 ブラウザのレンダリング初期値をうまくハンドリングする
049 デザインラフをもとにして、XHTML+CSSによる実装を行う方法
050 デザインラフをCSSで実装するときに考えたいこと

Chapter 06 デザインの実装 ─ レイアウト編
051 CSSレイアウトの要、ボックスモデルを理解する
052 CSSを使ったテキスト回り込みの表現
053 clearプロパティの基本の使い方を理解する
054 CSSレイアウトの裏技、clearfixとは?
055 floatとpositionを使い分けてより機能的なレイアウトを実現する
056 floatを使った基本の2カラムレイアウト
057 floatを使った3カラムレイアウトの指定のコツ
058 ネガティブマージンについて
059 自由なレイアウトを実現するpositionプロパティの活用方法
060 positionを使ったマルチカラムレイアウト
061 カラム落ち発生時の対処方法
062 overflowプロパティを使ってコンテンツのはみ出しによるレイアウトの崩れを防ぐ
063 iframeを使わないフレーム風ブロック
064 min-/max-プロパティでレイアウトを制御
065 ブラウザサイズに合わせて表示幅が変わるリキッドレイアウト
066 ブラウザの文字サイズによって変化するエラスティックレイアウト

Chapter 07 デザインの実装 ─ 装飾編
067 テキストの装飾とフォントフェイスの指定方法
068 フォントサイズの指定は可読性を考慮すること
069 ボーダーの見え方の違いを理解する
070 背景に画像を配置して装飾的なデザインを実現する
071 リスト項目を横に並べるには
072 a要素のリンク疑似クラスを使ったロールオーバーを作るには
073 CSSのみでドロップダウンメニューを表現するには
074 idやclassを利用して特定の要素のスタイルを置き換えるには
075 リスト項目を装飾する手法のあれこれ

Chapter 08 トラブルシューティング
076 Internet Explorerに関する代表的なバグについて
077 Internet Explorer 7で変わったこと
078 CSSハックの存在
079 これがあると役に立つ制作時必携のアイテム
080 制作時の困った!こんなときはどうしたらよい?
081 ブラウザについて(1)
082 ブラウザについて(2)
083 Webサイトはどれぐらいのサイズで作ったらいいの?
084 携帯電話に対応したWebページは別で用意するべき?

オリジナルグッズ制作がもっと楽しくなる大活躍アイデアシリーズ

今よりぐっと"良い"写真に仕上げる!おすすめ解説書ラインナップ