Wandering Thoughts archives

2013-10-19

I should never have allowed 'outside' content to break my layout

Here is a lesson that only sank into my head very recently: you should never allow user contributed content to break your layout. Or, really, any outside content; by this I mean things that show up basically outside of your control and get dropped into your pages.

You might wonder how on earth you stumble into this problem in the first place. In my case what happened here on Wandering Thoughts was comments with preformatted text that had lines that were too long for the width of your browser window. This has been an infrequent but long standing problem but I never did anything about it (at least at the layout level). That was a mistake.

Your site is, well, your site. It's your responsibility to make it so that your site looks right and works right; as a corollary, it's basically your fault if it doesn't. Where the content that's doing it comes from is at one level irrelevant because you're still the site owner. It's not as if my visitors are going to go 'well, it's totally not Chris's fault that looking at the comments on this entry makes the whole thing unreadable'. Instead their reaction is more likely to be to close the window and leave WT.

(And I don't get to blame the people leaving the comments with the wide preformatted lines, either. I'm sure the lines look fine to them on their displays. How they look on other displays is, again, my problem.)

The other way to put this is that outside content is not sacred and its nominal integrity is not a higher priority than your site's overall layout. It may feel bad to mangle the layout and readability of outside content but it is generally the lesser evil.

How you make sure that outside content won't break your layout depends on a bunch of things. How I finally dealt with the long <pre> line problem here is that I forced all <pre> blocks in comments to be linewrapped via a CSS setting of 'white-space: pre-wrap'. This can sort of break the formatting of such comments, but I consider this a lesser evil (and they still render correctly if the browser window is wide enough).

(It turns out that I couldn't make the CSS overflow property do what I wanted it to do, perhaps because of my table based layout.)

(As sometimes usual, I'm writing this down now partly in the hopes of getting it embedded in my brain so that next time around I remember it and follow through.)

web/UserContentAndLayout written at 00:58:58; Add Comment


Page tools: See As Normal.
Search:
Login: Password:
Atom Syndication: Recent Pages, Recent Comments.

This dinky wiki is brought to you by the Insane Hackers Guild, Python sub-branch.