LIFE ENERGY        HOME
U 科学(Musical life)

vol.5 Web Marketing2-Creation



ウェブビジネス第2弾。良質なホームページの作成方法。

<目次>

1 ブログ作成〜Word Press〜

2 サイト作成〜ホームページビルダー〜

3 ウェブ公開〜サーバーとドメイン〜



ページ下部へ(LINK)


★更新:2018/4/10
★ページ完成度:





 

1 ブログ作成〜Word Press〜


無料ソフト、Word Pressを使い、ブログを作成。
近年、他の無料ブログ(FC2等)よりWord Pressが最も推奨されている。

SYSTEM

T Word Press

(1)Word pressとは

・創始者→Automattic社の実業家、マレンウィッグ氏

・CMS(コンテンツ管理システム=Webコンテンツを、HTML等専門知識がなくても管理できるようにしたもの)の代表

・CMSの中で、最も利用者数が多い

(2)いつでも更新可

⇒PCだけでなくスマホ、タブレットからでも更新できる

(3)SEOに有利

⇒アクセスupの為の親切な仕掛けが幾つもある。

・サイト側で自分が編集した内容に対して分析してくれる

・ソーシャルボタン、コメント欄等が最初から設置されており、訪問者とコミュニケーションがとれる。

(4)編集

⇒英語の画面が出たり取っつきにくさはある。何事も慣れは必要。

・英語→日本語に変換
→プロフィール(右上画像)→アカウント設定(Account setting)→右下の保存(水色)ボタン

(5)プラグイン

⇒初期設定だと、文字のサイズを変えられないなどの機能不良があるが、追加機能(=プラグイン)すればできることが増やせる。

・TinyMee Advanced
→文字サイズ変更可能に




U コンテンツ作成 

本題。文章を書いたり、画像を貼り付けたりして中身を構成する。

(1)テーマ

⇒最も肝心な、書く内容。

・自分が興味あること
→自分が好きなことや、勉強すべきことは最もやる気につながりやすいため、まずは自分主体でテーマを決めるのがいいだろう。

・他者から需要のあること
→自分が好きなことばかりだと趣味のブログになり、狭い範囲の内容に偏ってしまう。それだけだと気分で更新することになり、中々アクセスを集めにくい。基本的にウェブで配信し、稼ぐということは、他者にとって有益な内容を提供するということ。

・相互刺激
→世の中には色んな人がいる。人と会話したり、色んなサイトや番組をみて勉強し、自分の興味にも繋げる。そうすることでネタ不足もなくなり、毎日安定して更新できるようになるだろう。

<例>

・ビジネス関係

・携帯電話、PC関係

・ウェブ、プロバイダ関係

・旅行

・音楽

(2)文章量命

⇒SEO(アクセスup)の基本は文章の充実量、キーワードの多さ。最も優先すべきことは、ウェブライターになった気持ちで毎日文章をコツコツ書き続け、更新を止めないこと。

(3)画像やツールで華を添える

⇒文章だけだとアクセスは集めても華がなく、見辛いため、ファンがつきにくい。ページに合った画像を使用。時間短縮したいなら無料素材、自分で撮った写真なら時間もかからないので安心。絵はオリジナリティがでるが、時間がかかるので余裕があるなら使う。

LINK


 

2 サイト作成〜ホームページビルダー〜


HPB(ホームページビルダー)
を使い、自身のサイトを作成。

SYSTEM

T 機能 

(1)バージョン

⇒2017年現在、HPB21まで発売されている(以前のバージョンは順次発売終了)

(2)HPBサービス

⇒作るだけでなく、公開、運営、集客までサポート。月額制。

☆プラン
→月額制、全独自ドメイン、初期費用無料、Word press対応

・10GBプラン→約1500円 、メールアドレス10個

・50GBプラン→約3500円、メールアドレス無制限

・ネットショッププラン(50GB)→約4500円、メールアドレス無制限

・ばっちり集客プラン→約6000円、全自動ウェブフォーム、メルマガ・クーポン配信

☆申込み

・ドメイン移行

・Auth code→移行元プロバイダの認証コード。移行元のサイト上で手続きし、発行。

・申込後→新規の場合は1時間ほどサーバ設定に時間がかかるため、完了メールを待つ。他社からドメイン移行の場合は、10日前後かかる。

・申込後
→ホームページみても、どこから設定したらいいのか分かりにくい。重要なのは、以下の2つ。

・コンパネ
→管理者アカウント設定、メール設定、WordPressインストールなど

・お客様カウンター
→契約内容の変更、ドメイン情報の詳細確認、ネームサーバー情報など

★トラブル対処

・転送不可:FTPサーバ名などいれても設定情報が反映されないという不可解なエラー
→ビルダー削除→入れ直しでは改善しない。プログラムの中の「Just systemツール」の中から設定情報をリセットする。

※対処法(JUST SYSTEM)

(3)Word Press(WP)

⇒HPB17から搭載。ソフトインストール済みのPCからだけでなく、ブログ感覚でスマホやタブレットからもサイトが更新可能に

・ページの公開設定
→この手順に従ってWord Pressインストール。
→WP画面上でブログ更新が可能に。

・1ページあたり記事表示数は5記事
→変更方法不明

・スマホやタブレットでブログ更新
→ウェブ上のWordPressの管理画面にログインすればスマホなどでも編集できる。外出先でメモ感覚で保存しておけば、時間を有効に活用できる。細かい編集は自宅のPCで行えばよい。

(4)種類

⇒HPB19以降、複数の種類があるが、互換性がない。例えば、クラシックで作成したページをSPで編集したりすることができない。

・クラシック
・SP
・EC

(5)サイト転送(転送設定)

⇒WEBサイトをインターネットにアップロードするために必要な設定。プロバイダと契約し、プロバイダーから指定されたFTP(File Transfer Protocol=ファイル転送時の通信)情報を指定する。

・FTPサーバー名、FTPアカウント名、FTPパスワード
→各プロバイダのサイトにログインをして確認。

・転送先フォルダ名
→プロバイダにより指定がない場合もあれば、ドメインと同じフォルダ名にすることもある。

(6)サイト容量

⇒プロバイダにより容量制限があるので、自分が現在作っているコンテンツの合計容量がどの位なのかは把握しておきたい。

<見方>
・サイト転送→合計○ファイル(転送サイズ○MB or ○GB)


U 手順 


(1)作成モード

⇒作成後でもモード変更可能。「ファイル」→「モードを指定してファイルを開く」

・標準モード
⇒ページを常に中央表示可能。表やスタイルシート(CSS)を使う。

・どこでも配置モード
⇒数ミリ単位で、思い通りに文字や画像を配置できるが、編集画面と見る端末側の画面でズレがあったり、常に中央配置画面が作れない等の難点がある。

(2)URL

・関連単語使用
→検索エンジンがわかりやすいよう、コンテンツと関連した単語を使用。

・作者主体記号NG
→page1.htmlなど、作者主体のもの、記号は-は使用okだが/と.(ドット)は保存不可

・URL削除

→URL名を変更した場合は、前のURLを完全に削除しないと、いつまでもWEB上に残ってしまい、スパム扱いで検索順位等に影響を与える可能性がある。これを避けるには、ファイル転送ツールで完全に削除する。

(3)表(テーブル)

⇒タグをいじらず直接編集可。

・中央配置
→どの端末でも画面を中央表示するのに便利。ビルダーの場合、表挿入→表の外枠選択→書式の位置揃え→中央揃えに

・枠非表示

(4)タグ(HTML)

⇒WEBを構成する用語を理解しなければならない。

・HTML

・CSS(スタイルシート)

・不要タグ削除
→コンテンツを作成する過程で、不要なタグが勝手に書き込まれてしまうことがあり、それが原因で動作が重くなることがある。その為タグの意味を理解し、不要なタグは極力排除しないといけない。
→文章をコピペするとバグが生じやすい。
(例)</font></font></font>…が連続で入る(本来は1つでいい)

(5)コンテンツ作成

⇒上記、ブログのコンテンツ作成と重複するため省略。

(6)バグ解消

⇒HPBで作成すると、ときに意味不明なバグが生じて悩まされる。その解消法について解説する。

<バグと対策>

・HTMLリンクに不要なタグが自動的に生成される。結果、編集が重くなる
→編集ページ上の文字をコピペすると生じやすい。コピペしたいときは編集ページからではなく、HTMLタグをコピぺすればバグは生じない。
→それでも解消しない場合、面倒だが入力し直しで解決する。

・同じ文字サイズで作成したのに、PCとスマホで実際にみたサイズが異なる
→HTMLタグをチェックし、不要なタグが入ってないか調べ、削除。それでも解消しなければ、面倒だが入力し直しで解決。



V ツール 

(1)挿入ツール


・ロゴ:ページのタイトル等目立たせたい文字に使用する。
・ボタン:別のリンク先にとんだりするために設置する為の色んなマーク。

(2)ウェブアートデザイナー

⇒写真や画像をページ内に配置するツール。

(3)ウェブアニメーター

⇒動く文字等をページ内に配置するツール。

(4)スタイル

・文字背景:文字の上に背景画像設定する等目立たせることが可能

W HTML 

(1)META


<meta name="description"content=(概要説明)>

<meta name="keyword"content=(キーワード)>

<meta name="viewport"content=width=device-width>
⇒スマホ最適化、自動縮小防止。

(2)TITLE

<TITLE>(タイトル)</TITLE>

⇒最重要。各ページ固有の名前

(3)HEAD

<HEAD>(内容)</HEAD>

(4)BODY

<BODY>(内容)</BODY>

<h1>(内容)</h1>

→h1〜h6:body内に見出し(目次)をつける。

・h1は大見出し。タイトル等1回のみ使用が望ましい。

・h2〜h6は中〜小見出しとなり、使用回数制限はない。

<font ○○>(内容)</font>


→○○にはcolorやsize等が入る。文字の色やサイズを指定する。

<b></b>:文字を太くする

<br>:改行する

<div style="top:○px;"left:○px;position:absolute;width:○px;height:○px;margin:○px>

→サイトの画面配置を指定。"px"は距離の単位、
"top"は上からの距離、"left"は左からの距離、
"position:absolute"は絶対位置への配置、
"width"は幅、"height"は高さ指定、
"margin"は余白
<center>(内容)</center>⇒画面全体を中央表示
<div align="left">⇒文字を左揃えにする

★応用

(1)リンク

⇒ある文字や画像から別のページにアクセスする仕掛け。

<a href="○">内容</a>

☆ページ内リンク
→ページが縦に長い場合、あるコードを設置する事で一気にその場所までジャンプすることができる。

<やり方>

・リンク元 <a href="#○">内容</a>
 
・リンク先 <h2 id="○">内容</h2>
→○に入れる文字は自由だが、リンク元とリンク先で同じものを指定する必要がある。
複数のリンクを設置する場合、リンク元、リンク先まとめて別のものを指定。

(例)
・リンク元1 <a href="#123">→リンク先1 <h2 id="123">
・リンク元2 <a href="#abc">→リンク先2 <h2 id="abc">

LINK

(1)お名前.com:GMOインターネット(株)



⇒国内シェアNo.1の格安ドメインサービス。年額¥1〜

・Webサイトやブログ、メールアドレスに使用

・500種類以上の独自ドメイン

(2)イージーメールフォーム:(株)リーフワークス



⇒Webサイトに必要な、お問合せフォームやアンケートフォームを簡単に作成・管理できる。

 

3 ウェブ公開〜サーバーとドメイン〜


SYSTEM

T サーバー 

(1)エックスサーバー:エックスサーバー(株)



⇒容量200GBで月額¥900。高速・多機能、高安定性

(2)リトルサーバー:(株)リトルネットワーク



⇒???




U ドメイン 

(1)???


⇒???



MENU     TOP     HOME


 

LINK

vol.4 WM1-Affiliate(ネットビジネス代表)

vol.6 Web Marketing3-SEO(アクセスupの秘訣)

vol.7 Web Marketing4-GAIN
→様々なネットビジネス