10 2月
以前に知り合いから「車のホームページを作りたい」
と相談された事があります。
もちろん彼は車屋さんとかではなく、
単なる車好きなだけであり、完全に趣味のサイト。
でもその人は走り屋(って今も言うのでしょうか?)のチームにも所属しているようで
その活動の紹介だったり、チームの車について紹介したり、
サイトに訪れた人と絡んだり簡単なブログのようなものをやったりしたいと言われました。
その時は自分ができる程度の説明はしましたが、彼はわからなかったみたいなので、
知り合いに少しだけホームページの作り方がわかるという方がいるとのことで
その方と自分が相談しながらサイトを作ってあげました。
自分は画像を触っただけで、後はわかる程度のアドバイスをしただけなんですけどね。
でも実はホームページの作り方としては、
こういった趣味から作り始めるのが一番覚えやすいんですよね。
ホームページの作り方がわからない最初の頃は
作っていくうちに必ず作り方で1度は誰でもつまづいてしまう時が来ます。
その時に興味のないサイトを人から任されているだけだと
全然覚える気もなくなり、だんだんいじるのが苦痛になるだけです。
ですが、自分の趣味のためのホームページ制作だったりすると、
ここをこうしたい、これはもっとこうした方がいいなど、
自分の中でもだんだん案が出てきたりするので、その為にはどうしたらいいのか
と学ぼうという意欲が出てくるからです。
また、最近増えてきているアフィリエイトなんかもそうですね。
儲けるためにはどうしたらいいかな?と思ったら
少しでもサイトを見やすく、シンプルに、
かつ効果的に広告なんかを盛り込めるように考えますからね。
24 1月
ホームページの作り方には色々な方法があるわけですが、
例えば近年使用されるのが当たり前になってきたCSSなど、覚えるまでが大変ですよね。
でも覚えてしまえば非常に便利なものでもあります。
ですが、最近ではCSSを自動でしかも簡単に作ってくれるものがあったり
文法などの間違いを指摘してくれるツールがあるので
作り方としては非常にハードルが低くなってきてるように思います。
ずっと自分ひとりでおこなっていると、その文法が
合っているのか間違っているのかもわからなくなってきたりして
そのまま「デザインが完成したからいいや」と間違いに気がつかずに
覚えるべきことを覚えないまま作れるようになってしまっている人も多いです。
「デザインが完成したからいいじゃないか。」
確かに人間の視覚の点で言うと全くその通りなのですが、
せっかく作ったサイトを人の目に触れるようにするには
SEOの力で上位表示させることも必要になってきますし、
その為には人間の視覚からじゃなく検索エンジンのクローラーに
確実に読み込んでもらうためにも文法の間違いは致命傷なのです。
ホームページの作り方というのは簡単にできる方法もありますが
こういった便利ツールを使って、自分の何が間違っているのか
作りながら学びながら制作していくことが大事だと思いますよ。
ある程度できるようになってきた頃、
最初の頃に作ったもののソースを見てみると間違いだらけなことに気付き
初心者のつまづきやすいポイントがわかると
それもまた非常に勉強になりますよ。
また、便利ツールとは関係ないですがホームページを作るのなら
SEO対策についても気にしなくてはいけません。
国内IPアドレス分散サーバーも検討した方がいいと思いますよ。
22 11月
ホームページの作り方の中でも一気にガラッと雰囲気を変えられるのが
「背景」だと思います。
背景を設定した作り方なだけでかなり雰囲気が変わりますからね!
ホームページの雰囲気というのはこの背景の設定の仕方によって
左右されると言っても過言ではありません。
背景をどこに置くかでまた印象が変わりますが、
かつては文字を書き込むコンテンツの部分に派手な背景を入れてしまって
文字が見にくくなってしまっているサイトなんかをよく見ました。
特に携帯で簡単にホームページが作成できる
携帯サイトに多かったのですが、最近はそういったものを見なくなりましたね。
背景が模様になっているのだけじゃなく、
例えば水色に白文字なんていうのもかなり見にくくなっているので
作り方において色の組み合わせにも注意したいものですよね。
また、bodyに背景を入れるのか、inner要素に入れるのかによって
背景の反映のされ方が違います。
どちらにも入れればどちらにも入りますが、
bodyの方に背景を設定し、bodyよりも内側にタグをおいているinnerに
白を設定すると、ブラウザにうつる周りだけが背景になり、
文字は見やすいままなので全く問題ないかと思います。
また、背景をうっすらと映るくらいの淡い模様にすれば、文字は見えやすくなるので
inner要素に背景を入れるという方法でもいいと思いますけどね。
全体的に真っ白にしたいのならinnerに白を指定すれば
全体的に真っ白になるはずなのでシンプルでいいですけどね。
ただ、ワンポイントに1~3色程度の色を入れることをおすすめしますが。
あまり色はいれすぎないようにしましょう。
01 9月
ホームページを作り方として色々紹介してきましたが
最後の仕上げとして必要となるのがサーバー。
このサーバがなければ、せっかく作り方を調べて制作したホームページも表から見ることができません。
レンタルサーバを契約するとともにドメインも取得できるのですが、
できればこれは独自ドメインを取得する方がseo的にはいいそうです。
ドメインというのはホームページのURLのことですね。
一般的にはレンタルサーバのサブドメインを使用できるはずなのですが、
独自ドメインにすることによって、サイトのキーワードに合わせたドメインを使用することが可能なので、
ぜひ独自ドメインの取得を行いましょう。
また、良心的な会社で契約できた場合には、レンタルサーバを契約した際に
ドメインの取得を代行してくれるところもありますから、
まず最初に聞いておくことによって、後々自分の手間を省くことができるかもしれませんね。
ちなみにドメインというのは、基本的には年間契約をするのが普通です。
ですが一度ドメインを手放してしまうと、その使っていたドメインが転売されたり、
嫌なことですが、悪用されてしまうこともよくあるそうなので、
面倒ではありますが更新はしっかりとしておき、気をつけましょう。
そしてサーバーにつなぐにはFTPなどのアップする為のツールが必要です。
サイトの作り方を調べて実行し、サーバを用意。・・でもそれだけではないんですね。
最後の最後に、自分のPC内にあるホームページのデータ(フォルダや加工して作った画像など)を
FTPなどのツールを使い、サーバーにアップしなければいけないのです。
それも作り方のひとつだと思えば面倒なことはありません。
それはレンタルサーバの共有タイプだから、買い取した専用サーバだから、などは一切関係なく、
どのサーバであれその工程は必ず必要な作業となります。
最初は意味がわからないという人もいるかもしれませんが、慣れればあっという間に終わる作業でしょう。
そして表から改めて全体的な表示などを確認してみて、完成です。
26 7月
ホームページの作り方について色々と紹介してきましたが、便利なサイトがあります。
それは、こうしたいけどそのタグのつづりなどがわからないという場合にタグを作ってくれるサイトや、あらかじめ作られているタグをコピーできるようになっているサイトなど、便利なサイトが沢山あるので、最初のうちはそういったものを利用してみるとスムーズに作っていけるので、勉強がてら作っていくのにいいかもしれませんね。
ホームページというのは全く同じデザインにする場合でも、いくつものパターンの作り方があるもので、自分がやりやすい方法で作り上げることができるので、そこがまた面白いところのひとつなんですよね。
また、サイトタイトルや見出しのタイトルなどをテキストで作るのか、画像で作るのかによって、同じ色合いでもまた雰囲気がガラッと変わったりするので楽しいです。2パターン作ってみて見比べてみてから決めるのもいいでしょう。
ホームページを作るのはなかなか大変なものですが、こういったことの一つ一つの積み重ねがまた新たな知識が増えていくことになり、自分でできることの幅がどんどん広がっていくというのが、ホームページ面白いところなんですよね。
いろんなことができるようになってくると、次はああしてみたい、もっとこうしてみたい、こうするにはどんな方法で行えばいいだろう・・・という風な考え方になるので、そこがまた新たに成長できるきっかけになります。
そういうやりたいことが向上心につながるので、どんどん成長してできることが増えていけば、いずれ仕事にすることも可能になってくると思いますよ。
26 5月
制作したホームページを公開できるようにするには、自分でサーバーを借りなければいけません。
もしくは、自分の契約してるインターネット接続会社に聞けば、だいたい借りれたりするので解決できると思います。
また、月額がいらないのにホームページを公開できるスペースをレンタルできるところもあるので、そういった所を使って気軽に作るというのもいいかもしれませんね。
ただ、そういった所は無料で貸してくれる代わりに、表示広告がある場合が多いので、レイアウトが自分の思い通りにならず、ちょと嫌だなと思う人もいると思います。そういった人におすすめなのは、容量が多くて、広告を省くことができる所を探すのがいいと思います。
作り始める前は、自分のパソコンの中でホームページを制作するので、作り方さえある程度知っていればすぐに始められます。ホームページを公開できるそのスペースに関しては、ホームページ制作が完成してから借りるという流れでもOKですよ。
あと、そのサーバーに接続する為のファイル転送ソフトは無料で入手できるので、大丈夫です。
1つ作ってしまえば後は慣れてくるので、ホームページの作り方に慣れてきたら、有料のいいサービスのレンタルサーバーを借りるというのもいいと思います。有料とは言っても格安な月額何百円といったところもあるので、利点が沢山あるレンタルサーバーに移すのもいいかもしれませんね。
また、利点としてはプロバイダを変更してもホームページが残るというとことがあります。
他には、無料ところの場合は今流行っているアフィリエイトをしようと考えている人にとってはダメなパターンもあるので、
商用利用ができる有料のレンタルサーバーにした方ができることも広がります。
作り方さえわかれば、後はどうとでもなる簡単なものなので、まずはしっかりと作りましょう。
28 3月
ホームページの基本構造は
----------------------
<html>
<head>
<title>タイトル</title>
</head>
<body>実際に表示される文書の内容</body>
</html>
----------------------
というようになっています。(“<”や“>”の部分に関しては半角での記入が必須です。)
タグがある程度理解できている人にはわかるかと思います。
一番最初にある<html>と最後の</html>についてですが、<html>~</html>で囲まれている部分というのが、“HTML言語で作成されている文書ですよ”という指定です。
このタグでの指定によって、ブラウザが情報をHTMLファイルとして認識してくれるということです。
そして<html>の次にある<head>から</head>ですがこの部分をヘッダと言います。
この部分にそのページのタイトル(=<title>タイトル</title>)だったり、キーワードだったり、ホームページの基本情報を記述するのです。
ちなみに上にもある<body>から</body>のタグの中には
実際にブラウザ上のページに表示されるはずの文章の部分を入れてください。画像や表なども全てこの中に書いていきます。
以上が大体の基本なのですが、たったこれだけでもホームページの基本は完成です。
後はデザインを変えていく為に、画像を作ったり、文章の一部分に色をつけたり、表示させる場所を指定したりしていくと、かなりホームページらしくなってきます。
慣れてくると、次はCSSというものを使い、それに色々な指定をして、そこから呼び出してくるようにすると、もっともっとデザインの幅が広がっていき、楽しいですよ。
05 1月
あけましておめでとうございます!
今年もホームページの作り方について色々と自分の数少ない知識を紹介していきます。
今年はどんどん新しいホームページを作っていくことを目標にしています。
早く、キレイなホームページが作れるようになりたいです。
今回はホームページとSEOについて紹介していきます。
SEOと言えば検索エンジンの上位にあげる為の対策のことです。最近はよく聞くので皆さんもご存知かと思います。
SEO的に言うと、ホームページの作りにも細かく影響するようです。SEOについてはそれほど詳しくないのですが、今回は知っているSEOの知識とホームページのタグなどについて紹介します。
例えば画像タグ。
普通に記入すると画像を呼び出すタグを<img src=”画像ファイルの名前”>もしくは<img src=”画像ファイルの名前” border=”0″>という書き方をするかと思うのですが、SEO的に言うと<img src=”画像ファイルの名前” border=”0″ alt=”コメント”>というように「alt」をつけたりすることをおすすめしているようです。
「これは〇〇の画像です」と書いているようなものなので、検索エンジン側にも伝わりやすくなるので、細かなことですが、これを入れるか入れないかで、意外と影響があるようです。また、テーブルタグを入れる際にも「alt」と同じようなかんじで「summary」を入れた方がいいでしょう。
summaryは、音声ブラウザなどの非視覚系のブラウザに対し、そのテーブルで記されている表の簡単な説明(目的や構造)を伝えることができるSEO的にも重要なタグです。
入れなくても、デザイン的にはちゃんと反映されるので重要視しない人もいますが、検索上位にあげたければ、こういった細かな部分にも気を配りましょう。
25 11月
ホームページと言えばスタイルシート。
そのスタイルシートに関する単位についてですが
【px】・・・ピクセル
【em】・・・フォントのサイズを“1”とする
【%】・・・パーセント
【in】・・・インチ
【pt】・・・フォントのサイズを指定
などが使われます。これらだけ覚えるのはなら簡単なのですが、そのスタイルシートに書き込む文字だったり、呼び出すタグだったりを覚えていくのが大変です。基本的に英語ですから綴りもある程度は覚えなくてはいけないですしね。
指定する時によく使われる言葉についても紹介しておきます。
【margin(マージン)】・・・余白
【padding(パディング)】・・・余白
これらはどちらも余白なのですが意味は微妙に違います。それは例えば囲まれたコンテンツの外側の余白を指定する場合はmarginを使い、コンテンツ内の文字などの間に余白をもうけたい場合はpaddingを使って指定します。
例
margin-top:10px; (※コンテンツの外側の上の余白を10ピクセルあける)
padding-bottom:5px; (※コンテンツの内側の下の余白を5ピクセルあける)
といった感じです。
【background(バックグラウンド)】・・・背景
⇒background-color(バックグラウンドカラー)・・・背景色の指定
⇒background-image(バックグラウンドイメージ)・・・背景画像の指定
例
background-color:#ffffff; (※背景の色は白にする)
background-image:url(“../images/haikei.jpg”); (※背景画像を(haikei.jpg)にする)
といった感じです。
このような指定を細かくしていって、デザインを決めていくんですね。
21 9月
ホームページの作り方というか、作るにあたって楽しい部分でもあるのがデザインを考えたり、画像を作ったりすることですよね。
サイズを指定して、そのサイズに合わせて画像を作ることで自分好みの好きなデザインに仕上げることができる、というところが、何といってもホームページを作る1番の醍醐味と言えるですよね。
ホームページの作り方としてスタイルシートというものがありますが、そのスタイルシートに色々な指定をすることで、もっと細かいデザインに仕上げる作り方を学ぶのも楽しいところですよね。
例えばそのスタイルシートを取り入れる場合に、まず「宣言」しなければいけないのですが、<title>~</title>の下で、</head>よりも上にあたるところに入れなくてはいけません。
【例】
<html>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=Shift_JIS”>
<title>ホームページの作り方</title>
↓ココからスタイルシートの宣言↓
・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
<style type=”text/css”>
<!–
a { text-decoration: none; ←ココにテキストの色は何色ですなどといった指定をする
text-color;#333;}
–>
</style>
・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
↑ココまで。↑
</head>
<body>
ここにホームページのコンテンツ
</body>
</html>
という感じです。
わかりにくいですかね・・・(苦笑)