Topic: Metal Slime

http://www.slimeland.com/style/test.html

This isn't finished. I'm asking for opinions and advice. I'm not entirely happy with the direction it's going in.

What do you think? What could I add or change to make this better?


 

So far, i like it a great deal.

The overall feel is very nice, and very open and light.

What I don't like is the metal bar thing....it just looks forced and fake.

I think if you tone that down a bit it will make the whole page *much* better.

The poster has demanded we remove all his contributions, less he takes legal action.
We have done so.
Now Tyberius Prime expects him to start complaining that we removed his 'free speech' since this message will replace all of his posts, past and future.
Don't follow his example - seek real life help first.

The metal bars were originally supposed to have a slight drop shadow to add depth, and some sort of caps on the ends. I've since realized that they can't have partial transparency and yet merge with the page's background image - at least not without PNG support in IE - and I can't add caps to the ends because of the limitations of CSS 1 - again a problem caused by IE.

I'll try removing them and using some other sort of visual effect for headers.

I also wanted a background image in the lower right of the page, but that can't be done with CSS 1 without adding more DIVs, and I really don't want to change the markup (it would make adding the new design to my page a lot more difficult).

I find myself using gradients a lot here, and I know from experience that that means I'm out of ideas and I'm just sort of trying things.


 

I've made some changes: removed the metal headings, and added a couple of diamond shaped metal things.

I'm a lot happier with it now, but I still think it needs some work. What's bothering me most is how there's so much contrast on the right and so little on the left. More comments and suggestions are appreciated!

[edit: I brought the metal bars back, in a different way now. I think it helps a lot.]


 

(Edited by Slime on 05-01-2004 19:19)

Slime: That's a nice design you have here. The margin around the Slime logo looks weird. If your metal bars are all like the one in http://www.slimeland.com/style/metalslime/title.jpg, then it seems possible to have a similar one without touching your markup :

<!-- code sample -->

<div class="section">

	<h2>sub header</h2>

	<p>Lorem lipsum ... you know the story...</p>

</div>

With the following CSS :

.section

{

	background:url('leftAndMiddlePartOfTheMetalBar.gif') top left no-repeat;

}

h2,h3,h4,h5,h6

{

	background:url('rightPartOfTheMetalBar.gif') top right no-repeat;

	margin:0;

}

Where leftAndMiddlePartOfTheMetalBar.gif is an extremely wide image ( 1600 or 2048 pixels ). Well you get the idea.



(Edited by poi on 05-01-2004 19:40)

Poi: Good idea, though I think DL-44 was right that the metal bars beneath the text was jarring. On top of that, if I used the metal bars elsewhere, then they wouldn't be able to have drop shadows (which add a lot of depth) because the lack of partial transparency wouldn't work with the background image.

I made some subtle changes to the upper left title image. Unless anyone brings up something that they really don't like, I think this is the final version.

Thanks for all of your help.