Webサイトを作ろう! 【 6 】トップページの一例

    icon-clock-o読了時間:約1分24秒

前回記事 【 5 】トップページと画像を用意 にて大体の準備が整ったかと思いますので
それらを使ってトップページを作成していきます。

まず今回は、こんな感じの完成形を目指そう!というページの例を、
更に次の記事にてコード記述やタグ記述の詳細をご説明します。
ページ作成例とタグ記述の説明を並べてご覧いただくと分かりやすいかと思います。

 目次 

トップページの一例
コード例

トップページの一例

まずは弊社を例にしてシンプルな企業紹介のページを作ってみます。

【 作成例 】
サイト作成例

この記述を書いたテキストファイルをサーバー上にアップロードすれば、上の画像のようなページが表示されます。
ちょっとした店舗や企業のページであればこれを丸々コピーして
画像やテキストを適宜修正していただくと何とかなると思います。
それでは次回、タグの構成や意味などをご説明します。

一番上でも申し上げましたが、こんな感じでウィンドウを横に並べて
一連のタグ(ご自分のテキストエディタにコピー&ペーストしたもの)と
個別の説明(次の記事を開いたブラウザ)を見比べていただくと分かりやすいかもしれません。
2画面表示

 良かったら押してみてください♥

  • このエントリーをはてなブックマークに追加
  • Pocket