第21講

演習問題

この章では、教材全体の内容を使って、判断、確認依頼、修正依頼を練習します。

演習1：目的を決める

課題架空の福祉事業所サイトのトップページを作るとします。最初に目に入ってほしい情報を1つ、次に見てほしい情報を2つ決めてください。

例：最初に「視覚障害のある方の外出を支援します」という見出し。次に「サービス内容」と「お問い合わせボタン」。

課題次の意図を、目視確認者への依頼文にしてください。「問い合わせボタンを一番目立たせたい。カードは3つ横並びにしたい。スマートフォンでは縦並びにしたい。」

模範例：トップページのサービス紹介部分を確認してください。問い合わせボタンが主操作として一番目立っているか、3つのカードがパソコンでは横並びで均等に見えるか、スマートフォンでは自然な順序で縦並びになるかを確認してください。

課題目視確認者から「なんとなくごちゃごちゃしている」と言われました。第15講の評価語を使って、追加で聞く質問を3つ作ってください。

課題スクリーンリーダーでは正しい順序で読めるページがあります。しかし、晴眼者から「ボタンが分かりにくい」と言われました。原因として考えられることを3つ挙げてください。

課題「見出し、説明文、3つのサービスカード、問い合わせボタン」をWordPressで作る場合、どのブロックを使うか考えてください。

例：全体をグループブロックに入れる。見出しブロック、段落ブロック、カラムまたはカード用グループ、ボタンブロックを使う。余白はスペーサー乱用ではなく、テーマ側の余白設定またはCSSで統一する。

課題スマートフォンで見たとき、見出しが1文字ずつに近い不自然な改行になっていると報告されました。修正依頼文を書いてください。

模範例：スマートフォン表示で見出しが不自然に細かく改行されているようです。見出しの最大幅、文字サイズ、折り返し設定を調整し、2〜3行程度で自然に読める表示にしてください。あわせて横スクロールが発生していないかも確認してください。

最後に、次の条件で架空のトップページを設計してください。

この課題の目的は、HTMLやCSSを完全に書くことではありません。見た目の意図を言葉で説明し、確認依頼できる状態にすることです。