Webページを分割する最も簡単な方法

わかりやすく整理された、読みやすいWebページを作成するには、基本を守ってください。 HTML 5とCSS 3はすべての報道を受けるかもしれませんが、ヘッダー、段落、およびいくつかの適切に配置された表のような基本的なHTML要素は、効果的にページを分割してメッセージを伝えます。 これは、サイトを整理するのに役立つ簡単で便利なタグです。

ヘッダ

さまざまなサイズのタイトルが、目を惹きつけ、読みたい情報を読者に示します。 を使用してメインタイトルから始めます

または

タグ：

私のサイトへようこそ

サイトをセクションに垂直に分割するには、下位レベルのヘッダーを使用します。 ヘッダーを2〜3つのサイズに制限します。

に

そして3つか4つ以下のセクション。

段落

段落を使う

次のようにテキストをセクションに分割するためのタグ。

最初の段落テキスト

第2段落テキスト

段落を小さく簡潔にしてください。 一般的なWebリーダーはコンテンツをすばやくスキャンするので、最初の1〜2文を読み終わってから別のリンクをクリックしてください。

画像

いくつかの適切に配置された画像も、ページを論理的なセクションに分割するのに役立ちます。 ページを分割するには、向きを左右に変えます。 可能であれば、タイトルを画像に変換してスタイルや種類を追加してください。 画像はリンクやボタンを置き換えるのにも適しています。

テーブル

単純な表を使用してページを水平に分割します。 タイトルの後ろに配置された単一のテーブルは、ページを2つまたは3つのセクションに効果的に分割します。 次のHTMLコードを使用してください。

テーブルは、ページの20パーセントを占める左側の列、さらに20パーセントを占める右側の列、およびその間の中央の列でページを埋めます。 各列が先頭から始まり下に流れるように、valign属性を忘れないでください。 この属性を忘れると、コンテンツはページの中央に垂直に配置されます。 内容を追加し、プレゼンテーションが正しく見えるまで列幅を調整します。

線と罫線

"としてコーディングされた水平方向の罫線

ホワイトスペース

空白行と空白列は、他のすべての書式設定よりもページをよく分割します。 改行、 "としてコーディング

"引用符なし、空の段落、自動終了タグとしてコーディング"

"引用符なしで、そして空の表の列はテキストを分離し、レイアウトを読みやすくします。空のスペースはほとんど帯域幅を必要とせず、本当にページを分割する最も簡単な方法です。