Tag Archives: design

Links: Unconventional Art, Private Browsing, Scott Pilgrim

Some recent linkblogging. (Thank you, StumbleUpon)

Art

Privacy

Scott Pilgrim

Posted in Entertainment, General, Web | Tagged , , , , , , | Leave a comment

Links: Identity, Kindle, Language, and the Moon

Posted in Comics, Computers/Internet, Life, Sci-Fi/Fantasy, Web Design, Writing | Tagged , , , , , , , , | Leave a comment

Best Way to Label Dead Links

I use the Broken Link Checker plugin on this blog and on Speed Force to find broken or moved links. In addition to helping you manage them in the admin interface, it can also assign formatting (as a CSS class) to mark them in your posts.

Cool! Readers can see that the link is broken before clicking on it!

But what’s the best way to label the links?

The plugin uses strike-through by default. You are marking something that’s gone, but strike-through usually means the text is being crossed out. That’s fine for a link in a list, but something like “Catering was provided by MyNiftyFoodCo” implies that the name of the company is wrong, not that the website is gone.

Just making something italic or changing the color doesn’t work either, because it’s arbitrary. Nothing about an italic link (which could be a title), or a random other color, suggests that something might be missing.

What I’ve come up with is to reduce the contrast on broken links. It combines two familiar schemes:

  • High contrast for new links and low contrast for visited links.
  • “Graying out” inactive items in software.

So here, I’ve got bright blue for new links, darker blue for visited links, and broken links as black (well, very dark gray), the same color as surrounding text. I’m keeping the underline in place so there’s still some indication that it’s a link, but it’s not as strong as the label for one that’s still functional.

It’s still not ideal, since color is the only difference, but it should cause less confusion than the strike-through.

Posted in Web Design | Tagged , , , | 2 Comments

ATM Design: Shelf?

It sure would be nice if this ATM had at least 1 horizontal surface so I could set down my drink & not have to mess w/my wallet one-handed #

Posted in Annoyances | Tagged , , | Leave a comment

Login Form Fail, Pinhole Bridge

  • Pet peeve: Login forms that move the cursor to the username field AFTER the page finishes loading. Sometimes I’m already typing by then. #
  • Weird: I feel tired, but I’m acting like I’m still on caffeine. #
  • Cool: A 6-month-exposure photo showing sun trails above a bridge, made using a pinhole camera made from a soda can #

First item cross-posted at LiveJournal.

Posted in Strange World, Web Design | Tagged , , | Leave a comment

Don’t Hurt the Web

Overly-cute fox with puppy-dog eyes, captioned: Please don’t hurt the web. Use open standardsThe Mozilla Developer Center has just posted some desktop wallpaper promoting open standards, (and the MDC itself) with the theme, “Please don’t hurt the web. Use open standards.”

Apparently the design was a big hit as a poster at SXSW.

For those who haven’t seen it, the MDC is a great developer resource for web developers, describing lots of standards along with Mozilla-specific information.

(via Rhian @ SFX, who notes that the image is available for use under the terms of the Creative Commons Attribution-NonCommercial license. These wallpapers are also covered by the Mozilla Trademark Policy.)

Posted in Mozilla, Web Design | Tagged , , , , , , , | Leave a comment

Thoughts from a Redesign

Last weekend I did a redesign of my comics fan site, Flash: Those Who Ride the Lightning. It was prompted by two goals:

  • Get rid of the non-working compatibility cruft for Netscape 4 (some of it was actually making things worse in NS4)
  • Make navigation easier.

Continue reading

Posted in Comics, Site Updates, Web Design | Tagged , , , , | 4 Comments

Web Design is Like Pizza

When web designers switch from focusing on a single browser (usually Internet Explorer) to developing cross-browser sites (usually adding Firefox, sometimes Opera or Safari, ideally all three), they often find that things don’t work as expected in the “new” browser. This can be for a number of reasons, including:

  • Bugs or “missing” features in the new browser (whether incomplete support in the new browser, or proprietary features in the familiar browser).
  • Broken code on the website being handled differently.
  • Different defaults where behavior isn’t well-defined in the specifications.

A big problem is that when you get into the code, a lot of pages aren’t as specific as the authors think they are. When you write code and test it on one browser, you’re not testing that the code is correct, you’re testing that that browser makes the same assumptions you do.

It’s like ordering pizza.

No, really. Let’s say Internet Explorer specializes in Chicago-style pizza, with a thick, chewy crust. And let’s say Firefox specializes in New York-style pizza, with a thin crust. But each can make the other style of pizza on request.

So you call up Internet Explorer and ask for pizza. They deliver you Chicago pizza, and if that’s what you wanted, you figure your order is fine. If you actually wanted New York style, you make sure that next time, you tell them you want that style of pizza.

But let’s say you like Chicago pizza. You get used to calling up IE and just asking for “pizza,” until one day you’re busy, and ask your roommate to order it. He likes to get his pizza from Firefox, so he calls them up, asks for “pizza,” and you get New York style. That’s not what you wanted. Obviously, Firefox pizza is inferior, because they got the order wrong! Well, no, it’s not, and no, they didn’t. They delivered what they were asked for. If you’d told your roommate to ask for Chicago style, Firefox would have been perfectly happy to deliver that style of pizza.

The moral of the story: always be specific with your code. Make sure it’s asking for what you think it’s asking for (validation helps here). And if something doesn’t do what you expect, make sure you didn’t leave that expectation out of your order.

See also: No, Internet Explorer did not handle it properly

(Expanded from a comment I posted at Mozillazine.)

Posted in Web Design | Tagged , , , , , , , | Leave a comment