セクションとレイアウト

項目が増えてきたら、見出しでまとめたり、ページを分けたりして、入力しやすい形に整えます。この記事では、セクション・ページ・タブの使いかたと、項目の幅の決めかたを説明します。

セクション・タブ・ページ

左ペインの下にあるボタンで、まとまりを足します。

まとまり	使いどころ
セクション	見出しと枠で項目をまとめる。値は持たない。「お客様情報」「点検項目」など
タブ	項目の組を、タブで切り替える
ページ	入力を何ページかに分ける。「基本情報」「写真」など

• ページ送りの設定が「自動」のときは、項目が25を超える、またはセクションが3つを超えると、セクションごとに分かれます。
• ページを移るときは、そのページ分だけが確かめられます。最後の送信では、全ページが確かめられ、エラーのあるページへ戻ります。
• 入れ子は、2階層までです。繰り返しの中に繰り返しは置けません。セクションの中にセクションも置けません。

セクションの見せかたは、「ふつう」「カード」「枠線」「折りたたみ」から選べます。

項目の幅

項目の幅は、1行を12に分けた考えかたで決まりますが、画面では 全幅 / 1/2 / 1/3 / 2/3 / 1/4 のボタンで選びます。

• 幅の合計が1行に収まらないときは、次の行に折り返されます。
• スマホでは常に1列 です。幅の設定にかかわらず、全幅になります。

フォーム全体の見た目

項目を選んでいないときは、右に フォームの見た目 が出ます。

設定	選べるもの
ルック	スタンダード・カード・ミニマル・紙の様式・会話風。選択肢の見せかた、節の囲いかた、詰め具合がまとめて変わります
詰め具合	コンパクト・ふつう・ゆったり
フォームの横幅	おまかせ・狭い・ふつう・広い・全幅
ラベルの位置	おまかせ・上・左。左にすると紙の申込書のような並びになります。スマホでは上に戻ります
細かく決める	書体など

横幅の目安は、狭い560px、ふつう720px、広い960pxです（本文の幅）。

端末ごとに確かめる

上の帯の端末の切り替え（スマホ390px・タブレット834px・PC）で、回答者の見え方に近づけて確かめられます。組織のブランド（基調の色・角の丸み）と、アプリの色も反映されます。

入力のしやすさ

右の「入力のしやすさ」で、次のスイッチを切り替えられます。

• 入れ終わった項目に ✓ を出す
• 「必須はあとN項目」を出す
• 書きかけをこの端末に取っておく

関連する記事

• フォームデザイナーの使いかた
• 項目ライブラリから選ぶ
• 必須と入力チェック
• スマホ・タブレットで使う