仕事のスキルアップ!パソコンで素人の私でも出来るホームページ作成法!

【仕事で使うパソコンスキル】簡単にホームページを作れるサービス

【おちゃのこさいさい】
格安でスマートなホームページが誰でも簡単に作れちゃいます!

 

【仕事で使うパソコンスキル】Bluegriffonで実践公開!


「ホームページの知識が無くて大丈夫だろうか・・・」
「本当に、ソフトだけで作れるのだろうか・・・」


この前の章で、ソフトとテンプレートのお話をしましたが、
まだ、このような疑問や不安があるのではないでしょうか。


そんなに簡単に作れるなら、制作依頼をして、
30万円も40万円もするはずがない、



そう思うのが当然だと思います。



しかし、ソフトとかテンプレートとか、
人が好意をもって作ってく れたものを使うと、
思っている以上に簡単に作 れます。



そうはいっても、ソフトの使い方や、
編集するファイル名くらい は理解しておく必要があります。



そこで、この章では、そのソフトの使い方と
テンプレートの生かし方を実際に使っ て、
編集する工程をお見せした いと思います。



ですので、できれば、まず、
前の章を参考にして、ホームページ作成のソフトとテンプレートを
ダウンロードしてから読んで頂けたらと思います。


それでは、ホームページ作成に取り掛かりましょう!

パソコンで仕事

【仕事で使うパソコンスキル】作成ソフトにテンプレートを読み込みましょう!


自分の作りたいホームページのイメージにあった
テンプレートをダウンロードし ます。


通常、テンプレートは、ホームページに必 用なファイル
まとめて保存してあります。


圧縮ファイルになっている と思いますので、
ファイルを都合の良い場所に解凍して下さい。
(解凍の仕方が分からない方は、
「ファイル 解凍 パソコン」等で調べてみて下さい。)


今回は、「全部無料のホームページテンプレート
というサイト(http://saetl.net/)からダウンロードしてみました。


ダウンロードしたファイルを解凍すると、
次のような感じになります。


仕事でパソコン


ファイルを見てみると
index.html
categories.html
stemap.html



と、○○.htmlという ファイルがあります。
これが、HTMLファイルと いってホームページのファイルになります。



そして、
index.html
はトップページのHTMLファイルになります。


つまり、ホームページの大元のページに なります。
(アドレスを打って初めに出るページです)



その他のHTMLファイルは、このindex.html
等、互いにリンクされク リックすると
移動する事ができるようになっています。



これから、HTMLファイルを編集する事で、
テンプレートを使ったホームページを作成していく
訳ですが、トップページや付属のHTMLファイルから
都合の良いファイルを探していきます。



そして、フォルダの中で、
もう一つ覚えておいて頂きたいのが、
images

というフォルダです。



これは、作る人によって名前が違いますが、
大抵index.htmlと同じ場所に、
images、image,img
等という名前で存在する事が多いです。



このフォルダの中には、
ホームページに使う画像ファイルを保存しておきます。


それでは、実際にテンプレートを使って、
ホームページを編集してみましょう。



まずは、編集するソフトを 開きます。
ここでは、Bluegriffonを開きます。



そして、ファイルを開くを選択し、
先程のテンプレートの中にある
index.htmlを選 びます。


仕事でパソコン


そうすると、ソフトにHTMLファイルが
読み込まれます。


仕事でパソコン


それでは、次に実際に編集をしてみましょう。


【仕事で使うパソコンスキル】テンプレートを編集する!


●文字を入力する
ま ずは、ソフトを使って文字を入力しましょう。
とっても簡単です。ブログと同じように、
入力をしたい部分を選んで文字を書いていくだけです。


例えば、
パソコンを仕事で使う


この図のような所を選んで、
文字を入力する事ができます。

パソコンで仕事

又、太文字や色も自由に
ブログのように編集する事ができます。


例えば、

パソコンで仕事


この場合のように太字になっているタイトルの文字を選んで、


パソコンで仕事


上にある色ボタンを 選ぶと、
色を選択するウィンドウが開き色を変えられます。



●画像を挿入する
画像の挿入もとても簡単です。
画像を挿入したい場所にカーソルをもってきて、
メニューから挿入→画像を 選びます。


パソコンを仕事で


そうすると、画像を選択するウィンドウが
現れますので、挿入したい画像を選びます。


パソコンで仕事を


この時に、代替文字列という箇所に
適当な文字を入力しておきます。


これは、万が一、画像が読み込まれなかった時に
表示される文字です。


そうして、OKキーを押すと、


仕事でパソコン

画像が挿入されるのが分かります。



もう、これだけで、ホームページが作れています。
試しに、本当にファイルが作られているのか確認してみましょう。



まず、ソフトの保存ボ タンを押します。

パソコンで仕事を


そうすると、ここまでの編集した内容が
保存されファイルが更新されます。


続いて、フォルダ内に移動して、
開いたindex.htmlファイルをブラウザで開きます。



index.htmlファイルを選択して、
右クリックをして、「プログラムから開く」
→ブラウザ名
を選択します。


パソコンで仕事をする



そうすると、ブラウザが開き、

仕事とパソコンの相性


編集された内容が反映されている事が分かります。


どうですか?
とっても簡単に作れますよね。

【仕事で使うパソコンスキル】いますぐテンプレートを編集してみましょう!


この章でお話しました内容を参考にして頂き、
ホームページを早速作ってみましょう。


自分の目的に合ったテンプレートを手に入れたら、
ソフトで開き編集してみましょう。


文字を入力したり、画像を挿入する事で、
あなたのホームページに変 わってきます。



何度もお伝えしますが、
自分でデザインして、
自分でHTMLを書き、
自分でレイアウトを作ったらとても大変で す。



私は、元々、一から自分で作ろうとした事がありますが、
この章で紹介したようなホームページを作ろうとしたら、
1か月、2ヶ月はみっちり かかってしまいます。



しかし、テンプレートを使い、
ソフトを使うだけで、数時間で作る事も可能です。



しかも、自分で作ると、
表示するブラウザによって表示がおかしくなっ たりする事もあるので、
色々なブラウザでチェックする必要があります。



しかし、テンプレートの中には、
はじめからそういう事も考慮して作ってくれているものが
あります。



ですので、
是非、この章でお伝えした内容を使って、
楽にホームページを作って頂けたらと思います。


>>簡単!誰でもできるHP作成3


【仕事で使うパソコンスキル】簡単にホームページを作れるサービス

【おちゃのこさいさい】
格安でスマートなホームページが誰でも簡単に作れちゃいます!