Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Feedback on header design

Featured Replies

Hi Folks,

 

Been working the new design for Amazing Host and just wondered if you could give me some feedback on what you think so far. Went for a dark look.

 

headerdraft1.jpg

 

All comments welcome :)

 

Thanks guys

Joe

It looks fine, but without context it doesn't mean much. You can't design a site in pieces, it's a whole entity; each piece's success is interconnected to the others.

Edited by porkchops

  • Author

Yeh get what u mean im still new too this so was wanting some advice so that when its finished i can code it etc.. without having a large list of modifications, does that make sense? lol. Having a think not sure what to put on the homepage as loads of hosting sites have a featured content then some more content but i want to be different and want to focus on design and e-commerce, as these are less competitive keywords than web hosting. been looking for inspiration lol.

 

Thanks for your time though:)

 

Joe

Edited by joe2011uk

Yeh get what u mean im still new too this so was wanting some advice so that when its finished i can code it etc.. without having a large list of modifications, does that make sense? lol. Having a think not sure what to put on the homepage as loads of hosting sites have a featured content then some more content but i want to be different and want to focus on design and e-commerce, as these are less competitive keywords than web hosting. been looking for inspiration lol.

 

Thanks for your time though:)

 

Joe

 

I definitely understand what you mean, I was in the same spot when I was starting out as a designer. Try to struggle through with the whole homepage design first. You should always be sketching things on paper. Dream it out on paper then design it out digitally.

 

Then, even if the rest of the homepage sucks, people providing critique can tell you what's working and what isn't. More often than not, if you piece something together in design, it looks like it was pieced together (read: not well designed).

  • Author

Hi Porkchops

 

Took your advice spent the whole night getting it right on paper well the layout.

 

Joe

Edited by joe2011uk

looking really good...if i was you thou id add a logo next to the header text ..part from tht looking really good :)

Hi Porkchops

 

Took your advice spent the whole night getting it right on paper well the layout.

 

Joe

 

Nice, that's really the first step. On big projects I sketch and then wireframe in Photoshop. While it may be easier to wireframe in something like balsamiq or fireworks, I find that it's really easy to take your wireframe and apply the visual design if you have pixel-perfect shapes already laid out.

 

Once you get a final product definitely post something up! I'm always happy to give my opinion.

header design is important for starting any Website design and your header design will look more effective when you apply the changes described in the previous replies. But I like the colours in your design.

Looks good so far, nice clean colour scheme... Now don't go messing it up by making the rest of the layout too complex! Lol.. Just playing. :D

 

Just a random thought, but something I find helps me quite a lot: when I start a site I like to check two basic steps first:

  • Basic layout - decide where and how big the header/body/sidebar/footer/etc will be
  • Colour scheme - what should be darker/lighter than the rest

After that, you at least have an idea of how much space you have to work with for different areas (such as the header). If needed, you can still make areas bigger or smaller as you 'fine tune' the layout to fit your content, but having a good structure to start with will prevent many headaches down the line in the coding process.

 

Anyways, since you gave us freedom of speech.....

All comments welcome :)

I do have one small critique: the vertical text alignment in your logo looks a bit odd, I'm not sure if you tried it all in-line and didn't like it, or what the story may be here... But I think it may look better all on one line, for example:

post-23450-0-35556900-1302181051_thumb.jpg

 

But that's just my 2 cents worth, which in SA probably isn't worth much, but I'll share it anyway. ^_^

  • Author

Hi Zalith,

 

Thanks for your input its amazing how much a wee change like that makes i actually love your idea, Im coding at the minute but gonna go back to drawing board for my footer lol but think i will implement that change :).

 

Speak soon

Joe

Hi Zalith,

 

Thanks for your input its amazing how much a wee change like that makes i actually love your idea, Im coding at the minute but gonna go back to drawing board for my footer lol but think i will implement that change :).

 

Speak soon

Joe

No problem at all, I'm curious to see how this turns out. I try my best to finish the design before starting to code the site, but I inevitably end up going back to the design to 'tweak' some areas at some point... I'm curious to see how it turns out in the end. :)

  • Author

No problem at all, I'm curious to see how this turns out. I try my best to finish the design before starting to code the site, but I inevitably end up going back to the design to 'tweak' some areas at some point... I'm curious to see how it turns out in the end. :)

 

hey you can have a look at my progress @ Amazing Host - First Draft Without Footer

 

Decided to change footer pure got designer block lol :p

 

Joe

hey you can have a look at my progress @ Amazing Host - First Draft Without Footer

 

Decided to change footer pure got designer block lol :p

 

Joe

Looks really good so far.. Nicely done! Not sure if you've decided on the final font yet, but if not, have a look at the @font-face kits on FontSquirrel sometime. Allows you to use any font for actual text on a website without the user needing the font. Sansumi or Sansation Light work quite nicely for body text.

  • Author

Looks really good so far.. Nicely done! Not sure if you've decided on the final font yet, but if not, have a look at the @font-face kits on FontSquirrel sometime. Allows you to use any font for actual text on a website without the user needing the font. Sansumi or Sansation Light work quite nicely for body text.

 

Hi

 

was thinking of sticking to calibri, but i do like these fonts do you think i should increase the size or do you think these will work will at current font sizes. Not sure if these fonts would stand out enough for HEader texts though i might be wrong :).

 

Thanks

Joe

Hi

 

was thinking of sticking to calibri, but i do like these fonts do you think i should increase the size or do you think these will work will at current font sizes. Not sure if these fonts would stand out enough for HEader texts though i might be wrong :).

 

Thanks

Joe

Keep in mind even Calibri is not considered a 'web safe font', so you'll find browsers on another OS (or even Windows prior to Vista) will have to take the next font in the list you specify..

 

I've got Calibri on my XP machine (I collect fonts, strange hobby, I know), but if that selection fails, Arial (your second choice on the test site) looks vastly different.

 

Obviously, it's entirely up to you at the end of the day, but if you're open to ideas, try this and then decide for yourself:

  • Sansation Light for paragraphs and lists
  • If h1, h2, h3, h4 and h5: Sansation Regular for headers
  • If h2, h3, h4 and h5: Sansation Bold for headers
  • Don't specify the font sizes, other than using 'em' to fine tune, and you'll have no issues with illegible text

 

It a smooth, clean, clear font, easy to read at virtually any size, and falling back to Helvetica (which is web-safe) if there is a problem won't break your site. Maybe just try it and see what you think, I'm pretty sure you'll like it.

Edited by ZaLiTH

Background texture is really cool. for background texture it looks really high tech and it best fit for hosting website.

Nice nice nice Joe. Gotta say it's looking good.Don't worry about choosing web-safe fonts. Use @font-face or cufon. With this you'll only need a web safe fall back for the very oldest browsers.The buttons at the bottom of the three content boxes would look nice if they where all at an equal height.Apart from that, good job.

  • Author

Nice nice nice Joe. Gotta say it's looking good.Don't worry about choosing web-safe fonts. Use @font-face or cufon. With this you'll only need a web safe fall back for the very oldest browsers.The buttons at the bottom of the three content boxes would look nice if they where all at an equal height.Apart from that, good job.

 

Hi Mike thanks for your comments

ARe they not at the same height, what browser you using? The buttons are all the same images for the three, thats strange.

 

Thanks

Joe

Guest
This topic is now closed to further replies.

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.