meyerweb.com

Skip to: site navigation/presentation
Skip to: Thoughts From Eric

Archive: 'Redesign' Category

Out of Order

Apologies to anyone who tried visiting meyerweb in the very near past and found it broken.  I’d noticed that suddenly all kinds of comment spam were getting past Akismet and landing in the moderation queue, and was just preparing to ask the spam-fighters about it when I discovered that the blog portions of the site were throwing a PHP error about not being able to find a function I’d written into a plugin.

At which point I discovered that all my WordPress plugins had been deactivated.  I know I didn’t do that, so how they all got turned off remains a bit of a mystery to me.  I’ve turned all the ones I need back on, and things appear to be back to normal.

So Akismet wasn’t being evaded by the spam: it was simply switched off.  Good thing my non-plugin defenses caught everything that poured in during the outage.  Which, come to think of it, must all have been direct-submit spam, since there wouldn’t have been a comment form available on the entire site.  So what they were really avoiding was my direct-submission defensive plugin, not Akismet.

Well, either way, other defensive measures protected the site, so all’s well there.  I’m certainly not thrilled about the site having been largely offlined for a short period, and again, my apologies to anyone who got blocked from information they wanted.

This episode has actually given me cause to reconsider my usual preference to put site navigation at the end of the document source.  When the PHP failed, the navigation was never served up.  Had I put it at the top of the page, it would’ve been present even though the blog posts were failing.  Getting to the static areas of the site would have been possible.  Due to my structural choices, a script failure dramatically affected the usability of the site as a whole.

Something worth thinking about as I slowly work on improving the organization of meyerweb.

Slashdot’s Validity

With the Redesign Watch back up and running, the most recent entry is Slashdot, the venerable geek portal so infamous for its ability to kill web servers with a single link that the site’s name is a verb meaning “to bring a server grinding to a halt”.

I was asked in a comment:

What’s your feeling on slashdot being HTML 4.01 (and slightly failing validation) VS XHTML 1.0?

My feeling is good.  Why?  Let’s take the second part first.

When it comes to HTML versus XHTML, I just do not care.  Sure, sure, people will tell you that XHTML is XML so it’s more transformable or something.  That’s a very good argument when the XHTML is well-formed and valid.  It’s also a very good argument for using HTML when it’s well-formed and valid.  Conversely, neither HTML nor XHTML is easily transformed when ill-formed and invalid.  This is an experiential point of view, too: I’ve written XSLT (which is itself so tortuous and ugly that it almost by definition cannot be called well-formed) to transform both HTML and XHTML, and the effort is pretty much the same each way—assuming well-formed, valid markup.

So as far as I’m concerned, there’s really no major practical difference between HTML and XHTML.  There are plenty of minor practical differences, like having to throw trailing slashes on all your empty elements in XHTML and needing some namespace information.  Some people will tell you the whole MIME-type thing is a major practical concern, but I’m just not that much of a purist.  Take that for whatever it’s worth.

I mean, imagine a world where Slashdot had used XHTML instead of HTML, and was failing validation.  How would that be any better or worse than things are now?

Okay, so that’s the second part.  The first part, the failure to validate, is not something I can get too terribly upset about.  Slashdot, as a site that accepts ads, is going to get horrible markup shoved into its pages.  That’s just the way it is.  If you want major sites to be perfectly valid, then in all honesty advertisers are the place to start.  So they’re already operating with a major handicap there.

Even if we were to ride our high horses along a very hard line and say that ads are just no excuse, I’d be hard-pressed to fault the job they’ve done.  For example, I ran a check on the Slashdot home page.  Out of 1,262 lines of code, there were exactly four validation errors, and that’s using HTML 4.01 Strict—you’ll note they bypassed Transitional, which only increases my respect.  Three of the errors revolved around an image in a noscript element, and the last was due to the presence of a language attribute on a script element—something they can fix in fifteen seconds, once it gets to the top of the to-do list.

You know what?  I’d be ecstatic to have that low a failure rate when launching the markover of an incredibly complex site like Slashdot.  Think about all the content they have to manage, stitch together, and offer up.  Four errors out of all that dynamically assembled markup?  I say somebody should organize them a parade for doing such a good job, and showing that any site can make use of and benefit from standards.

I’m also really looking forward to the restyling of Slashdot through user-created style sheets, and the Greasemonkey enhancements built on top of this new structure.  If there’s a site whose readers are inherently primed to script the holy bejeezus out of it, that would be the one.

Would I be happier if they’d managed to achieve total validation?  Of course.  In the meantime, though, I’m going to be very nearly as happy for what they’ve accomplished, and also for the simple fact of it being another major site that’s taken a big step forward.  Progress is always a cause for celebration in my world.

MMBUG Talk

Those of you in the Boston area might be interested in a talk I’m giving at the Macromedia Boston User Group meeting on Wednesday, 12 October 2005:

From Comp To Code: Pulling A List Apart Together

You’re handed a graphic comp file and told to make it into a living, breathing web page.  Now what?  How do you figure out what approach to take, which techniques to use, and what kinds of markup will go into the final page?  Eric gives us a fast-paced tour of his decision-making process as he tackled the new design for A List Apart– how he analyzed the requirements, the questions he had to ask, the trade-offs he made, and the reasons behind his decisions.

If you’re interested, then please join us from 7:00pm – 9:00pm in E51-151 (Tang Center) on the MIT campus.  According to the meeting organizer, arriving early is recommended.

If you do decide to drop by, I’m sorry to say that you won’t be the first to hear this presentation: that honor, if we can call it that, will go to the attendees of Web Essentials 05.  On the other hand, you’ll be getting a more detailed version of the talk, since at WE05 I only have 45 minutes.

On the third hand, could it be that both groups will be getting a sneak preview of just one of the topics to be discussed as part of An Event Apart Philadelphia?

Maybe.

Back On Watch

After an extended hiatus, the Redesign Watch is back.  I’m celebrating its return with eight new entries, including the very recently announced HTML+CSS reworking of Slashdot.  I wonder how their work compares to the third-party job that Daniel Frommelt did a couple of years ago.

Since only the most recent five redesigns are shown on the home page, you’ll have to dig into the archive if you want to see all the new stuff—from Everything Tori on forward—or you could just subscribe to the RSS 2.0 feed.  You can find it and other meyerweb feeds on the Feeds page.  (Go figure!)

Technorati Redesigns

It’s the time for redesigns, I guess—CNN did it over the weekend, and now Technorati has taken its beta design final.  I’m proud to say I had a part in making Technorati’s new look possible.  The graphic design was done by Derek Powazek, and from his graphic comp files I produced the XHTML and CSS.  Then I had to run the Tantek gauntlet; the job wasn’t done until he approved of the code I’d produced.

If you dig under the hood of the new design, you’ll probably find things you’d have done differently.  I’m not going to go into a detailed post-mortem here, but suffice to say that every choice was made within the project’s defined constraints.  So when you see, for example, a bunch of b elements used to create the corners, that approach was the best choice for the project: it best satisfied the concerns and demands of the various people involved.

This is not to say that my choices were the best for other projects with similar design demands but different technical demands.  They aren’t.  At a certain level, there are no canonically right answers.  There may be a whole spectrum of related solutions, where one variation is better for this project and another for that one.  And people like me, despite all their experience and knowledge, don’t always hit the right answer on the first try.  My initial approach to the corners is not what you see in the final markup.

That said, I am pleased with how I combined positioning and sprite-like styling to get the corners to work.  I know each technique has been done before, but I’m not aware of previous combinations of the two.  So that’s definitely a point of pride.  I hope to find time to document the details of this particular corner solution, along with variant approaches.

I’d like to thank Derek and the rest of the Technorati team for letting me be a part of the redesign project, and for giving me a chance to flex my creative and technical muscles.

CNN Redesigns

Everybody’s favorite fringe news organization, CNN, has updated the design of their Web site.  Unlike the last three changes of design, I actually like this one out of the gate.  Yes, I always got used to the old designs and quickly at that, but at first I disliked them.  This time I’m impressed.  It’s a little bit sparse, but the restrained use of whitespace is a refreshing change from many news sites (*cough*Fox News*cough*).

In part, this may be because the design isn’t a redesign so much as a tasteful makeover of the old design.  By that, I mean that everything’s basically in the same place as before, just with a more serious look.  However, it’s the addition of extra functionality that really appeals to me.  For example, most section boxes now have the title followed by unobtrusive links to the main section page, video or other media, and then partner links.  These links add a lot without upsetting the apple cart, as it were.

I also note with a good deal of interest that CNN’s video clips are now free; previously, you had to pay money to see their video.  What forces led them to drop the subscription fee, I wonder?  I can think of some likely candidates, but it would be interesting to hear from CNN why they did it.

Of course, they’re only free if you have the Windows Media Player 9 plugin installed.  Otherwise, they’re simply unavailable.  Gah!

New Design, New Feeds

The visual design of meyerweb turned a year old on February 1.  As a little celebration, I’ve rolled out an update to the design.  In the past, I’ve thrown out entire designs for completely new ones, but not this time around.  This time, the changes are more of an incremental advance; or, if you prefer, a mutation of the previous design.  After all, the basic layout is the same as before.  I simply opened it up, allowing the various components more breathing room, and cleared away some of the clutter that had built up, such as the various “RSS 2.0″ buttons.  (So how does one now get the feeds?  I’ll explain that in just a minute.)

There’s more to this than just a simple evolution, I admit.  The first major change is the addition of navigation links across the top of each page.  For some time now, a lot of the material that people come here to find was buried, difficult to find unless you knew where you were going, or else on what terms to search.  By pointing directly to the topic areas I think will most interest visitors, I believe the site is now much easier to use.

The second major change is the layout of “metainformation” for each post (and comments on posts). In this area, I was heavily influenced by Khoi Vinh’s Subtraction 7.0, and I definitely owe him a debt of gratitude and inspiration.  As will be evident from even a casual comparison of the two sites, I took a general design idea Khoi uses and adapted it to my particular situation.  I think it works rather well.

The third notable change is a feature addition that I’ve been planning to add for a couple of months now. New to the site is a Syndication Feeds page which brings together (dare I say it aggregates?) all of meyerweb’s RSS feeds.  The real step forward here is the debut of two new “Thoughts From Eric” feeds, including a feed of just technical posts and a feed of just personal posts.  Now all of you who just come here for the technical stuff, and couldn’t care less about the person behind the site, can restrict your feed to screen out the worthless drivel.  Similarly, those of you who know me personally but don’t understand the eye-glazing technical stuff can filter out the confusing nerdity.

Even better, each of the three “Thoughts From Eric” feeds (including the traditional “show me everything!” feed) comes in one of two flavors: summary or full content.  At long last, I’ll find out if providing full-content feeds drives my bandwidth consumption up, or eases it down.

I’ve also established a new Redesign Watch feed, which is something I know will be of interest to many visitors.

I made other small refinements throughout, and odds are I’ll continue to tinker for a little while.  Overall, though, I feel I met my goal of making meyerweb a more friendly site to visit, and a more feature-rich environment.  Explore, and enjoy.

Feeling Distracted

For no apparent reason other than I can, I’ve redone the sidebar to include a linkblog titled “Distractions.”  I did this by grabbing Markku Seguerra‘s wp-recent-links plugin and then hacking the holy bejeezus out of it.  I needed to add a “via” function, for example, and wanted to make the administrative interface a bit nicer.  That involved finding out how MySQL statements work (mostly by finding all the ways they don’t).  So, hack hack hack.  It was an interesting distraction.  I’ll make the files available in due course.

To make room, I took out the “Socialization” section because it seemed largely worthless; two of the services listed I hardly even look at any more, and the other one was mostly about me puffing up my ego in public, which nobody really needs to see.  I’m also thinking about taking out the Platelets because I don’t get to update it often enough, even though I have really soft spot for it in my heart.  We’ll see what happens.

Keen-eyed observers will notice that I backfilled a few entries from the past few days.  I needed test data, you know?

November 2014
SMTWTFS
September  
 1
2345678
9101112131415
16171819202122
23242526272829
30  

Archives

Feeds

Extras