文字・余白・記入欄を整え、A4で読みやすくする

画面上で小さく全体を見るだけでは、本文の読みにくさや記入欄の不足を見落とします。研修テキストは実際の大きさで読み、書き、印刷して確かめます。文字を小さくして押し込む前に、情報の優先順位と余白の役割を見直しましょう。今回は内容を固定し、表示の問題を一つずつ修正します。

学習目標

本文と記入欄を実際の大きさで確認する。
文字・余白・改ページを部分修正する。
印刷用PDFと編集元を照合する。

本文・見出し・注記に役割を持たせる

本文は説明を続けて読むための文字です。見出しは次に何を学ぶか探すため、注記は条件や注意を補うために使います。すべてを同じ太さや大きさにすると、どこから読むか迷いやすくなります。見本では大きなページ見出し、中くらいの節見出し、本文、補足という段階を作っています。強調は目標に関わる判断へ絞り、全文を太字にしません。

A4の本文サイズは、画面上の見栄えだけで決めず、印刷した状態で確かめます。最初は11〜12ポイント程度を目安にできますが、対象者、書体、行間、印刷条件によって読みやすさは変わります。この数値は一律の合格基準ではありません。注記だけ極端に小さくして、架空条件や未確認の説明を読めなくしないことが大切です。

長い行は視線を戻す位置が分かりにくくなります。一方、細かく改行しすぎると文のつながりが切れます。文章の意味のまとまりを保ち、見出しと直後の本文を近付けます。段落の間には適度な余白を置き、別の話題との境界を作ります。AIへは「読みやすく」だけでなく、どの段落で行が長いか、どの見出しが本文から離れているかを示しましょう。

整列と余白で読む順番を示す

ページの左右の端をそろえると、内容の関係が見えやすくなります。元情報表、説明文、回答欄の始点を必要以上にばらばらにしないでください。関連する見出しと本文は近付け、別の作業へ移る箇所には余白を置きます。線や囲みを増やす前に、距離だけで区別できないかを考えると、落ち着いた紙面にしやすくなります。

余白には複数の役割があります。ページの外側は印刷や持ちやすさのため、段落間は情報の区切り、回答欄は書くための場所です。全部を「空いている部分」と考えて減らさないでください。特に練習ページは文章が少なくても、受講者の作業が多いページです。見た目の密度を説明ページとそろえる必要はありません。

見本を修正する際は、元情報Bの表と回答欄が同じページにある理由を保ちます。表を前のページへ移すと、AとBを取り違える負担が増えることがあります。レイアウト変更は、学習の順番へ影響します。余白の改善案を採用する前に、受講者が何を見ながら答えるかを確認し、必要な参照情報を遠ざけないようにしましょう。

色だけで正誤や用途を区別しない

練習用の誤答例を赤、正しい例を緑にするだけでは、白黒印刷や色の見え方によって区別しにくくなります。「練習用・誤りあり」「完成例」「解答」と文字で用途を示してください。色は補助として使い、意味は見出しや言葉でも伝えます。同様に、会場が未確定であることも色の印だけで済ませず、「確認中」と書きます。

本文は背景との明暗差を確保します。淡い文字を淡い色の面へ置くと、画面では雰囲気が良くても印刷時に読みにくくなります。強調色は見出しや細い帯へ限定し、長文は濃い文字で表示すると安定しやすくなります。リンクは色に加えて下線などで識別し、印刷後にも必要な参照先が分かる説明を添えます。

装飾の図やアイコンを入れる場合は、説明や行動に役立つかを判断します。今回は元情報と文章の照合が中心なので、大きな挿絵は必須ではありません。画像を増やして記入欄を狭くするなら、学習への効果が低い可能性があります。サムネイルにはコースを示すキャラクターを使い、教材本文では情報の比較と記入を優先するよう、媒体ごとの役割を分けます。

記入してからページの収まりを見る

回答欄が空の状態で収まっていても、入力すると下の内容が押し出されることがあります。見本の欄へ想定する長さの回答を入れ、最後の行まで見えるか確認してください。HTMLの画面、保存後のHTML、印刷プレビュー、PDFの四つで見ます。自動で見えない部分を切り捨てる処理を使うと、受講者の回答が失われたように見えるため注意が必要です。

ページがあふれた場合は、どの要素が原因かを特定します。長すぎる見出し、必要以上の段落間隔、想定を超えた回答などで対応が違います。短い案内を書く課題なら、重要な6項目を残して文章を簡潔にする練習にもできます。ただし、回答を短くする指示を後から採点条件に追加しないでください。必要な量を書ける欄は制作者が用意します。

手書きの使いやすさは、ブラウザーの動作確認だけでは判断できません。印刷した紙へ実際に書く試しが必要です。手元で印刷できない場合は、その確認を未実施として残し、PDFの寸法と余白を確認した結果とは分けてください。未確認の項目を「見た目で大丈夫そう」と完了にせず、配布前に誰が確かめるかを決めます。

PDFを別の成果物として検品する

最終HTMLからPDFを書き出したら、ページ数が8であること、用紙がA4縦であること、文字や表が切れていないことを確認します。見出しだけがページ末に残ったり、解答が次ページへ押し出されたりしていないかも見ます。印刷用のスタイルが正しくても、ブラウザーの設定で倍率や余白が変わることがあるため、出力したPDFそのものを開いてください。

本文は検索や選択ができる文字として残っているか確かめます。全ページを順に開き、検索では見つからない見切れや重なりも確認します。表の罫線だけが残り文字が欠ける場合などは、目視の点検が必要です。日付や申込先を検索し、正本と一致する箇所へ移動できれば、後の点検にも役立ちます。画像化されたページでは、見た目が同じでも語句の検索やコピーができない場合があります。この教材では文字をHTMLで組み、PDFへも文字として出力する方針です。必要以上に全ページを画像へ変換しません。

画面とPDFを並べ、AとBの会場条件、練習1の五つの誤り、解答、版番号を照合します。色の差より、情報の欠落や改ページの問題を先に直してください。修正したら再びPDFを出し、影響したページを確認します。過去のPDFを同じ場所へ残す場合は旧版と分かる名前にし、受講者が誤って選ばないよう配布先には最終版を置きます。

実践課題：実寸と入力後の状態を点検する

完成見本か自分のHTMLで、説明ページと練習ページを一つずつ選びます。本文の読みやすさ、見出しの階層、欄の広さを実際の大きさで確認し、回答を入力して保存・PDF出力を試してください。修正は一度に一種類へ絞り、内容や解答を変えない条件も指定します。

修正例は「4ページ目の五つの回答欄の間隔をそろえ、欄名を残す。誤答例と参照先は変更しない」です。確認記録には、画面とPDFの結果を別々に書きます。紙への印刷をしていなければ「手書き確認は未実施」と残してください。すべての欄を実際に使ったかを区別すれば、見た目だけの点検を学習者による検証と取り違えずに済みます。

まとめ：読みやすさと書きやすさを両方確かめる

文字の階層、整列、余白、色の使い方は、受講者が読む順番と書く作業を支えるために整えます。空欄の画面だけでなく、回答入力後と印刷用PDFも確認しましょう。A4の実寸や紙への記入を未確認なら、その状態を記録します。表示が整ったら、次は実際の試読で説明と設問が伝わるかを確かめます。

自社の制作へ取り入れる

自社の制作物と判断に迷う工程を整理し、法人研修・AI導入支援の内容をご覧ください。