ホームページで「当日の持ち物」を押せば説明を読めるのに、印刷すると見出しだけで、持ち物の一覧がありません。開いたまま印刷し直せば出ることがありますが、利用者がページのすべての項目を開いてから印刷するとは限りません。ブラウザーの印刷プレビューで、閉じた場合と開いた場合を見比べると、制作担当へ直してほしい箇所を具体的に伝えられます。
島田市周辺で受付やイベントの案内をホームページに掲載する事業者向けに、見出しを押して本文を出す開閉式の欄を対象に確認します。このような欄は「折りたたみ」「アコーディオン」などと呼ばれます。公開ページから同じ案内を印刷するときに、利用者が直前にどの項目を開いたかで必要な説明が欠ける問題を取り上げます。
閉じた欄と印刷用の欠落を別々に観察する
折りたたみは、見出しだけを並べ、読みたい項目の説明を選んで開ける表示です。画面では何があるかを短い一覧で見渡せます。紙の見出しは押せないため、本文がないまま印刷されると、見出しがあっても内容は届きません。たとえば持ち物の見出しは載るのに「初回の方は控えを一枚持参」という文が消える場合、紙を手渡された人は何が必要か判断できません。最初に見つけたいのは、印刷された紙の見た目全体より、閉じた状態で失われる一文です。
WordPress.orgのサポートフォーラムには、開閉表示のプラグインを使ったページで、欄を閉じたままでも印刷用のプラグインから内容を出したいという運営者の相談があります。画面上では高さをゼロにし、透明にして内容を隠す指定が付いた例が示されています。返信では、使っているプラグインがどのように隠しているかを調べる必要があると案内されました。ローカル環境の個別相談で修正結果は確認できませんが、見えなくする仕組みを一つずつ確かめる必要がある場面です。
別のブラウザー利用者の相談では、長い記事が通常の印刷で一枚目の先から切れたという報告があります。印刷プレビューと用紙の両方が白紙になり、別のブラウザーで出せたという報告もあります。どちらも折りたたみを原因とした報告ではありません。自分のページを確認するときは、閉じた部分だけが消えるのか、その場所から先がまとめて消えるのか、印刷画面全体が表示されないのかを記録します。原因の候補が違うので、制作担当に「印刷できない」とだけ伝えるより、見えている部分を併せて知らせます。
同じページを閉じた状態と開いた状態で試す
実際に案内している公開URLをパソコンのブラウザーで開きます。管理画面のプレビューから始めると、編集画面用の見た目や権限が混ざることがあります。利用者から印刷方法を聞ける場合は、ブラウザーのメニューやショートカットから印刷したか、ページ内の印刷ボタンを押したかも聞きます。ボタンが別の画面を開く作りなら、印刷対象が同じとは限りません。二つの入口をまとめて扱わず、再現した方を最初に検査します。
まず公開ページの折りたたみを開いて、消えたと聞いた一文が元から載っているか確認します。たとえば「持ち物」の末尾にある「控えを一枚お持ちください」を目印に決めます。同時に、折りたたみの前後から一文ずつ選び、場所を控えます。この三つを比較すると、「中だけが消えた」「後ろも消えた」「別の案内を開いていた」といった違いを見分けやすくなります。社内の案内で説明を修正した直後なら、同じ版の文言で試しているかも確かめます。
次に対象の欄を閉じ、ブラウザーから印刷プレビューを開きます。パソコンのChromeでは、公式ヘルプにある印刷操作を使えます。WindowsとLinuxではCtrlとP、MacではCommandとPの組み合わせです。機能名の違う環境ではメニューの印刷を使います。最初の確認は紙に出さず、プレビューのページ数と目印の一文を探します。二枚目や三枚目に移動しただけなら本文欠落とは扱いません。末尾まで見て、見出しと本文の組み合わせを記録します。
一度プレビューを閉じ、同じ欄だけを開いてから、同じ出力先・用紙・倍率・ページ指定でやり直します。印刷範囲はページ全体にし、選択した文章だけを印刷する設定や簡略化した表示を使った場合は別の試験として扱います。条件を同時に変えると、欄を開いた効果なのか、倍率を変えた効果なのかが判断できません。ページに「開く」ボタンと「印刷」ボタンがあるなら、ブラウザーの印刷とページ内の印刷の両方を試して、操作の入口ごとに記録を作ります。
項目が複数並ぶページでは、同時に全部を開けるかも試します。持ち物を開いてから次に会場案内を開いたとき、持ち物が閉じる作りなら、利用者が全部開いてから印刷する案は使えません。手元では二つとも開けたように見えても、片方が閉じる途中の動きだった場合があります。操作が止まった後に、両方の目印が同時に画面にあるかを確かめます。親の欄の内側にさらに別の欄がある場合も、外側を開いたときと、内側まで開いたときを分けて確認します。
| プレビューで起きたこと | 次に見る箇所 |
|---|---|
| 閉じると本文だけ消え、開くと本文が出る | 折りたたみの開閉状態に依存している。別の項目を開くと再び閉じるか確かめる。 |
| 開いても本文だけ出ない | 印刷対象に選ばれた領域と印刷用表示を調べる。ページ内ボタンとブラウザーの印刷で比較する。 |
| 見出しも後続の文章も途中から出ない | ページ範囲や改ページ、印刷用の枠の高さを確認する。開閉だけを原因にしない。 |
| プレビューには出るが実際の紙だけ欠ける | 同じ用紙条件で印刷PDFにも出るか確認し、物理プリンター固有の差を分けて報告する。 |
何で折りたたみを作っているかを制作担当と確認する
見た目が同じ開閉欄でも、制作方法は複数あります。WordPressの詳細ブロックの公式文書では、要約を押すと隠れていた内側のブロックを表示できると説明されています。最初から開く設定もあります。同じ名前でグループ化すると、一つ開いたときに同じ組の他の欄は閉じることがあります。ページ編集画面で対象の欄を選び、ブロック名やグループの設定を確認できれば、制作担当にその情報を渡します。テーマや追加プラグインの独自の部品であれば、似た名前の設定を変える前に担当者へ確認します。
HTMLの仕様では、詳細を開閉する標準の要素と、同じ名前のグループで同時に開く項目を一つにする動作を定めています。他方、プラグインで作った折りたたみは、本文を画面に置いて見えなくしているもの、開く操作の後に本文をページへ追加するもの、印刷ボタンがページの一部だけを取り出すものがあります。画面の見た目では区別しにくいため、制作担当には「印刷プレビューを出した時点で、必要な文章が印刷対象に入っているか」を調べてもらいます。表示の指定を変えるだけで扱えるのは、印刷するページに本文が含まれている場合です。
利用者が閉じた説明まで見せることと、内部で隠している要素を全部見せることには大きな違いがあります。調べる対象は公開案内の指定した欄です。問い合わせフォームの入力欄、管理者用の編集部品、表示条件付きの案内などをまとめて印刷用に表示すると、関係ない内容が印刷されたりページの構成が壊れたりします。制作担当に公開原稿のどの見出しと本文を対象にするかを指定し、同じ見た目の部品を使う別ページへの影響も確認します。
現場ですぐ一枚必要なら、開くと印刷プレビューに出ることが確認できた欄については、必要な欄を開いてから印刷する手順を臨時に使えます。複数の欄を同時に開けず、必要な文が一度に出ない場合は、その方法で案内を渡せるとは判断できません。公開ページに「すべて開いてから印刷してください」と書く前に、実際に同時に開けることと、印刷画面で内容が落ちないことを確かめてください。利用者に毎回の操作を任せる方法は、制作側の修正の受入判定と分けて扱います。
開閉状態に依存しない形を選ぶ
最初に検討できるのは、失われた一文とその条件を折りたたみの外に移すことです。たとえば持ち物の欄で「初回のみ控え一枚」が欠け、ほかの説明は画面で読む補足なら、「持ち物」の見出しの下にその一文を置きます。残る補足だけを開閉できるようにすると、画面でも印刷でも同じ一文を読めます。同じ条件を折りたたみの内外に書くと、片方だけ更新されて内容が食い違う可能性があります。本文の元になる場所を一つにし、位置を変えた後に見出しと条件の対応を読み直してください。
各欄の本文がどれも必要で、項目が少ない場合は、折りたたみを通常の見出しと段落に置き換える案があります。画面で読む量が増えるため、トップに関係する見出しがどこにあるかを確認し、説明が長ければ短い導入と見出しで移動しやすくします。画面での開閉が重要な理由があるなら、紙に出すためだけに開閉をなくす前に、次の方法も検討します。画面側の使いやすさと、同じ内容を印刷に渡せるかを分けて比べると、機能の要否を判断できます。
画面での折りたたみを維持する必要がある場合は、制作担当に印刷時だけ対象欄の本文を表示する案を頼めます。MDNの印刷ガイドは、画面と紙や印刷PDFで異なる表示指定を使えると説明しています。折りたたみの部品が画面から本文を隠す方法は一種類ではありません。本文を見せる指定を足しても、高さがゼロのまま、透明のまま、印刷対象から外れたままでは出力できません。部品と実際の印刷経路を確認した上で修正し、ページ全体に共通の設定を先に変えないようにします。
印刷前にプログラムで開き、プレビューを閉じた後に元の状態へ戻す設計もあります。その場合は、同じ名前の欄を一斉に開けると仮定せず、画面で一つしか開かない組をどう扱うかまで検討します。普段開いている欄を記録し、印刷の取消後も元に戻るか、同じページで二回続けて印刷しても状態がずれないかを試します。使うブラウザーやページ内ボタンによって処理が通る道が違う場合があるため、画面での開閉の動作を変えずに印刷の結果をそろえられるかを制作担当と確認します。
「初期状態を開く」に変えるだけで、ページを開いてすぐ印刷する人の欠落が減る可能性があります。ただし利用者が一度閉じられるなら、閉じた状態で同じ症状が残るかを確かめてください。開いている画面の確認だけで終了すると、今回の発生条件が残ります。表示を変えた理由が「印刷する人にもこの説明を届けること」なら、修正後の受入試験には必ず閉じた状態を入れます。
修正依頼には残したい文と再現操作を記録する
架空例として、体験教室の案内に「持ち物」と「集合時刻」の二つの欄があり、どちらか一方だけを開けるとします。紙を準備する受付担当は、持ち物と集合時刻を一度に渡す必要があります。制作担当には、同じ公開案内の印刷に両方の見出しと指定した本文が入るようにしたいと伝えます。どちらを開いても一方が消える現象を、次のように記録できます。
- 対象の公開URLと確認日時。最初にアクセスしたURLと、印刷ボタンで別画面へ進む場合はそのURLも区別する。
- 使ったブラウザーと端末。用紙、倍率、向き、全ページ指定かどうか、出力先を記録する。
- 再現する操作。「持ち物」を閉じた状態で印刷し、見出しの後の指定文がないことを記録。次に「持ち物」を開き、同じ条件のプレビューで指定文が出ることを確認。
- 欠けてはいけない文。「持ち物」の下に控えの説明、「集合時刻」の下に開始前の集合条件をそれぞれ表示する。見出しだけの出力は不合格。
- 完了条件。最初の開閉にかかわらず二つの本文が対応する見出しの下に一度ずつ出て、途中の改ページでも文が読める。画面専用の開閉ボタンなど、紙に出さないと決めた要素が混ざっていない。印刷を取り消した後もページを操作できる。
確認に渡す画像は、公開ページの欄が閉じている画面と、見出ししか出ない印刷プレビューを一枚ずつ用意します。説明を開いた状態のプレビューもあれば、欠落との差を見せられます。印刷の送り先に表示される社内プリンター名などが写る場合は、伝える必要がある情報だけを残します。指定文が複数ある場合は、全文を丸ごと表に写す代わりに、各欄から識別できる一文と改訂日を控えます。制作担当に別のページの文章を参照させてしまう取り違えを減らせます。
修正後は閉じた状態からプレビューと紙を通す
修正したページを新しく開き、まず変更前に欠落したブラウザーと条件で試します。一項目も開かない状態、持ち物だけ開く状態、集合時刻だけ開く状態を比べます。どの状態でも両方が印刷対象に含まれれば、利用者が画面でどの欄を開いていたかに依存しないと確認できます。親子の開閉がある場合は、親が閉じている状態と、親を開いて子だけが閉じている状態も加えます。画面で必要な折りたたみを残す案では、印刷前後に開閉操作と画面での見出し順も試します。
ページ内に印刷ボタンを残す場合は、そのボタンを押した試験をブラウザーのメニューからの印刷とは別に行います。たとえばボタンが案内部分だけを別画面に表示するなら、通常の画面に加えた印刷用の指定がその別画面に反映されるかを確認します。修正できた経路が一つだけなら、利用者が実際に使う入口と合わせて結果を残します。二つの経路の片方だけに古い説明が出る場合は、開閉の問題と分けて、別画面が参照する原稿を照合します。
本文が出ることを確認したら、すべてのプレビューページを見ます。見出しが前ページの末尾、本文が次ページの先頭に来る場合は、次の紙でもどの項目か判断できるかを見ます。項目を一枚に収めようとして長い説明を極端に縮小すると、文字は含まれていても読めなくなります。用紙を増やして構わない場合は、表や段落が途中で欠けず、読み進められる方を合格とします。短い原稿だけでなく、実際に公開する長さの原稿で境界を試すと、後から説明を追加した時に再発しやすい箇所も見つけられます。
紙を使う業務なら、プレビューの後に通常使う用紙で一部出し、必要な一文と見出しが読めるか確かめます。プレビューに本文が出るのに紙だけ欠けたら、確認を印刷の仕組み側へ分けます。Microsoft Edgeの公式案内でも、別のサイトや文書、アプリでの印刷結果を比べる手順が案内されています。別のブラウザーや印刷PDFで読める場合でも、実際に使う環境の用紙で読めたかは別に記録します。PDFに保存する機能を比較に使うときは、保存したファイルを開いて末尾まで確認してください。
最後に、プレビューをキャンセルしてから画面へ戻り、閉じた欄と開いた欄が操作できるかを確かめます。印刷前だけ画面を変更する実装では、キャンセル直後の見え方にも注意します。公開後にも、利用者が入るリンクから同じテストを一度行い、結果を公開URLと一緒に残します。次に折りたたみの原稿を増やすとき、変更した欄を開かずに一度プレビューする運用にすると、前回どの条件で確認したかを引き継げます。
折りたたみの案内を維持しつつ、印刷時の見え方を整えたい場合は、LIFESEEDSのホームページ制作サービスをご覧ください。お問い合わせには、対象の公開ページと、閉じた場合に消える見出しまたは文章を添えていただくと、修正範囲を整理できます。
コメント