...

View Full Version : Website "sheen" effect?



claire_t
04-17-2012, 09:49 AM
Forgive me for
a. if this is a silly question and
b. if this is in the wrong part of the forum

I have been trying to figure this out for a while. I have built a couple of sites and am working on 2 more at the moment. But they all, at the moment, have a real "homemade" look about them. They don't seem to "shine" on the page.

Where as I look at most other sites and they always look "glossy" and "shiny".

Is this just due to the resolution of graphics, images etc or is there something else that can be done with the actual css/html code to get this effect and make my sites look a liitle more professional?

This is the first , basic site I builthttp://www.creativebexhill.org and as you can see it just doesn't shine.

I'd really apprechiate people thoughts on this and any hints or tips to get the look I'm looking for! :D

VIPStephan
04-17-2012, 10:31 AM
There are a lot of things to consider when it comes to making a website look good. Graphics are just a part of it. But before I overwhelm you let’s just talk about your site’s graphics first:

Professional looking websites use clear and crisp graphics and ideally professional photographs to support the message. On your home page that big graphic is blurry and I can see that you just have scaled it up, probably from the size of the logo at the top left. You should use a high resolution image, never scale small graphics up. The photos on the about page also look a little “home made” and unprocessed. It helps to learn a bit about lighting and perspective in photography to make images interesting. And you can still make something of badly exposed photos by tweaking the levels with your favorite photo editing software.

Other things that make a website look professional include the overall layout (clearly defined sections, column layout, grid system (http://www.smashingmagazine.com/2007/04/14/designing-with-grid-based-approach/), baseline grid (http://www.alistapart.com/articles/settingtypeontheweb)), a well attuned color scheme, good font selection (different fonts for headlines and regular text, see combining typefaces (http://www.smashingmagazine.com/2010/11/04/best-practices-of-combining-typefaces/)) and appropriate sizing.

Regarding the column layout I mentioned earlier: Too long lines of text are harder to read. I’d suggest an absolute maximum width of half your current page’s width for continuous text. And if you’re wondering what to put in the empty space then, it might be worth rethinking the whole concept, i. e.: do you need so many pages or can things be put on one page, too? For example, I can already see that the home page basically has no content so you could save that, or rather make the “about” page the home page. And you could as well put the media page’s content into that “about/home” page to fill up the space you got earlier.

A well structured layout with easy to read content that requires just few clicks to reach makes a website professional looking and fun to browse.

claire_t
04-17-2012, 10:48 AM
Thanks for reply.
I figured it was mostly about res of images and graphics. Can you advise on what resolution is best for graphics?

I agree with all you say about my site. It was my first site and was supplied with the logo and photos. In hindsight and knowing what I know now I would certainly of remade the logo and changed levels etc of pics. Sadly I no longer maintain the site so can't make alterations to it.
Agree with you point about amount of text and this is something I have done I sites I'm working on.....all a learning curve! :D

Thanks again for comments. Am always keen to hear lots of advice on how to improve my work!

:)

KULP
04-17-2012, 06:51 PM
Eeek! No offense but that was one scary website. I'd focus on learning some css so you don't have to rely on images. This makes them sharp, and also adaptable if they want to change.

claire_t
04-18-2012, 08:42 PM
Yer I know it's not the best website by a long shot! But to be fair it was my first one an I built this with barely no experience! Just lots of googling and asking on here!!

I do know more now and have more experience with CSS so I like to think that my work is improving and lookinguch better!

Good to hear people thoughts to I can improve! With no training other then teaching myself I need as much advice as I can get! :)

hotelworld
04-25-2012, 07:10 PM
Is this just due to the resolution of graphics, images etc or is there something else that can be done with the actual css/html code to get this effect and make my sites look a liitle more professional?

dougcollins02
04-25-2012, 07:56 PM
A couple of suggestions from someone who's slugged his way through teaching himself web design and graphic design over a much longer time than I'd care to admit:

1.) Learn CSS. It might seem intimidating at first, but solid CSS coding is absolutely essential to building a dynamic and sharp website. If you haven't delved into it yet (or need to refresh yourself) check out their CSS tutorials at http://www.w3schools.com/css/.

2.) Invest in a good graphics editing program and learn how to use it. You don't have to spend hundreds of dollars on Photoshop or Illustrator (though if you have the money to dump into it and you want to learn the best software, I'd recommend it.) Depending on how deep your pockets are, you can start out with something as low-cost as the free GIMP graphics editor at http://www.gimp.org, or go with something more middle-of-the-road such as Corel's Paint Shop Pro Ultimate X4 (currently running at $69.99, and can be found here (http://www.corel.com/corel/product/index.jsp?pid=prod4220093&cid=catalog20038&segid=5900044&storeKey=us&languageCode=en). Once you have the software, look online for tutorials on how to use it.

3.) Ask a lot of questions. If you see something you like and can't find a tutorial of how to do it, this is a great website to seek some direction.

Hope that helps!

ConcreteWaves
05-04-2012, 08:51 PM
A couple of suggestions from someone who's slugged his way through teaching himself web design and graphic design over a much longer time than I'd care to admit:

1.) Learn CSS. It might seem intimidating at first, but solid CSS coding is absolutely essential to building a dynamic and sharp website. If you haven't delved into it yet (or need to refresh yourself) check out their CSS tutorials at http://www.w3schools.com/css/.

2.) Invest in a good graphics editing program and learn how to use it. You don't have to spend hundreds of dollars on Photoshop or Illustrator (though if you have the money to dump into it and you want to learn the best software, I'd recommend it.) Depending on how deep your pockets are, you can start out with something as low-cost as the free GIMP graphics editor at http://www.gimp.org, or go with something more middle-of-the-road such as Corel's Paint Shop Pro Ultimate X4 (currently running at $69.99, and can be found here (http://www.corel.com/corel/product/index.jsp?pid=prod4220093&cid=catalog20038&segid=5900044&storeKey=us&languageCode=en). Once you have the software, look online for tutorials on how to use it.

3.) Ask a lot of questions. If you see something you like and can't find a tutorial of how to do it, this is a great website to seek some direction.

Hope that helps!

this guy is spot on. learn css, photoshop, ur on the right track. but ur graphics are low quality. learn different tricks, there are tutorials by the buttload all over the interweb.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum