There’s a saying I use – CSS is only as good as the markup it’s applied to… and you’ve got some issues in the markup I’d HIGHLY suggest cleaning up before even THINKING about the CSS.
First off, you aren’t doing a single thing that should need ANY of that IE conditional nonsense. From the appearance the page isn’t even complex enough to need hacks in the first place, much less that stuff (which I never use on any sites).
From there you have the problem of your use of ID’s. Elements can only have one ID and you can only use an ID once on the page, so:
<div id=“main content”>
<div id=“content”>
Is just asking for the page to break. If you want to use it twice, use a CLASS… Though I’m not even sure what the double wrapper is for.
Finally, <!== is not the normal syntax for comments, and placing the comments after the elements can often trip rendering bugs in both IE and FF… simply changing this:
</div> <!== logos ==>
To this:
<!-- #logos –></div>
can prevent all sorts of headaches down the road.
Finally, this is a new page, right? If it’s new, what the blue blazes is with the tranny doctype? Likewise you shouldn’t be using TARGET on a modern page that doesn’t have framesets – and of course from an accessibility standpoint one shouldn’t be using framesets so there’s NO legitimate reason to use TARGET… ESPECIALLY target=“_self” which is nothing more than a waste of bandwidth.
Design wise, you’re not too bad, though the green text on the dark transparent background is below accessibility minimums for contrast, as is the absurdly undersized font in the menu.
Also I don’t know if you’re planning on adding more content or sections, but if you do the use of H1 for “promotion. branding. design. media.” could be problematic since that basically makes everything on the page a subsection of that. The image up top where you have “franz design & media” is what should PROBABLY be the h1, if for no other reason than to have something meaningful on the page for formatting for CSS off or images off users – which is something else you are lacking.
The page is also not viable to be anything but bounce central due to the ridiculous filesizes. There’s a reason you don’t see major successful websites with images like this one:
http://www.franzdesignandmedia.com/images/FDM.jpg
… as at 382k that image by itself is three times the upper limit I would allow for an entire page on a site (that’s HTML+CSS+IMAGES+SCRIPTING) – AND you basically are shoe-horning yourself into a fixed height layout making you have to constantly micro-manage your content – which means it’s going to age like milk. Fixed height image backgrounds are garbage – don’t even go down that road.
Which is just part of why drawing a pretty picture in photoshop and calling it a website is usually the road to failure – even if most of the PSD jockeys out there claim it’s how it’s supposed to be done.
THOUGH – for all that if this is your first one, you’re doing better than most of the so called “professionals” out there vomiting up code any old way! Keep with it, you show a lot of promise. Few tweaks here and there and you’ll be golden.
