HOME | DD
s-tec — Slashdot Redesign WIP
Published: 2006-04-27 08:43:49 +0000 UTC; Views: 763; Favourites: 0; Downloads: 288
Redirect to original
Description
Earlier today, Slashdot.com announced a contest to redesign their site's visual appearance by producing a new style sheet. The contest sounded like great fun, so I put together the above concept art. I have not yet coded this design in CSS, and I'd like some feedback from you before I begin that long and difficult process. What do you think? Is it totally worthless? Can I improve it? What should I change?Update: I've changed this design quite a bit in my coding efforts. See here: [link]
Related content
Comments: 12
Hmmm.. the same vertical spacing between the top menu and the right side cells in the body table. Good job. The grey bg kinda sucks. Add some texture that compliments the green. Also the space between the S in 'Slashdot' and the border is way too tight. Kill those corners. In fact I would place the 'Slashdot' over the border for an interesting layered effect. 'Slashdot' need to be big and 'slashed'. Concentrate on the top left.
👍: 0 ⏩: 1
> The grey bg kinda sucks. Add some texture that compliments the green.
Excellent idea! Even with the gradient, the page background seems sort of bland. Something along the lines of a dark-green circuit-board pattern might really liven it up.
>Also the space between the S in 'Slashdot' and the border is way too tight. [...] Concentrate on the top left.
Actually, the contest rules are pretty specific about maintaining the site's logo in the upper left. On the other hand, there is enough leeway to do some tweaking. I'll revisit this part of the design and see what I can do. Odds are, I may scrap the whole top part of the design and try something completely different.
👍: 0 ⏩: 0
Thanks! I'm glad to know people like it. That's what makes the effort worthwhile, even if someone else snags the prize with a better design.
👍: 0 ⏩: 0
Ooh. This is a pretty good design. I thought the regulations set by the site might be restirctive, yet you've come up with something that's both "Slashdotty" and still fresh. And I definitely like that the text is on a pale version of the green, rather than on white. Like many comment in the riginal /. thread stated, black-on-white can be rather harsh. And actually using the site's colour to lessen that is a good idea. I also the curved edges, as they fit into the "feel" of the site.
I do have a couple of (very) minor niggles and questions, though.
Firstly, there's only space for the three story icons at the top. Now I do like the user-data being where it is, but it does kind of crowd out the icons. If there's only space for three then maybe that's not the place for them.
Secondly, where will the adverts go? I might not be a fan of the on-site advertising, but not only is it a requirement that it goes somewhere but I find that sometimes the difference between looking at (or at least overlooking) an ad-banner and blocking/avoiding it is how it is presented. So I'm curious as to how they'd appear on the site.
Niggles aside, it's a very nice design concept. It doesn't fly in the face of the current look, but it also looks a whole lot more modern and refined than their current look. I'd be very interested to see what an actual CSS version of this looked like.
👍: 0 ⏩: 2
> Now I do like the user-data being where it is, but it does kind of crowd out the icons. If there's only space for three then maybe that's not the place for them.
This is one of the hard things about CSS design. The location of things are more or less fixed by the layout of the HTML, giving me relatively little freedom to move them around. My current plan involves using overflow:hidden to show just as many icons as the browser can handle at the current resolution. So, if you run at 1024x768, you get three. If you run at 1280x1024, you get all five. Actually, I'm still unhappy with the header's design, and may rework it completely if I get some better ideas.
> Secondly, where will the adverts go?
They would go where they have always gone - above the header area and in the slashboxes. There's not much I can do about that.
> I'd be very interested to see what an actual CSS version of this looked like.
Me too. Actually, the only really hard part is the shadowy border around the content area. The rounded corners and float positioning are pretty straightforward once I figure out the IE bugs.
👍: 0 ⏩: 0
It looks nice, but I think it's a bit too similar to the current one. Anyway, would it be that hard to code it in CSS?
👍: 0 ⏩: 1
The contest rules were pretty restrictive about maintaining visual continuity with the old design, so there's not much I can do about the similarity. The design is pretty straightforward to code in CSS, but I expect it will be time consuming with the large number of elements.
👍: 0 ⏩: 0