WEB初心者のための、増販WEBデザイン塾

基本的にサイトはトップページ、サブトップページ、内部ページの三段階で構成を考えて行けば、わかりやすいと思います。
トップページ・・サイト全体の顔となる部分で、適切な情報量で、「役にたいそうだなあ」ひきつける必要があります。あまり情報を詰め込みすぎて、ごちゃごちゃしすぎると逆効果になります。
今日はここまで
いま、一気にコーディングを進めています。近日中にまとめて解説しますのでよろしくお願いします。
それを言い訳に、少しブログの更新はサボるかもしれない。
というか、サボるでしょう。

• 
• 
• ツイート

あなたのHPという店舗に、たくさんのお客さんに来てもらうには、HPの認知度を上げる必要があります。
実店舗で認知度を上げるためには、ロードサイドのような人通りの多いところに店舗を持つ。あるいはチラシや広告を打つという方法をとりますが、WEBの世界でも同じです。
ロードサイドに店舗を持つー＞検索エンジンでトップページあるいは２ページ目までに載せる。
広告チラシを打つー＞メルマガやブログを継続的に発信する。
WEBマーケティングはHPに偏らないトータル的なしくみが必要です。

• 
• 
• ツイート

表にラインや色をつけて行く場合には、CSSファイルを使います。
CSSファイルを使うことに、後からの表の追加や変更に関して、容易になります。
他のページで表を作る場合にも、このCSSファイルをリンクすることにより、HTMLの記述が効率的に行うことが可能となります。
http://km-plan.jp/gaiyou3.html

• 
• 
• ツイート

昨日、話した通り、東京に行っていたのですが、昼過ぎ羽田空港についてびっくりしました。
空港内のTVモニターの前には人だかり、
「なんだろう～？」と、思ってみてみると、福岡で震度6弱の地震。
「え～？？？？？」
まさか、予想もしていなかった事態が・・・
急いで携帯で電話するにも、全然つながらない。
ま～、事が事だけに、しばらくは仕方がないか、と思いながらも、まめに連絡をいれ、しばらくしてつながりました。
家族の無事を確認して一安心。
そこまではよかったのですが、その後、夕方過ぎまで、不通状態が続きました。
回りの人たちの携帯は、結構話しているのに、わたしのFOMAはつながらない。
FOMAに変えて、約一年。当時、NTT DoCoMoの人には「これからは中継局は増え今年中（昨年末のことです）には、DoCoMoと同等になりますよ」と、いわれたが、いつまでたっても、追いつかない。
たいがい、いやになってしまいます。

• 
• 
• ツイート

表を作成するときのタグは、＜table>タグを使います。
そのほかのタグについては、ソースファイルにコメントで記入してますので参考にしてください。
http://km-plan.jp/gaiyou2.html
この状態では、まだ、線は引かれていません。
しかし、文章の構造は、かなり見やすくなったと思います。
じかいは、この表に線をいれ、また、色などをつけて、より一層見やすくしていきたいと思います

• 
• 
• ツイート

今日は出張で東京に来ています。
3連休の頭であるためか、羽田までのチケットが取れず、成田に降り立ちました。そこから、渋谷までリムジンバスで移動。
福岡－＞成田90分。成田－＞渋谷120分。時間で考えれば、福岡ー＞成田のほうが近いことになります。
距離をどう捉えるか、物理的な距離か、時間か難しいところです。
インターネットではどうでしょうか？
瞬時にして、世界中に情報を発信することができ、瞬時にして、世界中の情報を入手することができる。
時間的にいえば、距離は0になります。
では、インターネットでビジネスをする場合、顧客との距離が、0かというと、決してそのようなことはありません。
インターネットでの顧客との距離は信頼度です。
いかに、信頼度を高めるかにより、顧客との距離を縮めることができ、ビジネスの結果へとつながって行きます。
インターネットで顧客との信頼度を高めるには、ホームページだけではできません。そのホームページに導くときの、事前準備、ホームページを訪問した後の、アフターフォローこの三つが仕組みとして整ったときに、初めて、売上UPになるのです。造反増客WEB開発とは、この三つを仕組みとして、デザインしていくものです。

• 
• 
• ツイート

それでは、サブページのひとつである、「会社概要」をコーディングしていきます。
とりあえず、テキストエディタを使って、書きたい情報を記述して行きます。
ここで、気づいたこと
1.改行を認識しない。
　ワープロのように普通に改行してもHTMLは認識してくれません。
　改行させるには＜ｂｒ＞というタグが必要です。
2．スペースの取り扱いについて
　HTMLでは、半角でスペースを入れた場合、いくつ入れても、ひとつ分のスペースとして認識します。
　全角スペースは記述したとおりに、認識します。
まずは、上の"1."を無視したファイルをアップしておきます。
表示された画面と、ソースファイルを見比べてください。

http://km-plan.jp/gaiyou1.html

次は、この文章に強弱をつけ、表にしていきます。

• 
• 
• ツイート

HTMLの雛形を作る。
HTMLでコーディングする場合に、全ファイル共通の「お約束」があります。
まず、それを雛形として、保存しておくと便利です。
雛形の内容はブログではうまく表示されないので、下のリンクに置いておきます。
自由に、自分のフォルダにコピーして使ってください。
http://km-plan.jp/hinagata.html

HTMLの基本的な構造についてもソースファイル内に記述しています。
一つ一つのタグについての解説は今後とも省略して行く予定です。
初めての方も、ぜひタグ辞典を一冊かって、マニュアルを読んで理解する練習をしてください。
お勧めのタグ辞典はこれ


著者： アンク
タイトル： HTMLタグ辞典

• 
• 
• ツイート

まずは、パラパラッとマニュアルをめくってみて解かったこと。
HTML･･･コンテンツ（表示される情報）
SCC････デザイン(画面の背景や、HTMLで書いたコンテンツをどのように表示するか）
と、基本的には、分かれています。
コーディングの流れとしては、コンテンツを、HTMLで1ページ1ファイルづつつくっていき、各々のファイルで、SCCファイルを呼び出して、デザインする。といった感じです。
以前は、デザインの部分も全てHTMLで記述していたみたいですが、現在では、「コンテンツ」のみHTMLが担い、｢デザイン」はCSSで行う分業が一般的です。
分業化することのメリットは、
1．シンプルである。
2．複数の画面のデザインを統一することができる。
3．デザインを変更する場合、CSSファイルひとつのみの、変更ですむ。

各ページを作って行く場合も、最初からあまりデザインこだわらず、ひたすらコンテンツをHTMLを使って、出力して行く。その後、CSSでデザインを考えていくほうが効率的でしょう。
私も、まず、この手順でサブページから作っていきたいと思います。

• 
• 
• ツイート

プログラミングで準備するものとして、マニュアル（言語辞典）とエディターが必要です。
まずマニュアルですが、私が選んだのは、下の2冊です

通常は、入門本からは始めるべきでしょうが、それはそれでめんどくさいので、事例の多いデザインブックを購入しました。
実際にプログラムの事例を見ながら、解からないところは、辞典で調べていく。
その手順でいきたいと思います。
あと、プログラミングには、エディタが必要なのですが、HTMLやSCCはWindowsに標準装備の「メモ帳」で可能らしいのですが、なぜか私のPCはこの「メモ帳」が起動しない。インターネット上からフリーのテキストエディタを探してくることにしました。
いくつかのレビューを参考にダウンロードしたのが、「HTML　Project2」というソフトで、vector http://my.vector.co.jp/　からダウンロードできます。
以上で、準備は整いました。



著者： アンク
タイトル： HTMLタグ辞典



著者： エビスコム
タイトル： HTML&スタイルシート デザインブック―付録CD‐ROMのテンプレートですぐできる

• 
• 
• ツイート