モバイルフレンドリーなレスポンシブ対応サイトとは
Web界隈では、昨年あたりから色々なところで話されてきたネタの一つです。
モバイルフレンドリーとか、これからはレスポンシブウェブデザインだ！などと言われていますが、そもそも何のことでしょうか。
ここで改めて押さえておきたいポイントを解説していきます。
フォルダの階層と相対パス、絶対パス
相対パスと絶対パスでファイルを指定する
HTMLで画像を挿入したりリンクを貼るときに、対象のファイルを指定する必要があります。指定の仕方には相対パスと絶対パスがあります。
なお、パソコン上で「フォルダ」と呼んでいるものを、サーバー上では「ディレクトリ」と呼んだりしますが、基本的には同じものだと思っていただいてかまいません。
画像を挿入する
本文中に画像を挿入するやり方です。
ここではサンプル画像として“image.jpg”というファイル名の画像を用意しました。
画像ファイルは、このページのHTMLファイルと同階層に“img”というフォルダをつくり、その中に保存しておきます。
文字の背景色と、文章の行間隔を指定する
文字の大きさ・色を変える
文字の大きさや色など、テキストのデザインを指定する
Webサイトのフォント（文字の字体や大きさ）は、指定していない場合は訪問者が使っているブラウザのデフォルト（初期設定）の表示になります。
サイト作成をする際に意識したいこととして、誰がどんなブラウザで見ても同じ（もしくはかなり近い）フォントで見られるように作る、ということが挙げられます。
そのためにはブラウザのデフォルトに頼らず、CSSでフォント指定をしてあげることが必要です。
Webサイト作成の環境整備と覚えておきたいHTMLのルール
Webサイト作成の基本
Webサイトをつくるためには特に何も用意したり購入する必要はなく、ネットにつながったパソコンさえあればOKです。（当サイトではWindowsPC向けに解説していますが、Macでも基本的には同じです。）
とはいえ、パソコン内の環境を整えることで作業の効率がよくなり、より短い期間でホームページ作成をマスターすることができます。まずはWebサイト制作の準備として環境の整備をしていきましょう。
HTML・CSS基礎知識！自分だけのホームページを作ろう！
HTML・CSSの基礎を実践しながらマスターしよう
このコラムでは、有料のホームページ作成ソフトを使わず、自分の力でホームページを作りたい方向けの基礎講座です。
HTMLは骨組みさえわかってしまえばけっこう簡単なのですが、最初のとっかかりはつまずきやすいもの。HTMLタグの基礎を解説した本やサイトはたくさんありますが、パソコン素人の方にとってはなかなか難しいかと思います（当サイト管理人もはじめは苦労しましたので・・・）。
というわけで、独学でWebサイト作成をマスターできるよう、 “HTML・CSS基礎知識！自分だけのホームページを作ろう！” の続きを読む