かぜまかせPC

かぜまかせPC

タグ講座

タグの基本

こんなの当たり前なるべく皆さんの知らないものを紹介しますね
<html>はここから HTMLファイルが始まりま～す というタグ
<head>～</head>この部分は ヘッダー と呼ばれファイルに関する
情報やタイトルを示すタグなどを記述します
<body>～</body>この部分が 実際にブラウザで表示される部分 で
ここに文字の大きさや色など様々な情報を指定するタグを
書きこみます

</html>----HTMLの終了タグ
<html>
<head>
<title>かぜまかせ</title>
</head>
<body>
</body>
</html>


ここでタイトルに対するアドバイス
SEO対策　Googleが認識させる為には
22文字以上で「区切り文字」が無ければタイトルは空白（...）になる。

「区切り文字」とは
全角もしくは半角の空白
・（中黒）
括弧
／（スラッシュ記号）
日本語と英数字との境目
ひらがなとカタカタの境目
これが間にあると後半が消えてしまいます。
「かぜまかせＰＣパソコンと遊ぼう体験日記公開中」
これだと消えてしまいます 「かぜまかせＰＣパソコンと遊ぼう体験日記」 これはＯＫ 「「かぜまかせＰＣ/パソコンと遊ぼう体験日記公開中」 かぜまかせＰＣ/...」としか表示されません

見出し文字を設定しよう

<h★>～～</h★>
★=1～6（見出しのフォントサイズで数字が大きくなるほど
文字は 小さく 表示されます
見出し文字の位置指定
<h★ align="☆">～～</h★> ☆=left(左詰),center(中央揃え),right(右詰)
こんなこと知ってるって・・・ だけど、知ってました？ｈ１とｈ２だけがロボットが見出しだと判断すること

見出し文字を設定しよう

▼Sample 
<FONT size="1">フォント1</FONT>
<FONT size="7">フォント7</FONT>
▼Display

フォント1
フォント7 ※属性値は"1"から"7"まで。
ここではｈ１　ｈ２のタグ乱用を避けるためにこのフォント指示を使って欲しいので紹介しました、
何故ってｈ１　ｈ２は見出しタグですからやたら使うとロボットが「ここはふさわしくない」と判断して無視してしまいます。
だから、ただでかい文字を入れたいときはフォント指示でやりましょう！

文字にルビをふる

<ruby>★<rp>■</rp><rt>☆</rt>
<rp>■</rp></ruby>
★=ルビを付ける対象文章
☆=ルビ
■=<ruby>タグ未対応ブラウザで表示させる文字
たとえば
我我は宇宙人だ ■ われわれはうちゅうじんだ ■

色指定

<body bgcolor=" 背景の色 "
text=" 文字の色 "
link=" リンクの色 "
vlink=" リンク済みの色 "
alink=" リンクする時の色 ">

背景に壁紙画像を指定しよう

<body background="★">
★=背景用画像のＵＲＬ
タグ使用例
<html>
<head>
<title>かぜまかせ</title>
</head>
<body background="img_01.gif">
</body>
</html>
これまた知ってましたよね・・・

画像上で右クリックを無効にする

<img src="★.jpg" onContextmenu="return false">
IEだけですが・・

テーブル

▼Sample 
<TABLE width="200" height=""
border="1" bordercolor="red" bgcolor="yellow"
cellSpacing="0" cellpadding="5">

<TR><TH>AAA</TH><TH>DDD</TH></TR>
<TR><TD>BBB</TD><TD>EEE</TD></TR>
<TR><TD>CCC</TD><TD>FFF</TD></TR>

</TABLE>
▼Display

AAA DDD
BBB EEE
CCC FFF

リスト

<UL type="square">
<LI>PC</LI>
<LI>ゲーム</LI>
<LI>音楽</LI>
</UL>
▼Display
  • PC
  • ゲーム
  • 音楽

カラーコード

カラーコード 背景とフォントの色具合をチェックしよう！

空白をそのまま表示する

▼Sample 
<html>
<head>
<title>空白をそのまま表示する</title>
</head>
<body>

空白をそのまま表示する<br>
<pre>
 かぜまかせ 
　　　　　　　パソコン  

　　あれ～
</pre>

</body>
</html>
▼Display 
かぜまかせ 
　　　　　　　パソコン  

　　あれ～

© Rakuten Group, Inc.
X
Design a Mobile Site
スマートフォン版を閲覧 | PC版を閲覧
    Share by: