So-net Top に戻る
  U-Page+みんなのホームページサービス  
Menu
U-Page+ってなに?(サービスガイド)

U-Page+パーク

U-Page+カフェ

みんなのもくじ

ホームページづくりを学ぼう

HOME PAGE TUTORIAL

素材作成講座

つかってみよう

ファーストページアシスタント

ホームページ素材集

困ったときにはまずここを

よくあるご質問と回答(FAQ)

お問い合わせは

障害・メンテナンス情報

特定商取引法に基づく表記

ホームページづくりを学ぼう
TOPへ
はじめに ホームページづくり事始め さらに詳しいページづくり デザインのヒント
back 2-3.ページづくりの流れ 3-2.覚えておきたいこと
ファイル名のつけかた
next
1 HTMLタグ
  ホームページを作成する言語であるHTMLについてもう少し詳しく解説します。

・タグの書き方

・基本的なタグの参照表
  タグの書き方

タグの表記法についてちょっと触れておきます。
タグは大文字で書いても小文字で書いても問題ありません。通常は、見やすいように大文字で記述します。ただ、リンクや画像のファイル名の部分だけはしっかりと大文字と小文字を区別する必要があります。
また、タグにはそれぞれオプションを設定できます。タグのオプションは、タグの後ろに書き足して、付加的な設定を加えます。オプションはタグによって異なりますのでHTML辞書などでこまめにチェックするとよいです。

例)<BODY BACKGROUND="bg.gif" TEXT="RED" LINK="GREEN" VLINK="BLUE">
  タグをたくさん書き込んでみると、とても見にくくなってしまいます。だからなるべく見やすくする工夫をしましょう。
 
 
例えば、上の図のように改行を積極的に使ってまとめたり、タブを使って段をつければ後で見たときに構造が分かりやすくなります。これは改行タブがブラウザーで見たときには無視される性質を利用しています。ここでスペースを使ってしまうとページにも影響してしまうので注意しましょう。また、<!-- コメント -->(コメントタグ)を利用するとHTML上にちょっとしたメモを書き込むことができます。このタグもページ上には表れませんので是非利用するとよいと思います。
  基本的なタグの参照表

ここにあるHTMLタグは一般的なものを選んで掲載しています。しかし、これらのタグさえ分かればほとんどのページができてしまうのも確かです。
タグ 終了タグ 意味 オプション指定 セットタグ
全体構成    
<HTML> </HTML> HTML文書    
<HEAD> </HEAD> ヘッダ部    
<TITLE> </TITLE> タイトル   <HEAD>
<BODY> <BODY> 本文 ALINK="色(#RRGGBB)" <HTML>
      BACKGROUND="ファイル名"  
      BGCOLOR="色(#RRGGBB)"  
      LINK="色(#RRGGBB)"  
      TEXT="色(#RRGGBB)"  
      VLINK="色(#RRGGBB)"  
文字    
<H1>〜<H7> </H1>〜</H7> 見出し ALIGN="LEFT" or "CENTER" or "RIGHT"  
<FONT> </FONT> 部分的なフォントの指定 COLOR="色(#RRGGBB)"  
      SIZE="n"(n=1-7)  
      SIZE="n"(n=1-6)  
<B> </B> ボールド体    
<I> </I> イタリック体    
<TT> </TT> 固定幅フォント    
<BLINK> </BLINK> 文字の点滅    
段落・レイアウト    
<BR>   改行    
    テキストの回り込み中止 CLEAR="LEFT" or "CENTER" or "ALL" <IMG>
<HR>   罫線 ALIGN="LEFT" or "CENTER" or "RIGHT"  
      NOSHADE  
      SIZE="太さ"(ピクセル数)  
      WIDTH="長さ(ピクセル数または%)"  
<CENTER> </CENTER> センタリング    
<BLOCKQUOTE> </BLOCKQUOTE> 引用    
リスト    
<UL> </UL> マーク付きリスト    
<OL> </OL> 番号順リスト START="連番開始番号" <LI>
<LI>   リスト項目 TYPE="DISC" or "CIRCLE" or "SQUARE" <UL><OL>
      TYPE="I" or "i" or "A" or "all" <DIR>
<MENU>
      VALUE="連番開始番号"  
<DL> </DL> 定義リスト COMPACT <DT><DD>
<DT>   定義語   <DL><DD>
<DD>   定義内容   <DL><DT>
リンク    
<A> </A> リンク HREF="リンク先のURL(#アンカーネーム)"  
      TARGET="フレームの名前"  
      NAME="アンカーネーム"  
イメージ    
<IMG>   イメージ SRC="イメージファイルのURL"  
      LOWSRC="低精度イメージファイルのURL"  
      WIDTH="イメージの横幅(ピクセル数またはウインドウに対する比)"  
      HEIGHT="イメージの縦幅(ピクセル数またはウインドウに対する比)"  
      ALIGN="イメージの位置":  
      "LEFT" or "RIGHT" or "TOP" or "BOTTOM" or "MIDDLE  
      ALT="台替テキスト"  
      BORDER="外枠の太さ(ピクセル数)"  
      HSPACE="上下の余白(ピクセル数)"  
      VSPACE="左右の余白(ピクセル数)"  
テーブル    
<TABLE> </TABLE> 表の作成 BORDER="外枠の太さ(ピクセル数)" <TR>
<TH>
<TD>
      CELLPADDING="中の罫線の太さ(ピクセル数)"  
      CELLSPACING="データと罫線との間隔(ピクセル数)  
      WIDTH="表の横幅(ピクセル数または%)"  
      HEIGHT="表の縦幅(ピクセル数または%)"  
フレーム    
<FRAME> </FRAME> フレームの作成 MARGINHEIGHT="フレーム内の上下マージン(ピクセル数)" <FRAMESET>
      MARGINWIDTH="フレーム内の左右マージン(ピクセル数)"  
      NAME="フレームの名前"  
      NORESIZE  
      SCROLLING="yes" or "no" or "auto"  
      SRC="フレーム内に表示させる文書のURL"  
<FRAMESET> </FRAMESET> ウインドウの分割を指定 COLS="縦分割指定(フレーム幅のピクセル数または%)  
      ROWS="横分割指定(フレーム幅のピクセル数または%)  
<NOFRAME> </NOFRAME> フレーム非表示用テキスト   <FRAMESET>
back 2-3.ページづくりの流れ 3-2.覚えておきたいこと
ファイル名のつけかた
next
HOME PAGE TUTORIAL TOPへ | ホームページ作りを学ぼう TOPへ | U-Page+ TOPへ
So-net TOPへ
 
Copyright 2010 So-net Entertainment Corporation