こちらでHTMLとCSSのテンプレートはGETしましたか？
テンプレートを基に説明していきます。
HTMLで
<head> ～ <head>
の間に書く内容について簡単に説明します。
※<と>を書くの面倒なので、以下省略します。
meta http-equiv～
っていうのはコンピュータ向けに、文字コードとか使用するスクリプト言語なんかを指定しています。
特に覚えていた方が良いのは
「charset=UTF-8」
の部分です。
UTF-8っていうのが文字コードです。
他にも色々ありますが、個人的には「UTF-8」がオススメです。
最初は「Shift_JIS」とかにしても良いかもしれません。
これは「この文字コードで開いてください」っていう意味なので、
HTMLファイルを保存するときはこの文字コードで保存してください。
※保存した文字コードと、指定してある文字コードが一致しないと文字化けします。
title
ページのタイトルを書いてください。
通常サイトタイトルも含めますが、含めなくても大丈夫です。
ページごとにタイトルを変える事をオススメします。
robots
index,followと書くことで、検索エンジンに検索してねって伝えます。
ですが「index,follow」と書いたからインデックスされるという事ではありません。
※noindex,nofollowだと、ほぼインデックスされません。
description
ページの説明文を書いてください。
普通サイトの説明文も含めたりします。
ページごとに説明文を変える事をオススメします。
keywords
検索キーワードをここに書きます。
半角のカンマ「,」区切りで複数を書きます。
実際には、このキーワード以外でも検索されます。
link href～
「rel="stylesheet"」の方は、スタイルシートへのリンクです。
（サイト内の）外部のスタイルシートをパスで指定して読み込んでいます。
「rel="contents"」の方はトップページを指定しています。
script～
JaveScriptファイルを読み込んでいます。
※実際にはjQueryを使用しています。
最初は作るのは難しいと思いますが、ここで読み込んでいるのは
任意の要素に「class="rover"」と付け加えると、マウスポインタが重なった時に半透明になります。
リンク画像なんかに使用しています。
ここに適用しましたのでソースを見てください。画像にも適用できます。