広告以外の周知方法

自社サイトを宣伝するのに、本格的な広告を出す必要はありません。広告は効果も絶大ですが、費用もそれなりに高くなります。中小企業であればわざわざ広告を出さなくても、SNSやメルマガで直接紹介することも出来ます。SEOと同時に対策することで、より大きな効果を期待することができます。一番簡単な方法としては、SNSに自社のアカウントを持つことです。そうすれば直接サイトを紹介しなくても、ユーザーの興味を引く情報を流し続ける中に、さりげなくアドレスを記述することが出来ます。それだけで十分な広告効果が得られることもあるのです。もちろん投稿の中にホームページの更新情報を載せることも出来ます。ただ知らせるだけでなく、SNS上ならユーザーからの問い合わせにも気軽に答えられますから、不足している情報を追加するなどして、その都度補完することも出来ます。
SNSを利用することの最大の意義は、何と言ってもコストが掛からないことです。しかも無料で利用できるSNSは沢山ありますから、自社の業種、業態に合わせてそこから選択することが出来ます。例えばFacebook、Twitter、Instagramは、それぞれユーザーの特徴が異なります。ターゲット層に近いユーザーが多く利用しているSNSを選ぶのも大切なのです。
SNS以外には、メールマガジンで知らせるのも有効です。メールマガジンは登録している人に送るものですから、それを目にするのはターゲット層に当たります。ただメールマガジンの場合、そのアドレスを得るのに難航する可能性があります。1度得ることが出来れば長い付き合いも期待できますが、最初の登録(購読申込)までのハードルが、SNSに比べて高いという欠点があるのです。

発注者への見積もりの提示、説明、交渉を見直す

発注者への見積もりの提示は、どのタイミングで、どのように行なわれたか。発注者からの反応と、それに対する対応はどうだったか。

例えば、「見積もり提示の形式(対面、メール、電話での補足)」、「見積の再検討の有無」、「見積もり作成のボトルネック(何に手こずったか)」など、こうしたものを見直す必要があるだろう。

また、発注者に対し、見積もり内容を説明しただろうか。発注者からの質問に的確に回答できたか、また返答までに時間がかかりすぎていなかったか。
発注者から特に反応力、無かったり、「大丈夫」と返答があっても、本当に疑問がないとは言いきれないだろう。見積もりの作成や発注者との交渉は「プレプロジェク卜J とも呼べ、受注し本格的にプロジェクトを開始する前段階ながらもPDCAサイクルでとり行なわれる。見積もりは作成したら終わりではなく、気を抜かずに発注者への説明を行ない、フィードバックに応えることが大切だろう。

 

見積もりのレビュー見直し

見積書や見積もり資料を叩き台に、プロジェク卜を受託する実現性やリスクを検討したことがあるだろうか?

見積もり内容の精度、妥当性、整合性はどのようにチェックしてきたか見直しをしてみよう。

例えば、レビューの登場人物であれば、レビュアー、プロジェクトマネジャー、営業担当者、プロジェクトを担当するデザイナーやコーダー、自社の経営層はチェックしているか。

レビュー視点からは、例えば見積もり内容と、その妥当性(技術的な視点)の見直しや、リスクの洗い出しとの評価(自社のビジネスの観点)の見直しなどがあるだろう。
レビューの登場人物が不足しているのであれば、次回のプロジェク卜から適任者に依頼する。自分ひとりでWeb制作にあたる場合も、自分自身の中で上記の人物の役割を意識してレビューしてみよう。見積書の金額(単価×数量ないし一式の価格)と、実際にWeb制作にかかった工数、生じたリスクとを比べ『にあった』内容であるかを検証する。見積前提条件に発注者との問で生じそうな齟齬(納品内容、素材の用意など)や想
定されるリスク(修正の回数、納品後の修正対応など)を織り込んでいたかを確認しよう。

Googleのビジネスモデル

Googleは、利用者に検索エンジンを無料で提供することで、膨大な数の人々に検索エンジンを利用させています。そして、その検索結果に広告を表示させることで、広告収入を得るというビジネスモデルで収拾を得ています。実際にGoogleを利用する利用者の数はかなり多く 、月間の利用者数はおよそ7,000万人以上と言われています。この7.000万人以上にリ ーチできる広告をGoogle広告という名前で展開しているそうです。
このGoogle広告の中でも有名な広告モデルが検索連動型広告と呼ばれるもので、いわゆるリスティング広告の事を指します。利用者が検索したキーワードに対して広告を出すことによって、検索結果の上部の広告枠に広告主のサイトを表示してくれる広告の方法のひとつです。

メニューの作成

メニューのHTMLは、テンプレートの<nav>~~~</nav>の内側に記述します。
メニューのような箇条書き(リスト)を表現するときは<ul>タグが適切です。
<ul>タグはリストの枠を表し、<li>タグでリストの個々の要素を表します。
リストの一般的な書式は次の通りです。

<ul>
<li>~~~</li>
<li>~~~</li>
<li>~~~</li>
<li>~~~</li>
</ul>

「~~~」の部分に、メニューの文字を<a>タグで囲っ たリンクを入れればよいのです。メニューの文字を2段に折り返すために、改行を示す<br>タグを間に記述することに注意しましょう。そうすると、メニューのHTMLは次のようになります。

ヘッダーエリアの作成

テンプレートができたら、ヘッダーエリアを作っていきます。
まず、キャッチフレーズは、新聞で言うと一面の大見出しに相当しますので、<h1>タグで記述するのが適切です。
テンプレートの<header>と</header>の間に記述します。
次にロゴです。ロゴは画像ファイルを用意し、<img>タグを使って記述します。

<img src= “(画像のURL)” alt=”(画像タイトル)”>

src属性には、HTMLファイルから見た画像ファイルのパスを、フォルダ階層の区切りに「/」を使って記述します。
このように、「http~~~」からではなく、記述元のファイルから見た相対的なパスで指定する方法を“相対パス”と言います。alt属性には、何の画像なのかを表す文章を記述します。
記述しなくてもエラーにはなりませんが、なるべく記述しましょう。

ところで、ロゴは表示するだけでなく、クリックするとトップページにリンクするようにしなければなりません。
リンクを貼るには<a>タグを使います。
<a>と</a>の間に、リンクにしたい文字や画像を入れます。

<a href=”(トップページのファイル名)”>
<img src=”(画像のURL)” alt=”(画像タイトル)”>
</a>

リンク先のURLはくa> タグのhref属性に指定します。
URLというと「http://~~~」という書式を想像されると思いますが、相対パスで記述すると「http://~~~」から書く必要はありません。
このホームページでは全てのページのHTMLファイルを同じフォルダに配置しますので、ファイル名よりも手前の部分は省略することができるのです。

例:<img src=”img/logo.png” alt=”ロゴ”>

また、トップページのファイル名を「index.html」とした時には、
<a href=”index.html”>~~~く/ a>となります。
こうすると、<img>タグは<a>タグに図まれてHTMLの階層が1階層下がりますので、上記のようにTabキーで字下げ(インデント)をしておきましょう。

そして、フッターの作成の際もそうですが、内側に表示するものを1つ1つ“四角形のボックスに入れていくような感覚で枠を書いていくと、それがHTMLの階層構造になります。
コツは、外側から内側へと段階的に枠を書いていくことです。

ワイヤ ーフレームとは

ホームページの構成が決まったら、いきなり作り始めるのではなく、各ページの大まかなレイアウトを描き起こします。
一般に「ワイヤーフレーム」や「ラフ」などと呼ばれます。
ワイヤーフレームを作る目的は、どこに何をどのように配置するのかを明確にすることですが、それらの情報が誤解なく読み取れるのであれば、手書きで作っても構いませんし、使い慣れていればエクセルやワードの図形機能を使って描いても構いません。
ワイヤーフレームは言い換えるとホームペ ージの骨組みです。
家を建てる場合にたとえると設計図に相当します。
どこに玄関があって リビングの間取りはどれくらいで、階段の傾斜は何度ぐらいで、といった具体的な情報が盛り込まれた白黒の図面をイメージするとわかりやすいと思います。
設計図を作らずに家は建たないのと同じで、ホームページも設計図なしで作っていくと、間違いが起こりやすく、リニューアルもしにくくなります。
また、家は建てて終わりではなく、その後何年も何十年もそこで暮らしていくわけですから、手抜き工事があっては困りますよね?
ホームページも同じで、作ったあとで不具合を起こさずスム ーズに運用できることが
重要です。
ワイヤーフレームはそのために作るのです。

用語からWebサイトの構造を考える

Webサイトの構造を決めるためには、情報を分類したカテゴリの 作成や各情報につながりをつけるリンクといった作業を行う必要がある。これらの作業を行ううえで欠かせないのが、 Web担当者が Webサイト上で何を行いたいのか、何を提供したいのかを明確にすることだ。さらに訪問者がいつ、どこから、どのような立場で、どのよう な理由で、訪問するのかを想定しておくことも重要だ。 Web担当者側 のニーズと訪問者のニーズを考慮したうえで、 Webサイトの情報を整理していけば、どこの階層に何を置けばよいのか、どのページに導けばよいのかが見えてくる。 ここで、 Webサイトの構造設計で使われる用語についての解説をいくつかのせておこう。「ディレクトリ構造」 は、 Webサイトのトップページ、を 中心にした実際のファイル構成を示すものだ。「階層」はディレクトリ構造の階層ではなく、カテゴリごとに分けられた層のこと。トップページから何回クリックして目的のページに行き着くかを示すときに使われる。「導線」は、Webサイトの構造を考えるうえでもっとも重要な用語だろう。導線とは訪問者を目的のぺージに導く線のことで、サイト 内のどのページに訪問者を導くかを明確にすることによって初めて見いだせるものであり、これを無視してWebサイトの構造を決めてし まうことは避けるべきだ。「ショートカット」は階層をユーザーが移動するときに、より下の階層へのジ‘ャンプを可能にするリンクのことだ。一 般的なページ内リンクとつくり方は同じだが、うまく使うとサイト内を動 きやすくできる。

パソコン操作について

Windows などの GUI 環境に慣れたユーザーはマウスでの操作を 当然と考えている人も多いが、運動障害などを有する人にとっては マウスは使いづらいデバイスであり、パソコンの操作をマウス以外の デバイスやキーボードのみで行っているユーザーも多く存在する。実際、ほとんどの Webブラウザはマウスを使わなくても、キーボードのみで操作できる。したがって、マウスクリックで表示されるドロップダウン方式のメニューを設置するような場合、その操作がキーボードでも問題なく利用できるように、キーボードイベントにも対応するように制作する必要がある。 また、フォームを利用してユーザーに入力を促すようなページでは、 Tab キーによる項目の移動順序に問題がないかを確認し、場合に よっては tabindex 属性により Tab キー移動の最適化を図る必要もある。

階層構造

Webサイトは、雑誌などの 紙媒体と違い、すべてのユーザーがひとつの方向へよみ進んでいくものではなく自由な順番で読み進むことができています。人によ って読みたいものを自由によんでいくことができる「 立体的な構造」をしています。

ウインドウ枠内では1枚の画面に見えますが、 実はいくつもの画面(レイヤ ー)が積み重なっ た階層状の構造で
いつもの画面を分類ごとにまとめて積み重ねた階層構造をしています。

Webサイトの階層を移動しながらコンテンツを楽しむためには、 今読んでいる場所が全体の中のどの位置なのか、「全体量」と「 現在地」を把握できることが大切です。メインメニュ ーで、全体を分類し、現在地がわかるよう色で示 したり数字をつけるなどの工夫を しましょう 。紙媒体では「ツメ」ゃ「ノンブル(ページ番号)J などに 当たるものです。WEBではパンくずリストと呼ばれます。