【SharePoint】モダンの余白を削除してみた

MS開発部の小溝です。
今回は、SharePoint OnlineのモダンUIで、
余白を削除した場合の見た目の変化についてご紹介します。
情報量とデザイン性の両立を検討することは大切なことです。
その中で、情報量を優先して余白を削除したらどうなるか実際に試してみました。
日本でのサイトデザインの傾向
まず、実際に違いを見ていただく前に
どちらがよいのかを、日本人の性格という観点から考えてみましょう!
情報量を重視
日本のWebブラウザには独特な進化がありました。
特に、見た目よりも情報量を増やすことが重視される傾向があります。
これは、日本という土地柄や、ユーザーが情報を多く求めるという文化的な背景があるからです。
日本という土地柄
物理的なスペースの重要性
日本は狭い国土に多くの人口が集中しているため、
物理的なスペースが貴重であるとされています。
そのため、できるだけ効率的にスペースを使い、
狭い空間にもモノや人を配置しようとする傾向があります。
ウェブサイトにおいても、その独自の文化的背景が反映されていると言えます。
日本語に含まれる意味
日本語は、1つの漢字でも複数の意味を含めることができます。
また、言葉の間には省略された文脈や情報が含まれていることがあり、
それによって少ない言葉で多くの情報を表現することができます。
また、狭い空間に多くの情報を配置することが求められる場合もあるため、
情報を整理する能力や空間を最大限に活用する能力を身につけることも重要視されています。
日本の文化的背景
自己啓発
日本は、科学技術や先端技術分野において高い水準を維持しており、
日本の文化において「知識」や「情報」は高く評価されていることが背景にあります。
また、日本の経済状況や技術革新のペースも影響していると思われます。
日本は高度に発展した経済国であり、技術革新も早いペースで進んでいるため、
常に最新の情報を持っていることが求められます。
リスク回避
日本にはリスク回避的な文化があります。
これは、日本人が失敗やミスを避け、安全性や確実性を重視する傾向があるためです。
リスクを避けるために多くの情報を収集し、分析することが一般的です。
これらの文化的・経済的・社会的な背景が、
日本のユーザーが情報を多く求めるという傾向を生み出していると考えられます。
デザイン性を重視
一方で、情報量を増やすことに重点を置いたため、デザイン性が欠けているという指摘もあります。
しかし、近年では、ユーザーエクスペリエンスを重視する傾向があり、
Webブラウザのデザイン性も向上しています。
また、スマートフォンの普及によって、
シンプルなデザインが求められるようになりましたが、
同時に必要な情報を効果的に伝えることも求められます。
そのために、「情報の階層構造を明確にする」 「必要な情報には目立つ場所に配置する」
「適切な量の白いスペースを確保する」といった工夫がされることがあります。
このように、ポータルサイトは情報を表示するだけでなく、
見た目も美しいものであり、使いやすいものであることが望まれるため
【情報表示に優先することとデザイン性を両立することを課題】としています。
では開発した結果を、早速みていきましょう。
モダンUIでは、ページ単位にデザインやスクリプトの埋め込みは行えないようになっています。
そのため、余白を削除するための開発をSPFxで行い、弊社のデモサイトに導入してみました。
デモサイト①
ファーストビューで違いを見ていきましょう。
余白あり

余白なし
どちらも同じ画面サイズで見ていますが、青い部分の余白がなくなっているのが分かると思います。
さらに、ニュースページも見ていきましょう。

余白あり

余白なし
余白が減って、その分サイトが上側へと詰まったのがお分かりでしょうか。
他のデモサイトでもみてみましょう。
デモサイト②
ファーストビューです。こちらも余白が減って、その分サイトが上側へと詰まったのが分かると思います。

余白あり

余白なし
さらに細かく見ていきましょう。
青い部分の余白が減っているのが分かると思います。

余白あり

余白なし
思ったよりも違和感なく、削除できたと思います。
まとめ
結論として、余白の大きさは、情報量と見やすさのバランスをとることが大切です。
情報の量が多い場合でも十分な余白が確保されていれば、
読みやすく、見やすいページを作ることができます。
それは、ユーザーの使い勝手や目的によって異なります。
一部のユーザーは、情報を一目で把握するために大量のテキストを望みますが、
他のユーザーは、視覚的に見やすいレイアウトを求めます。
また、ページのレスポンシブデザインや見た目も重要な要素となります。
最終的には、ユーザーのニーズを満たすことが最も重要なポイントですので、
ユーザーアンケートやフィードバックなどから、最適なレイアウトを決定することが望ましいです。
それらを検討する中で、今回の余白を削除するという試みを手段の1つとすることは、
モダンUIを適用してから行う丁度良い対応の一つではないないでしょうか。
当社では、今回ご紹介したようなSharePointについての開発やご支援など行っております。
SharePointでお困りのことなどございましたら、一度ご相談いただければ幸いです。
以上、最後までご愛読いただき
ありがとうございました。
お問い合わせは、
以下のフォームへご連絡ください。