[DivideByZero]

Hi web developers,

Yesterday I created the backbone of what will be my online portfolio.
The problem is, it looks hideous
Now I don't expect it to look amazing, but I can't point the site to future employers with how it looks now.

I am using only HTML\CSS and the software I am using is Visual Studio 2008.

Here is a picture of one of my pages (they all use the same CSS file, so all the other pages look very similar).

Is the any tips on how I can not make the site look so amateurish?

Here is the CSS file.

Spoiler

body 
{
	background-color:Blue;
}

h1
{
	text-align:center;	
	color:White;
	font-size:xx-large;
	font-family:Arial;
}

h2
{
	text-align:left;
	color:White;
	font-size:larger;
	font-family:Arial;
}

h3
{
	text-align:left;
	color:White;
	font-size:small;
	font-family:Arial;
	margin-left:20px;
	height: 12px;
}

p
{
	font-family:Arial;
	font-size:18px;
	color:White;
}

/* This allows me to center align images. */
IMG.displayed 
{
    display: block;
    margin-left:auto;
    margin-right:auto 
}

#Container
{
	width:auto;
	background-color:Blue;
	margin-top:auto;
	margin-bottom:auto;
}

#Header
{
	width:auto;
	text-align:center;
	height:50px;
}

#LeftMenu
{
	float:left;
	height:800px;
	width:175px;
	background-color:Blue;
}

#Content
{
	background-color:#00BFFF;
	height:775px;
	width:auto;
}

#Footer
{
	vertical-align:bottom;
	text-align:center;
	font-size:medium;
	font-family:Arial;
	color:White;
	height:25px;
}

Thanks for any help

[iamnotgeek]

i think your color combination is not good
visit this site for getting better idea on which color to choose.

This post has been edited by iamnotgeek: 21 July 2011 - 02:56 AM

[sas1ni69]

The design is simplistic and elegant but the colors are really bad on the eye. Since you want to display your portfolio why don't you got for much lighter colors? Or how about you look at some free html templates.

You might also want to consider using CSS to help you make your site a little more presentable and less 1996.

[RetardedGenius]

I've found the templates on websites like templatemonster a strong source of inspiration in the past. Obviously you shouldn't use any of their media or copy their code, but following the general layout of a site that you like can help.

[RudiVisser]

Are you looking to do something with JUST HTML/CSS and no images?

If so that's cool, and there's a lot of neat stuff you can do these days alleviating the need for images, including WebFonts, CSS3 Gradients / Shadows / etc, and of course Javascript being fast in ALL major browsers.

For a start, I would consider getting rid of the blue, completely. Employers would appreciate a nice soft colour set, mostly white and perhaps still incorporating hints of blue. The main issue you need to consider is readability, if you're trying to get hired as a web developer, then having a bright blue site will do you no favours whatsoever.

Big companies (or at least the ones that care / have to care (ie. high profile)) will require their developers to have an understanding of WCAG/DDA Requirements (sometimes even all the way up to DDA Level 3) since you're in the UK. If you have a bright blue high contrast website that doesn't use semantic markup and essentially screams at you - It's doing you no favours.

If you can provide a nicely readable website to every visitor, no flashy shit or anything like that, then you're all good. Of course, I'm not saying just have text on a page, make it look nice, but clearly define your content areas and most of all, don't forget to use your semantic tags.

I am, of course, talking about using <strong> instead of <b> where appropriate, etc.

[Lemur]

Design can be learned, art cannot. Simple rules of composition are easy to find and not much harder to implement. Basic color theory and aesthetics are also in the same realm. Google is your friend, use it well.