つい先ほど、自サイト「ひとりっぷ」をリニューアルリリースしました。
ビフォアー
やったー＼(＾＾)／
今日はリニューアル記念日です。この休みの２日間怒涛のように打ち込みました。疲れたけどうれしい。達成感。
っていいうかよく２日で終わったなワタシ、みたいな。
デザイン検討変更・構成・情報設計考案・記事約50ページ転載。。
時間最優先で、せっかちだから早くリリースしちゃいたくて細かいところはボロボロです^^;
今まで何度もリニューアルはしてきましたが（前回のリニューアルはこちら2012の記事）それは見た目のデザインを変えたり構成を変えたり、コンテンツを追加したりJSを覚えたのでJS動画を挿入したりとかそんなリニューアルでした。
しかし今回はhtml＆cssで組むのを卒業してついにCSMのWordPressに全面組み替え・再構築という大きなリニューアルです。WordPressで組み替えた一番の理由は、スマホに最適化するためにレスポンシブデザインにしたかったこと。
最近、Googleさまが検索順位のアルゴリズムに「スマフォフレンドリーであること」を掲げたというのが発端でもある。確かにここ最近、サイトひとりっぷの検索順位がどんどんどんどん落ちて行っていて気になっていたのです（更新せず放置していたせいもありますが…）。
レスポンシブデザイン自体は WordPress でなくても作ることはできるのですが、仕事で WordPress を使う機会があり最近の WordPress がものすごい機能的であることを知ったのもきっかけです。
それまでは単なるオリジナルブログ作成ツールという認識でいたのですが、いやいや、コーポレートサイトを構築できる自由度の高いツールであるということを理解したのです。
「よし、自分のサイトをWordPresでリニューアルしよう」
火が付いたらもう止まりません。
しかし最初はちょっと遠回りをしてしまいました。html&cssでの構築から考えが抜けられず、SSIを使ったincludeの方法もマスターしたのでそれを使ってみたくてこつこつ html&css で制作着手したのです。
それはまだテストサーバーに残ってるんだけど、こちらです。
ベースを組んでみたところで「これだと相当時間かかるな・・・」と現実に帰り、しかもこのページがWordpressのテンプレをもとに作っていたので「だったらWordPressでよくね？」とやっと気づいたのでした。
WordPress にはたくさんのデザインテンプレート（テーマという）が無料で用意されていて、それをベースに構築すれば超時間短縮できる。いろいろ検討して コンテンツサイトに向いている構成のHueman というテーマに決めました。（公式はこちら デモサイトはこちら）。そのままでも十分かっこいいのですが、私の目指すサイトのイメージとは違うのでアレンジが必要です。そもそもWPテーマはアレンジすること前提になっています。そのアレンジメニューも驚愕の秀逸さ。かゆいところに手が届きまくっていてびっくりしました。ちょいちょい調べないとわからないこともありましたが、ググれば簡単に情報が出てきたので作業はしやすかったです。大変だったのは情報（contents）のすみ分け・情報設計のほう。これがいかに難しく重要であるかというのを仕事を通して学び、そこも今回手を加えたかったとこ。
WordPressの仕組みは基本的にはブログと同じで新しい記事が優先的に表示されるので、そこだけみるとあまり更新しない私のサイトやコーポレートサイトには向きません。でもそれもWordPressではちゃんと考えられていて、そのための「固定メニュー」機能があります。最初はこれをどう活用すべきかがわからなかったのですが、どのメニューがどこにどうやって表示されるのかがわかってきたので活用方法を考えました。サイトの一番かなめでありながらあまり更新しないコンテンツを固定メニューで作成し一番目立つ左サイドトップに表示。ここは写真+タイトル+文章とかくどい表示にはしたくなかったのでベスト構成です。
そのほか手を加えたのは
・スライダーの設置（オプション機能だった）
・ad関連の設定
・解析タグの埋め込み
・ツイッター/Facebook BOXの設置
といったところです。あとはひたすら記事の転載。これがしんどかった。全部で50ページくらいあった。。。まだ全部は終わってないので地道に。
Hueman のテーマをインストールしたのが昨日。たった２日でリニューアル完了です*。
すごいなWordPress。神ツール。
＊ WordPress自体は2010年ごろにすでにサーバーにセット済だったので（用途がわからずずっと放置してた）、そこからのスタートです。
それからもう一つ問題だったのがリニューアルのサーバー設定。
これは思い切ってサブドメイン設定のディレクトリのほうをいじっちゃいました。
今までは
http://hitrip.ikuranet.com/ には /tabi/というディレクトリが指定されていました。
これを、WordPressがある/blogs/のほうに変えちゃったのです。一瞬でホームページがさし変わります。
でもこの場合の問題は/tabi/以下にあるhtmlファイルにアクセスした場合not foundになってしまうこと。
そこでちょっと強引ですが取り急ぎ /tabi/以下にあるhtmlファイル を /blogs/ に入れちゃいました^^;
これも地道にリダイレクトかけていかなきゃです。
なんか細かいエラーがぼちぼちあって、
http://hitrip.ikuranet.com/ではなく
http://hitrip.ikuranet.com/index.htmlで飛ぶとエラーになってしまう問題が発生。
/blogs/ の中には index.html は存在しなくて index.phpがある。
そこで index.html に http://hitrip.ikuranet.com/ へのリダイレクトmetaタグを入れてアップロードするもうまくゆかず（無限ループのようになり表示されなくなった）。そこでまたググって、リダイレクトをmetaタグではなくhtaccessでやる方法があって、それを試したら成功した。WordPressには htaccess ファイルが既にあるのでそれに下記を追記。
# BEGIN WordPress
RewriteEngine On
RewriteBase /
RewriteRule ^index¥.html?$ / [R=301,L]
RewriteRule ^default¥.html?$ / [R=301,L]
RewriteRule ^index¥.php$ – [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
# END WordPress
しかし、問題発生。上記のせいでWordpress がおかしくなり、トップページ以下第二階層が表示されなくなった。
こりゃいかん。
いそいで追加した記述を削除。また調べていろんな記述を試すもどれもダメ。
仕方なく、/index.htmlにリンク記述されてるhtmlのほうを直した。DWの一括置き換え(初めて使った)で処理。
コメント