8.3 構造化された文章の作成
8_2の最後では,読みやすい文章を書く必要性について説明しました.それでは,読みやすい文章とはどのような文章のことを言うのでしょうか.また,読みやすい文章を書くためにはどのようなことに気をつければよいのでしょうか.
構造化の考え方
次の2つのページにある文章を読み比べてみましょう.どちらのページの方が読みやすいでしょうか.また,その理由について考えてみましょう.
一目見るだけで,ページBの文章ははじめから終わりまで途切れずに続いているのに対し,ページAにある文章は見出し,パラグラフ(段落)がつけられているということがわかります.あるまとまった文章を理解しようとするとき,人間はその文章の内容をいくつかの「意味のまとまり」に区切るとともに,見いだされた「意味のまとまり」同士の関係を手がかりにしながら,文章全体の意味を把握しようとします.見出しやパラグラフは,読み手に文章の「意味のまとまり」を適切に把握させるための指標として機能します.ページAの文章のように,意味のまとまりに基づいて適切に構成された文章を,構造化された文章と呼びます.
構造化というと難しそうですが,要は文章同士の関係を明らかにしながら,論の流れがわかりやすいように全体の構成をつくりあげていくことです.ここでは「読みやすい文章」を「適切に構造化された文章」と捉え,適切に構造化された文章を作成するための練習を行います(決して,人の心をうつ文章,奇抜な文章を書くための練習ではありません).
構造化された文章の作成
ここでは,構造化された文章を作成するための基礎であるパラグラフ作成を中心に解説します.
(1)パラグラフを作成する
パラグラフ(段落)とは,内容的に関連のある複数の文(センテンス)の集まりで,それによって一つの考えを表現するものです.1つのパラグラフが1つの意味のまとまりを表しており,複数のパラグラフを論理的につないだものが文章全体となります.適切なパラグラフを作成することは,構造化された文章を書くための第一歩です.以下に,パラグラフを作成する際のガイドラインを示しますので,参考にしてください.
● パラグラフ作成のガイドライン
- ・1つのパラグラフには1つのトピック
- 一つのパラグラフには,内容的には一つの話題(トピック)だけを書くべきです. 二つ以上の話題(トピック)を1つのパラグラフに書くことはお勧めしません. 逆に,同じ事柄についての話が続いているにも関わらず,改行して別のパラグラフを作成することもお勧めしません.
- ・トピックセンテンス
- そのパラグラフにおける話題(トピック)についての中心的な考えは,一つの文(トピックセンテンス)によってまとめられるべきです.トピックセンテンスは,書き手がそのパラグラフで主張したい内容を端的に表現するものであるべきです.
- ・トピックセンテンスとその展開文
- 多くの場合,一つのパラグラフは,トピックセンテンスとそれを支えるいくつかの文から成りたっています.トピックセンテンス以外の文は,トピックセンテンスによって表現された主張をより具体的に説明するものであるか,他のパラグラフとの関係を明らかにするための文である必要があります.つまり,トピックセンテンスと関係のないことを書いてはいけません.
- ・トピックセンテンスの位置
- トピックセンテンスは,パラグラフの冒頭にあると読みやすく,目をひきます.日本語の文章においては,最も伝えたい内容がパラグラフの最後に置かれることがよくあります. 確かに,我々が物事を考える際の自然なプロセスに従って文章を書いていくと,そのようになりがちです. しかし,主張を明確に伝えるためには,原則的にはパラグラフの第一文にトピックセンテンスを置くように心がけます.読み手が論旨を把握するためにはその方が都合がよく,o曹+手も論の構造を自覚しやすくなります.
(2)見出しをつける
小さな意味のまとまりであるパラグラフを複数論理的に結合することによって,大きな意味のまとまりが作られたら,見出しをつけます.見出しは,読み手が文章を読み進めていくための指針(どのような内容についての文章なのか,事前に見出しを読むことによって予測することができます)となります.そのため,見出しは文章の意味内容を適切に示す必要があります.
● 練習問題
以下のページに構造化されていない文章が記載されています.これから皆さんには,この文章を構造化(適切なパラグラフを作成し,必要に応じて見出しをつける)してもらいます.構造化した文章はHTMLで記述して下さい.HTMLにおけるパラグラフや見出しの作り方については,第7週の教材を参考にしてください(余裕のある人は下を参考に画像も適切な位置に貼りつけてみましょう).
→構造化されていない文章ウェブページで画像を表示する
自分のウェブページに画像を表示させたい場合は,HTML 文書でimg 要素を使います.以下のような属性を指定できますが,src 属性と alt 属性は必ず書かなければいけません.また,終了タグはありません.
- src 属性:画像ファイルの URI を指定します.a 要素の href 属性同様,絶対パスでも相対パスでもどちらでも指定できます.
- alt 属性:画像を表示しないブラウザは,代わりにこの属性で指定された文字列を表示します.画像を表示しない理由としては,画像形式に対応していない,携帯電話のように表示能力が限られている,画像転送に時間がかかり過ぎる,視覚障害者のための専用ブラウザである,などが考えられます.
注意
alt 要素の内容は画像を表示しないブラウザで見る人の為に,その画像がどういうものであるのを簡潔に分かりやすく書きましょう. - width 属性,height 属性:画像の幅と高さを指定します.数字だけのときは画素数,うしろに % を付けると,ブラウザのウィンドウに対する割合を表します.指定された大きさに画像を拡大,縮小して表示します.
例えば「image」というディレクトリの下にある,photo.pngという画像を表示させたい場合は以下のように記述します.
<img src="image/photo.png" alt="特別教室の風景">
また,ページの背景を画像にすることもできます.この場合はスタイルシート(次項参照)を使い,以下のように body 要素について背景画像をURIで指定します.
body { background-image: URL(backImage.gif)}