2015年05月01日
2. ホームページ作成・HTML入門 ヘッダー・グローバルナビ・フッター 編
キーワード：
ホームページ作成 HTML
サイト初心者 ヘッダー グローバルナビ
フッター CSS 内部参照 入門
ホームページの構造理解
今回は、
テキストエディタを利用して、
HTMLで記述した内容に加え、
CSS（ Cascading Style Sheets ）の内部参照を利用しながら、
レイアウトを調整し、
ブラウザ上で、
「 ヘッダー 」や「 グローバルナビゲーションメニュー 」
「 フッター 」
などを表示をさせる、
ホームページ作成の基礎的な内容の記事を
まとめておこうと思います。
現在は、以下のように様々な便利な、
ホームページ作成ソフトが販売されていますが、
ホームページ作成ソフトなどの例
Amazon
 |
Amazon
 |
Amazon
 |
Amazon
 |
[ ホームページ・ビルダー19 関連本 ]
Amazon
 |
Amazon
 |
Amazon
 |
Amazon
 |
ホームページ作成ソフトを利用せずに、
テキストエディタなどを利用して、
HTMLコードやCSSコードを入力してみると、
ブログのカスタマイズや、
ホームページ作成ソフトなどでの、
ホームページ構造の理解などに
つながるのではないかとも感じます。
そして、
手入力でHTMLやCSSなどのコードを入力して、
ホームページを作成することの大変を感じ、
上記のようなホームページ作成ソフトのありがたみも
より感じるのではないかと思います。
この記事では、
動画でまとめておきましたので、
動画を確認しながら、
練習などを実施してみてください。
2. ホームページ作成・HTML入門 ヘッダー・グローバルナビ・フッター 編
訂正事項
：「 style〜/style 」内の、「 .title 」は、
idの要素に対する装飾のため正確には「 #title 」
でしたのでご了承下さい。
ブラウザでの表示自体は、
テスト環境ではどちらでも変わりませんでしたので
コード入力練習の際は、訂正して下さい。
参考：「 id 」要素 → CSSでは「 # 」
「 class 」要素 → CSSでは「 . 」
注：・動画ではMac向けの無料テキストエディタの
ひとつである
「 CotEditor 」で、
HTMLファイルを作成しています。
・Windowsを利用されている方の場合、
テキストエディタには「サクラエディタ」や
「TeraPad」などがあるようです。
・ブラウザは、「Google Chrome」を
利用して説明しています。
・HTMLの入力方法は、HTML5を参考に作成しています。
・画面を拡大してみると、
HTML/CSSコードなどが見やすいと思います。
前回のHTMLの基本構造に加え、
CSSでレイアウトの調整や、
様々なコードがでてくるので、
一見複雑に感じますが、
自分でコードを入力したり、
ブログなどでのカスタマイズなどを実施したりする過程で、
少しずつ要所はつかめてくるのではないかと思います。
今回の内容が、難しすぎると感じられた方は、
︎ 記事ページ：1. ホームページ作成・HTML入門 ブラウザでタイトルとテキストを表示させる
︎ 記事ページ：書評3. 今すぐ使えるかんたんmini 図解HTML5
などの記事も参照してみてください。
また、
HTMLやCSS、JavaScript、PHP等をはじめとした、
ウェブプログラミングや、
WordPressなどに関連する
プログラミング学習関連の情報や、
様々なプログラミング言語に関して、
Q&Aが行なわれているサイトとして、
エンジニアのためのQ&Aサイト【teratail】
というサイトもありますので、
学習の補助などに参照してみてください。
teratail
のサイトでは、
Q&Aは、
会員の登録をしなくても無料で閲覧が可能です。
会員登録
（facebook、twitter、Google+、github、
hatenaアカウントなどでも登録可能）
をすると、質問への追記や、
回答ユーザーなどとのやり取りも可能となり、
プログラミング関連の学習をさらに深めたい方にとっては、
役に立つのではないかと思います。
また、
レンタルサーバーをお探しの場合は、
︎ 記事：レンタルサーバーのサービス比較（一覧）ドメインに関しての情報をお探しの場合は、
︎ 記事：ドメイン登録サービス会社のサービス比較（一覧）アフィリエイトサービス会社をお探しなら、
︎ 記事：アフィリエイトサービス・広告配信サービス会社の比較（一覧）の記事ページにまとめておきましたので、
必要に応じて、
参照していただければ幸いです。
[ スポンサードリンク ]
by はじめてのコンピュータ・パソコン
︎ サイトマップ︎ プロフィール | サイトポリシー・免責事項など︎ CONTENTS（コンテンツ）一覧︎ コンピュータ・プログラミング書籍関連 | 書評（一覧）︎ Macでアフィリエイトのやり方・始め方入門講座（一覧）︎ パソコン・コンピュータ学習関連サイトやサービスの情報 ︎ プログラミング言語関連記事（一覧）【このカテゴリーの最新記事】
-
no image
posted by HajimeteCPC at 10:52
| ホームページ作成・HTML入門
