目次

表紙
はじめに
目次
本書の使い方
ノーコードWeb制作ツール「Studio」について
CHAPTER01 Studioを使う前に知っておきたい最低限の基本と下準備
PART01 Webサイトの種類
PART02 Webサイトの構造
PART03 レイアウト
PART04 レスポンシブWebデザイン
PART05 写真・イラスト・アイコン
PART06 フォント
PART07 配色
PART08 イメージ固め
PART09 ワイヤーフレーム
COLUMN Webデザインの企画書 ムードボード・ワイヤーフレーム
CHAPTER02 ページを作りながら基本操作を覚えよう
PART01 Webサイトを作ってみよう
PART02 ボックスレイアウトの基本
PART03 レイヤーの基本
PART04 HTMLタグの基本
PART05 新規プロジェクトの作成
PART06 カラーとフォントの設定
PART07 ヘッダーの作成
PART08 ホバーアニメーションを設定する
PART09 メインビジュアルの作成
PART10 あしらいの配置（絶対位置）
PART11 レイアウトのリスト化
PART12 ソーシャルアイコン
PART13 CTAセクション
PART14 フッター／トップに戻る
COLUMN 実装マイルールを作ろう
CHAPTER03 コンテンツが充実した下層ページを作る
PART01 下層ページ
PART02 コンポーネントの作成
PART03 下層ページの作成／コンポーネントの挿入
PART04 プロフィールの作成
PART05 カルーセル
PART06 グリッドレイアウト
PART07 テキストの一覧
PART08 問い合わせページ
PART09 THANKSページ/送信設定
PART10 プライバシーポリシーページ
COLUMN デザインスキルアップに繋がるデザイン分析
CHAPTER04 CMSを構築して記事を作成する
PART01 CMSの基本
PART02 CMSモデルの作成
PART03 プロパティの追加・編集
PART04 記事の編集画面
PART05 CMSとエディタを紐づける
PART06 タグのフィルタリング
PART07 CMSアイテム詳細ページの作成
COLUMN 共同でサイト制作ができる！コラボレーション機能
CHAPTER05 完成したサイトを公開しよう
PART01 公開するまでの流れ
PART02 リンクの設定
PART03 レスポンシブの調整
PART04 ハンバーガーメニュー／モーダル
PART05 動作検証して公開
COLUMN Studioで実現するウェブアクセシビリティ
CHAPTER06 クオリティがぐっと上がる！デザインアイデア集
PART01 文字組み・フォント
PART02 レイアウト
PART03 カラーリング
PART04 素材加工
PART05 カルーセル
PART06 埋め込み
PART07 ホバーアニメーション
PART08 出現時アニメーション
PART09 モーダル
PART10 404ページ
PART11 トグル
PART12 ボックス内スクロール
COLUMN Studio Storeで買えるオリジナルのテンプレート
書籍購入者特典の案内
INDEX
奥付

著者プロフィール

• gaz（著者）

  株式会社gaz (https://gaz.design/)
  世界初、唯一*のStudio Experts Platinumの株式会社gaz(ギャズ)は「想いをデザインで可視化する」をパーパスにWebサイト制作・UIデザイン・ブランディング事業を展開する福岡のデザインファーム。2019年の創業から現在までメガベンチャー、大手企業、スタートアップ、地方自治体など計400を超えるお客様の課題解決をデザインで支援。gazがUI/UXデザインを担当した「福岡市LINE公式アカウント」が2020年度グッドデザイン賞を受賞。2021年より代表 吉岡が福岡市DXデザイナーに受嘱。 *2025年2月時点