HTMLの基礎の基礎

HTMLの基礎の基礎

HTMLはマークアップ言語

HTMLは、Webサイトを構築する為のマークアップ言語であり、文章コンテンツにタグを加えて、HTMLファイルとして保存し、サーバにアップロードする事で、Webページとしてブラウザが解釈・表示する事が出来ます。

ブラウザでWebページを表示しますと、ブラウザが表示されているウィンドウの上部にタイトルが表示されます。

これは、HTMLのタイトルのタグを使う事で設定する事が出来ます。

headとbody

HTMLのソースコードは、head部分とbody部分の二つに分けられます。

タイトルタグはhead部分に記述し、head部分には、metaタグでキーワードや著作権者名や概要などを書いておく事も可能です。

また、外部CSSのリンク先を指定する場合には、link要素を使って指定を行います。 style要素を使えば、HTMLコードに直接CSSを記述する事も出来ますし、script要素を使えば、外部JavaScriptやスクリプトをソースコードに記述する事も出来ます。

HTMLの基本知識としては、head部分とbody部分でどのようなタグが使えるかを把握しておく事が大切であり、それぞれのタグには、意味があるという事を理解していく必要があります。

基本知識を押さえて、ソースコードを書いていきますと、文章にそれぞれの意味を持った要素にしていく事が出来ます。

CSSを使ってデザインを分離させたり、スクリプトを外部化する事によって、HTMLソースコードが見易くなり、メンテナンスがしやすくなります。

検索エンジンを意識した構築

タイトルは、Webサイトの顔になる部分ですので、コンテンツ内容にマッチしたタイトルを用意しておくと良いでしょう。

基本を押さえてHTMLページが作成出来るようになれば、検索エンジンへの最適化も考慮して、検索エンジンのクローラに渡す情報を整理していくと良いでしょう。

書籍で習得したり、HTMLのリファレンスページなどを閲覧すれば、多くの基本的な知識を得られますので、是非書店で手にとってみてください。

サイトの構造を確認する

最近のChrome等のブラウザには、開発者向けのツールが搭載されていますので、これを使えば、リアルタイムでCSSを適用して効果を確認出来たり、どのコンテンツが読み込みに時間が掛かっているのかを把握する事が出来ます。

br要素は改行で使われ、p要素は段落を分ける時に使われますが、文章の構成によって、このようなHTMLの要素を使い分けていけば、ソースコード自体に意味を持たせる事ができ、メンテナンスをする時にも分かりやすくなります。

LEAVE A REPLY

*
* (公開されません)

CAPTCHA


*

COMMENT ON FACEBOOK