Vol.2|SSCのホームページ制作・集客スクールブログ2014.05.12S.SHTMLWeb制作ブログこんにちは、鈴木です。今回はHTMLの基本について書いていこうと思います。1.テキストエディタついてまず、HTML/CSSコーティングをするためには、テキストエディタが必要です。Windowsの「メモ帳」、Macの「テキストエディット」でもコードを書くことはできますが、HTML/CSSコーティングを考慮したソフトではないので、初心者の方には使いにくいかもしれません。はじめのうちは無料のテキストエディタを使うことをお勧めします。無料で使えるテキストエディタには、Windows用の「サクラエディタ」、Mac用の「CotEditor」があります。私は普段Windowsを使っているので、「サクラエディタ」を使って説明してきます。以下が、HTML文書の基本構造です。<html>~</html>は、HTML文書であることを示します。lang=”ja”は言語が日本語であることを示します。英語の場合は、lang=”en”になります。<head>~</head>は、ページの設定情報を記述します。(ブラウザ画面には表示されません。)<meta>~</meta>は、HTML文書に関する情報を示します。<title>~</title>は、ページのタイトルを示します。<body>~</body>は、ページのコンテンツを示します。(ブラウザ画面に表示されます。Definition:文書型定義)と呼ばれる種類を示しています。*文字コードとは、コンヒュータ上で文字を表示させるための規格に準じたコードです。世界中のコンヒュータですべての文字が扱えるように標準化しようとする動きから、Unicodeが作られました。現在は、Unicodeを表現した文字コードの一つであるUTF-8を利用することが一般的です。HTML文書に指定した文字コードとファイルの保存時に指定した文字コードが一致していないと文字化けしてしまいます。3.タグのルールHTMLは、基本的に開始タグ~終了タグ(<○○○○>~</○○○○>)の囲まれた形になっています。<○○○○>のように終了タグを記述しない単独のタグもあります。属性名=”属性値”>の形で記述します。lang=”ja”>~</html>で説明すると<html>~</html>までが要素名、lang=”ja”が属性名、”ja”が属性値となります。属性はスペースで区切ることで何個でも指定することができます。size=”5”>のように色だけでなく文字の大きさも一緒に変えることができます。上図のHTML基本構造をブラウザで表すと下図のようになります。次回はページにコンテンツを増やし、どのように装飾していくかを説明したいと思います。鈴木君、さっそくhtml修正の軽作業を頼んだら、遅いながらもキッチリこなしてくれました。その調子で頑張っておくれ〜オカベSSCのホームページ制作・集客スクール当社では、WordPress講座を中心としたホームページ制作・集客スクールを運営しています。教室は、さいたま市の浦和駅から徒歩5分。・Webのスキルを習得したい学生などなど、様々な方に幅広い目的で受講していただくことが可能です!SSCのホームページ制作・集客スクールはこちら。