サイト全体のデザインを見直しました

こんにちは、田部です。

ブログの更新は、はや2ヶ月ぶりですね。

布教を桶教新聞に切り替えるための準備を進めており、新規記事の更新は滞っていましたが、実は桶教について伝える内容などは、適時見直して内容の調整などを行っていました(軽微な修正なので逐一報告はしていませんでしたが、機会があれば過去の記事もご覧頂けると幸いです)。新聞の方はレイアウトなど悩んでおり、もう少し時間が掛かりそうです。SNSでの活動は続けてまいりますので、今しばらくお待ちください。

今回の記事では、サイトデザインを見直したことについて、どのような点を意識した変更を行ったのかをまとめます。

前回の変更点の反省

あわせて読みたい
カラーユニバーサルデザインに基づいて公式サイトをリニューアルしました こんにちは、田部です。 以前からご覧になっている方は、サイトのデザインが変わっていることに気がついたでしょうか。カラーユニバーサルデザインを意識して、全体的に...

以前、当サイトは多くの人にとって見やすいサイトになるよう、ユニバーサルデザインを考慮したデザインへと変更したことがあります。

この変更は様々な面でおおむね好評でしたが、自分で何度も確認するうちに、記事のカテゴリーを示すバナーのデザインについていくつかの課題も見えてきました。以下の画像は以前のトップページです、こちらを確認しながら問題点を振り返っていきましょう。

第一の問題は、細い丸ゴシックを採用していることです。悪くはないのですが、特にスマートフォンのような小さい画像で見た場合に、細すぎて少し読みにくく感じることもありました。

第二の問題は、ピクトグラムを使用していることです。何を示しているのか分かりやすくするねらいがありましたが、キスメ様の絵の隣にあることや、文章と絵が混じっていて、とっちらかっている印象を受けます。

また、サークルのロゴなども少し不満があったため、これらの反省を元に変更を加えました。

まず、サークルのロゴを読みやすいように感覚を開けました。以前のロゴは「新興宗教桶教」という文字は線が込み入っているため、詰めたほうがバランスが良くなるのではないかという狙いから調整しましたが、今回はフォントの線も細くして、読みやすさと雰囲気を重視した形になります。

「信じぬものも救われる」という標語は、フォントや色を変更しています。以前は標語もロゴと同じフォントでしたが、別のフォントを使用することでメリハリがついたのではないでしょうか。ちなみに、下の概要文もフォントや行間を調整して少し余裕を持たせています。

バナーは特に大きく変更しています。まず、ピクトグラムは廃止しました。その分、文字を大きくして、読みやすさに注力することにしています。

色使いについては、以前の変更でも意識していた「カラーユニバーサルデザイン」を意識して決定しています。カラーユニバーサルデザインについての詳細は、前回の変更をまとめた記事にて記載してありますので、割愛いたします。要約すると、様々な色覚の人が多くの状況で見やすい色使いということです。

あわせて読みたい
カラーユニバーサルデザインに基づいて公式サイトをリニューアルしました こんにちは、田部です。 以前からご覧になっている方は、サイトのデザインが変わっていることに気がついたでしょうか。カラーユニバーサルデザインを意識して、全体的に...

フォントについては、以前の「フォントワークス UD丸ゴ ラージ」から、適度な太さと読みやすさを兼ね備えている「フォントワークス ハミング」を採用しました。

UD(ユニバーサルデザイン)丸ゴを採用していた理由に、読みやすさと丸ゴシックの温かみがありますが、今回使用したハミングはその両方を備えつつ、普遍的かつ現代的な雰囲気を持っており、桶教のバナーに適していると考えて変更しました。実際、多くのシチュエーションで採用されており、人気のあるフォントです。皆様も見かけたことがあるかもしれませんね。

キスメ様と桶教についての詳しい説明があるページへのリンクバナーも変更しています。以前のバナーは文字が多く煩雑であったため、とにかく最初に訪れた方はここを確認して欲しいというこちらの意図をシンプルに伝えることが大切であると判断し、思い切って一行にまとめました。

以前は「桶教について」のバナーにのみ付けていたフリガナも、デザインの統一性のために全てのバナーにつけています。

今後も改良を続けます

今回の変更点は以上となります。他に細かい部分としては、データ圧縮の方式を変更して通信量の削減を図るなどの調整も同時に行いましたが、こちらは目に見える部分ではないため、以前と変わりなくお使い頂けるはずです。

トップページ以外は変更を要するほど気になる部分はありませんでしたが、トップページやその他のデザインについて、皆様から見て思うところがありましたら、ぜひともご意見ください。ここまでご覧頂き、ありがとうございました。