オペラ協会のサイトリニューアル

フィオーレ・オペラ協会さまのWebサイトです。全面リニューアルをご依頼いただき、MovableType.netを用いて制作いたしました。

これまでもレスポンシブなホームページはありましたが、年月とともに公演の情報などがどんどん蓄積されていく一方で、情報が整理しきれずに、縦に長いページになってしまっていることや、更新するたびに字体や写真のサイズがバラバラになっていき、統一感が無いことなどを改善したいとご相談いただきました。

更新に携わる人が複数いることを想定し、決められた箇所に文字と写真を指定すればページが出来上がるようにし、誰が更新してもレイアウトが崩れにくい、かつ分かりやすいインターフェースを目指しました。

「公演」ページを効果的に

Webサイトの中で最も重要なのが「公演」のページです。

これから開催する公演を魅力的に宣伝し、公演が終わったら「これまでの公演」としてアーカイブしていく必要があります。

そこで、MovableType.netのブログ機能を活用し、公演が終了したら、カテゴリのチェックを入れ替えるだけで、自動的に「これまでの公演」に移動するよう構築いたしました。「差し替え予約機能」を活用すれば、更新忘れも防ぐことができてとても便利です！

また、各公演の案内ページとメールフォームを連携し、今見ている公演ページの情報がメールフォームの項目に引き継がれるようにしました。

このようにすることで、チケット申込みの際に公演名や席種を入力する手間が省けるため、スムーズなチケット購入につながるのでは、と期待しています。

リニューアルを機に、ガラリとイメージチェンジ

旧サイトは白を基調とした比較的シンプルなデザインでした。文字の割合が多めだったこともあり、高尚で敷居が高い印象だったかもしれません。

リニューアルを機に、公演のお写真やチラシ画像を多目に入れ、それらが映えるような濃いめのブラウンを基調にさせていただきました。

協会の名称である「フィオーレ（Fiore）」は、イタリア語で「花」の意味ということもあり、全体的に花を入れたいとリクエストいただきましたので、随所にお花を入れて、華やかさを出しつつ、親しみやすさも感じられるよう工夫してみました。

リダイレクト機能を有効活用

旧サイトのページ構成やページのファイル名（URL）はなるべく変更しないように配慮しましたが、どうしても多少の違いは出てきてしまいます。Webサイト切り替えの時期は、次の公演まで１ヶ月を切っているという状況でしたので、ページが見つからないエラー（404 Not Found）が発生することを極力避けるため、MovableType.netのリダイレクト機能を活用しました。

運用しやすいCMSへ

旧サイトではWordPressを使って運用されていました。WordPressは確かに安価で便利ですが、サーバー管理やバージョンアップ作業、セキュリティ対策などを誰が担うのか、という問題もあります。（実際、長期間バージョンアップされていないままで、非常に危うい状態でした）

そこで、サーバー管理やセキュリティ対策を考えなくても済むCMS（MovableType.net）へのお引越しをご提案させていただきました。