大きなロゴの周りにウェブページをデザインするには？

現在、大きな円形のロゴを使用する場所のウェブサイトをデザインしています。彼らのロゴは画像だけでなくテキストも含んでいます。

私が直面している問題は、ロゴのテキストを判読可能に保ちながら、このロゴをWebデザインに適合させることですが、画面のスペースを大量に消費することはありません。

円形のロゴは、幅と同じくらいの高さです。ほとんどのロゴは高さよりも幅が広く、そのため画面に合わせやすくなっています。

メニューと一緒にページのヘッダーに組み込むことを考えていますが、ロゴの高さによって画面上に実際の不均衡が生じ、ロゴ内のテキストによってロゴを小さくすることは不可能です。

だから私の質問は、これは手に負えないロゴをどのように扱うのですか？それらを分解しても大丈夫ですか、それともこの種の状況ではどのような回避策が役立ちますか？

頭に浮かぶ考えの1つは、円がその光学系の面で自然に行うことを実際に利用できるということです。それを色付きのナビゲーションバーの上に置き、円形のロゴの上部と下部が長方形の上にこぼれるようにすると、ヘッダーと本文の間に必要な空白の量が減ります。

私の例では、円は中央に配置されています（円形のロゴの場合はこれが好きですが、おそらく個人的なものです）が、左揃えにすることもできます。

円形のロゴのあるウェブサイトをいくつかチェックしました。デルのものは小さいです。UPSも同様です（円形ではなく、高さと同じくらいの幅）。アップルもそうです。バーガーキングは面白いことをしました：

いいえ、サンドイッチのフライドポテトは興味深い部分ではありません...私たちはピッツバーグで何十年もそれを行ってきました。面白いのは、ヒーローの画像の中に配置することです。彼らには素晴らしい写真家がいるので、左上にロゴを損なうものが何もないようにショットが設定されていることを確認できます。しかし、それは間違いなく、そこにある食べ物の巨大な画像との関係でまだ小さいので、圧倒しない大きなロゴを許可します。

円でもあるロゴのあるLinux Distroがあります。Ubuntuのロゴは、「Circle of Friends」が中にあるサークルです。彼らはロゴを縮小し、名前の右上隅に「商標」記号が表示されると予想される場所に配置しました。彼らは彼らの「ロゴ」の変更を持っています、そしてこれはそれらの一つです。ロゴのバリエーションを確認するには、http：//design.ubuntu.com/brand/ubuntu-logoにアクセスしてください。ロゴの割り当て方法も示されています。彼らは彼らがそれがどのように見えるようにしたいのかについてあまり保守的ではない場合、これはあなたにデザインのアイデアを与えるかもしれません。それ以外の場合は、ロゴが付いたバナーを作成し、それをWebサイトのヘッダーとして使用することをお勧めします。

大きなロゴ、特に円形は頭痛の種です。ロゴが実際にどのように見えるかについてあまり知らないので、ここにいくつかの非常に速くて汚い概念があります。

非常に原始的な例を許してください。レイアウトガイドラインではなく、概念的なアイデアです。

左側にロゴを配置してページのバランスを調整します（スペースが広くなる可能性が最も高い場所）

少し透明度を使用し、ロゴを大きくします。「空白」（より正確には「ロゴスペース」）を恐れないでください。

ロゴのプロパティに応じて、透明度と非透明度を同時に使用できます

透明性に関するもう1つの取り組み-非透明性

そして、ついに、ロゴをスライスすることに少し変わった楽しみがあります。全体がどこかにある限り、スライスは実際にはかなり効果的です。エキサイティングなデザインになります。