Info kplace.plala.jpから移設しました

■目的
新規Webページを作成のメモです。
スマホ対応や自動返信メールなどの課題もクリアします。

■サイトイメージ
 作成するサイトのコンセプトとイメージは以下の通りです。
 ・スマホ/タブレット対応でシンプルかつ見やすいデザインと構成
 ・タイムリーでフレンドリーなコンテンツ
 ・自動化/省力化による作成/更新効率向上
site
■課題
 Webの内容はもちろんですがそれ以外の課題も多数です。
 ただし公開までの時間は1か月余りと短く考えている余裕はありません。
 課題の解決にはクラウド上の無償サービスを使います。
issue
■スマホ対応
 Googleはモバイルユーザビリティを重視しスマホでのアクセスの改善を提案しています。
 モバイル対応なしは検索順位の低下につながるので今後のWeb作成においては必須事項と思われます。
 短時間でのサイト作成には、必要なCSSやjQueryを提供してくれるCSSフレームワークを使うのがベストです。
 今回が初めての利用ですがデフォルトでレスポンシブデサインが可能なBootstrap Frameworkを利用します。
 必要なパーツ(html)をコピーし、提供されたCSSでのアレンジは予想外にシンプルでスムーズです。
 また文字の大きさや余白/背景などデザインも統一できるので悩む間もなくページが完成します。
 メインページはStarter Templateと7種のパーツを使いましたが、それ以外はオレンジの水平ラインだけです。
 Googleモバイルユーザビリティのページはこちら
 「Bootstrap/Webページ作成」のページはこちら
 「Bootstrap/Gridシステム」のページはこちら
 「www.ski-odawara.com/」のページはこちら

new site
■自動メール返信と表アプリ連携
 現状データ入力に<Form>を利用していますが自動返信メールと、表アプリとの連携が課題です。
 Google FormとGoogle Apps Scriptでこれらに対応します。
form
 「Google Form/自動メール返信」のページはこちら

■写真共有
 写真とビデオの共有のため、GoogleフォトとYouTubeの共有を利用します。
 現時点Googleフォトは埋込を未サポートのためリンクのみで対応します。
 *Picasaは埋込をサポートしますが写真解像度の高いGoogleフォトが本命と思われます
photo
■作成/更新効率化
 ページ数が20を超えるあたりから更新作業が複雑多岐になりはじめ手作業の限界を感じ始めます。
 個人的にMovableTypeは利用実績がありますが今回はシェアトップのWordPressの利用を予定しています。
 公開後ページ数の少ない早い時点でWordPressへの移行します。

■Reflesh
 旧Webページは、新しいページに自動ジャンプさせます。
 ジャンプするには<meta>タグでrefleshを指定します。
<head>
<meta content="text/html; charset=Shift_JIS" http-equiv="content-type">
<meta http-equiv="refresh" content="1; url=https://www.ski-odawara.com/">
<title>sao odawara ski</title>
</head>
reflesh
■Webサーバ
 @homepageサービスからレンタルサーバに移行し、また独自ドメインを取得します。
 今回利用のレンタルサーバサービスはさくらレンタルサーバ/スタンダードです。
 応答速度が気になりますが低価格ながらCMS/独自ドメイン/アクセス解析と必要な機能はそろっています。
 さくらレンタルサーバのページはこちら
 「Filezilla FTPクライアント」のページはこちら
sakura
■Google Search Console
 完成したWebページをGoogle Search Consoleに登録しGoogle検索DBへの登録を可能にします。
 Google Search Consoleではサイトのモバイル対応の状況やパフォーマンス確認し最適化できます。
 今回は作成した全ページでモバイル対応に対する問題は「なし」でした。
GSC
■結果
 着手から1か月あまりの短期間でしたが、新規Webサイトを無事公開しました。
 最初のイメージとは差がありますが、ほぼ予定通りのコンセプトのサイトに仕上がりました。
 Bootstrap利用でResponsiveデザインとスマホ対応を実現しましたが、短期作成に対する効果が絶大です。
 Webでの行事申込にはGoogle FormとGoogle Apps Scriptでメール自動返信と、表アプリ連携を可能にしました。
 容量無制限のGoogleフォトは外観もリフレッシュされ高解像度写真とあわせてより見やすくなりました。
 Webサーバーにはレンタルサーバーを利用し独自ドメインを取得しましたが年間費用はこれまでの1/3です。
 CMSは今後になりますが優先事項として推進予定です。

  blog      MovableType