Design Concept Question - Headers

No, not secret CIA crap.. but just about as tough to crack for most of us. He's got it all, css, html, xhtml, php.. you name it!

Moderator: Zorro

Design Concept Question - Headers

Postby Bullet Magnet » September 20th, 2012, 12:47 pm

Hi all, allow me to introduce myself. OK, now that that's over, I have a question for our ol' pal, Zorro, or whoever might be roaming these forums with web design knowledge.

I've designed my header with a logo, logo text, and a navigation menu like so: http://imageshack.us/photo/my-images/545/headeryxc.png/

I'm confused on how to proceed with splitting it up into HTML elements. The way I see it, there are several different ways. For example, one could use a 1px version of the header gradient and repeat it across the page. This would create the entire header background without using a large image. However, you must then split up the logo design into its own images, which would be extremely difficult given the several different layers for reflections and such (and the fading gradient on the reflecting text/fish would then be screwed up and have to be done in CSS instead).

Instead, I would think the easiest method would be to slice up the entire header including the logo text and logo (i.e. Blushark Media & the jumping fish). You would most likely leave out the navigation menu from the image and create it in HTML using the unordered list tag. This would leave you with a fully functional header of size 980x150px. Would I actually need to split the header up into two slices? One for the logo text/logo and one for the navigation side? Or three slices, even?

How would you proceed, Zorro? I don't need a technical walkthrough or anything... just confirmation of the design plan.
User avatar
Bullet Magnet
Squad Member
 
Posts: 1472
Joined: February 6th, 2011, 5:53 pm

Re: Design Concept Question - Headers

Postby Zorro » September 20th, 2012, 4:48 pm

A 100px wide repeating X gradient (1px will work too, but 100px will render faster) as your page background. Slice the logo area as is. With your gradient, as long as the logo is in the same vertical position relative to your gradient, it won't matter where you place it horizontally.
Research shows that one in three Clinton supporters are just as stupid as the other two.
Zorro
Squad Member
 
Posts: 543
Joined: February 5th, 2011, 12:25 pm

Re: Design Concept Question - Headers

Postby Bullet Magnet » September 21st, 2012, 2:24 am

What do you mean by slice the logo as-is? That's my main question, basically. Do you mean use one image with logo, text, nav buttons, etc.?
User avatar
Bullet Magnet
Squad Member
 
Posts: 1472
Joined: February 6th, 2011, 5:53 pm

Re: Design Concept Question - Headers

Postby BlackCat » September 21st, 2012, 2:31 pm

Use HTML5 and don't worry about it.
User avatar
BlackCat
 
Posts: 1674
Joined: February 12th, 2011, 12:05 pm

Re: Design Concept Question - Headers

Postby Bullet Magnet » September 21st, 2012, 2:44 pm

BlackCat wrote:Use HTML5 and don't worry about it.


You remind me of a kid in my Introduction to Information Systems class.

We were working in Access a bit and the teacher wrote a simple SQL SELECT statement. It had a semicolon at the end of it, so some idiot was like, "oh ok, so this is c++?" He thought he sounded smart.
User avatar
Bullet Magnet
Squad Member
 
Posts: 1472
Joined: February 6th, 2011, 5:53 pm

Re: Design Concept Question - Headers

Postby BlackCat » September 21st, 2012, 4:14 pm

I'll shut my mouth then.
User avatar
BlackCat
 
Posts: 1674
Joined: February 12th, 2011, 12:05 pm


Return to El Zorro's casa de la Codes

Who is online

Users browsing this forum: No registered users and 9 guests

cron