レスポンシブWebデザインでリニューアルいたしました
その他2016年12月27日
「独学Webデザイナーの覚書」をリニューアルいたしました。ありがたいことにかなりの間更新が滞っているサイトではありますが、毎日多くのユーザーに閲覧していただきたき大変感謝しております。
今回のリニューアルについて本記事にまとめさせていただきました。
リニューアルにあたって
一時はサイト自体を閉鎖するかどうか非常に迷いました。しかしながらかなりのアクセスを現在もいただいており小さなサイトではありますが誰かの役に立っているであろうこと、また8年続けてきたドメインを手放すのは資産という観点で非常にもったいないことだと考え、多少パワーをかけてでもリニューアルしようと重い腰をあげました次第です。
特に、以下の記事は未だに1日100PV以上のアクセスをいただいております。
また、以前のサイトはPC専用の設計となっており、スマートフォン全盛期の時代にそぐわないものとなっておりました。
そのため、サイトの主要記事における検索結果の順位がどんどん下がっていたこともサイトリニューアルを決意した理由の一つでもあります。
リニューアルで大変だったこと
どうやって記事を引っ越すか
既存記事をそのままに上手に移行するか。1つ1つ記事を新しいマークアップに直して全て記事を投稿し直すことも考えましたがそれだけで非常に時間がかかってしまうため、一度WordPressのエクスポートの機能を使ってxmlファイルでデータを抽出。
このxmlファイル内に投稿記事の内容が記述されているので、新しい設計に合わせてマークアップを正規表現で置換しました。
全ての記事を満足なマークアップにはできていませんが、見出しやリストなど、最低限の置換はできているため、情報の可読性に支障はないと思います。むしろリニューアルしてかなりアクセシビリティには気を使ったので、とても見やすくなっていると思います。
ローカルでテスト実装
WordPressも当然最新のバージョンにアップデートすることに。WordPress 4.7をローカルサーバにインストールし、WordPressのテスト実装を行いました。前述の置換したxmlファイルを、ローカルサーバでインポートを行えば投稿記事がどんな状態になるか確認できます。これはリニューアル公開のシミュレーションにもなるので、公開時のリスクを多いに減らすことができました。
いただいた投稿記事へのコメントも全てこれで引っ越しすることができます。
ただやはり置換のし直しであったり、インポートすると何故かすべての記事が「未分類」にもカテゴライズされてしまい、これだけ泣く泣く公開時に1つ1つ未分類のチェックを外すはめに。。。一番面倒だった作業ですね。
レスポンシブWebデザインでの設計
当然ながらレスポンシブWebデザインでリニューアルいたしました。
これは工数自体は当然それ相応の時間をかけましたが、私自身これでご飯を食べている身なので、幸いこれはさほど大変には感じませんでした。
まとめ
本記事は約2年ぶりの投稿となりました。今後は可能であればたまにでも記事を投稿出来ればと考えております。
引き続き「独学Webデザイナーの覚書」をどうぞよろしくお願いいたします。
この記事を読んでいる方にオススメの記事
- その他XAMPP（ザンプ）で複数ドメインをローカルサーバで管理する（for Windows）
- その他外部サイトからの直リンクを.htaccessでブロック
- その他計画停電に備えて／自家製サラダオイルランプの作り方
- その他現在の主要ブラウザ
- その他Adobe CS2の無償（ではない）ダウンロードの騒動について
- その他Webデザイナーの給料／年収
- ※承認制のため、即時には反映されません。
この記事にコメントする