【ホームページビルダーでホームページ作成】web制作 ホームページビルダー解説
受付時間はこちら
HOME サービス内容 ビルダー使い方 ビルダー作品集 よくある質問 問合せ・申込 プロフィール
  HOME > ビルダーの使い方 > ホームページビルダー解説(5)

ビルダーの使い方

 ホームページ作成の手順

 ホームページビルダー解説(1)

 ホームページビルダー解説(2)

 ホームページビルダー解説(3)

 ホームページビルダー解説(4)

 ホームページビルダー解説(5)

 ホームページビルダー解説(6)

ホームページビルダー解説(5) 「沖縄旅行」

完成版は、ここをクリックして確認してください。

ホームページビルダーを起動し、「スタート」→「ページを作成する」をクリック。今回は、「白紙から」「どこでも配置モード」で作ります。

まず、最初に「ページの設定」をします。「ページの設定」をクリックしたら、ページのタイトルのところに、「沖縄旅行」と入力し、次へをクリックします。

背景と文字色は、「カラーギャラリー」からを選択し、お好きな組み合わせを選んで下さい。

文字色が薄くて見づらい場合もあるので、詳細」をクリックして文字色を変更しています。

次に、一番上のロゴを作ります。ナビメニューから「ロゴ(飾り文字)の挿入」をクリック。文字のところに「沖縄旅行」と入力し、デザインは001を選びます。

文字の大きさは、50くらいにします。この文字の大きさを必要に応じて、大きくしておかないと、後で大きさを変えても、文字がギザギザになって汚くなっちゃいますよ。

オレンジ色がプレビューに表示されるけど、気にせず、そのまま「文字の詳細設定」をクリックします。

フォント名は、「HG創英角ポップ体」を選んで下さい。もちろん、お好みで変えて頂いて結構ですよ。教材どおり、文字を斜めにしたい場合は、「イタリック」をクリックします。

次は「色の選択」です。

教材と同じにする場合は、「テクスチャ」を選びます。一覧から「WATER」を選んでください。

次に「ロゴの縁取り」→「通常」を選び、色は青。縁の太さを太くすると、はっきりしますよ。

次の「ロゴの文字効果」は、「影」を選びます。影の色も変えて、「影のぼかしの強さ」を少し変えています。

これで「完了」をクリックすると、最初の画面に戻りますので、表示されたプレビューを確認してください。

後から、修正する場合は、「編集」→「かんたん編集」→「ロゴの編集」をクリック。さきほどと同じ画面が出てきますから、必要な個所を修正してください。

飛行機のイラスト、これは、区切り線なんですよ。

「ナビメニュー」→「画像ファイルの挿入」→「素材集」をクリック。「区切り線」の中の、ず〜っと下のほうにある、「pe09_l1.gif」というファイルを選択。これがこの飛行機です。

次に「文字の挿入」をクリック後、ドラッグしながら適当な大きさの枠をつくり、1行目の文章を入力。改行後、そのまま2行目を入力。

また、「文字の挿入」をクリックして、次の文章の枠を作って、3行目を入力していきます。

最後まで文章を入力したら、次は、また区切り線の挿入です。いろんな区切り線があります。

絵柄が見えづらいですが、それを簡単に見る方法は講習の中で説明します。

次は、表を作ってその中を完成させます。3行2列の表をつくりましょう。表の作り方は長くなるので省略します。

次に写真を入れましょう。教材で使っている写真は、下のサイトのフリー素材を使っています。

【日本の写真集】デジタル楽しみ村

もし、こちらの写真を使って練習する場合は、「写真マップ」の「沖縄」から写真をコピーしてください。ご自分で持っている写真で練習しても構いませんよ。ご自分の写真を使う時は注意点を守って使ってくださいね。

上のデジタル楽しみ村の写真を使って練習する場合は、使う写真を自分のパソコンに保存してそれを使います。

インターネットから自分のパソコンに写真を保存する方法は、ここでは省略します。

「デジカメ写真の挿入」→「写真の挿入」をクリック。「ファイルから」を選び、先ほど保存した写真を選びます。

次に文章を打つんですが、その前に、今の写真を選択した状態で「編集」→「属性の変更」を選び、「レイアウト」の「位置揃え」を「左寄せ」にしておきます。

写真の左がわに文章を入力する為ですよ。「余白」のところは「左右」を「5」にしておきます。こうしておけば、写真と文字の間に少し空きができます。

文章を入力したら、1列出来上がり。

以下、同じように写真と文章を入力していきますが、写真が右に寄ってるところは、先ほどの「レイアウト」の応用です。考えてね(^・^)

全部完成したら、最後に「編集」→「すべて選択」を選び、「どこでも配置モードツールバー」から「複数の部品を左右中央揃えにする」を選びます。

これで、文章やロゴ、区切り線や表など、すべての素材が、真ん中を中心に揃えられます。

ただし、これはページの中央に配置されるという意味ではありませんので、ご注意くださいね(^o^)丿

これで完成ですよ〜♪  どう? うまくできましたか?(^o^)丿

前のビルダー解説を見る 次のビルダー解説を見る
このページのトップへ
| HOME | 講習内容 | 支払方法 | 講習のキャンセル・返金 | 受講までの流れ | 講習のポイント | よくある質問 | 問合せ・申込 |
| ビルダー無料解説集 | ビルダー作品集 | プロフィール | 特定商取引法表記 | プライバシー保護 | リンク集 |
Copyright 2003-2008 Hitomi Ono. All rights reserved. 【ホームページビルダーでホームページ作成】web制作 ホームページビルダー解説