Need Creative Advise: Navigation to content divider image?

Hello all!

I was looking for some one creative to assist me in separating my navigation from my content. Here is an image of an example;;

http://i52.tinypic.com/2vanj1k.jpg

See the navigation bar? (Red Sky Capital - Resources)?

Before there was a banner type image that separated the content and the nav bar. Now, my boss has told me that takes up too much room as he seems very concerned with "Iphone load appearance" . . . :confused:

Anyways, I need to remove the image divider and the only thing I came up with is that extremely basic 2 dotted lines.
Please help me think of something that can seperate the two without ruining consistency of the website design. (Simple, solid colors, squared off)

I think these dotted lines serve the purpose very well. If that is what’s being used throughout the site then go for it.

Well thank you I made it myself :D

haha.

But yeah, I wouldn't come here if I felt this was sufficient, I just don't think it divides the site well enough. The nav bar is too plane, it becomes part of the major content in my eyes :(

I just need like a ledge or something I cant figure out, hmmm

Well, you could make the division more prominent by adding a light gray background color to the header, for example, maybe even with a subtle drop shadow. Or you can actually make the header into a “sky”, like, use the cloud motif you have in the top right corner for the bottom of the header?


You know, actually the best thing that would separate the header from the content would be space. It could have more space there, everything is so crowded. And as I thought how you said that this wouldn’t please your boss because of the appearance on the iPhone an idea just came into my mind: CSS media queries (http://css-tricks.com/6731-css-media-queries/) (do resize the browser window with that site open and see the effect of media queries in action). Have your site look different on regular screen and mobile devices.