: Critique: How can I tie a logo into my website design at both mobile and desktop screen sizes? I'm new to the graphic design section of SE, this being my first question here, but not new

@Jennifer810

A vertical shape like this logo+text does tend to look a bit lost in a wide horizontal space, especially centered. That's largely because it immediately defines three rectangles, two of which are in the opposite orientation to the logo and text. In order to keep the "bar and comic book lounge" text large enough to be readable, you also have to use an unwelcome amount of valuable vertical real estate at the top of the screen.

Centering the text under the logo, as you've done here, makes it very still. Compare with the slightly offset text you've used in the slider, which has a sense of motion that's very appropriate to the theme. With the letter shapes of your logo, the "pedestal" formed by the two lines of text make the PVP seem just enough off-balance to be a bit uncomfortable.

Make a version for horizontal applications like your web header (you should have one anyway). That allows "Bar and Comic Book Lounge" to be more prominent and also allows you to maintain that sense of motion, which reducing the amount of vertical space needed.

On the mobile screen, it will nicely fill the header. On the large screen it should float to the left. That's where we expect to see a logo on a left-to-right language website, and it leaves you room for an auxiliary menu or a banner rotator for special event announcements or ads if you need them.

Vote Up Vote Down

@Lengel450

Simplest answer: I don't think the logo looks terrible sitting above everything as it is.

Simple answer: You could try floating the logo to the left at large and above and moving the menu up to fill the space.

Complicated answer: You could think more about an identity system. A logo is not a brand; it's just a part of it. Think of how Coca-Cola has their logo, but then they also have the "Dynamic Ribbon" that they use as a secondary element on their can. If you had some secondary branding elements or a color palette to work with, you could work that into the header and better fill the space.

Vote Up Vote Down