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.

Some Feed back and Advice

Featured Replies

Hi all

 

As a side project, I am attempting to update our current company website (Current Site) and teach myself how to design a CSS based website - Cause I just love the looks and sleekness that most CSS based site have.

 

Here is what I currently have New Design - I think it's ok, but I just cannot seem to get that sleek, sexy CSS look that most CSS based sites seem to have, I think it currently looks very late '90 style? - what I am missing, maybe the graphics don't help??

 

Would be very great full for any feed back and recommendations.

 

Many Thanks

 

Rob :huh:

Space. You need space. Especially you main body of text. And I'd recommend increasing the line-height as well.

 

The text in the navigation is pressed up against the border. Maybe push it down a little.

 

I'd suggest that you try some various colour schemes for the navigation bar buttons. Some which isn't that intense as the current purple. And a completely black border rarely works well.

 

I'd also look into the header with the strong embossed line there. Try it flat perhaps? Maybe a faint gradient. And notice that the shadow doesn't merge in with the background at the very far left side.

 

The colour of the headlines are good as it makes it easier to spot the outline of the page. But I'd say that the body text is to light. People with poor eyes could easily have trouble reading that due to lack of contrast with the background. (Mind you, full back on full white isn't great either as too big contrasts can strain the eyes.)

 

Also, I had a look at the code for the page. And you're using a frameset when you only got one frame. Which doesn't make sense. Just drop the whole frames setup.

Frames are bad for accessibility and search engines.

Agree with Thomas ^

 

Its not bad at all, just space is the main key here.

 

Im also not too keen on the text wrap around the picture - one word on each line beacuse of wrapping around the picture makes it quite hard to read in my opinion.

 

One other thing is to change the navigation bar buttons like Thomas said, that colour is too strong and im also not to keen on the rollover effect. Something lighter/more simple would add a greater effect.

 

hope this helps :)

My design skills are poor so I can't say much but I noticed in opera at least the highlighting of the on hover doesn't go the whole width of the button and your logo in the top left, the loops are really shakey and poor which only looks worse when the text says smooth :-)

  • Author

Excellent advice - Thanks Muchly!!

 

I shall take all on board and make the suggested changes. :D

 

 

Thanks ever so much.

 

Also, I had a look at the code for the page. And you're using a frameset when you only got one frame. Which doesn't make sense. Just drop the whole frames setup.

Sorry for my ignorance, but what do you mean by this?? I didn't think I set any frames up - did I? I have a Left Div (navigation side) and right div (main content).

 

 

Rob ^_^

cool - make sure you let us know when youve made some changes :)

This tag, which you get when you view the source code.

 

<frameset>
<frame src="smoothweb_files/smoothweb.htm" name="redir_frame">

 

 

You are using a frame to direct to the page...makes no sense at all, as it is just one page so you don't need it you just need the page no frame.

  • Author

Ah! OK, could that be due to the fact I am using a webhop service from DynDNS? This site is currently hosted on my webspace with my ISP just for testing / development purposes- the jorob.webhop.net address just acts as forwarder to the actual web address.

 

Cheers

 

Rob

yep, that could well be it. Frames are often used as forwarders as it's the only way to mask the url in the browser bar.

  • Author

Hi all

 

Having taken your advice, please take another look at this site (Website)

 

I am thinking that the line hight for the main body of the text needs a little more space, what do you think? Also included is the link to the Solutions page - just to give an idea of navigation.

 

Again, thanks for the comment - very constructive and most helpful for someone looking to improve their designs and coding.

 

Cheers

 

Rob ^_^

Oh yea, much better. Though I'd still say there's room for more space. Padding and lineheight.

If you add a little padding to the top of the navigation links they'll have more even space above and under.

  • Author

OK, increased the line height and also padded the navigation out a little more - think it's now starting to look much better!!

 

Thanks for all the advice, all very helpful

 

Rob

I still think that logo looks like a dodgy knock off but otherwise it looks cool

agree, much better now!

 

one more thing from me - the 'windows server...' image on the solutions page. The text which wraps around it need more space i think as it looks a bit close.

 

navigation is much better. although im not sure if the word 'navigation' is necessary - its just using up more space, as its clear that that is the navigation.

 

hope this helps :)

Hey

 

I've joined this discussion a bit late as I've been away...still feel it's worth offering my opinions though from a designers point of view.

 

I think the new site is a great development on the old one and certainly a lot more refreshing and easier on the eye. I don't particularly like the logo - I think it lets you down and hinders the sexy look you're going for.

 

I think it would be useful for you to decide on a colour palet and stick to it. You have a lovely blue used in the horizontal header bar at the top of the page - it's a shame this isn't reflected elsewher in the site - like your text headers or your navigation and your body copy - all the different blues conflict to be honest and it would be good to settle on one and use a grey or a darker blue in the same tonal range as a secondary colour.

 

I took a screengrab and had a little play about and came up with this:

 

post-7-1188326970_thumb.jpg

 

I've used 2 main colours - The blue in your header and a grey to compliment it. I removed your beige/pale orange background colour as to me it screams 'naff' and 'cheap' [personal opinion, I hope no offence is taken] and replaced it with a grey one - you could have it with stripes or without, but it compliments the rest of the layout better than the previous colour which didn't match anything. I've also removed the word 'navigation' as it's not necessary. If you define your navigation area, I think people aren't going to need it pointing out. What you have is OK, but I wouldn't have such a contract between the off and on states - plain text/white background to the coloured background and vertical bar. Why not have the coloured background present at all times and use the vertical bar to define the on state? I've also introduced a couple of icons as I thought they would help to differentiate your main headers from the rest of the copy and your sub header.

 

Feel free to use the jpg attached andtake ideas from it or use it outright - I can send you the png if you think it would be useful.

 

Hope these comments help.

  • Author

Wow Eskmyo thats fantastic from a screen grab! You have given me a lot to work on and plenty of idea's on how to move it forward a bit more - Thanks very much.

 

I agree the colours were not very good - but could not quite find a scheme that worked! Unfortunately there is nothing I can do about the main circle's logo - was designed and adopted way before I came alone - (I don't really like it much either!).

 

Thanks to everyone that has / have contributed today - as someone just starting out learning / developing CSS based websites, this place and the people involved are a great resource.

 

Many thanks

 

Rob ;)

Is it too late to chime in?

 

My main suggestion for the spacing of the content is to decrease the space at the bottom of your header tags (h3, etc) and add that to the space at the top. That will break it up a bit (right now the spacing is equal).

 

I do think the site is a great improvement and is coming along nicely. Good work! :D

  • Author

Hi all

 

OK, having taken on board all your great advice, and also some inspiration from Eskymo's design ^_^ ! Here is a new update to my redesign Website

 

The contact Page will 404 because at the moment I am only testing this on my ISP's free webspace, so no PHP - but it's just a simple contact form that send us an email back in the office.

 

Again, please feel free to give any criticism - good and bad, as this is the only way I will develop my skills.

 

Many Thanks

 

Rob :rolleyes:

line height is in my opinion too much already...

 

I would say do the following:

* expand your pallette - try some hints of green or orange

* add a lower border to the heading names.

* make the heading names larger (font size)

* add a greater white-space between end of paragraphs and tops of heading names.

I'd consider making the blue a little darker. for those with sight problems or colour blindness I can see that light blue blurring into the white.

line height is in my opinion too much already...

 

I disagree, I think there's still room for more. Make it less and the text becomes very dense.

 

 

And I still think there could be more space in the left hand side of the main text.

 

 

And maybe reconsider the alt text of your Info images in the headlines. Do you really want "info" appended to your titles when the image isn't used? (for instance when image doesn't load, or screenreaders that reads the alt text, or search engines that will use the alt text.)

  • Jo 90 locked this topic
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.