知恵袋 (前に戻る)
128

 HTML4からHTML5に

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
から

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
に変更。
(表示できなかった絵文字がHTML5で表示できる)


ホームページビルダー(特にクラシック系)は便利ですが、
HTMLやCSSの最新の書き方からすると少し古いクセがあります。
注意すべきポイントを箇条書きにまとめました:

1. 配置・センター

古い書き方:
<div align="center"> や <p align="center">

注意:
今は CSS text-align:center; を使う。
推奨:
<p style="text-align:center;">テキスト</p>


2. 背景色・文字色

古い書き方:
<body bgcolor="#ffffcc"> や <font color="#ff0000">

注意:
<body> の bgcolor や <font> タグは非推奨。
推奨:
CSSで指定。
<body style="background-color:#ffffcc;">
<span style="color:#ff0000;">文字</span>


3. テーブルレイアウト

古い書き方:
レイアウト目的で <table> を多用

注意:
今は <div> + CSS Flex/Grid が主流。
テーブルは本当に表データのみ。
推奨:
表は <table>、レイアウトは CSS Flex/Grid。


4. 空行・改行

古い書き方:
<br> を何度も連続で使用

注意:
デザイン上の空白は CSS で余白 (margin / padding) を使う。
推奨:
p { margin-bottom: 20px; }


5. フォント指定

古い書き方:
<font face="MSゴシック" size="3">

注意:
<font> は非推奨。CSS font-family / font-size を使用。
推奨:
p { font-family: "MS Gothic", sans-serif; font-size:16px; }


6. 幅・高さの直接指定

古い書き方:
<td width="240" height="10">

注意:
CSSでレスポンシブ対応する方が望ましい。
推奨:
td { width:240px; height:10px; }


7. インラインスクリプト / 広告

古い書き方:
<script> を本文中に直接埋め込み

注意:
外部ファイルや非同期読み込みにするとページが安定。
推奨:
<script src="script.js" defer></script>


8. 文字コード指定

古い書き方:
HTML 4系の <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

注意:
今は UTF-8 が標準。
推奨:
<meta charset="UTF-8">


💡 まとめポイント
ホームページビルダーは
「見た目を優先して古いHTMLを書く」
ことがあります。

<font>, <center>, bgcolor, align 属性
→ CSSに置き換え

<table> はデータ用、レイアウト用には使わない

<br> の連打は避ける

(前に戻る)

chie2.html(tvm)
<EOF>