ホームページ作成ビギナーズガイド

ホームページ作成・序

• 当サイトについて
• HTML4.01とは？
• ホームページの基本構造

ホームページのひな型と解説

ホームページを作成する前の土台作り。このへんがけっこう重要なんです。

1. ホームページの雛型
2. DOCTYPE宣言について
3. htmlタグにlang属性を入れる
4. 文字コードを指定する
5. titleタグについて
6. metaタグdescriptionについて
7. metaタグkeywordsについて
8. 基準スタイルシート言語の指定
9. 基準スクリプト言語の指定
10. linkタグによるナビゲーション

HTMLタグ

ホームページ作成によく使うHTMLタグの論理的・構造的な意味や注意点など。
マークアップはこれだけでほとんど足りると思います。

• hタグ(見出し)
• pタグ(段落)
• ulタグ(順序のないリスト)
• olタグ(順序のあるリスト)
• dl、dt、ddタグ(定義リスト)
• imgタグ(画像)
• divタグ
• spanタグ
• tableタグ(表)
• emタグ(強調)
• strongタグ(より強い強調)
• blockquoteタグ(引用)
• qタグ(引用)
• aタグ(リンク)
• brタグ(改行)

軽視されがちですが重要なこと → ブロック要素とインライン要素

CSS(スタイルシート)入門講座

CSS(スタイルシート)を使ってホームページを作成する実践例。外部スタイルシートは検索エンジン対策でも重要。

1. CSS(スタイルシート)入門講座1
2. CSS(スタイルシート)入門講座2
3. CSS(スタイルシート)入門講座3
4. CSS(スタイルシート)入門講座4
5. CSS(スタイルシート)入門講座5
6. CSS(スタイルシート)の外部化

CSS(スタイルシート)によるレイアウト

divタグとfloatプロパティ・positionプロパティを使った2段組・3段組レイアウトの作り方。

divとfloat

固定幅

1. CSS(スタイルシート)レイアウト:2カラム 1
2. CSS(スタイルシート)レイアウト:2カラム 1 解説
3. CSS(スタイルシート)レイアウト:3カラム 1

可変幅

1. CSS(スタイルシート)レイアウト:2カラム 2
2. CSS(スタイルシート)レイアウト:3カラム 2

divとposition

1. CSS(スタイルシート)レイアウト:2カラム 3
2. CSS(スタイルシート)レイアウト:3カラム 3

レイアウト・デザイン

レイアウトやデザインの注意点など。ホームページを作成した環境以外では全く見た目が違うかもしれませんよ。

• table(テーブル)レイアウト
• フレーム(frameset、frame)レイアウト
• CSS(スタイルシート)レイアウト
• ホームページの幅
• 文字のフォント種類
• 文字の大きさ(フォントサイズ)
• 配色について

その他

• アクセスアップ・SEO　web標準に準拠したホームページ作成はアクセスアップにつながります。
• ホームページ作成リンク集　ホームページ作成に役立つツールやサイト。
• ホームページ作成関連知識　ホームページ作成に関連したちょっとした知識。
• 総合　雑談など、他のカテゴリーに入らない記事。

XHTML入門

HTML4.01とXHTMLとの違いや移行のポイントなどはXHTML入門で解説しています。