長年、FrontPage を使ってきたけど右も左もわからない…という方をはじめ、無料でホームページを作りたいけど HTML とか CSS が全然わからない方向けに、ステップバイステップで解説していきます。
フリーソフトになった Microsoft Expression Web 4 を使って、スマホ対応のレスポンシブ Web デザインのホームページを作ってみましょう!
Information
当サイトは、メインサイト『ワニchanのうぇぶわーるど』の初心者ユーザー向けまとめサイトとして運営していきます。Expression Web 4のより詳細な機能については、メインサイトの『Expression Web 4を使ってみよう』を参照してください。
- Expression Webテンプレート
- レスポンシブWebデザインに対応したWebサイトを手っ取り早く作りたい方のために、テンプレートを用意いたしました。
- Web配色パターン
- web creators 2009 vol.96 の New Color Trend 2010 of Web Site から抜粋し、16進数とRGBを掲載しています。
- Expression Web Users Forum
- Expression Web 4の使い方の質疑応答に特化したサポート掲示板です。
Contents
Introduction ホームページ作成の基本
ブログとホームページの違いをはじめ、ホームページ作成に必要な基礎知識や心得についてまとめていきます。
Chapter 1 Expression Web 4の概要
Expression Webは、Web標準に準拠したサイトを効率的に構築できるアプリケーションです。この章ではまず、Expression Web 4の画面構成をはじめとした概要をはじめ、基本的な使い方について説明します。
Chapter 2 サイトの管理とデザインの決定
Expression Webでホームページ管理機能を利用するには、まず「サイトを開く」操作が必要です。ここでは、サイトの操作、および、Webデザインを統一するためのダイナミックWebテンプレートの活用方法について説明します。
Chapter 3 ページの作成と編集
トップページの編集、Webページの新規作成をはじめ、段落やスタイルの操作、および、検索と置換方法について説明します。
Chapter 4 ページレイアウトの適用
データを分かりやすく見やすくする手段としてのテーブル(表)の挿入をはじめ、テーブルを使わずにコンテンツを配置させる方法について説明します。
- Section 1 テーブルの作成
- Section 2 テーブルの編集
- Section 3 テーブルのスタイル
- Section 4 レイヤーとDIVの操作
Chapter 5 メディアの挿入と編集
デジカメで撮影した写真をWebページに挿入して、効果的なWebサイトを作成したり、見栄えの良いフォトギャラリーページを作成する方法をはじめ、写真の加工、トリミング方法などについて説明します。
Chapter 6 ハイパーリンクの作業
それぞれのWebページをつなぐためにリンクを作成していきます。Webページや外部Webサイトへのリンク、および、電子メールへのリンク方法などについて説明します。
Chapter 7 サイトのパブリッシュ
Expression Webで作成したホームページを公開する前に、全体のチェックを行いましょう。ここでは、レポート機能を使用した問題のチェック、および、サイトのパブリッシュの設定をして公開する方法について説明します。