名前空間って?

名前空間は、タグや属性のグループを区別するための場所。同じ名前のタグや属性が定義されている別のXMLと組み合わせても、正しく処理されます。

XMLでは、必要に応じてタグや属性を定義し、利用することができます。
また、複数のXMLを組み合わせてドキュメントを作成することもできます。XHTMLの中にも、XMLを組み込んで表示させることも可能です。

しかし、XMLを組み合わせたときに、同じ名前で定義が異なるタグや属性があると、処理が混乱してしまいうで、特定のタグや属性のグループを区別するために利用されるのが名前空間(namaspace)です。同じ名前の付いたタグでも、所属している名前空間が異なれば、それぞれ別のタグとして処理させることができます。

XMLでは、xmlns属性の値にURIを指定して名前空間を区別します。

カテゴリー: HTMLの基礎知識, タグ, ナレッジノート, 属性 |

文字コードは何を使えばいいの?

ホームページで使える文字コードには、JIS・Shift-JIS・EUC-JP・UTF-8など多くありますが、多様な言語を扱えるUTF-8がお薦めです。

文字コードとは、コンピュータで文字を扱うために、各文字に割り当てた数字の組み合わせのこと。文字コードにはいくつかの種類があり、ホームページでも、さまざまな文字コードが利用されています。

meta要素での指定(HTML4.01、XHTML1.xまで)

[html]
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
[/html]

meta要素での指定(HTML5、HTML書式)

[html]
<meta charset=utf-8" />
[/html]

XML宣言での指定

[html]
<?xml version="1.0" encodeing="utf-8"?>
[/html]

カテゴリー: HTMLの基礎知識, ナレッジノート, 文字コード |

文書型宣言って何?

文書型宣言とは、宣言の以降で記述される文書の規格について示すもので、HTML5では、ブラウザの表示モード切替に利用します。

文書型宣言(DOCTYPE)は、たいてい(X)HTMLの先頭に記述されます。これから読み込まれる文書が、どんな規格に基づいて記述されているかを示すのに利用されています。(X)HTML文書の場合は、どのバージョンの文書型定義に基づいてマークアップされたかを示しています。

HTML4.01 Transitional DTDの場合

[html]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
[/html]

HTML4.01 Strict DTDの場合

[html]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
[/html]

HTML4.01 Frameset DTDの場合

[html]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
[/html]

XHTML1.0 Transitional DTDの場合

[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
[/html]

XHTML1.0 Strict DTDの場合

[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
[/html]

XHTML1.0 Frameset DTDの場合

[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
[/html]

XHTML Mobile Profile1.0 DTDの場合

[html]
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
[/html]

XHTML1.1 Strict DTDの場合

[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
[/html]

XHTML Appendix1の場合

[html]
<?php echo ‘<?xml version="1.0" encoding="utf-8"?>’."\n" ?>
[/html]

HTML5の場合

[html]
<!DOCTYPE html>
[/html]

XHTMLのマークアップの結果内容は、先頭に記述した文書型宣言のルールと一致している必要がありますので、はじめに指定した文書型宣言のバージョンと異なるマークアップをした場合は、文書型宣言を適切なものに変更しなければなりません。

カテゴリー: HTMLの基礎知識, SEO対策について, ナレッジノート |

XHTMLはなくなるの?

VHTMLの規格開発は終了しますが、HTML5でもXHTMLは作成できます。

ただし、XHTML1.0/1.1とは若干、文書の記述方法に違いがあります。

XHTMLの次バージョンとして策定が進められていたXHTML2は、2009年末をもって終了しました。しかし、以降はXHTMLを使ってはいけないというわけではありません。HTML5は、HTML1.0の新しいバージョンでもあります。ですので、わざわざHTMLに直すことは必要ありません。ただし、XHTML1.0/1.1の書式は、そのままではHTML5のXHTMLとして利用できませんので、少し変更をする必要があります。

1.XML文書

HTML5でXHTMLを作成する場合は、文書の先頭にXML宣言
[xml]
<?xml version="1.0" encording="utf-8"?>
[/xml]
を記述しなくてはなりません。従来のXHTMLの場合、ブラウザによっては古いバージョンでの表示方法に切り替えてしまうものもあるため、この記述をしていないものもありました。

2.文書型宣言

HTML5でXHTMLを作成する場合、文書型宣言を記述しません。従来のXHTMLでは文書型宣言が必須で、たとえばXHTML1.0 Strictの場合は以下のように記述していました。
[xml]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
[/xml]
HTML5でHTMLを作成する場合は、ブラウザで標準モードで表示させるために文書型宣言が必要ですが、XML(XHTML)書式の場合は標準モードで表示されるように決まっていますので、記述の必要がないのです。

3.空要素

従来のXHTMLではimg要素やbr要素など閉じるタグがない要素(空要素)を記述する場合、閉じカッコ「>」の前に「/(スラッシュ)」を入れていましたが、HTML5ではXML書式でも閉じカッコの「>」の前に「/」を入れません。ただし、HTML5では従来のXHTMLから移行しやすくするために、閉じカッコの「>」の前に「/」を入れる記述も容認しているようです。

4.メディアタイプ

HTML5で作成したXTHMLには、メディアタイプをapplication/xhtml+xmlまたはapplication/xmlといったXMLのものにする必要があります。従来のXHTMLの場合、XMLのメディアタイプを指定するとブラウザによってはファイルをダウンロードしてしまうため、text/htmlを指定することがありました。HTML5でXML書式に従って記述した文書でも、メディアタイプにtext/htmlを指定するとHTMLとして処理されてしまいます。ブラウザに確実にXMLとして処理させるには、XML書式で記述するだけでなく、XMLのメディアタイプを指定する必要があります。

カテゴリー: HTML5, HTMLの基礎知識, ナレッジノート |

HTML5の特徴

文書の構造がわかりやすくなり、Webアプリケーションが作成しやすくなります。また、図形の描画やビデオ・音声の再生のための要素も追加されます。

HTMLは当初、文字と画像のみを表示していました。
読みたいページへすぐに表示を切り替えられる、いわば雑誌のようなイメージです。
その後、ブラウザの進化によってJavascriptなどのプログラムが実行できるようになり、プラグインでアニメーションや音楽が再生できるようになると、雑誌からテレビのようなイメージに近くなりました。どちらの場合も、特定のアドレスのページにアクセスすれば、誰でも同じコンテンツが表示されるのには変わりはありません。

ただ、今のウェブサイトで広く使われているWebアプリケーションでは、同じアドレスを指定しても、サイトユーザをしている人の設定によって異なるコンテンツを表示させることができます。また、コンテンツの配置や表示サイズなどを、サイトユーザが変更することもできます。

その結果、文字と画像を静止した状態で表示するために作られたHTMLの規格では、サイトユーザに合わせて動的に変化するWebアプリケーションを作成するには不都合が多く生じてきました。それを解決するために開発が進められているのが、HTML5というわけです。

HTML5コードの例

[html]
<!Doctype HTML>
<html>
<head>
<meta charset=utf-8>
…略…
</head>
<body>
<header>…略…</header>
<nav>…略…</nav>
<article>…略…
<section>…略…
<section>…略…</section>
</section>
<section>…略…</section>
</article>
<aside>…略…</aside>
<footer>…略…</footer>
</body>
</html>
[/html]

カテゴリー: HTML5, HTMLの基礎知識, ナレッジノート |

HTMLはこれからどうなる?

XHTML2.0の策定は2009年末で終了し、新バージョンのHTML5へと移行します。

現在、ウェブページで広く使われているHTML4.01とXHTML1.0は、もとになる書式の規格が異なるだけで、要素や属性はほとんど同じです。そこで、両者をまとめてさらに使いやすくする目的で検討されているのがHTML5です。

HTMLの歴史は古く、1986年ISOにより、SGML(Standard Generalized Markup Language)として規格され、このSGMLの規格から生まれた言語がHTMLです。

HTMLは正式にはHyperText Markup Language(ハイパーテキストでマークアップした言語)と言います。ハイパーテキストとは、ある文書から別の文書へジャンプする仕組みで、HTMLではハイパーリンクによってそれを実現しています。

HTMLのもととなった規格のSGMLは、汎用性が高く機能も豊富な事が特長ですが、汎用性が高いということは逆に、作成者が任意で要素や属性を定義できるということでもあるので、不特定多数の人が閲覧できるようにしたいウェブサイトでは使いづらい面もあります。

そこで、ウェブサイトの標準化団体W3Cが、SGMLをもとに文法を簡素化したXML(Extensibl Markup Language)規格を勧告する運びとなりました。XMLデータは構造化して表すことが得意で、ソフトの保存ファイル形式の一つとしても採用され始めています。このXMLの規格によってHTML4.01を再定義したものがXHTML1.0です。

参考サイト:[ウィキペディア]HTML5
http://ja.wikipedia.org/wiki/HTML5

カテゴリー: HTMLの基礎知識, ナレッジノート |

サイトマップについて

さて、ここではサイトマップについてお話していきたいと思います。
皆さんもサイトマップという言葉を一度は聞いたことがあるのではないでしょうか?
または、現在既にご自身のホームページに設置をされている方もいらっしゃるのではないでしょうか?

サイトマップとはその名の通り、そのサイトにどういったコンテンツがあり、どのような構成になっているかを一目で分かる様に、一覧にしたページの事です。このサイトマップを作ることによって、サイト訪問者に対してとてもわかり易くサイト構成を伝えることができます。

また、サイトマップには、検出が難しいサイトのページの情報をGoogleやmsnなどの検索エンジンに提供する手段としても用いられます。
簡単に言うと、ウェブサイト上にあるページのリストのことです。サイトマップを作成して送信すると、Google の通常のクロール処理では検出できない可能性のある URL を含むサイト上のすべてのページを知らせることができます。

ここでは、後者のXMLサイトマップを自動で生成してくれるサイトをいくつか紹介いたします。

無料サイトマップ生成ツール

サイトマップラス
http://www.sitemaplus.com/

XML-Sitemaps.com[海外サイト]
http://www.xml-sitemaps.com/

FC2サイトマップ
http://seo.fc2.com/sitemap/

sitemap.xml Editor
http://www.sitemapxml.jp/

カテゴリー: SEO対策について, ナレッジノート |

検索エンジン最適化について

2009年6月1日、GoogleがGoogleウェブマスター向け 公式ブログでGoogle検索エンジン最適化スターターガイドを公開しました。

冒頭の記述にもあるのですが、社内向けに作成したものを、検索エンジン最適化(Search Engine Optimization:SEO)にまだ馴染みのない方々や、ユーザーと検索エンジンの双方に優しいサイトを構築しようとしているウェブマスターの方々にも役立つのではないかと考えのもとに公開されているものです。

スターターガイドの主なポイント

  • サイトタイトルの最適化。個別ページについても別々のものをつけるようにする。
  • descriptionタグを最適化。同じdescriptionが大量にある場合、消すのも1つの手かも?
  • URL構造の最適化。意味不明な羅列ではなく、「www.adworks24.co.jp/seo/google.html」というように、ディレクトリやファイルに意味のある文字を使うとよい。
  • ページがたくさんあるときは、パン屑リストで階層表示してあげると見やすくなる。また、サイトマップも作ると、訪問者がページを探しやすい。
  • 404ページを作成して、折角来た訪問者に、代替ページを用意したり、適切なナビゲーションをする。
  • 質の高いコンテンツを心がけ、関連性のある言葉を使う。
  • 訪問者にわかりやすい言葉でアンカーテキストを使う。
  • 見出しタグを適度に利用し、ぱっと見ただけで理解できたり、思わず読んでしまうようにする。
  • 画像には代替テキストであるaltタグを使い、画像が表示されない場合の情報を提供する。
  • robots.txtやrel=”nofollow”を使い、ロボットの制御を行う。
  • ブログを使ってサイトの更新を知らせ、あれば関連するコミュニティに参加する。
  • Googieウェブマスターセントラルやアクセス解析を使う。

尚、現在は2010年9月27日、検索エンジン最適化(SEO)スターターガイドの最新版が公開されています。

カテゴリー: SEO対策について, ナレッジノート |

まずはサイト登録から

アクセスアップ対策でまず、やっておきたいのが検索サイト・検索エンジンへのサイト登録です。
大手の主要検索エンジンだけでも登録しておきましょう。

Googleサイト登録
http://www.google.co.jp/addurl/

Bingサイト登録
http://www.bing.com/webmaster/SubmitSitePage.aspx

NAVERサイト登録
http://www.naver.jp/

baidu百度(バイドゥ)サイト登録
http://www.baidu.jp/info/help/webmaster/site/01.html

ODP – Open Directory Project
http://www.dmoz.org/World/Japanese/

以上が、主な検索サイト・検索エンジンへの登録先となります。

カテゴリー: SEO対策について, ナレッジノート |

ホームページ、リニューアルしました。

平素は、格別のご厚情にあずかり深く感謝いたしております。
さて、弊社ではかねてより準備をすすめておりましたオフィシャルサイトをリニューアルいたしました。
当サイトは、会社概要をはじめサービス内容の紹介、営業所案内など幅広く弊社を紹介する内容となっております。また、随時『制作実績』のページも公開予定です。
弊社は、このウェブサイトの公開を機に会社やサービスに関する情報を積極的に公開してまいる所存でありますので、なにとぞ、弊社サイトを奮ってご利用いただけますようお願い申し上げます。

カテゴリー: ごあいさつ |