HTML&CSSコーディング ユーザーにやさしいWebデザインテクニック HTML Living Standard 準拠

構成数 : 1枚

本書をご利用いただく前に

第1章 よりよいWebサイトをめざして
STEP1 Webサイトを見直す
STEP2 改善方針を確認する

第2章 Webページの要素のレイアウト
STEP1 フレックスボックスレイアウトとは
STEP2 フレックスボックスレイアウトを使って
配置する

第3章 Webページの要素の変形と変化
STEP1 要素を変形させる
STEP2 要素の変化を設定する
STEP3 トランスフォームとトランジションを組み合わせる

第4章 画面幅に適したメインビジュアルの設定
STEP1 編集するWebサイトを確認する
STEP2 編集するWebページを確認する
STEP3 高さが変わらない画像を配置する
STEP4 画面幅によって表示画像を切り替える

第5章 画像を活用したボタンの作成
STEP1 編集するWebページを確認する
STEP2 画像にボタンのような効果を付ける
STEP3 レスポンシブWebデザインに対応させる
参考学習 画像に様々なグラフィック効果を付ける

第6章 カード型デザインの作成
STEP1 編集するWebページを確認する
STEP2 カードを作成する
STEP3 レスポンシブWebデザインに対応させる



第7章 ナビゲーションメニューの作成
STEP1 編集するWebページを確認する
STEP2 セレクタの結合子を記述する
STEP3 プルダウンメニューを作成する
STEP4 ハンバーガーメニューを作成する
STEP5 ヘッダーを固定する

第8章 フッターの作成
STEP1 編集するWebページを確認する
STEP2 フッターの構成を作成する
STEP3 フッターのレイアウトを設定する
STEP4 レスポンシブWebデザインに対応させる

第9章 見出しデザインの作成
STEP1 編集するWebページを確認する
STEP2 下線付きデザインの見出しを作成する
STEP3 見出し付き囲み枠を作成する

第10章 開閉できる目次の作成
STEP1 編集するWebページを確認する
STEP2 目次の開閉の仕組みを作成する
STEP3 目次のレイアウトを設定する
STEP4 ページ内リンクの動作を調整する

第11章 Webページの先頭へ戻るボタンの作成
STEP1 編集するWebページを確認する
STEP2 ボタンを作成する

第12章 アクセス数向上を意識した設定
STEP1 設定する内容を確認する
STEP2 ファビコンとアップルタッチアイコンを
設定する
STEP3 ソーシャルメディアボタンを設定する
STEP4 OGPを設定する

索引