Guest Nuntius Posted December 10, 2009 Share Posted December 10, 2009 We have just published a new web site at http://www.actadiurna.fi and need some help with making it better. We would like to get some advice on how to make the site look more professional and credible.Below are the css file and the modified html file of one page so that you can take a look at them. Feel free to make corrections and changes to the code. Also, any hints and suggestions as to how to improve the site visually or layout-wise are welcome. All comments will be greatly appreciated.style.css body { line-height: 140%; margin: 5em auto; width: 90%; padding: 0 1em; margin-top: 0em;} #logo {margin-left: 30%; margin-right: 23%; margin-top: 0em; text-align: justify;}#oikeapalsta { width: 20%; float: right; margin-left: 1em; text-align: justify; margin-top: 0em; } #keskipalsta { margin-left: 23%; margin-right: 23%; margin-top: 0em; text-align: justify; } #edellinen { float: left; }#seuraava { float: right; }h1 { text-align: center; }h2 { text-align: center; }h3 { text-align: center; }#vasenpalsta { width: 20%; float: left; margin-right: 1em; margin-top: 0em; text-align: justify; } img.kuva-oikea { float: right; margin: 1em;}img.kuva-vasen { float: left; margin: 1em;}img.kuva-keski { float: middle; margin: 1em;}img.logo { float: middle; margin: 0em;} page.html <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Acta diurna</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div id="logo"> <img class="kuva-keski" src="logo.jpg" alt=""> </div> <div id="oikeapalsta"> </div> <div id="vasenpalsta"> <a href="index.html">Etusivu</a></div> <div id="keskipalsta"> <h2>Main title</h2><p>Text text text text text text text text text text text texttext text text text text text text text text text text text text... <br>– Quotation quotation quotation quotation quotation quotation quotation quotationquotation quotation quotation quotation quotation quotation quotation quotation...</p><h4>This is<br>subtitle</h4><p>Text text text text text text text text text text text texttext text text text text text text text text text text text text... <br>– Quotation quotation quotation quotation quotation quotation quotation quotationquotation quotation quotation quotation quotation quotation quotation quotation...</p><p><a href="1b.html">Next page</a><p>More on this topic:</p><p><a href="2.html">Another article</a></div></body></html> Link to comment Share on other sites More sharing options...
AElliott Posted December 10, 2009 Share Posted December 10, 2009 Well, if you really want it to look professional, you could always go for a professional designer. I know you've probably ruled that out for some reason but it had to be said. :)Anyhoo, some nice simple ways to get your site looking better. Firstly, clean lines are generally good, clear sections and clear areas of focus. At the moment, you've got a text in the center, with an image that breaks up the lines of the text and looks a bit mashed in. The main reason for that is that the heading above the image has no clear difference in style to the lower heading. That makes the headers appear of equal importance, but one is at the top clear of the image and the other is being pushed to the left by it. You could clear the bottom heading below the image, or move the image clear of that content area (in an area to the right of it perhaps).As to clear sections, the site title is clear, and there's a main content area. But what I assume is navigation on the left hand side is just (to visitors) a random word floating on the left side of the page away from everything else. I'd consider restructuring that so that there's a clear column layout, ideally with a divider to emphasise the separation and a heading for the navigation.The typography on the site heading is not ideal for the web, it's heavily stylised and out of place with an otherwise (fairly) bland website, if you were to add more graphical elements to the site it could work, but as it stands I think it could do with being toned down a little bit (but you can still have a bit of flair in the font choice, maybe a compromise would be something like Georgia?).Moving on to some more purely visual stuff, you've done well to have consistent colours, but there is in my view too much unmanaged whitespace - don't get me wrong, whitespace is great, but you need to make every bit of whitespace intentional if you know what I mean. Consider adding some more colour (including some background colouring, but either go for dark or pale pastel, hard to make vibrant colour work in large quantity) - but remember to keep up the consistency with colours, if you're not that great with working out colour schemes then that's fine you can get premade colours schemes from various sites.And that's about all I can really say for now, I'm not a great designer (this is why I get designers in for my sites ), but hopefully there's something in there. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.