携帯サイトの作り方〜XHTMLで書こう

Crescent Eve(クレセントイヴ)はダウンロードしましたか?ここからはCrescent Eve(クレセントイヴ)のキャプチャ画像と共に説明していきますのであしからず!

てか。XHTMLってなに?

って思った人、あんまし難しく考えないでください。HTMLと大して変わりません。

注意:サイトをHTMLでかいている人はアドセンスのためにわざわざXHTMLに書き換える必要はありません。

携帯サイト作成に必要なXHTMLの知識はHTMLがわかってる人なら簡単。ただちょっとタグの記述(タグの書き方)が違うだけです。では早速携帯サイトを実際に作りながらXHTMLのタグの書き方を見ていきましょう。Crescent Eve(クレセントイヴ)を開いてください。

Crescent Eve(クレセントイヴ)でXHTMLを書く

1,まずはCrescent Eve(クレセントイヴ)を開いてツールバーの右端にある青いチェックマークをクリック!XHTML1.0Transitionalを選択してください。下の画像をクリックすると拡大してみれます。

2,次に下記のタグをコピーしてCrescent Eve(クレセントイヴ)に貼り付けてください。

上のフレーム(枠)のなかを1度クリックして、Ctrl+A(コントロールキーを押しながらA)で選択して、Ctrl+C(コントロールキーを押しながらC)でコピー、さらにCtrl+V(コントロールキーを押しながらV)でペーストできます。(キーボードでのショートカットは覚えておくと作業効率があがります!)

そしたら下の画像ようになっているはずです。下の画像をクリックすると拡大してみれます。

まず基本的なタグと必要最低限なSEO対策となるタイトルタグ、見出しタグの説明からしましょう。

<html>(→タグはこのHTMLから始まります。)
<head></head>(→ここにサイトの情報を書きます。)
<title></title>(→サイトのタイトルを記述します。)
<body>(→ここからブラウザに表示されるHTMLを書きます。)
<h1><h2><h3>(→見出しタグ)
<p></p>(→段落タグ 文章を囲うタグ)
</body>(→ここまでがブラウザに表示されます。)
</html>(→最後に必ず/HTMLで閉じます。)

XHTMLの基本はタグの記述がすべて小文字であることです!大文字は基本的に使いません!でも間違って使ったからといって不具合が出るようなことはないのですが、基本的には小文字で統一しましょう。あとここにはありませんが基本的につかう改行タグ<br>はXHTMLでは<br />と記述しましょう。

ファイルを保存

次にファイルを保存しましょう。ファイルはindex.htmlでひとまず保存します。

ファイル→名前をつけて保存をクリック。Ctrl+Shift+Sでも名前をつけて保存できます。

保存する場所はデスクトップでもマイドキュメントでもかまいません、後で自分が保存した場所がわかるようにしましょう。このときファイル名をindex.htmlにします。サイトができたら最終的にindex.phpという拡張子に変えて保存します。ここでindex.phpで保存してしまうとIE(インターネットエクスプローラー)やFF(ファイヤーフォックス)などのブラウザでサイトのレイアウトの確認ができなくなってしまいますので注意してください。

ファイルをブラウザで確認する

保存したファイルをブラウザで確認してみましょう!まず、ツール→ブラウザでプレビューをクリック。

IE(インターネットエクスプローラー)ならF9でも確認できます。FF(ファイヤーフォックス)でも確認できますが、IEで見てみましょう。すると下記のような状態になっているはずです。

あとはこのサイトにもう少し手を加えれば立派な携帯サイトになります!ここまでは簡単でしたね?では次に、タグの装飾を勉強しましょう!

このページのトップへ

携帯アドセンスをはじめよう!
携帯アドセンス基礎知識
携帯コンテンツを用意しよう
携帯アドセンスコードとは
携帯アドセンスコードの取得
携帯アドセンスを入れてみよう
携帯アドセンスの審査
アドセンスのアカウントとは
モバイルアドセンスの審査は簡単?
アカウント停止・削除とは?
アドセンスの規約を守ろう
プライバシーポリシーページは必須
携帯サイトの作り方
用意するもの
XHTMLで書こう
タグの装飾
画像の挿入
携帯サイト用無料素材
携帯サイトSEO対策
検索エンジン登録の効率化
検索エンジン登録先リスト
ヤフーモバイルカテゴリに登録
ヤフーモバイルカテゴリ登録手順
GoogleのSEO対策
キーワードの選び方
内的SEO対策済み無料テンプレート