Dec 11, 2009

久しぶりのホームページ制作講座 第10回

\"「タコライス」食べたい!!



タコライス、ご存知ですか?

たこ飯ではないですよ。



いわゆるタコス+ライスで、タコライスです!!

知ってました?



このタコライスを食べると、気力が出るんですけど・・・

最近忙しくて行きつけのお店にいけてないのです・・・とほほ。ホームページを作成していると、meta descriptionという表記が目につく・・・はずです。



ブログなどでは、meta descriptionが初期設定にないものもありますが、

ホームページビルダーなどには初期にはmeta descriptionが表記されているはずです!



meta descriptionは、SEO的にも有効なもので設定しておくといいでしょう。





では、meta descriptionとはどんな意味を持つものなのか?





metaタグのdescriptionは検索エンジンの検索結果に示される

ホームページの説明文です。



検索結果を見ればわかると思いますが、タイトルの下にそのサイトの説明文が

書かれていますよね?



これがmeta descriptionというわけです。



設定方法などは↓

metaタグのdescriptionとは



かつては、SEO的にかなり有効なモノだったらしいのですが、今はさほど

効果はないです・・・;





が、設定しておいた方がいいですよ!



Googleのヘルプなどをみると、上位に表示されるためには?というところに

meta descriptionのmeta keywordsの設定をしましょう!ということも書いてある。

ただ、メタタグを設定したからと言って上位表示される保証はどこにもない!

meta descriptionとmeta keywordsを設定した方が多少はいいですよ。

ということですね。



しっかりSEOをしようと思うなら、内部的な要因も必要ですが被リンクを増やす

などの方が大事になってきます!ホームページ制作と睡眠時間には、密接な関係があります。

つまり、ホームページ制作に時間をさけばさくほど、睡眠時間が短くなるのです。

これを、「ホームページ制作睡眠時間減少の法則(民明書房より)」と言います。



どれだけ、デザインを凝るのか、しかし、デザインに懲りすぎるとユーザビリティが下がる・・・

また、ぐちゃぐちゃなページは購入率が少なそうではあるが、実際に購入率が高いのは、比較的雑に配置されているページだったり・・・



ホームページ製作者は、夜も眠れずに色々なアイディア、試作、を繰り返しているのです。\"

 

Nov 25, 2009

ホームページ制作講座 第9回

\"昨日、また「沖縄美ら海水族館」に行ってしまいいました。

多い時だと、週に3回は行ってしまうんですけど・・・(・・。)ゞ テヘ



なんでそんなに行ってしまうのかというと、

あの巨大アクリル板!そして9メートルにもなろうかと言う、ジベイザメ!!

あの巨体が空を泳ぐ様は圧巻です!!



悩みも忘れさせてくれる、そんな感じです。

沖縄に来た際には、ぜひ寄ってみてください。突然ですが、インターネットの基本構造ってご存知ですか?

今日は、今さら聞くに聞けなかったインターネットの基本構造をお教えいたします。

「そんなのわかってるよ!」本当に完璧に理解できていますか?

ちょっと初心に帰って、もう一度おさらいしてみましょう☆





インターネットを語るとき、パソコン通信と比べるとわかりやすいでしょう。

パソコン通信はその中心母体のコンピューターたったひとつに対して、ユーザーがつなぎます。一方、インターネットは、中心母体のコンピューターがたった一台ではない、ということです。



中心母体のコンピューターには、いくつものページが納められていて、これをサーバーと呼んでいます。例えば僕は「ビッグローブ」というプロバイダ(インターネット接続業者)を使っていて、ビッグローブのサーバーにホームページを持っていますが、ビッグローブ経由でニフティのサーバーにも接続できて、ニフティのサーバーにおいてあるページも閲覧することが出来ます。

「ジオ」はプロバイダではありませんが、サーバーを持っています。僕はジオにもページを持っていますが、ジオのサーバーには「ビッグローブ」経由でつないでいます。

この他に、某サーバーにもページがあります。その某は、プロバイダ業をやっていますが、プロバイダ(インターネット接続)契約はせずに、有料でサーバーレンタルの契約だけをしています。



なぜこのようなことが出来るのかというと、サーバー同士がつながっているからです。それぞれのネットをつないでいるから、「インター」ネットなのですね。



インターネットは、だから「ネットワークのネットワーク」とも言われています。ユーザーはこういうシステムのおかげで、自宅に近いアクセスポイントを持っているプロバイダと契約し、そこまでの電話代を払うだけで、世界中のホームページを閲覧出来るのです。



どうです?

ちょっと硬くなってしましましたが、少しは理解できたでしょうか?

こういう基礎知識をしっかりと身につけることもとても大事なことなのですよ♪このサイトでは、初心者〜中級者までのホームページ制作テクニックを不定期に更新しています。

ホームページ制作が楽しくなっちゃうような、HTMLやCSSのマル秘テクニックをどんどん配信!

HTMLマスターを目指して頑張りましょう☆\"

 

Nov 17, 2009

ホームページ制作講座 第8回

\"最近、見なくなりましたね〜

「でもそんなの関係ねぇ!そんなの関係ねぇ!」



小島よしお



沖縄出身だったみたいです。

ちょっとびっくりですね。今日はHTMLでしようする基本的なタグをご紹介いたします。





HTMLタグ



    基本



            * :言語の指定

            * :HTMLの宣言

            * :ヘッド

            * :タイトル<br /><br />            * <BODY>:内容 <br /><br /><br /><br /><br /><br />    コメント<br /><br /><br /><br />            * <!-- -->:間に実際は表示されないコメントを書ける <br /><br /><br /><br /><br /><br />    コメント文書構造<br /><br /><br /><br />            * <Hn>:文章の見出し(nには1から6の数字が入る)<br /><br />            * <P>:段落 <br /><br /><br /><br /><br /><br />    改行<br /><br /><br /><br />            * <BR>:改行 <br /><br /><br /><br /><br /><br />    水平線<br /><br /><br /><br />            * <HR>:水平線の表示 <br /><br /><br /><br /><br /><br />    リンク<br /><br /><br /><br />            * <A>:リンクの指定と表示<br /><br />            * <BASE>:リンク先の一括指定<br /><br />            * <MAP>:画像を使ったリンク<br /><br />            * <AREA>:画像を使ったリンク <br /><br /><br /><br /><br /><br />    リスト<br /><br /><br /><br />            * <UL>:ポイント付きリスト<br /><br />            * <OL>:ナンバー付きリスト<br /><br />            * <LI>:リスト内容<br /><br />            * <DL>:リスト<br /><br />            * <DT>:リストタイトル<br /><br />            * <DD>:リスト内容 <br /><br /><br /><br /><br /><br />    フォーム<br /><br /><br /><br />            * <FORM>:フォーム<br /><br />            * <INPUT>:入力フォーム<br /><br />            * <SELECT>:選択フォーム<br /><br />            * <OPTION>:選択フォームで使用<br /><br />            * <TEXTAREA>:テキストエリア <br /><br /><br /><br /><br /><br />  テーブル<br /><br /><br /><br />            * &lt;TABLE&gt;:テーブル<br /><br />            * &lt;TR&gt;:行指定<br /><br />            * &lt;TH&gt;:セル見出し<br /><br />            * &lt;TD&gt;:列指定<br /><br />            * &lt;CAPTION&gt;:テーブル見出し <br /><br /><br /><br /><br /><br />    フォント<br /><br /><br /><br />            * &lt;FONT&gt;:文字の装飾<br /><br />            * &lt;B&gt;:太字<br /><br />            * &lt;U&gt;アンダーライン<br /><br />            * &lt;S&gt;:打ち消し線<br /><br />            * &lt;STRIKE&gt;:打ち消し線<br /><br />            * &lt;BIG&gt;:フォントの表示を一回り大きくする<br /><br />            * &lt;SMALL&gt;:フォントの表示を一回り小さくする<br /><br />            * &lt;BLINK&gt;:点滅<br /><br />            * &lt;BASEFONT&gt;:文字の装飾 <br /><br /><br /><br /><br /><br />    意味<br /><br /><br /><br />            * &lt;ADDRESS&gt;:アドレス表記時に使用<br /><br />            * &lt;BLOCKQUOTE&gt;:引用時に使用<br /><br />            * &lt;SUB&gt;:文字を下にずらす<br /><br />            * &lt;SUP&gt;:文字を上にずらす<br /><br />            * &lt;STRONG&gt;:文字の強調 <br /><br /><br /><br /><br /><br />    音・動画<br /><br /><br /><br />            * &lt;IMG&gt;:画像の表示 <br /><br /><br /><br /><br /><br />    埋め込み<br /><br /><br /><br />            * &lt;SCRIPT&gt;:JavaScriptを扱う時に使用<br /><br />            * &lt;NOSCRIPT&gt;:JavaScript未対応ブラウザ時に表示<br /><br />            * &lt;EMBED&gt;:音声や動画などの表示<br /><br />            * &lt;NOEMBED&gt;:EMBED未対応ブラウザ時に表示 <br /><br /><br /><br /><br /><br />    フレーム<br /><br /><br /><br />            * &lt;FRAME&gt;:フレーム要素<br /><br />            * &lt;FRAMESET&gt;:フレーム指定<br /><br />            * &lt;NOFRAMES&gt;:フレーム未対応ブラウザ時に表示 <br /><br /><br /><br /><br /><br />    べたテキスト<br /><br /><br /><br />            * &lt;PRE&gt;:自動改行しなくなる等<br /><br />            * &lt;XMP&gt;:テキストをそのまま表示<br /><br />            * &lt;PLAINTEXT&gt;:テキストをそのまま表示<br /><br />            * &lt;LISTING&gt;:テキストをそのまま表示 <br /><br /><br /><br /><br /><br />    スタイル<br /><br /><br /><br />            * &lt;STYLE&gt;:DCはスタイルシート未対応のため内容は非表示<br /><br />            * &lt;DIV&gt;:テキスト編集 <br /><br /><br /><br /><br /><br />    レイアウト<br /><br /><br /><br />            * &lt;CENTER&gt;中寄せ <br /><br /><br /><br /><br /><br />    その他<br /><br /><br /><br />            * &lt;META&gt;:アクセス制限、自動転送等<br /><br />            * &lt;ISINDEX&gt;:サーチ用フォーム <br /><br /><br /><br /><br /><br />    特殊文字<br /><br /><br /><br />            * &xxx;:&lt;(&lt;) &gt;(&gt;) &amp;(&) &quot;(\"\")等の文字参照 ホームページ作成ソフトなんて使わなくても、サイト制作は可能です☆<br /><br />むしろホームページ作成ソフトなんかよりも、より見やすく、集客ができるサイトをつくることができます!<br /><br />最初は煩わしい作業と思うかもしれませんが、次第になれてきますので、頑張ってホームページ制作の基礎を抑えていきましょう!\"<br /><br /> </p></p> </div> <div class="article_footer"><p><a href="/article/1328/">[本文のURL]</a></p></div> </div> <div class="article"> <div class="article_header"><p>Nov 14, 2009</p></div> <div class="article_body"> <h3>沖縄環境 ホームページ制作</h3> <p><p>\"「スティッチ!」<br /><br />知ってますか?あれ、沖縄が舞台なんですよ。<br /><br /><br /><br />ディズニーアニメの舞台が沖縄って、なんかドキドキなんですけど〜<br /><br />でも、あんな生物が実際にいたら・・・怖いですけどね。空メール登録って知ってますか?<br /><br /><br /><br />いわゆる携帯の会員登録によく使われる手段なのですが、<br /><br />ユーザーのメールアドレスの存在を確認するのに使われます。<br /><br />会員にメールを送る際に、きちんと届くのかを確認する意味合いもあります。<br /><br /><br /><br />しかし、ここで問題が発生することがあります。<br /><br />その手順によっては、ユーザーが上手く登録できず、見込みユーザーが登録されないことがおきてしますのです。<br /><br />その手順とは、ユーザー情報を入力してもらってから、メールの存在確認を行う手順です。<br /><br /><br /><br />ユーザー情報の入力時に、メールアドレスを入力してもらうのですが、<br /><br />このメールアドレスが間違っている場合、あるいはフィルターがかかっている場合、<br /><br />ユーザーが情報を入力しているにもかかわらず、メールが届かないと言うことで、<br /><br />同じ作業をまた行わなければいけなくなってしまいます。<br /><br />果たして、どれほどのユーザーがこの手順を再度行うのでしょうか?<br /><br /><br /><br />つまり!<br /><br />1.空メール送信<br /><br />2.送信者に、ユーザー情報入力画面のURLを送信<br /><br />3.ユーザー情報を入力したら本登録<br /><br />という流れにする必要があるのではないでしょうか?突然ですが、インターネットの基本構造ってご存知ですか?<br /><br />今日は、今さら聞くに聞けなかったインターネットの基本構造をお教えいたします。<br /><br />「そんなのわかってるよ!」本当に完璧に理解できていますか?<br /><br />ちょっと初心に帰って、もう一度おさらいしてみましょう☆<br /><br /><br /><br /><br /><br />インターネットを語るとき、パソコン通信と比べるとわかりやすいでしょう。<br /><br />パソコン通信はその中心母体のコンピューターたったひとつに対して、ユーザーがつなぎます。一方、インターネットは、中心母体のコンピューターがたった一台ではない、ということです。<br /><br /><br /><br />中心母体のコンピューターには、いくつものページが納められていて、これをサーバーと呼んでいます。例えば僕は「ビッグローブ」というプロバイダ(インターネット接続業者)を使っていて、ビッグローブのサーバーにホームページを持っていますが、ビッグローブ経由でニフティのサーバーにも接続できて、ニフティのサーバーにおいてあるページも閲覧することが出来ます。<br /><br />「ジオ」はプロバイダではありませんが、サーバーを持っています。僕はジオにもページを持っていますが、ジオのサーバーには「ビッグローブ」経由でつないでいます。<br /><br />この他に、某サーバーにもページがあります。その某は、プロバイダ業をやっていますが、プロバイダ(インターネット接続)契約はせずに、有料でサーバーレンタルの契約だけをしています。<br /><br /><br /><br />なぜこのようなことが出来るのかというと、サーバー同士がつながっているからです。それぞれのネットをつないでいるから、「インター」ネットなのですね。<br /><br /><br /><br />インターネットは、だから「ネットワークのネットワーク」とも言われています。ユーザーはこういうシステムのおかげで、自宅に近いアクセスポイントを持っているプロバイダと契約し、そこまでの電話代を払うだけで、世界中のホームページを閲覧出来るのです。<br /><br /><br /><br />どうです?<br /><br />ちょっと硬くなってしましましたが、少しは理解できたでしょうか?<br /><br />こういう基礎知識をしっかりと身につけることもとても大事なことなのですよ♪\"<br /><br /> </p></p> </div> <div class="article_footer"><p><a href="/article/1294/">[本文のURL]</a></p></div> </div> <div class="article"> <div class="article_header"><p>Nov 11, 2009</p></div> <div class="article_body"> <h3>沖縄環境 ホームページ制作</h3> <p><p>\"沖縄に旅行に来ませんか?<br /><br /><br /><br />やっぱり、住んでいて思うんですが、沖縄サイコーです!<br /><br />食べ物は美味しい、海は綺麗だし、人は優しいし。<br /><br />しいて難点を挙げるとすれば、台風でしょうか・・・<br /><br />台風のシーズンを抜かせば、ピカイチの環境です!!<br /><br /><br /><br />沖縄の人は、本土の環境客をお待ちしていますよ〜ホームページ制作でよく問題になることがあります。<br /><br /><br /><br />それは、デザイナーとプログラマーの作業分担の境界線です。<br /><br />つまり、デザインからサイト制作までには、<br /><br />1.サイトのデザイン<br /><br />2.デザインのHTML化<br /><br />3.プログラム<br /><br />大きく上のような分担になるのですが、<br /><br />2のデザインのHTML化をデザイナーが分担するのか、プログラマーが分担するのか重要な問題になるのです。<br /><br /><br /><br />なぜかと言うと、<br /><br />ボタンのマウスオーバー1つをとって説明すると、Javascriptを書けるのか書けないのか。<br /><br />べた書きできるのか、Dramwaverのようなソフトを使うのか・・・<br /><br />実際ソフトを使ってコーディングしたHTMLは、タグが意味不明な使われ方をしていることが多く、<br /><br />最終的にプログラマーが全てを修正する必要が出てきたりします。<br /><br />しかし、プログラマーがデザインをコーディングすると、デザイナーが重要と思っている部分を<br /><br />システム的におかしいと言うことで排除してしまうこともあるのです。<br /><br /><br /><br />はたして、この部分を解消する良い方法はあるのでしょうか?ホームページ作成の力を付ける方法の一つとして、自分の好きなホームページのデザインやレイアウトを参考にする方法があります。自分が良いと思えるホームページには自然と興味や探求心が沸いてきますし、勉強もそれほど苦になりません。<br /><br /><br /><br />「あのホームページのデザインはとっても見やすくて綺麗だけどどうすればあんな風に作れるんだろう?」<br /><br /><br /><br />そうした探求心から優れたホームページのタグの使い方や表現方法を研究し、学んでいくのは大切なことです。その結果似通ったデザインのものが出来てしまう場合もあると思いますが、始めは似たものしか作れなくとも少しずつ自分の色を出していければ良いと思います。<br /><br /><br /><br />ですが、タグやデザイン、文章を丸々コピー&ペーストで写すといったパクリは絶対にいけません。<br /><br /><br /><br />パクることで自分の好きなホームページとまったく同じデザインや文章を苦労することなく再現しても、<br /><br />その行為から何も学び得ることは出来ませんし、パクられた人を深く傷つけることにもなります。そしてもちろん著作権にも違反します。<br /><br /><br /><br />たとえ悪意なくパクったとしても、パクられた人は本当にヘコみます、悲しくなります、制作意欲が激減します。あくまで自分の手で作りあげましょう。\"<br /><br /> </p></p> </div> <div class="article_footer"><p><a href="/article/1293/">[本文のURL]</a></p></div> </div> <div class="article"> <div class="article_header"><p>Oct 28, 2009</p></div> <div class="article_body"> <h3>WEB制作 in 那覇</h3> <p><p>\"夢とロマン!<br /><br />この2つがなければ、男は生きていけないわけですが。<br /><br /><br /><br />「沖縄の海底遺跡」に思いをめぐらしたいと思ってます。<br /><br /><br /><br />マジで何なのでしょうか?<br /><br />ムー大陸の遺跡?それとも古代の超文明の遺跡?<br /><br />そこでは、どんな人が住んでいて、どんな生活をしていて・・・<br /><br />同じ星の上なのに、そこに住んでいた人たちの事は何もわからないんですよね・・・<br /><br /><br /><br />いつか、この謎が解明される日を楽しみにしています。ホームページを作成していると、meta descriptionという表記が目につく・・・はずです。<br /><br /><br /><br />ブログなどでは、meta descriptionが初期設定にないものもありますが、<br /><br />ホームページビルダーなどには初期にはmeta descriptionが表記されているはずです!<br /><br /><br /><br />meta descriptionは、SEO的にも有効なもので設定しておくといいでしょう。<br /><br /><br /><br /><br /><br />では、meta descriptionとはどんな意味を持つものなのか?<br /><br /><br /><br /><br /><br />metaタグのdescriptionは検索エンジンの検索結果に示される<br /><br />ホームページの説明文です。<br /><br /><br /><br />検索結果を見ればわかると思いますが、タイトルの下にそのサイトの説明文が<br /><br />書かれていますよね?<br /><br /><br /><br />これがmeta descriptionというわけです。<br /><br /><br /><br />設定方法などは↓<br /><br />metaタグのdescriptionとは<br /><br /><br /><br />かつては、SEO的にかなり有効なモノだったらしいのですが、今はさほど<br /><br />効果はないです・・・;<br /><br /><br /><br /><br /><br />が、設定しておいた方がいいですよ!<br /><br /><br /><br />Googleのヘルプなどをみると、上位に表示されるためには?というところに<br /><br />meta descriptionのmeta keywordsの設定をしましょう!ということも書いてある。<br /><br />ただ、メタタグを設定したからと言って上位表示される保証はどこにもない!<br /><br />meta descriptionとmeta keywordsを設定した方が多少はいいですよ。<br /><br />ということですね。<br /><br /><br /><br />しっかりSEOをしようと思うなら、内部的な要因も必要ですが被リンクを増やす<br /><br />などの方が大事になってきます!このサイトでは、初心者〜中級者までのホームページ制作テクニックを不定期に更新しています。<br /><br />ホームページ制作が楽しくなっちゃうような、HTMLやCSSのマル秘テクニックをどんどん配信!<br /><br />HTMLマスターを目指して頑張りましょう☆\"<br /><br /> </p></p> </div> <div class="article_footer"><p><a href="/article/1239/">[本文のURL]</a></p></div> </div> <div class="article"> <div class="article_header"><p>Oct 19, 2009</p></div> <div class="article_body"> <h3>沖縄でホームページ制作</h3> <p><table cellspacing=\"0\" cellpadding=\"0\" border=\"0\" width=\"2045\" style=\"border-collapse: collapse; width: 1534pt;\"><br /> <col width=\"2045\" style=\"width: 1534pt;\" /><br /> <tr height=\"20\" style=\"height: 15pt;\"><br /> <td height=\"20\" width=\"2045\" style=\"height: 15pt; width: 1534pt;\">ツールド沖縄!!<br /><br /> 知ってますか?<br /><br /> 日本のサイクルイベントのTOPに立つであろう、イベントです。<br /><br /> <br /><br /> 自転車のイベントは、日本やアメリカよりも、ヨーロッパのほうが盛んで、<br /><br /> 毎年、ジロ・デ・イタリアとか、ツールドフランスとか、ブエルタ・ア・エスパーニャとか、<br /><br /> ヨーロッパを縦断するような大会が開催されています。<br /><br /> 最近のエコ志向も重なって、自転車を走る人が多くなっていると思いますが、<br /><br /> やっぱり、ツールド沖縄に参加して、初めて一人前のサイクリストではないでしょうか!?今回は、実際にさまざまなタグを使って、ドキュメントソース(以下、ソース)を作成していく。まずは、文字だけを使ったHP作りの方法をお教えいたします。<br /><br /> <br /><br /> ●お助けソフトを使おう<br /><br /> <br /><br /> ソースはワープロやテキストエディターでも容易に作れるが、さまざまなタグをマウス操作だけで自動的に入力できる「お助けソフト」があればさらに簡単。<br /><br /> <br /><br /> 今回は、オンラインで入手できる「HyperEdit32」(HE)を使う。HEの ホームページからダウンロード後、すぐに使用可能だが、試用して気に入れば料金を支払う「シェアウェア」なので、継続使用の場合は三千円を送金する。<br /><br /> <br /><br /> それではHEを起動し、HPのトップページを作ってみよう。アクセスした人が最初に見る部分だから、「タイトル」「見てくれた人へのメッセージ」「HPの内容紹介」「感想などを寄せてもらうためのメールアドレス」を表示する。<br /><br /> <br /><br /> ●最初は文字だけで<br /><br /> <br /><br /> ツールバーで「ファイル」→「HTMLテンプレート」と進み、「単純テンプレート」を選んで「開く」をクリック。「〈HTML〉」と「〈/HTML〉」の二つのタグが入った入力画面になるので、例1のように入力してほしい。 <br /><br /> <br /><br /> 入力が終わったら、「index.html」の名前で登録。次にネットスケープを起動し、ツールバーから「File」→「Open File」と進んで「index.html」を開く。するとファイル内容が、改行なしの黒い文字で表示される。これは、HTMLでは改行もタグで指定する必要があるためだ。今度はこれらを読みやすいデザインに作り替える。<br /><br /> <br /><br /> まずは改行。HEでタイトルの最後の「E」の右側にカーソルを合わせ、ツールバーに並んだアイコンの左から十番目、改行マークのアイコンをクリックする。すると、カーソル位置に「〈BR〉」と入力される。<br /><br /> <br /><br /> これが改行タグだ。以下同様に、各項目の最後に改行タグを入力する。<br /><br /> <br /><br /> ●色をつけてカラフルなページに!<br /><br /> <br /><br /> 次に、文字の大きさと色を変える。タイトル部分をドラッグして領域指定し、ツールバーの黒い「F」のアイコンをクリック。すると文字の大きさや色の選択画面が現れるので、1−7の文字サイズから最大の7を選択する。<br /><br /> <br /><br /> さらに、「色の参照」ボタンを選び、カラーパレットで好きな色の部分をクリックして「OK」を選択。ここでは一番左の列の上から二番目、赤を選ぶ。大きさと色を決めたら、「OK」をクリック。するとタイトル部分に「〈FONT SIZE=7 COLOR=#FF0000〉」「〈/FONT〉」というタグが加わる。<br /><br /> <br /><br /> 「FONT」が文字に関する指定の意味で、「SIZE」が大きさ、「COLOR」が色指定。色を指定しない場合は、文字色は自動的に黒になる。以下、同様に「メッセージ」はサイズ5で青、「内容紹介」と「メールアドレス」はサイズ3で黒にする。<br /><br /> <br /><br /> ●よりHPらしく<br /><br /> <br /><br /> さらにタイトルを太字で強調し、メールアドレスを斜体に変える。HEで領域指定後、強調は黒い「B」のアイコンをクリック、斜体は「I」のアイコンをクリックする。すると強調タグ「〈B〉」「〈/B〉」と、斜体タグ「〈I〉」「〈/I〉」が加わる。<br /><br /> <br /><br /> 再び更新登録し、ネットスケープで表示すると、なんとなくHPらしくなってきた。 次回はセンタリングや左右寄せのレイアウト、段落分け、個条書き、仕切り線の入力、表組みなどにチャレンジする。このサイトでは、初心者〜中級者までのホームページ制作テクニックを不定期に更新しています。<br /><br /> ホームページ制作が楽しくなっちゃうような、HTMLやCSSのマル秘テクニックをどんどん配信!<br /><br /> HTMLマスターを目指して頑張りましょう☆</td><br /> </tr><br /></table></p> </div> <div class="article_footer"><p><a href="/article/1209/">[本文のURL]</a></p></div> </div> <div class="article"> <div class="article_header"><p>Oct 13, 2009</p></div> <div class="article_body"> <h3>沖縄 ホームページ制作 その6</h3> <p><table width=\"2045\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\" style=\"border-collapse: collapse; width: 1534pt;\"><br /> <col width=\"2045\" style=\"width: 1534pt;\" /><br /> <tr height=\"20\" style=\"height: 15pt;\"><br /> <td height=\"20\" width=\"2045\" style=\"height: 15pt; width: 1534pt;\">ハブ酒って知ってますか?<br /><br /> ハブを古酒(くースー)につけて飲む・・・いわゆる滋養増強剤というか、早い話が、精力剤です。<br /><br /> <br /><br /> 何でこんな話を・・・というと、<br /><br /> 先日名古屋にあるある会社の社長さんに、ハブ酒をプレゼントしたら、<br /><br /> 大変喜んでいただき、また送って欲しい!って言われたんです。<br /><br /> やっぱり、社長と言う人種は、あっちの方もガンガンなんですね・・・ホームページ作成の力を付ける方法の一つとして、自分の好きなホームページのデザインやレイアウトを参考にする方法があります。自分が良いと思えるホームページには自然と興味や探求心が沸いてきますし、勉強もそれほど苦になりません。<br /><br /> <br /><br /> 「あのホームページのデザインはとっても見やすくて綺麗だけどどうすればあんな風に作れるんだろう?」<br /><br /> <br /><br /> そうした探求心から優れたホームページのタグの使い方や表現方法を研究し、学んでいくのは大切なことです。その結果似通ったデザインのものが出来てしまう場合もあると思いますが、始めは似たものしか作れなくとも少しずつ自分の色を出していければ良いと思います。<br /><br /> <br /><br /> ですが、タグやデザイン、文章を丸々コピー&ペーストで写すといったパクリは絶対にいけません。<br /><br /> <br /><br /> パクることで自分の好きなホームページとまったく同じデザインや文章を苦労することなく再現しても、<br /><br /> その行為から何も学び得ることは出来ませんし、パクられた人を深く傷つけることにもなります。そしてもちろん著作権にも違反します。<br /><br /> <br /><br /> たとえ悪意なくパクったとしても、パクられた人は本当にヘコみます、悲しくなります、制作意欲が激減します。あくまで自分の手で作りあげましょう。このサイトでは、ホームページ作成に関しての知識が全くない方を対象に、ホームページ制作が初めてでも、簡単に取りかかれるよう、最低限必要な内容に絞ってできる限り分かりやすく伝えるようにしています。<br /><br /> 主に直接メモ帳などを使ってタグを打ち込んでいく手法を中心に不定期ではございますが、どんどん情報を配信してまいりますのでお楽しみに!</td><br /> </tr><br /></table></p> </div> <div class="article_footer"><p><a href="/article/1179/">[本文のURL]</a></p></div> </div> <div class="article"> <div class="article_header"><p>Oct 5, 2009</p></div> <div class="article_body"> <h3>沖縄 ホームページ制作 その5</h3> <p><table width=\"2045\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\" style=\"border-collapse: collapse; width: 1534pt;\"><br /> <col width=\"2045\" style=\"width: 1534pt;\" /><br /> <tr height=\"20\" style=\"height: 15pt;\"><br /> <td height=\"20\" width=\"2045\" style=\"height: 15pt; width: 1534pt;\">知ってますか?<br /><br /> 「ヤマヤマー」<br /><br /> <br /><br /> 知ってますか?<br /><br /> 「ヤマピカリャー」<br /><br /> <br /><br /> そう、イリオモテヤマネコのことです。<br /><br /> 実際に発見されたのが1960年代で、最近のことなんですよね。<br /><br /> 生物学的に20世紀最大の発見では?とまで言われたようです。<br /><br /> <br /><br /> 私も、21世紀最大のホームページ制作といわれてみたいです。ホームページ制作で失敗の多い例が、先に予算だけを決めて、制作会社を選ぶパターンです。<br /><br /> こういった場合、SEO対策は行っているとしても、検索エンジンにHitせず、アクセスがないページが出来ることが多いです。<br /><br /> <br /><br /> 何故でしょうか?<br /><br /> それは、検索エンジンにHitさせるキーワードの選定が上手くいっていないのです。<br /><br /> <br /><br /> SEO対策とは何でしょうか?<br /><br /> SEO対策とは、検索エンジンにサイトを検索されやすくする手法ですが、<br /><br /> 検索エンジンから検索されやすいとはどういうことでしょうか?<br /><br /> <br /><br /> それは、あるキーワードで検索順位の上位に表示されること(+α)です。<br /><br /> SEO対策をしたけど、アクセスが上がらないのは、<br /><br /> 1.キーワードが合っていない<br /><br /> 2.キーワードの競合が多い<br /><br /> などの理由が挙げられます。<br /><br /> <br /><br /> つまり、<br /><br /> ・新商品の「イカライス」でSEOをかけても、検索するユーザーが「イカライス」を知らないので、そもそも検索数が低い。<br /><br /> ・「イカ飯(ライス)」と言うキーワードでSEOをかけても、「いかめし」にはライバルが多すぎて、上位に表示されない。<br /><br /> などの原因が考えられます。<br /><br /> <br /><br /> これらの失敗は、制作会社の問題なのでしょうか?<br /><br /> 違います。<br /><br /> 基本的に制作会社はSEOのことまで対策する事は殆どありませんし、SEOで上位をねらう事はありません。<br /><br /> それでも検索エンジンからアクセスを集めたいのであれば、制作会社に的確な指示がひつようになるのです。今日もホームページの作り方をまた一つ勉強できましたね!<br /><br /> そろそろ自分だけのホームページが作りたくなってきたんじゃないですか?<br /><br /> このサイトはホームページをつくる皆さんを応援します!</td><br /> </tr><br /></table></p> </div> <div class="article_footer"><p><a href="/article/1150/">[本文のURL]</a></p></div> </div> <div class="article"> <div class="article_header"><p>Sep 29, 2009</p></div> <div class="article_body"> <h3>ホームページ制作 其の4</h3> <p><table width=\"2045\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\" style=\"border-collapse: collapse; width: 1534pt;\"><br /> <col width=\"2045\" style=\"width: 1534pt;\" /><br /> <tr height=\"20\" style=\"height: 15pt;\"><br /> <td height=\"20\" width=\"2045\" style=\"height: 15pt; width: 1534pt;\">沖縄、おきなわ、OKINAWA・・・<br /><br /> どれが一番いいですか?<br /><br /> <br /><br /> 今度、知り合いのお店でオリジナルの商品を出すって事で、<br /><br /> 「おきなわ」を商品名に入れたいらしいのですが、<br /><br /> 実際に文字にした時にどれがいいのかなぁとおもったんですけど・・・<br /><br /> <br /><br /> 難しいですね〜業者にホームページ制作を頼む問題点<br /><br /> <br /><br /> 一般的に、大手のホームページ制作業者というのは、「お洒落な」ホームページを作ることには大変長けています。 <br /><br /> でも、お洒落と言うことと、商売につながるというのは別問題。 <br /><br /> 多くの場合、ホームページ制作を担当する「Webデザイナー」というのは、「商売」をしたことがありません。<br /><br /> 当然、ホームページを通じて、売上げを立てるというノウハウにも乏しい訳です。 <br /><br /> ホームページ制作会社の多くは、営業マンとWebデザイナーは別々に別れています。<br /><br /> そして営業マンは既存客からの紹介で新規のお客様を獲得し、Webデザイナーはそのお客様と相談しながら「見栄えの良い」ホームページを作るわけです。 <br /><br /> Webデザイナーが自分で営業しているわけではありませんから、「お客様を開拓する」ホームページを作るノウハウは持ち合わせていないのです。 他のサイトを見てデザインや内容の充実さで負けていることを実感することもあるでしょう。ですが、あなた以上にそのサイトの管理者は努力しています。<br /><br /> ならば、そのサイトを隅々まで見て研究しましょう。意外な発見があるかもしれません。同じ土俵で相手を見るのではなく、自分らしさで勝負しましょう。</td><br /> </tr><br /></table></p> </div> <div class="article_footer"><p><a href="/article/1118/">[本文のURL]</a></p></div> </div> </div> <div id="side"> <div id="calendar"> <div id="calendar_header"> 2010年02月 </div> <div id="calendar_body"> <table> <thead> <tr> <th class="sunday">日</th> <th>月</th> <th>火</th> <th>水</th> <th>木</th> <th>金</th> <th class="saturday">土</th> </tr> </thead> <tbody> <tr> <td class="sunday"></td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td class="saturday">6</td> </tr> <tr> <td class="sunday">7</td> <td>8</td> <td>9</td> <td>10</td> <td>11</td> <td>12</td> <td class="saturday">13</td> </tr> <tr> <td class="sunday">14</td> <td>15</td> <td>16</td> <td>17</td> <td>18</td> <td>19</td> <td class="saturday">20</td> </tr> <tr> <td class="sunday">21</td> <td>22</td> <td>23</td> <td>24</td> <td>25</td> <td>26</td> <td class="saturday">27</td> </tr> <tr> <td class="sunday">28</td> <td></td> <td></td> <td></td> <td></td> <td></td> <td class="saturday"></td> </tr> </tbody> </table> </div> <div id="calendar_footer"> <a href="/month/201001/"><<前月</a> <a href="/month/201003/">翌月>></a> </div> </div> <br /> <div id="new_article"> <div id="new_article_header"> 新着記事 </div> <div id="new_article_body"> ・<a href="/article/1388/">久しぶりのホー・・・</a><br /> ・<a href="/article/1358/">ホームページ制・・・</a><br /> ・<a href="/article/1328/">ホームページ制・・・</a><br /> ・<a href="/article/1294/">沖縄環境 ホー・・・</a><br /> ・<a href="/article/1293/">沖縄環境 ホー・・・</a><br /> </div> <div id="new_article_footer"></div> </div> <br /> <div id="archive"> <div id="archive_header"> アーカイブ </div> <div id="archive_body"> ・<a href="/month/200912/">2009年12月(1)</a><br /> ・<a href="/month/200911/">2009年11月(4)</a><br /> ・<a href="/month/200910/">2009年10月(4)</a><br /> ・<a href="/month/200909/">2009年09月(4)</a><br /> </div> <div id="archive_footer"></div> </div> <br /> <div id="link"> <div id="link_header"> リンク集 </div> <div id="link_body"> ・<a href="http://digitalauthoringsolutions.com/">那覇 ホームページ制作</a><br /> ・<a href="http://galiciaonline.info/">ホームページ制作 手順</a><br /> </div> <div id="link_footer"></div> </div> </div> </div> <div id="footer"><p>Copyright <a href="/">ホームページをつくろう</a> 2009</p></div> </div> </body> </html>