 |
 |
Ⅱ 科学(Musical life) 5:ウェブ制作=サイト構築・ドメイン契約 -Web Creation- ウェブビジネス第2弾。良質なホームページの作成方法。 <目次> 【1】ブログ作成～Word Pressで作る～ 【2】サイト作成～ホームページビルダーで作る～ 【3】ウェブ公開～サーバーとドメインを契約する～  ★更新：2022/10/1 ★ページ完成度：80％(公開OK) ★文字数：約10300字(達成)   『ホームページビルダー22 ダウンロード版』:：ジャストシステム   初心者でも簡単にホームページを作成できる、ホームページビルダーシリーズの最新版！高品質な写真・イラスト素材を合計20種類搭載している。 |
【1】ブログ作成～Word Pressで作る～無料ソフト、Word Pressを使い、ブログを作成。 近年、他の無料ブログ（FC2等）よりWord Pressが最も推奨されている。 Ⅰ Word Pressの使い方 (1)Word pressの特徴 Word Pressの特徴は下記の通り。 ・創始者はAutomattic社の実業家、マレンウィッグ氏 ・CMSの代表。CMSとは、コンテンツ管理システム=Webコンテンツを、HTML等専門知識がなくても管理できるようにしたもの。CMSの中で、最も利用者数が多い ・いつでも更新できる。PCだけでなくスマホ、タブレットからでも更新できる。 ・SEOに有利。アクセスupの為の親切な仕掛けが幾つもある。 ・サイト側で自分が編集した内容に対して分析してくれる ・ソーシャルボタン、コメント欄等が最初から設置されており、訪問者とコミュニケーションがとれる。 (2)Word Pressの編集 英語の画面が出たり取っつきにくさはある。何事も慣れは必要。 ・英語→日本語に変換 ・プロフィール（右上画像）→アカウント設定（Account setting）→右下の保存（水色）ボタン (3)Word Pressのプラグイン Word Press内での機能を追加する為のソフトウェアのようなもの。初期設定だと、 文字のサイズを変えられないなどの機能不良があるが、追加機能（=プラグイン）すればできることが増やせる。 ❶TinyMce Advanced 文字サイズや文字の背景色、文字の背景画像を変更可能に ・「設定」から付けたし可能 ❷Popup Maker まずマウス右クリックで日本語に翻訳しておこう。ポップアップの作成手順は下記の通り。 左メニューの「プラグイン」→「ポップアップを作成する」→「ポップアップ名、ポップアップタイトルと本文」を記述する。 ポップアップ名はWordPress編集画面で作成したデータの名前になる。 ポップアップタイトルに記述した文章はポップアップの左上に大文字で表示される。 本文欄は通常のブログと同じように文章を書いたり、画像を入れたりして自由に記述できる。 作成が終わったら「公開」ボタンを押すと保存できる。作成したポップアップ一覧の確認は左上の横三本線→「すべてのポップアップ」から確認できる。 ●ポップアップの起動条件を指定する ポップアップが表示される条件として、「クリック展開」または「時間経過による自動展開」かどちらか指定できる。 クリック展開の指定方法はポップアップの編集画面→下部の「トリガー」→「新しいトリガーを追加」→ 「開くをクリックします」→「追加」→「追加」→「更新」で設定できる。 ●作成したポップアップをブログに導入する ポップアップが作成できたら、左上の横三本線→「すべてのポップアップ」→ 一覧画面の作成したポップアップの中で使用したいポップアップタイトルの右横「CSS Class」のところに記載された「popmake-〇〇」というのをコピーし、 ポップアップの起動条件になる文字や画像の部分を下記コードで囲む。 <span class="popmake-〇〇">（クリック対象の文字や画像）</span> ❸Slimstat Analytics アクセス解析可能 ➍Yoast SEO SEO対策のアドバイス表示をしてくれる。 Ⅱ ブログでコンテンツを作成する 本題。文章を書いたり、画像を貼り付けたりして中身を構成する。 (1)ブログのテーマ 最も肝心な、書く内容。 ●自分が興味あること 自分が好きなことや、勉強すべきことは最もやる気につながりやすいため、まずは自分主体でテーマを決めるのがいいだろう。 ●他者から需要のあること 自分が好きなことばかりだと趣味のブログになり、狭い範囲の内容に偏ってしまう。それだけだと気分で更新することになり、中々アクセスを集めにくい。基本的にウェブで配信し、稼ぐということは、他者にとって有益な内容を提供するということ。 相互に刺激し成長し合う。世の中には色んな人がいる。人と会話したり、色んなサイトや番組をみて勉強し、自分の興味にも繋げる。そうすることでネタ不足もなくなり、毎日安定して更新できるようになるだろう。 ●既存のサイト＋オリジナリティー 既にあるようなサイト等のコピーやマネをしても、既存のサイトには勝てない。既存のサイトを参考にするのは文化の発展には欠かせないが、それ＋新しい何かを付け加えることでそれがオリジナリティーとなり、サイトの需要や存在意義が出てくる。 ●テーマの例 ・ビジネス関係 ・携帯電話、PC関係 ・ウェブ、プロバイダ関係 ・旅行 ・音楽 (2)文章量命 SEO（アクセスup）の基本は文章の充実量、キーワードの多さ。最も優先すべきことは、ウェブライターになった気持ちで毎日文章をコツコツ書き続け、更新を止めないこと。 (3)画像やツールで華を添える 文章だけだとアクセスは集めても華がなく、見辛いため、ファンがつきにくい。ページに合った画像を使用。時間短縮したいなら無料素材、自分で撮った写真なら時間もかからないので安心。絵はオリジナリティがでるが、時間がかかるので余裕があるなら使う。 |
【2】サイト作成～ホームページビルダーで作る～
|
【3】ウェブ公開～契約と転送設定～Ⅰ サーバー契約 (1)エックスサーバー：エックスサーバー（株） 
・全サーバーの中で最も世間的評価が高い。 ・一括払いのみ対応。分割払い非対応なので注意！ ・Word Press対応！ ・初期費用あり（全プラン3,000円） ・電話サポートは平日10-18時受付 ・メールサポートは365日24時間受付！ ●プラン（3種類） 各々3カ月、6カ月、12カ月、24カ月、36カ月ごとの契約。ここでは3カ月分の金額のみ記述する。 ・「X10」は3カ月3,600円。ディスク容量（※）200G、転送量（※）70G/日 ・「X20」は3カ月7,200円。ディスク容量300G、転送量90G/日 ・「X30」は3カ月14,400円。ディスク容量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/日 ・エンタープライズ：月額2,000円（2,300円）。ディスク容量400G、転送量無制限 (3)コアサーバー：GMOデジロック(株)  ・全プラン転送量無制限！ ・Word Press対応！ ●プラン（4種類） ・CORE-MINI：月額198円/ディスク容量60G ・CORE-A：月額397円/ディスク容量120G ・CORE-B：月額785円/ディスク容量240G ・CORE-C：月額3,167円/ディスク容量500G (4)GIGA：セブンアーチザン(合)  ・ディスク容量無制限プランあり！ ・Word Press対応！ ・サポートは365日24時間受付！ ●プラン（5種類） 1カ月、3カ月、6カ月、12カ月契約あり ・スーパー：年額8,908円。ディスク容量80G、転送量180G/月 ・ディスク容量無制限：年額11,760円。ディスク容量無制限、転送量180G/月 ・ウルトラ：年額14,980円。ディスク容量120G、転送量360G/月 ・ギャラクシー：年額26,980円。ディスク容量200G、転送量360G/月 ・アルティメット：年額50,980円。ディスク容量300G、転送量720G/月 (5)リトルサーバー：（株）リトルネットワーク  ・安い！！ ・Word Press対応！ ・転送量不明 ●プラン（4種類） 1カ月（ヘビーのみ）、3カ月（ミニ以外）、6カ月、12カ月プランあり ・ミニプラン：年額1,800円。ディスク容量20G ・リトルプラン：年額3,000円。ディスク容量60G ・ビッグプラン：年額5,160円。ディスク容量120G ・ヘビープラン：年額47,760円。ディスク容量500G ※参考サイト ・レンタルサーバー比較 Ⅱ ドメイン契約 (1)ムームードメイン：GMOペパボ（株）  月額69円（.workや.club、.xyz、.site）～1,260円（.net）でドメイン取得可能なサービス。 Ⅲ 転送やアイコン設定 ウェブ公開後の各種設定方法。 (1)HTMLファイルを管理する サイトの内容をアップロードするさいに、全てのデータを管理しているファイルを「HTMLファイル」と呼ぶ。画像ファイルなどをこのHTMLファイル内に移動すれば、サイト内のデータとして共有できる。 ホームページビルダーの場合、ファイルの最上層（ルートディレクトリ）は「public_html」というフォルダになる。 (2)サイトのアイコンを作成する サイトのアイコン＝「favicon」と呼ぶ。自己ブランディングになり、ブックマーク登録しやすくする為、設定しておいた方が望ましい。 ※favicon作成サイト ●作成するサイズ ・パソコン用：16px×16px、32px×32px、48px×48px ・iPhone用：180px×180px 拡張子はパソコン用は「.ico」、iPhone用は「.png」にする。 ●画像をファビコン用に変換し、HTMLファイルに保存する ※Faviconジェネレーター ※Favicon generator 上記サイトでアイコンにしたい画像をアップロードすれば、ico形式のfavicon用画像を自動で作成してくれる。 ダウンロードができない場合、ico形式に変換できるソフト（ペイントなど）を用意しておく。ダウンロードするとパソコン内のダウンロードフォルダに自動で保存される。 ダウンロードしたらそのファイルをHTMLファイル（index.htmlなどが保存してあるファイル）と同じ場所にコピーして保存。 ファビコンの説明サイトを参照しているとHTMLソースの中に<link rel="shortcut icon" href="/img/favicon.ico"/>の記述が必要などと記載があるが、当サイトの場合HTMLファイルに保存するのみで上記コードを記述したページのみ逆にファビコンが表示されないという珍現象が起きた。謎である。 ※ホームページにファビコンを表示する方法    |
|
|
