Discuss: Retooling Slashdot with Web Standards
by Daniel M. Frommelt
- Editorial Comments
22 Similar efforts have been proposed.
MacEdition’s web standards columnist, “CodeBitch” analyzed Slashcode and offered a detailed proposal, based on her own unreleased rewrite of a Slashdot page. She also claimed about a 50% savings in html size.
http://www.macedition.com/cb/cb_20011203.php
I posted this link on /. and called their html “spaghetti code” and I got modded down -2 Flamebait.
posted at 10:56 pm on November 21, 2003 by Charles
23 Bad CSS = Broken Fonts!
Ok, I like ALA, I’m a bit of standards guy even, my whole website is XHTML 1.0 strict. Unfortuanately slashdot has a table based layout, which, to put it simply, CSS cannot handle.
I’ve spent days researching correct CSS tables in the past and it is an impossibility. The problem? Font overlapping. Try a text zoom to as little as 200% (yes, doubling the text size is not that extreme) and all CSS table based designs instantly break. Much like this one.
My site works fine with CSS as everything is positioned such that font size only breaks at absurdly high magnification, but if it were any more complex I’d HAVE to use tables. I’m lucky to need such a simple site design.
I don’t know if this is a browser issue, or a problem with the CSS spec, but text overflow is a serious issue, one which breaks nearly every CSS page using complex layout. There needs to be a way to style tables in CSS without having to use a table tag.
In short, CSS boxes are just that, boxes, they don’t link together to correctly handle font sizes. The new ‘compliant’ slashdot is more broken than the current slashdot in a functional sense, regardless of the philosophical correctness of standards.
posted at 11:04 pm on November 21, 2003 by Andrew Cholakian
24 Slashdotting "Retooling Slashdot"
As the only person known to have been slashdotted, textismed, and zeldmanised in the same week and the sole person to have delivered the A part of a Slashdot Q&A in valid XHTM (only to see the whole shebang, DOCTYPE and all, plunked wholesale into tag soup like tofu into miso), it is my honour and, indeed, duty to have slashdotted the article about retooling Slashdot.
http://developers.slashdot.org/article.pl?sid=03/11/21/2223256
posted at 11:32 pm on November 21, 2003 by Joe Clark
25 Needs a LOT of work
This new site has two HUGE problems. First, the content is in a narrow column in the center of the screen, wasting 2/3 of the screen real estate (in I.E. and in NS 7.02). Second, it has problems with text zoom – the text just runs everywhere. Both need to be fixed before rollout. Please!
posted at 11:52 pm on November 21, 2003 by Zorn
26 Ok - maybe half right
I just didn’t find the right page. It does flow the whole screen, but the text still doesn’t scale right. (which is an issue for me).
posted at 11:59 pm on November 21, 2003 by Zorn
27 Rather see a redesign
Although it is wonderful to see another conversion of a table-based site to CSS, it seems we are beginning to beat a deadhorse. Anyone who reads this article will already know the benefits of CSS design and when looking at all the tables used for Slashdot it should already be assumed that there would be a great decrease in file size. I think it would have been better to simply redesign the site itself so that it wasn’t so ugly and violated so many usability rules. That would be a great article…
posted at 12:00 am on November 22, 2003 by Scrivs
28 Complaints = fixable!
Everything mentioned in these comments are fixable, including Andrew’s “CSS tables.”
Have a look at http://projects.exclupen.com/slashdot/ (does not work well in IE, but that is fixable if there is interest)
- Italics are back (using cite) so you can tell what is contributed and what is editorial remarks. – I have “jump to” links to the content, navigation, and right-side boxes. – Labels are used on the forms. – The content column comes first – Padding is fixed so some text isn’t touching the edges of the boxes (maybe it’s just a personal pet peeve, but that really bugs me) – I’m sure there’s more stuff I did, but this was a month ago and I forgot already. :)
I’m also willing to help get /. up to speed. Where’s the best place for interested parties to discuss this further?
posted at 12:15 am on November 22, 2003 by Marshall Roch
29 Sweet. I've been working on the same thing.
This is an elegantly-designed page, and a nice recode of the original.
For the last several months I’ve been working on the same project from a slightly different perspective. We have a working Slash-based site, currently in live beta, at http://www.news4neighbors.net.
The site doesn’t validate, but it’s all structural XHTML with CSS for layout and style. This is much rougher than the beautiful markup presented here, but the difference is that nearly our entire site is running this template system. My work is based on the Openflows strict theme, released early this year at http://strict.openflows.org. But not much of that theme is left, as their project and mine had very different goals. I’ve changed all of the 120-something templates, and much of the code that sends them data.
The site needs a lot of work, no doubt. But we’re developing it rapidly, and have made much progress.
The biggest challenge is that Slash itself doesn’t separate content from presentation from business logic. To change one set of tags you may have to rewrite a template, change a database variable, write some Perl, or a combination. This isn’t a knock on Slash — it’s very powerful and I enjoy using it — it’s just that the presentation layer hasn’t been their focus.
The end-goal for this project, Slash-wise, is to have a fully XHTML/CSS compliant theme that people can easily use on their sites.
If you want more information about it, send me email at randall at sonofhans.net
posted at 12:44 am on November 22, 2003 by Randall Hansen
30 GZIP compression
If you add a GZIP filter to Slashdot with the redesign you can save, for the browsers that support it (which is most everything) a lot more space:
Slashdot.html 33654 -> 9955
layout.css 3546 -> 915
markup.css 3511 -> 742
Almost 30k. Put that in your bandwidth bill and smoke it. Hey, lets see what happens with the original page with all that redundant markup:
Original Slashdot 42861 -> 11503
So now if both CSS files are cached you can save .5k per pageview by doing all these changes, or you can just use GZIP compression and get rid of redundant code the old fashioned way — brute force :)
posted at 01:46 am on November 22, 2003 by Sam Pullara
Discussion Closed
New comments are not being accepted, but you are welcome to explore what people said before we closed the door.
Got something to say?
Discuss this article. We reserve the right to delete flames, trolls, and wood nymphs.
Create a new account or sign in below if you’d like to leave a comment.
Subscribe to this article's comments: RSS (what’s this?)






21 More room for bandwidth saving
First off, I LOVE the alternate look – is it permissable to use the XHTML and CSS in non-slashdot projects?
Secondly, I did a save on the source, and noticed that the output was still ‘pretty’ – ie, nested tags are indented, etc. Although this makes the code wonderful to work on, it is not needed on a site such as slashdot that will auto-generate the code. Instead, a pretty-formated template could be retained in original form, and an automated tool could strip redundant newlines and tabs out of the source.
This all sounds trivial, but it adds up – I get the same exact experience when viewing the page after doing such replacements, and the size drops from the original 33923 to 31870 – a savings of 2053 bytes. Going by the page-views-to-bandwidth calculations within the story, this would save an additional 3GB a day, and thus save slashdot an additional 1095$ a year.
I’m willing to work on the code for slashdot to move to this new system, and provide tools to allow for template size-reduction via the methods described.
posted at 10:45 pm on November 21, 2003 by Jon Franz