LIFE ENERGY        HOME
Ⅱ 科学(Musical life)

vol.5 Web Marketing2-Creation



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

<目次>

1 ブログ作成~無料のWord Press~

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

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



ページ下部へ(LINK)


★更新:2018/9/1
★ページ完成度:50%
★文字数:約5000字(未達成)





 

1 ブログ作成~無料のWord Press~


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

SYSTEM

Ⅰ Word Press

❶Word pressの特徴 

(1)Word Pressとは

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

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

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

(2)いつでも更新可

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

(3)SEOに有利

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

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

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

❷Word Pressの編集 

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

●英語→日本語に変換

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

❸Word Pressのプラグイン 

⇒Word Press内での機能を追加する為のソフトウェアのようなもの。初期設定だと、文字のサイズを変えられないなどの機能不良があるが、追加機能(=プラグイン)すればできることが増やせる。

(1)TinyMce Advanced

→文字サイズや文字の背景色、文字の背景画像を変更可能に

●「設定」から付けたし可能

(2)Slimstat Analytics

→アクセス解析可能

(3)Yoast SEO

→SEO対策のアドバイス表示をしてくれる。




Ⅱ コンテンツ作成

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

❶テーマ 

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

●自分が興味あること

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

●他者から需要のあること

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

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

●既存のサイト+オリジナリティー

→既にあるようなサイト等のコピーやマネをしても、既存のサイトには勝てない。既存のサイトをパクるのは文化の発展には欠かせないが、それ+新しい何かを付け加えることでそれがオリジナリティーとなり、サイトの需要や存在意義が出てくる。

●テーマの例

・ビジネス関係

・携帯電話、PC関係

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

・旅行

・音楽

❷文章量命 

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

❸画像やツールで華を添える 

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

LINK


 

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


ホームページ制作ソフトにも色々あるが、このページでは主にHPB(ホームページビルダー)を使ったサイト作成方法についてまとめる。

SYSTEM

Ⅰ ホームページ作成ソフト

Word Pressと違い、全て有料である。


(1)ホームページビルダー:(株)ジャストシステム

⇒直感的に作れるホームページ制作ソフト。

(2)シリウス:(株)ACES WEB

※公式ホームページ

⇒次世代のホームページ制作ソフトといわれる。アフィリエイト専用の制作ソフト。

●料金:¥18,800

(3)Dreamweaver:アドビシステムズ

⇒???

Ⅱ ホームページビルダーの機能

(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)


Ⅲ ホームページビルダーでの作成手順


(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タグをチェックし、不要なタグが入ってないか調べ、削除。それでも解消しなければ、面倒だが入力し直しで解決。



Ⅳ ホームページビルダーのツール

(1)挿入ツール


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

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

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

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

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

(4)スタイル

❶文字背景

→文字の上に背景画像設定することで目立たせることが可能!

●「参照」→「素材集から」

→最初から選べるもの。割と種類が豊富にあるので、慣れないうちはこれを使えばOK。

●「参照」→「ファイルから」

→自分でPhotoshopなどで背景素材を作成し、文字背景に設定することが可能!オリジナルの背景を作れるので、素材集に飽きた人は自分で作成してみよう。

Ⅴ 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">⇒文字を左揃えにする

(5)ページ内リンク

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

<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

Ⅰ サーバー 

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



●特徴

・全サーバーの中で最も世間的評価が高い。

一括払いのみ対応。分割払い非対応なので注意!

・Word Press対応!

・初期費用あり(全プラン¥3000)

・電話サポートは平日10-18時受付

・メールサポートは365日24時間受付!

●プラン(3種類)

→各々3カ月、6カ月、12カ月、24カ月、36カ月ごとの契約。ここでは3カ月分の金額のみ記述する。

・X10:3カ月¥3600
→ディスク容量(※)200G、転送量(※)70G/日

・X20:3カ月¥7200
→ディスク容量300G、転送量90G/日

・X30:3カ月¥14400
→ディスク容量400G、転送量100G/日

※ディスク容量とは…ウェブ作成時のファイルや画像などの保存できるデータ量のこと。サーバ契約により数10GB保存できるケースが多いが、実のところ複数サイトであっても1GBですら使い切るのが難しいといわれており、あまり大容量に拘る必要はないと思われる。

※転送量とは…ウェブページ閲覧時にサーバーへの負荷を抑える為に業者が設けたデータ送受信容量の上限。ウェブサイトへのアクセスが多ければ多い程、転送量は多くなる。転送量を超過してしまうと、業者から警告を受け、プラン変更等を促される事がある。

(2)ロリポップ!:GMOペパボ(株)



●特徴

・安い!!

・ライトプラン以降、Word Press利用可能!

・初期費用¥1500(エンタープライズプランは¥3000)

●プラン(4種類)

→契約期間は1カ月、3カ月、6カ月、12カ月、24カ月、36カ月から選べる。ライトプラン以降は6カ月以上プランの一括払い限定で少し安くなる。

・エコノミー:月額¥100
→ディスク容量10G、転送量40G/日

・ライト:月額¥250(¥300)
→ディスク容量50G、転送量60G/日

・スタンダード:月額¥500(¥600)
→ディスク容量120G、転送量100G/日

・エンタープライズ:月額¥2000(¥2300)
→ディスク容量400G、転送量無制限

(3)コアサーバー:GMOデジロック(株)



●特徴


・全プラン転送量無制限!

・Word Press対応!

●プラン(4種類)

・CORE-MINI:月額¥198/ディスク容量60G
・CORE-A:月額¥397/ディスク容量120G
・CORE-B:月額¥785/ディスク容量240G
・CORE-C:月額¥3167/ディスク容量500G

(4)GIGA:セブンアーチザン(合)



●特徴

・ディスク容量無制限プランあり!

・Word Press対応!

・サポートは365日24時間受付!

●プラン(5種類)

→1カ月、3カ月、6カ月、12カ月契約あり

・スーパー:年額¥8908
→ディスク容量80G、転送量180G/月

・ディスク容量無制限:年額¥11760
→ディスク容量無制限、転送量180G/月

・ウルトラ:年額¥14980
→ディスク容量120G、転送量360G/月

・ギャラクシー:年額¥26980
→ディスク容量200G、転送量360G/月

・アルティメット:年額¥50980
→ディスク容量300G、転送量720G/月

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



●特徴

・安い!!

・Word Press対応!

・転送量不明

●プラン(4種類)

→1カ月(ヘビーのみ)、3カ月(ミニ以外)、6カ月、12カ月プランあり

・ミニプラン:年額¥1800
→ディスク容量20G

・リトルプラン:年額¥3000
→ディスク容量60G

・ビッグプラン:年額¥5160
→ディスク容量120G

・ヘビープラン:年額¥47760
→ディスク容量500G






※参考サイト

・レンタルサーバー比較


Ⅱ ドメイン 

(1)ムームードメイン:GMOペパボ(株)




⇒月額¥69(.workや.club、.xyz、.site)~¥1,260(.net)でドメイン取得可能なサービス。



MENU     TOP     HOME


 

LINK

vol.4 Affiliate:ネットビジネス代表

vol.6 SEO:アクセスupの秘訣

vol.7 GAIN:ポイントサイトや投資


vol.8 Variety:Youtubeやウェブ漫画で稼ぐ


Server Transport:プロバイダーやWord Press移行