SimpleBits Archives

Welcome, Meagan Fisher

Posted at 9:30 PM

On a brief break from diaper changes and time-outs, I have an important announcement. Several months ago, I put out a call for help. Today, I’m excited to announce the search is over!

Meagan Fisher (talented designer, front-end coder and owl aficionado) will be joining us as a part-time assistant. Meagan has recently moved from sunny Florida to Salem, and will help SimpleBits become slightly less tiny than it’s been for the past six years or so, beginning next month. I’m really excited about some of the new things this will allow us to work on.

Some of her recent work includes a wonderful Rails Machine redesign (where she worked with Dan Benjamin, who I owe for putting us in touch) and Halogen Guides Greener. You can read more about her big move over at her blog.

So, welcome aboard, Meagan — and get ready to become a converted Red Sox, Patriots and Celtics fan (I’m omitting the Bruins since they have a bit of catching up to do).

Authentic Jobs

Posted at 11:44 AM

Since 2005, Authentic Jobs has been:

… a targeted destination for standards-aware designers and developers and the companies seeking to hire them.

It’s a fantastic resource for the community — and one I’ve often pointed folks to that seek help.

You’ll notice some Authentic Jobs listed right here in the sidebar of SimpleBits. We’re happy to have joined the network of partners over the weekend. AJ proprietor (and designer extraordinaire) Cameron Moll announces the new additions over at his site. It’s great to be aboard.

SimpleBits Seeks Apprentice/Assistant

Posted at 4:05 PM

Dear Esteemed Readers: I need help. I suppose I’ve needed help for quite some time. But I wasn’t in a hurry. Things have settled down enough to start a formal search for an eager assistant/apprentice/intern to help SimpleBits grow a tiny bit more.

I’m trying to keep an open mind about who you might be. In essence, I’m looking for the right person instead of trying to fill a well-outlined job description. Here are a couple important details about this little position that we’re looking to fill:

• Part-time. Mostly likely, just one day a week at a reasonable hourly rate.
• You’ll work onsite in our small studio here in downtown historic Salem, Massachusetts. We’re situated in an old brick row building with a great coffeeshop on the first floor. Being onsite is an important part of this search. I miss collaborating with someone in person, with a goal of building a fun place to come to work to everyday.
• You’ll hopefully have some HTML and CSS experience, perhaps you dabble in backend development or graphic design. You might help test and do research, or you might help mail t-shirts or help develop future SimpleBits ideas and products. There’s a variety of places you could plug in here — it all depends on finding the right person and focusing on the strengths they might have.

Best of all though, you’ll definitely have fun. And you’ll get to work on some cool projects. Interested and local to Massachusetts? Please send over some info about you, and we’ll get the ball rolling.

Deckage

Posted at 10:37 PM

You may have noticed a little advertising spot over in the sidebar there. SimpleBits is pleased to have joined The Deck, which is described perfectly as:

The premier advertising network for reaching creative, web and design professionals, The Deck serves up millions of page views each month and is uniquely configured to connect the right marketers to a targeted, influential audience.

I’d never slap just any ol’ ad up here. And that’s why I’m excited to join a network that is picky about the advertising it accepts. My latte addiction has hope now.

Special thanks to Jim Coudal and the rest of my fellow Deckians.

Gridlasticness

Posted at 11:31 AM

After a brief period of unstyledness, we’re back with a realign and overhaul of simplebits.com. Aesthetically, it’s not much of a departure from the previous design — but under the hood is new markup, new stylesheets and a strict grid layout based on ems. After moving into new physical digs last month (more on this later), it only seemed appropriate to spruce up the virtual ones as well.

As usual, the overhaul started innocently enough, with a little tinkering here and there that snowballed into tearing the old CSS out, while the site embarrassingly stood naked for a week. But the challenge of creating a em-based grid was too tantalizing (the second time I’ve used that word in as many days).

A few notes when trying to create a grid layout using ems:

• Using the 62.5% method for sizing text has the advantage of setting gutters, borders, etc. at values of ten (e.g. 1em = 10px).
• Remember to avoid specifying widths and font-size on the same element (or at least be consistent about it).
• Realize that when adjusting text size in Safari, the grid will only stay perfect on a random bump. Firefox seems to stay intact at all times. I assume this is due to a rounding discrepancy.
• Understand that when building an already-wide layout, it’ll get really wide, really fast. That’s OK. Wide is the new drop shadow.
• Have plenty of coffee at hand.

A large motivation for this tinkering had to do with the Notebook entry styling. I’ve tweaked the MovableType templates to enable posting of quotes and photos as well as long entries and QuickBits (links). A “tumblelog” as the kids would call it. That doesn’t mean there’ll be 100 posts a day — but it does mean (I hope) more posting in general.

Now if you’ll excuse me, there are several dusty corners to clean up around here.

Introducing Foamee

Posted at 10:00 AM

I think I’ve just created something that will change the web as we know it. But I’ll write about that another day. Instead, I’m going to talk about a fun new thing I launched last night. Actually, it’s a couple of things.

I owe you a beer.

I say this quite a bit. For friends, family, people that deserve a pat on the back. I also often forget to make good on the promise. Wouldn’t it be cool if there was a way to keep track? And then also keep track of who owed you?

So, I decided to build Foamee (hey, there were plenty of abandoned ‘e’s lying around). It’ll keep track of who you owe beers to and vice versa. But don’t worry, this is NASN (not another socical network). Like you, I’m tired of creating another login, another set of friends/contacts, another avatar and more tears. So instead, Foamee piggy-backs on an existing one. As I was tossing ideas around, I realized a lot of the functionality: short messages directed at another person, web/IM/mobile messaging, etc. already existed elsewhere — so why not make things simpler and utilize the indispensable Twitter as a primary interface for the app?

Using Twitter’s API, Foamee will harvest replies and direct messages to create a barnacle-esque utility (props to Josh Porter for coining that) on the already-popular messaging service. If you’re already on Twitter, using Fomee is as easy as following ioubeer, then using specific syntax to announce an I.O.U. Beer to the world. We’ll repost these virtual pats-on-the-back, and also create a people page for anyone that sends a beer. Your people page will show who you owe, and who owes you. The sender or receiver also has the option of “redeeming” an I.O.U. via a direct message to Foamee, completing the deal.

I realize this is a silly (but potentially useful) service. And I’m excited to see where it leads, if anywhere. What it does now is incredibly simple (and there’s a reason for that, partially explained below). It’s also a shameless brand vehicle. How so, you ask?

Foamee Goods

Right out of the gate, there are two cool things to buy at the Foamee Store (because two weeks from now, when you’ve long forgotten about this little site, it’d be too late). T-shirts (of course) and I.O.U. Beer Coasters: a pack of six pulpboard coasters shipped in a drawstring cotton bag with a Foamee-branded Mini Sharpie. The coasters have a spot to write your name, perfect for handing out tactile I.O.U.s in person to deserving recipients. They work great in the mail as well. And they are awesome.

Special technical geek notes

Building this little app became a personal challenge. Could I handle the backend as well as the design? Could someone who primarily spends their time worrying about interface solutions roll up their sleeves and create a fully-functional product? And so the process of investigating APIs, databases and frameworks began. It reminded me of the old days, learning HTML (and later CSS) for the first time. Late night experimentation, utter frustration and then those “little victories” that make it all worth it.

Foamee runs on PHP, using the CakePHP framework, which turned out quite well. Cake uses the same model/view/controller setup found in Rails and other frameworks, has a good community and is dead simple to install and move around. I owe Jonathan Snook a beer for blogging about Cake (surely where I heard about it first). My code is likely terrible and other smart folks could probably bang out the same functionality in an afternoon, blindfolded and behind-the-back. But it works, and my familiarity with PHP coupled with my experience with Rails while working with the imitable Dan Benjamin on Cork’d and other projects (I owe him several beers as well) made baking with Cake tolerable for a noob like me.

Foamee is hosted by the fine folks at Media Temple, and I owe them a beer (or twelve) for that.

The motivator here was fun. Fun to build, fun to create for, and (hopefully) fun to use. I’m hoping fun continues to motivate around here — for Foamee and for whatever else cures the constant desire to create. Special thanks to Biz Stone at Twitter for helping tap the keg last night.

DingBit

Posted at 10:50 AM

I’m pleased to announce a new product shipping today over at the IconShoppe. Chameleon16 is a new pixel font for Mac and Windows, hand-crafted using only the finest pixels available. It’s based on the Chameleon Original icons that we’ve been hocking over here to support our growing latte addiction.

Initially, I’d thought to just convert the GIF images to a bitmap font so that the customer could change the color and add effects at will. The minimalist nature of the icons begs of it, and having the 16×16 icons in font format would sure be handy. But while I was at it, why not create new alphanumeric characters to go along with it, and create a real font in the same style?

As the name suggests, Chameleon16 is designed to be used at 16px. And like its pixel font predecessors, it also works at multiples of that base (32px, 48px, 64px, etc.) for retro, extra blocky goodness.

Since each character is a 16×16 tile, it admittedly has limited use for setting large chunks of text. You’re not going to use this font to display client invoices or proposals. But interesting things can happen when you start playing with kerning and line height, and I’m excited to see some interesting applications where it could be used creatively.

The TrueType font includes standard alphanumeric characters as well as the entire Chameleon Original icon set as alternate characters and costs just $39 bucks. As a special promotion, the first three orders also get a free copy of Bulletproof Web Design, Second Edition that hit store shelves last month First three orders received!.

Special technical geek notes

The process of creating the font was a learning experience, and I would compare it (at times) to removing stubborn wallpaper. I first created the characters in Photoshop, then used a program called BitFonter to turn those into a bitmap font, assigning each character, adjusting metrics, etc.

Over the course of the last six months or so I began chipping away it, navigating the spotty documentation, and teaching myself the wonders of font metrics, character encoding and more. In the end, I needed to create additional outlines of the bitmap characters and export these into TypeTool which could then generate a proper TrueType file (after having problems letting BitFonter do this). If I knew what I was doing this wouldn’t have taken long.

I avoided using something like Fontographer (also by FontLab) because I was creating a bitmap font and BitFonter’s pixel editor seemed a natural choice — and for creating and editing pixel fonts, it’s great (or at least slightly more intuitive). It’s the output and documentation that was confusing, and my respect for real type designers has grown tenfold after this little project.

So, my advice for those looking to create their own pixel fonts: learn Fontographer, or remember that you’ll need TypeTool in order to generate a TrueType file from BitFonter’s outlines.

Gone Fishing

Posted at 3:09 PM

We’re packing up over here for a little trip to San Francisco for @media followed by a few days of vacation. The whole family is coming with me, and we’re excited about everything, save the 6+ hour flight. Snacks? Check. Sesame Street? Check. Non-noisy toys? Check.

I’m posting this primarily to warn anyone of a delay in email response that’ll begin shortly. Well, there’s always a delay these days, but it’ll be even worse for the next little while.

See you on the left coast, or when we return.

Cork’d Finds a New Home

Posted at 10:36 AM

When Dan Benjamin and I launched Cork’d a year ago, our primary goal was achieved immediately: building something we personally wanted to use to discover and share wine. Twelve months later, it turns out other people wanted to use it as well, and we’ve had a blast listening to the community, improving the site and watching it grow (to over 20,000 users today).

One thing became clear throughout the evolution though: that the site always deserved far more attention than it received from its founders. We were building Cork’d on nights and weekends, and keeping up with new site features, member requests, etc. often took a backseat to other client work and dayjobs. Cork’d needed a new home — but not just any.

A New Home

After talks with companies large and small, we realized we didn’t want Cork’d to become just an advertising bucket for a media company that would most likely let it fizzle out. It was important to us to find a home that would get what the site does and how it uniquely fit in the wine world. We’re happy to announce today that Cork’d has been acquired by a newly formed company with Gary Vaynerchuk of Wine Library TV at the helm.

Gary has been changing the wine world as host of WLTV has built a rabid following of wine fans (“Vayniacs”, they’re called — myself included) with his energetic take on making wine fun — this is precisely the same mantra we had building Cork’d. But Gary also really knows wine — something Dan B. nor I can really claim. The recycling guy in my neighborhood knows how much I love wine (and regularly) — but that doesn’t mean I know wine. You know? To get an idea of the show, be sure to check out this video summary.

Gary really gets community. And with his mix of knowledge, energy, fresh take on wine, and his embracing of technology and the web, we’ve found a perfect fit. And that’s really what’s most important for the site — that Cork’d continue to grow under an organization that gets wine, gets the web, gets what Cork’d was trying to do, etc.

We’re excited that Gary along with Rails whiz Erik Kastner will be able to take the site to the next level (something it’s always deserved), integrating Cork’d and live tasting, having a real wine authority behind it. Cork’d will not only continue on — but it’ll get even better. For the last month or so, we’d been helping transition the site over, and out of that came some cool new features:

• A switch to the more widely used 100-point rating system.
• “Cork Board” on every profile page to start discussion between members.
• Easy import of wines for CellarTracker members.
• New identity and layout for Wine Library TV, to further tie the two destinations together.

Gary and team have more things in the works like support for OpenID, mobile and more. Dan B. and I will remain on as advisors, but we leave the site in very capable and enthusaistic hands. Cheers to WLTV and the future of Cork’d!

A Learning Experience

The last year has been a tremendous learning experience on so many levels. Sure it’s just a little wine site that Dan B. and I created in our spare time — but the process of building, maintaining, and transitioning was filled with lessons and “ah, so that’s how this all works” moments.

Working with Dan B. taught me volumes about how Rails can be a fantastic environment for designers to create in. I’ve talked about it before — but the concept of using Subversion (SVN) and “chipping” away at the interface in real time made it a bit like sculpting the application. I’m hooked.

I credit Dan B.’s talent as a developer for being able to easily handle the real brunt of the work here — having spent most of my time handing over XHTML and CSS templates to clients and then walking away, seeing and learning how everything falls into place by watching Dan work his magic was invaluable. And fun.

Read more about the Cork’d acquisition over at Hivelogic.

What’s Next?

It’s been a busy Spring, with the Cork’d transition, large client projects, and a book revision in the works. But I’m looking forward to the Summer to brainstorm on the future. An office move, expansion and a new SimpleBits-branded product are all probable — we’ll just see how all the juggling goes.

New Chunky Icons T-Shirt

Posted at 2:25 PM

Just in time for Spring, the all-new Chunky Icons Tee is available, selling fast, and shipping immediately! This is a limited-editon run that includes a numbered, signed letterpressed card and free stickers. The shirt is printed by the fabulous folks at Acme Prints on “Army” American Apparel (of course). You will love it.

On the front are five icons lined up in a row (from the Chameleon Chunky stock icon set over at our IconShoppe). Your task is to come up with what they mean. Best answer added as a comment here wins a free shirt (comment before April 7, 2007 to enter). On the back yoke is a small SimpleBits logo mark. Just because.

More detailed views of the shirt are available in this Flickr photo set.

41 Comments

IconShoppe Grand Opening

Posted at 3:32 PM

Without fail, I get more done when the work is piled on. When stress is at a max and there are a million to-do items. But this was long overdue, and something I’ve been meaning to set up for a while for reasons I’ll go into in a minute. So, before I pack for Austin, I’m happy to have finished this off enough to flip the switch.

Today, IconShoppe opens it’s doors. I’ve finally spun off the stock web icons I’ve been selling here at SimpleBits into their own, proper digs. It’ll motivate me (hopefully) to put more time into more icon sets and some other ideas I’ve had brewing for a while. This “setting up shoppe” was the first necessary step.

That said, they’re the same simple little web icons I’ve been selling here for the last few years. But they now have a better framework in which to grow and a more easily maintainable system behind them (Wordpress, customized).

Stay tuned for more, and grab the RSS feed to be alerted of new stuff happening over at the ‘Shoppe. I can’t say it’ll be updated often, but this is just a start, my friends.

35 Comments

AIGA Redesign

Posted at 11:09 AM

This morning, AIGA (the professional association for design) relaunched with a shiny new design by Happy Cog. I had the pleasure of taking Jason Santa Maria’s brilliant designs and turning them into semantic XHTML and CSS templates that could be plugged into a custom CMS built by Thirdwave (AIGA’s technical partner). Magic and fun ensued.

Every project is a learning experience. But working with Jeffrey and Jason for a client like AIGA, well that’s a whole new level of awesomeness. One could (and should) study Jason’s molecule-level of detail in typography (using just two web fonts and a splash of Interstate via the venerable sIFR). It was a fun challenge getting things right using CSS. I hope I’ve come close.

Congrats to AIGA for renewing their digs with a smart, readable, beautiful design — and a big thank you to Jeffrey, Jason and Happy Cog for allowing me to pitch in and help with this.

Read more about the redesign:

• Jeffrey Zeldman: Happy Cog redesigns AIGA
• Jason Santa Maria: AIGA Redesign
• Happy Cog: AIGA Website Redesign

And a special geek note: events listed on AIGA’s homepage are marked up with hCalendar.

New Icons: Chameleon Chunky and SuperPack

Posted at 2:20 PM

While I was putting together an hCard example for next week’s Web Directions North presentation a while back, I whipped up a few icons that were Chameleon in spirit — but doubly thick. And so, Chameleon Chunky was born: the newest addition to the color-changing family of stock icon sets.

The extra-thickness of this style was a bit more challenging for some shapes, but the ability to add single pixel details makes for good contrast when using just one color. Like all the Chameleon sets, these are royalty-free stock icons that are customizable to fit your site’s color pallette. Just punch in a hex color, hit a button and we’ll magically generate a custom-colored set for you immediately. Ah, the wonders of technology, and all for $25 USD.

If you’re feeling lazy or indecisive, a Ready-Made Pack is also avaible that includes 6 pre-selected colors for $35 USD.

Chameleon SuperPack

In addition to the new Chunky style, I’ve also put together a SuperPack of all four Ready-Made Packs in one convenient (and low-priced) bundle. For just $85 USD, you’ll get all four styles in 6 different colors — 1,680 icons in all. That’s a lot of pixels folks.

Hope you dig ‘em!

Pressed

Posted at 3:33 PM

With a new logo, comes new business cards. I’d used Dependable Letterpress for a previous run of cards and was really pleased with the quality, service, etc. Today, the new cards arrived, and I’m just as happy with the results. Highly recommend them, but be warned that it’s not a quick and cheap option.

Nothing beats seeing the art and type stamped into thick card stock, with visible embossing from the weight of the plates (more evidence of letterpressing awesomeness here). It’s also reassuring to see the flexibility of the new vector-based logo in action. Smooooove.

39 Comments

Cheers, Interwebizens

Posted at 4:58 PM

2006 was an amazing life-changing year, and largely because of stuff that has nothing to do with the web or business. But as I lock up the BitCave until 2007, I just wanted to write a quick thank you to all the clients, icon/t-shirt customers and readers of SimpleBits. You’ve made it possible for me to focus on the stuff that really matters, and for that I’m grateful.

So, Happy Holidays, Merry Christmas and Happy New Year (in case I ignore blogging until then)! Cheers indeed, interwebizens.

Re-Brand New

Posted at 8:41 PM

For the first time ever, SimpleBits has a logo! Roughly six years ago, I took a stab at creating an isometric set of three boxes (cardboard, to be specific). It was really an icon — and one that sat in the header alongside my personal site at the time, the now-defunct cederholm.org. Over the years, it’s always been there, and I’ve probably overdone it in terms of branding: I put the boxes everywhere. It became the brand. But it was always awkward, and highly inflexible. It worked terrible in print, where at small sizes, the pixelated blocks looked more like botched clip art.

Several months ago, I finally started on a new logo design — something I’d been meaning to do for years. It went rather quickly, playing with four curly brackets set in Avenir that created a frame around a hand-drawn cube (vector this time!). I finally had something I didn’t hate the next day. I’m excited to have a mark that’ll be flexible going forward, and it was crucial for me to create one that could be any size, or color (even looking intact using a single color).

I owe Greg Storey thanks for suggesting Whitney for the logo’s type, after I realized that the previously-utilized Triplex just wasn’t working.

It was the logo refresh that forced me to rework the site design as well. I’m not one to change things for the sake of changing things, but the new logo was a good excuse to update the templates as well. And what you see now is the result of several weeks of tinkering.

Much of the structure and layout of the site remain the same. Nothing earth-shattering here. This time around, I’m trying out an elastic em-based layout. If you’re unfamiliar, try resizing the text in your browser to see what happens. For this particular site, I think it works well. If I had the need/desire/requirement for an additional column, then I would’ve explored other fluid or variable fixed-width options. But for this simple, two-column set-up, I thought it’d be interesting to try something with ems.

I’m hoping the revised logo will help swing the rest of the company forward. I have a lot of ideas and things in mind for the future, and this is merely step #1. Here goes nothing. But first, new business cards need ordering.

Workshopp'd (and a break)

Posted at 8:21 PM

I’ll start off by mentioning that the Carsons (Gillian and Ryan) are two of the nicest people you’ll meet in the business. I’m grateful to them for setting up Thursday’s workshop at Boston’s Museum of Science.

I think it went well, and I’ve received some good, positive feedback. As with anything, I’ll now be focusing on the parts that I thought could’ve been presented better — but all-in-all I had a great time, managed to still have a voice after talking for eight hours, and those that attended (suprisingly many from outside of New England) brought along great questions. It’s clear that the majority of people attending conferences and workshops are gaining more and more knowledge about CSS, standards, semantic markup, etc. So much so, that I wonder what the heck I should speak about in the future. Hrm.

So thanks to all who came out to the workshop, and again to the Carsons (they have this stuff down to a science). It capped off the busiest few months I’ve had in years, and in two days we’ll board a plane for Florida to visit family for a week. A much needed unplugging.

While I’m away, Rael Dornfest and company will be presenting Stikkit on the Launch Pad at the Web 2.0 conference. Stikkits are “little yellow notes that think”, and I’ve been helping with the design. Keep an eye out for it!

More Workshop Details

Posted at 10:54 AM

Amidst a flurry of client activity over here at SimpleBits HQ, I’m also lovingly crafting what I hope to be a great Carson Workshop: Bulletproof Design with XHTML & CSS on November 2nd in Boston. The venue is now booked, and it’ll be a fun one: Boston’s Museum of Science — a place anyone who’s grown up in the area knows very well. Perhaps between sessions we can chill out in the planetarium or IMAX theatre. Anyhow, I think it’ll be a great setting, and I can only hope I’m able to make the day helpful, fun, inspiring and interesting.

I should also note I’ll be handing out stickers, t-shirts and books to attendees in scheduled bursts of shameless self-promotion. I haven’t yet determined the criteria for receiving the goods — but we’ll think of something interesting.

Hope to see you there.

One Percent for the Planet

Posted at 10:55 AM

It’s been just about three years now that I’ve been out on my own, building SimpleBits into a fledgling little business. I feel really fortunate to be able to wake up everyday and work on things that I’m excited about. It’s been a lot of work, of course (as many of you know) — but the flexibility has been especially important lately.

For a while now, I’ve been thinking of ways I could give back, finally stumbling on an organization called 1% for the Planet. From their mission statement:

1% For The Planet is an alliance of businesses committed to leveraging their resources to create a healthier planet. Members recognize their responsibility to and dependence on a healthy environment and donate at least 1% of their annual sales to environmental organizations worldwide.”

It struck a chord with me immediately. Here’s a structured way I could give back to the environment as a business each year. I filed the paperwork, and from now going forward, SimpleBits, LLC will be a proud member.

One of the aspects I really dig about 1%FTP, is the fact that as a business, it’s up to you in choosing what environmental groups you’d like to donate to from a list of approved organizations. That takes much of the guesswork out of “where to donate?”, and is a real benefit in joining the group. I’ll be choosing 2006’s groups over the next month or so. There are already a few local orgs that look interesting (Ipswich River Watershed Association for example, where I’ve often gone hiking).

I do realize 1% of our revenue isn’t going to change the world — a drop in the bucket really. But I thought it was worth mentioning publicly in case others have also been searching for an easy way to help the environment. And the more businesses on board, the better for all of us.

Upcoming Speaking Events

Posted at 10:34 AM

A few years ago I would’ve told you that two of my biggest fears are: flying and public speaking. Thankfully, that’s no longer entirely true, and like anything, the more you tackle things that frighten the hell out of you, the easier (and even enojoyable) they become.

That said, I’ve lined up a few speaking events that I’m quite excited about, and conveniently they’ve all been just announced within the past few days:

• Carson Workshop: Bulletproof Design with XHTML and CSS November 2, 2006 9:30am-5:30pm · Boston
  Having a whole day will be excellent for diving deeper into the concepts and techniques described in the book. I’ll be using the design of Cork’d as a model for much of the day, discussing the bulletproof methods for designing with lean markup and flexible style. It’s also a bit daunting having an entire day — but the 40 seat limit will (I hope) create a two-way conversation, and I’m looking forward to talking about things that would otherwise get tossed out of a short presentation. I also like the commute to this.
• Web Directions North February 6-10, 2007 · Vancouver
  The best conference of the southerrn hemisphere comes north to Canada. Brought to you by John Allsopp and Maxine Sherrin of Westciv, Dave Shea and Derek Featherstone. A great lineup, and skiing at Whistler. I’ll be talking about microformats (with more details to follow).
• @media 2007 (America) May 24-25, 2007 · San Francisco
  The best conference in Europe comes stateside!
• @media 2007 (Europe) June 7-8, 2007 · London
  Vivabit knows how to put a really great conference together. Last year’s event was fantastically organized and a real blast. Wish the World Cup happend every year though.

Admittedly, I’m not entirely sure what I’ll be speaking about this year at @media yet (a conference that’s gone tri-continental this year, with a stop in Hong Kong as well). Actually, feel free to suggest something in the comments (topics could include “ukuleles” or “designing with baby toys”).

17 Comments

New Chameleon Icon Sets

Posted at 4:32 PM

It’s been almost exactly one year since releasing Chameleon, a customizable stock icon set for the web. It’s been really successful, and later spawned additional ideas for color changing goods. Then life happened, and most of those ideas fell by the wayside.

I’m happy to announce today, at least a small portion of those grand ideas in the form of two new Chameleon icon pack styles:

Chameleon Graphite

A reversed version of the original, the graphite style has a shiny silver container for the tiny shapes that change color inside.

Chameleon Mini

Just the tiny shapes without the container. I’d been meaning to get this set finished since releasing the original and just never got around to it. These miniature icons are especially great for embellishing links inline.

Just like the original style, each of these new sets is available in a “Ready-Made” pack of six pre-selected colors ($35 USD), or as a single set using the hex color of your choosing ($25 USD). Hope you dig ‘em.

New SimpleBits Tees

Posted at 10:50 AM

A fresh batch of t-shirts has just arrived from the printer. This time around, the design has been tweaked and screen-printed on “Asphalt” American Apparel shirts (the most comfortable, fitted shirt available) by the fine folks at Acme Prints. We’ve been using Acme for the Cork’d t-shirts, and they do such a fine job that I decided to make the switch here at SimpleBits. Acme has low prices, free shipping and no set-up charges — and their customer service is excellent.

The Official SimpleBits T-Shirt is just $16 USD plus shipping. We believe you will enjoy it immensely.

Introducing Cork'd

Posted at 9:59 AM

I like wine. I’ve even touted it’s ability to act as a design enhancer. The problem with wine (for me, and for many) is knowing what’s good. There are infinite choices out there. It’s overwhelming. Oftentimes, I lean on the suggestions from friends — people that probably know more about wine than I do.

When I finally find a wine that I like, it’s always impossible to remember it for the next trip to the store. Some people keep a journal, writing down what they thought about the wine in a notebook. But wouldn’t it be great if you could do this online? And wouldn’t it be also great if we could share those lists with our friends through a simple, free interface? And while we’re at it, wouldn’t it be the bomb.com if this same interface allowed you to review the wine, tag it, and set up lists for wines that you want to buy or that you own in your cellar?

Introducing Cork’d. A brand-spanking new site devoted to reviewing and sharing wine created by Dan Benjamin and myself. We’ve been working on this for quite some time. Just the two of us. Call us the Bartles & Jaymes of the wine web world (wait, no, don’t do that).

What is Cork’d?

The basic gist of Cork’d is this: after painlessly creating a free account, you’re able to keep track of wines you’ve tried in your Wine Jounal. You can rate, review and tag wines (more on that below), and these “tasting notes” end up attatched as comments to each wine in our database. You can also build a Shopping List of wines you’d like to buy (think of this like you would a Netflix queue), and a Wine Cellar for wines that you own. Keeping track of what your friends are tasting is as easy as adding them as a Drinking Buddy. You can also recommend wines to your buddies after you’ve rated and reviewed a bottle.

We have a partnership set up through wine.com, where a selection of their bottles have seeded the Cork’d database with about 1200 wines (which will grow as members add their own bottles), each with a link to buy that wine right away. But we can also see other cross-promotional opportunities by getting involved in the meat-space wine community. There are endless ideas flowing about connecting with wineries and vineyards, other wine blogs and podcasts. We’re really looking forward to watching it all grow.

Tasting Tags

The idea of tagging a wine may sound absurd — but when we started to realize the benefits, it became a must-have. We call them tasting tags, and by applying keywords like “oak, pepper, vanilla, berry” to a wine, we’re then making it easy to find similar wines based on those flavors. If you like oaky wines, for instance, then it should be easy to find them.

Why and How

What’s funny about Cork’d when looking at it for the first time, is that it’s pulling in many of the current technologies that have been brewing out there, and applies them to… wine. And why not? This is something Dan B. and I built quite simply because we wanted to use it. We’d been trading favorite bottles, realizing there would be an incredible benefit to keep track of things through a web interface, building a community around it, and making it easy to subscribe to buddies and wine lists. It had to be.

It’ll also be interesting to continue to talk about what we learned by building a web application with a team of 2. Working with Dan B. is a natural fit, as our areas of expertise overlap only slightly (design/ui/development), and where they do overlap actually made things run all the smoother. I was continually amazed by the way Dan approached building the app in Ruby on Rails, the speed, the structure, the way he thinks about a problem for a while, then takes all of about 3 minutes to write the working code — he’s a developer who designs in code. And I’m sure he’ll have much to write about regarding the process, including his already-published thoughts on the launch over at Hivelogic (far more thorough than mine).

This was a giant learning experience for me in terms of dipping my toes in Rails, becoming more familiar with Subversion (more on this later), and in using these tools as a collaborative and iterative way of building a web application. It’s a gratifying way for a designer to work on a large project, chipping away at things in real time, using real data — it’s a bit like sculpting. An evolution.

Go Forth and Uncork

I’m excited to share much more about the site over the coming weeks and months, and we’ll be rolling out some additional features and tweaks. But until then, if you dig wine (or want to start digging wine), then head on over and, um … uncork — Cork’d.

Inside the Net Interview

Posted at 11:55 AM

Chatted with Amber Mac and Leo Laporte last evening, and the resulting conversation (roughly 40 minutes) is now up and ready for consumption in the form of Inside the Net Episode 19.

It was an honor to be on the show, where topics included SimpleBits, web standards, books, current stuff that’s happening, iterative app building and other hopefully interesting things.

Fence Riding Once Again

Posted at 2:07 PM

Apparently the fixed/fluid-width toggle feature here at SimpleBits was a popular one. The latest realign bid farewell to the option, instead settling on a centered, fluid-width layout with a conservative max-width applied. For those that requested it, the ability to toggle between fixed and fluid is now back. There are a few reasons I decided to add it back in:

1. Well, you asked. Actually, I don’t usually cave in to reader demands, hence my recent useless-but-riveting articles regarding oatmeal cookies and (of all things) the weather.
2. It’s so dead-simple to implement. Well, after reading this it should be.
3. Choice can be nice. Since max-width isn’t currently supported by all browsers, giving those readers an easy option for readable line-length seems to me a Good Thing.
4. It’s fun to play with. Along the same lines as twirling a pencil in your fingers like the drumstick of a spandex-wearing drummer from the 80s.

20 Comments

Some Speaking Events

Posted at 11:06 AM

The speaking drought is ending this summer and I’ll be taking Bulletproof Web Design on the road to two conferences. Don’t worry though, I won’t be regurgitating the book, but rather using the concepts as a platform to talk about some recent (and future) projects along with the methods and thinking that’s gone into them.

@media 2006 · London · June 15-16

Kerry and I visited (Old) England back in 1998. Loved it of course (especially Oxford). Looking forward to going back, although we originally thought this might be a first big family trip, it’ll be hard to be travelling solo. If you’re attending the conference and see a misty-eyed, intentionally (for now) bald guy glued to his iPhoto-enabled iPod — now you’ll know why.

@media looks like it’ll be a fantastic conference though, with quite an amazing line-up of speakers. Really looking forward to it.

Webvisions 2006 · Portland, Oregon · July 20-21

I’ve never been to Oregon, but have always assumed I’d really dig it. Webvisions has quite a line-up as well, spread out over two days of workshops, panels and keynotes. Should be fun times.

Arkanoid Edition

Posted at 6:05 PM

Another year, another realignment. What started out as a long-term desire to take better advantage of the footer (putting content chunks that were previously in the sidebar down near the bottom) quickly turned into more of a CSS refresh. This version is dubbed “Arkanoid Edition” (coined by Ethan and will make sense to anyone that spent their afternoons at the arcade in the 80s).

There are too many dusty corners to clean up, and so there very well might be some areas that still need attention. But somehow this feels more comfortable right now. The colors are toned down a bit, columns feel a bit more readable, etc. Surely not everyone will be a fan, but such is the life of a web site. Change is good. But it can also be disorienting.

Boxy, but Nice

One of the struggles with the SimpleBits logo is that it’s not a logo at all. It’s an icon. And works terribly in print unless it’s enlarged properly. I’ve debated changing the logo, always settling on maintaining the brand, and instead embracing its pixellated charm. Hence the square, blocky treatments that will likely warm the hearts of 8-bit fans and yet turn away the warm-and-fuzzy brigade.

Fluidity

I’m no longer straddling the fixed/fluid fence! Previous versions of this site featured a little toggle up in the top right corner enabling you to switch between a fixed or fluid width by means of a little Javasript and an alternate stylesheet. How diplomatic. With this new design, I thought I’d try a centered, fluid layout, using left and right padding on the body using a percentage value. That coupled with a conservative max-width set at 900px makes for a wider-but-not-too-wide solution. If only max-width (and min-width) worked in IE (aside from the Javascript fixes that exist).

Hiding from IE/Mac

I’ve also decided to intentionally hide all CSS from IE/Mac this time around. It’s not that it would be impossible (or even that difficult) to get this particular design working. It’s just that, for this site, it’s time to move on and have one less set of hacks to worry about.

What’s great, is that it’s dead simple to hide CSS from IE/Mac using the commented backslash hack just before importing your styles. Here’s my main stylesheet, screen.css, which imports the master styles as well patches for IE/Win.

/* import stylesheets and hide from ie/mac \*/
@import url("master.css");
@import url("ie.css");
/* end import/hide */

IE/Mac won’t get any of it because of that backslash at the end of the opening comment. And this is certainly OK for SimpleBits. Your site’s statistics may vary.

Posterity

Archived for posterity, and a comparison for those arriving here today for the first time, is a screenshot of the previous design.

Web 2.0 Show Interview

Posted at 10:17 AM

Chris Saylor and Josh Owens of the Web 2.0 Show have interviewed me for Episode 10 of their podcast series. We chat for about a half hour on matters web design, recent work, inspiration, etc. Listen while you jog, vacuum, or fly to exotic destinations.

Chameleon: a new icon set that changes color

Posted at 3:00 PM

I’m excited to finally announce a little something I’ve been working on for quite awhile. Chameleon is a unique stock icon set for the web that features simple, friendly, universal shapes designed and hand-crafted by SimpleBits. The set contains 70 royalty-free icons, each weighing in at a standard 16x16 size (perfect for favicons) in GIF format. Chameleon is unique in its ability to change color, allowing you to custom match the set to your own site’s color pallette.

A Weblog Entry About Weblog Entries

Posted at 4:15 PM

I’ve been thinking lately about weblog format standards, and what readers come to expect. This quote from Jason Kottke regarding a change in the way he handles his “remaindered links” sums up my frustration with current trends:

38 Comments

Contest Winners

Posted at 10:44 AM

First things first, a big thanks to everyone who entered the contest. A whopping 713 entries far exceeded my expectations — and it’s excellent that so many weighed in with genuinely thoughtful comments regarding Huey Lewis’ modern day equivalent.

30 Comments

The Great Book Giveaway Contest #2

Posted at 10:21 AM

It appears that Bulletproof Web Design is now available, and I’ve received a few reports that copies are starting to be spotted in stores and received via various online booksellers. To celebrate, I’m launching a little contest where you can win two books, a t-shirt, and some icons.

712 Comments

New T-Shirt: Document

Posted at 2:35 PM

The dog-eared document icon has long been a symbol for web aficionados everywhere. Now you can show off your passion for wearable pixels with the brand-spankin’ new Document T-Shirt from SimpleBits.

This is a superior, 100% heavyweight Hanes Beefy-T in Graphite. The magnified icon (inspired from the Stockholm set) is printed in two colors and simply centered on the front.

An icon on a t-shirt? Yep. And that’s why you (probably) want one.

Odeo Opens its Doors

Posted at 10:55 AM

Discover, create, and subscribe to original audio content for your iPod or MP3 player. Earlier this month, Odeo opended its doors to the public, with a site design from SimpleBits.

New Book: Bulletproof Web Design

Posted at 10:11 AM

I’m happy to finally announce my new book, Bulletproof Web Design, to be published by New Riders this summer. It’s now completely written and heading to the printers this weekend. If all goes well, it should hit bookshelves in early August.

microformats.org Launched

Posted at 10:28 AM

Officially announced at Supernova2005 earlier this week, a new community-based site has been launched to be the official home for microformats — with a logo and simple site design from SimpleBits.

SimpleBits T-Shirts Reprinted

Posted at 12:07 PM

The bad news: the Summer sale wiped out our inventory of official t-shirts. The good news: they’ve been reprinted, and all sizes are now back in stock. A slightly darker “bluestone” shirt (100% cotton Hanes Beefy-T) was selected this time around, with the same 3-color screen print, centered on the front. Apparently, t-shirts rule.

Weeding Feeds

Posted at 8:11 PM

Following up on last week’s thoughts on feed confusion and multiple XML feed formats, Nick Bradbury offered a handy tip in the comments that I’ve implemented here for this site.

22 Comments

New Office: The BitCave

Posted at 10:24 AM

A few months ago, I had written about the search for office space, and I’m happy to report that SimpleBits is unpacked and settled into its new office. For a while now, I’ve been referring to SimpleBits as a “tiny web design studio”. That remains accurate, but the size of the space doesn’t diminish the benefit of having a place to call “home” and also a place to call “work”.

After doing a fair amount of searching and research, there were several things that made the choice clear — a 150 year-old brick building in downtown Salem, Mass. It’s about a five minute walk from the house. Very key, and being right downtown, I’m close to other businesses, restaraunts and, well… people. But also, having a flexible landlord helps to ease the worry of having a monthly expense this large. If things don’t work out, I can opt out of the lease. Having been here a few weeks, I can’t see that happening, but it’s a nice safety net. Also potentially helpful, is the possibility of moving to larger space within the building if necessary. Moving sucks, but would suck less if you can stay under the same roof. Something you might consider inquiring about if you (like me) just need room enough for one person now, but potentially more in the future.

Probably the most important aspect of the new office’s location is what lives on the ground floor (I’m up on the 4th floor). The Boston Hot Dog Company and (coming soon) Ben & Jerry’s (Vermont’s finest ice cream). The office will get even smaller, due to me getting larger.

As for the office itself, although it’s tiny, it took a vanload of IKEA furniture to outfit it. This was my first excuse to drive 3 hours to the nearest IKEA for the best price/design ratio out there as far as office furniture goes. It also struck me how IKEA is the “web standards” of the furniture world. Choose a couch. Grab the base model. Then choose a slip cover for the color you’d like. Choose from a crazy number of storage combinations — all modular and eventually fitting together (after a few hours of assembly). It’s designed not only to look good when it’s put together — but it’s also designed to stack and travel well before it’s even put together. I was impressed with it’s use of structured markup and CSS…. err, I mean vaneered particle board, wooden pegs, and silver framework.

So now, I get used to going somewhere to work every morning again, and things feel a bit more legitimate — like there’s room to think and grow. This seemed important, and now that I’m in here, I’m realizing how right I was.

Stockholm Icon Updates

Posted at 12:40 PM

Just before I headed down to SXSW, I completed a large update to the Stockholm royalty-free web icon set. Several new icons were added (including shopping cart, gear cog, check mark, refresh) as well as “add” and “delete” versions of previous document and folder icons.

The price is remaining the same (still just $45 USD) and, as always, previous purchasers of Stockholm are entitled to getting a free upgrade. Just follow the instructions further along in this entry.

Also introduced today and included free as part of the larger Stockholm set, is Stockholm Mini — 36 miniature versions of popular icons from the main set. For those that just need tiny bits only, this little pack is also available as a standalone for just $18 USD.

How to retrieve your free upgrade

If you’ve purchased Stockholm in the past, you’re entitled to getting the entire updated set (including Stockholm Mini) for free. Just point yourself to the upgrade page. You’ll be asked for a username and password. Here’s how to find those:

1. Open your existing Stockholm icon set.
2. Look in any folder that contains the set and lists the GIF files alphabetically in one column.
3. The username = the first five letters of the 3rd filename listed.
4. The password = the first four letters of the 5th filename listed.

After entering the correct username and password, you’ll be directed to a page where you can download the newly updated set. Any future updates will continue to be free for those that purchase the set.

New Feeds Available

Posted at 2:05 PM

In the spirit of Burger King, there now two three ways to “have it your way” in regards to SimpleBits feeds. A master feed, which contains a singular flow of both articles and QuickBit links (you need not change your subscription URL if you want this feed). Or, for those that are happier with fewer items in their aggregators, there are also “articles only” and “QuickBits only” versions. All three flavors come in RSS 2.0 or Atom formats:

• Master Feed RSS 2.0 (articles and QuickBits)
• Master Feed Atom (articles and QuickBits)
• SimpleBits Articles RSS 2.0 (articles only)
• SimpleBits Articles Atom (articles only)
• QuickBits RSS 2.0 (QuickBits only)
• QuickBits Atom (QuickBits only)

I suppose I could also offer a “QuickBits only” version, but for simplicity’s sake, the master feed will give you all the updates in one place. And since I’m not writing 50 articles per day, I can’t see the occasional article here and there being a nuisance, but popular demand could sway me. There was really no reason not to offer this.

Update: I’ve updated the above list of feeds to also include a “QuickBits only” version. And the feed lovers rejoice!

A Note About the Notebook

Posted at 3:25 PM

Equally a reaction to my recent busy-ness and my desire to fold the QuickBits (short links to cool stuff) into the main content area, I’ve made a few small tweaks to the Notebook here.

Following the lead of a few other sites, I wanted to experiment with a singular flow of Notebook entries — both fleshed-out articles, as well as quick links to stuff that I happen to be reading. It’s become quite common for sites to break those quick links out into a separate column (as I had done previously). It prevents a proper “article” from being pushed down the page when quick links are added in succession. But there were other aspects of the dual setup that were bothering me.

title=”abuse”?

It started to feel funny, stuffing longish descriptions of QuickBits into the title attribute of the link. Oftentimes, the descriptions weren’t titles at all. In fact, the title was often the text that was being linked. Visually, it’s cleaner to just show the linked text, and have the longer description shown on mouseover (when placed in the title attribute), but it’s hidden, and usually contains far more than a title. I want the ability to say more than just a few words about what I’m pointing to.

Attribution

Attributing the source of a link becomes a problem when using the title attribute as well. If I want to give credit to someone for a cool link I’ve found on their site, I can only add unclickable text: kottke.org at the tail end. Even worse, If I just say, Kottke, is everyone going to know where that is? (Yes. OK, bad example).

Description Length

We’re limited as to how much text we can actually stuff inside a title attribute (I belive some browsers will truncate at a certain character length). I want the ability to write a bit more about something, without feeling the need to write a whole article about it.

Lack of Comments

This is primarily because I was using my own home-grown mini CMS previously, and I realize that other sites enable comments on link lists.

Lack of a Permalink

See the item above.

So, these are some of the reasons for the tweak. I now need to experiment with how to handle feeds. Should the title for a QuickBit link directly to the site that I’m pointing to, or should it point back to the archvied entry? I suppose if I enable comments on these, linking to the post would make more sense. Things to think about.

At present, a QuickBit’s title will link to the site directly, as well as a “Visit site” link at the end of the description. A permalink is added at the bottom (marked with a # icon) to reach the archived entry on SimpleBits. An extended notebook entry’s title links to it’s archved entry, and permalink is also marked with a document icon.

This got me thinking about importance, weighting and text size (a hot topic these days). It’s perceived that a separate link list in another column becomes less important than proper full-blown entries (and maybe that’s intended). But when mixed in together, the importance evens out. I’m attempting to weight the importance subtly by decreasing the size of QuickBit titles.

Confusing? Make sense? I guess that’s for you to let me know. I think it’ll work well going forward (still not sure about the feeds though).

And the experiment continues…

Update: Well, the experiment was a success, in that I’m back to having QuickBits in the sidebar :-). But while I’ve returned to abusing the title attribute, I’ve solved several of the other problems: permalinks, ability to comment, searchable entries (now that I’m using MT for all of it) as well as a singular flow for the main Notebook page and monthly archive indexes. Attribution isn’t perfect — the link obviously isn’t clickable in the tooltip, but it will appear in the archived entry page (as well as any other HTML). I’m also happier with the feeds, now still offering a singular flow of entries for all content or separate feeds for articles and QuickBits. So, while I’m back to the same placement, I’m much more content with the improvements.

27 Comments

Done Fiddling (for now)

Posted at 10:59 AM

What started as an attempt to cure this site of its over-use of grey, turned into more of a site design update than planned. So after several weeks of refinements, I’m done fiddling. And having done several subtle updates over the last several months, perhaps I don’t know when to stop.

In addition to new colors (the blue sky and green grass lend further evidence that I’m trying to be the Ben & Jerry’s of web design) I’ve chopped the home page down by displaying just excerpts of the recent Notebook entries. Because of this, the recommended link list has been moved to the main Notebook page. It’s not that this list is now unimportant — it just doesn’t fit on the shortened page anymore.

It’s been just over a year since I turned SimpleBits into a full-time job, and throughout this time, I’ve often struggled with the personal weblog vs. company portfolio vs. everything else balance. There was a time when I debated creating a separate site for business only, but then realized that it may eventually go largely unvisited. So I’m committed to keeping everything right here. A mix of everything it’s always been, and it’s certianly convenient this way.

Here’s to bold, bright colors in 2005 — a year that’s already looking to be filled with fun projects and exciting work and (hopefully) less global tragedy.

The Official SimpleBits T-Shirt

Posted at 3:38 PM

Almost in time for the holidays. An official SimpleBits t-shirt is now available. Following the lead of Daring Fireball (you do have a DF shirt, don’t you?), I’ve long thought it’d be cool to make available a high-quality silk-screened shirt (and I thank Mr. Gruber for his sage advice on t-shirt logistics). That day has finally come.

This is not a mediocre iron-on, but rather a 100% heavyweight cotton Hanes® Beefy-T® in Stonewashed Blue, with the SimpleBits blocks and typeface in three-color screened print. This t-shirt also validates as XHTML 1.0 Garment. A new standard in clothing quality.

Price, size and shipping details can be found on the t-shirt page in the newly added “Buy” section of the site.

I’ll be packing and shipping t-shirt orders by hand (with payment through PayPal), so a two-week delivery time is anticipated, depending on your global location. Unfortunately I couldn’t get it all together in time for holiday shipments. But rest assured, I’ll be getting orders out the door as quickly as possible. It’ll be an interesting experiment.

Winterfresh

Posted at 11:20 AM

Changes to the design of SimpleBits have always come in small, incremental tweaks. I’ve had to restrain myself from making a complete departure from the basic theme. This is partly due to time, and partly due to always coming back to the same concept. Is it perfect? No way. But for now (and for a long while) it has worked, leaving time for other things.

This little update is very tiny. I’ve removed the icons from the navigation. The site as a whole was in danger of being consumed by icons. Icons everywhere. So I thought I’d strip down the design, and let it flow around the work, rather than force the work into the design.

Gone are the (rather pointless) color theme switcher buttons, replaced by a new default frosty blue. Instead of changing header colors, you can now toggle between a centered, fixed-width layout and a widescreen, fluid-width version. This was a bit tricky, in order to keep design elements in the header and sidebar consistent. I’ve used the “Sliding Faux Columns” approach (1, 2, 3) in achieving a flexible, yet full-length sidebar.

For me, it’s difficult to stop tweaking. To know when to stop and when something is done. And at times, it’s fun to remove things, distilling a theme or idea a bit more than originally planned. Here’s to the constant ebb and flow of web design.

Commenting Restored

Posted at 11:07 PM

Commenting is now restored. I ended up (reluctantly) upgrading to MT3.11, solely for the ability to bulk delete any future spam attacks with ease. But clicking around a bit, I’m noticing some other interesting features, and am now happy to be on the latest version.

A tip on upgrading. If you have a large site with a lot of entries and comments — I’d suggest making sure you’re using a SQL database. I was previously using Berkeley DB, and upgrading those large databases failed every time (timeouts). There are scripts (possibly already there) to transfer from Berkeley DB to SQL. Do this first. The rest of the upgrade process went very smooth, and MT in general looks to be running faster.

I’ll be continuing to add more spam-blocking features to the site now that I’m upgraded. Thanks to all those that have written in with offers to help. Very kind of you.

Comments Are Disabled

Posted at 9:43 AM

After waking up to over 200 comment spams this morning, I’ve had to disable comments on the site for now. For a while, I wasn’t getting any spams — but then about a week ago I started getting maybe 5 a day. Until last night, when someone just dropped on bomb over here. So commenting is broken for now, and (maybe) will be back soon. Clearly I need to take better measures in preventing this stuff. Thanks.

Update: Commenting is now restored. I’m hopeful that, along with MT-Blacklist which I’ve had installed for a long time, the following will help combat future spamming: renaming mt-comments.cgi and removing the “Post” button from the entry page (forcing a preview of your comment before posting). These tips and more, explained. It also appears that MT3.1 has a vastly improved editing interface for comments, hopefully easing the process of deleting 200 comments all at once. An upgrade may be in order.

Stockholm Icons Now in Two Sizes

Posted at 1:00 PM

I’ve just finished an update to the Stockholm set of royalty-free web icons. Each icon now comes in two standard sizes: small (16x16) as well as large (32x32).

A few new icons were also added to the set: folder box, and clipboards.

The price will remain the same (just $45 USD), and I’ll be emailing those that have bought the icon set before today’s update with instructions on how to get a free upgrade. Any future updates to the Stockholm set will continue to be free as well.

Update: The upgrade email has just been sent to previous Stockholm customers. If you haven’t received the email, please contact me to receive instructions on receiving the new icons. Thanks!

Icon Set Updates

Posted at 5:14 PM

I’ve just finished a tiny update to both the Stockholm and Overcast icon sets. By popular demand, each set now contains a “printer” icon. Additionally, the Stockholm set now sports a “brown shopping bag”, suitable for your favorite electronic commerce applications.

I may periodically update these sets in the future, and such updates will always be free to those that have purchased the set in the past. That said, if you’ve already purchased Stockholm and/or Overcast, drop me a note and I’ll send you the new icons.

Overcast™: More Stock Web Icons for Sale

Posted at 11:04 PM

Creating an icon set proved to be fun enough for me to want to do it again. Overcast is a new set of royalty-free stock web icons — this time I’m offering each icon (28 in all) in two standard sizes: 16x16 as well as 32x32. The whole set is just $65 (USD).

Like the previous set, Overcast comes in GIF format (transparent) only. Sticking to this one format and just two sizes allows me to keep the price down (additional formats and icons are of course available by way of custom work).

The sharp edges and greyscale palette intend to separate them from the Stockholm set, while also adding a little more flexibility by appearing in two sizes. Hope you like ‘em.

Comments welcomed for any questions regarding the icons, payment, etc.

29 Comments

Stockholm™ Stock Web Icons for Sale

Posted at 4:40 PM

I’ve just made available a set of 35 stock web icons for sale (through PayPal), dubbed Stockholm™ (stock icons, Cederholm… yikes) . They come in just one size: 16x16. They come in just one format: GIF. But at $45 (USD), they’re an inexpensive way to add a little pixel goodness to your personal or commercial web site or application.

You may recognize many of the icons from this very web site. I had started working on the set some time ago, which in turn inspired a mini-redesign, which in turn inspired me to standardize a full set at 16x16 pixels and make them available for purchase (royalty-free), in response to frequent requests from readers who wished to reuse my icons.

There are of course other destinations for buying fully-featured sets at various sizes and formats — and I’m certainly not looking to get rich off of selling these. Nor will I be focusing entirely on icon design. But creating small icons is fun, and a part of interface design that I’ve always enjoyed and put a lot of effort into. So here’s to trying new things.

I’ve turned comments on for this post, should there be any questions about the icons, purchasing, etc. I expect there to be kinks to work out in the whole process.

51 Comments

I Wouldn't Call it a Redesign

Posted at 10:36 AM

I’ll admit, all this recent redesiging is infectious. More importantly though, it made me realize that the previous SimpleBits design had been up for probably over a year. At the very least, it needed some “freshening up”. And isn’t this what’s fun about the web? The constant flux?

Much of the design and concepts remain the same. So much so that you may be asking “what’s different?”. The inspiration for the subtle update emerged from a set of icons I started working on a while ago.

I toyed with the idea of selling the icons as set — but realized I liked them too much and thought I’d stretch the SimpleBits pixel “brand” a bit further and fold them into the template.

Prefer the old design?

No worries. The old stylesheet is still available as an alternate and can be activated in the dashboard (top right corner). It was also probably a good idea to keep the old theme around, as there are a few examples in the book that reference that design. The markup remains almost untouched, while the CSS methods are essentially identical as well.

Speaking of icons…

The many talents of Josh Williams and co. have released three full stock icon sets over at Icon Buffet - and they’re now on sale. If you dig icons — check out their amazing work.

62 Comments

Scalable Mini Tabs

Posted at 3:08 PM

Previous to this week, the mini tabs that power this site’s navigation used a fixed pixel font-size. It’s been something that has always bothered me (there could be worse things). So, in an effort to try to use relative font sizing as much as possible going forward, I thought I’d revisit the way the tabs were styled.

It only took a little tweaking, and now the navigation scales perfectly if the user bumps up the text size a few notches. I’ve updated the mini tabs example page by adding the relative font-size version for those that are currently using this method — but now would like the text to be scalable. The new method continues to use a single unordered list.

It turned out so well, that I finally went ahead and switched the entire site over to use relative font-sizes (using keywords in this case).

I settled on assigning a base keyword font-size of small on the <body> element, then using percentages for everything below. What was interesting was the differences in say, a value of 85% across all browsers using default settings. Some interpretations would be noticably different — but by experimenting with in-between values like 82%, some browsers appear to “round up” to the nearest 5 or 10 multiple, while others would accept the value. This turned out to be a good thing — tweaking the percentage values to get the text to appear at least similar across the board when viewed with default settings.

It’s impossible (and useless) of course to get it precisely consistent — because that’s not the promise of relative font sizing. Heck, isn’t that what pixels are for? ;-) But it’s nice to think that, if the user wanted to, they could increase the text for the entire page and still absorb the design as intended.

Open for Business

Posted at 11:16 PM

You may or may not remember that I was searching for a job back in February. I’m not searching anymore. Have I found a job? Sort of.

SimpleBits will still be the site it’s always been — but in addition, it’ll now act as the umbrella for my consulting business. After searching for the perfect job for awhile, I came to the realization that I might as well give it a try on my own and see what happens.

I found it interesting that many companies (in the Boston area, anyhow) often farmed out their design/interface work to contractors. Many “web designer” positions have been cut in favor of hiring outside help. Not everywhere of course, but it certainly seemed like a trend.

But I think that’s OK. My hope is that I can work on more of a variety of different projects — and that the variety of stuff I’m working on can reflect more of a variety in the content of this site.

So for those that I’ve told “no, I’m not interesed in contract work right now” in the past — I was lying. Although, it’s funny to end a post about giving self-employment a shot with this: I’m really busy right now. Working on some cool projects that have me occupied at present. But I’m banking that being busy is not always going to be the case — and that’s the reason for this post.

Now We're Floating

Posted at 6:04 PM

Today I’ve made some significant changes to the CSS that powers this site. Significant enough to post about them, primarily to warn that if things look funky on your end, kindly give a refresh and things should pop back into place.

Previously, I was using absolute positioning to control the site’s two columns. Now, I’m using the single float method — floating the content left, while the sidebar takes up the remaining space. This keeps the order of the markup the same way I initially intended — content first, then sidebar.

I’m still using Faux Columns to create the sidebar’s background and fancy siderails. Previously, to make IE6 play nice (its background centering differed by one or two pixels from every other browser… go figure), I was assigning the same tiled background image to both the body and containing wrap elements. IE6 users may have noticed a “shift” while the page loaded. No more. The tiling is now only happening once on the <div id="wrap">.

Using the float method for laying out columns gives me another benefit. I can clear both columns with a full-width footer at the bottom of each page — regardless of the length of either column. Previously, on pages where the content column was shorter than the sidebar, the footer would be appear higher than the bottom of the sidebar’s content. Because we can clear floats, that’s no longer a problem.

Either method has their own pros and cons. Case in point: I ran across some absolutely maddening bugs in IE6 to get this simple, two-column float layout to look proper. Historically, I’ve found absolute positioning to be far easier to grasp and troubleshoot — but the footer issue always bothered me.

So now, we float. And continue to evolve…

Hi-Fi Design With CSS Slides

Posted at 12:54 PM

I had promised a few at SXSW that I would post my slides from the panel. As part of “Hi-Fi Design With CSS”, I talked specifically about the accessible image-tab rollovers that I designed for Fast Company last year.

I thought this would be a nice example of the flexibility that CSS can bring — and that image-based rollovers can be achieved with far less code and zero JavaScript, using CSS and a simple unordered list.

The drawbacks of image replacement were also mentioned — that we’re still searching for the perfect way to handle replacing text with images. But while keeping those drawbacks in mind, this method (as an alternative to table/image/JavaScript options) can work in certain situations.

The slides aren’t terribly exciting without me blabbering on behind them. But I thought it’d be good to post for those who attended the panel, wanting to take a closer look.

Be sure to also check out my fellow panelists’ notes and slides that are posted as well (Bowman, Shea).

11 Comments

Common Sense and Image Lifting

Posted at 7:01 PM

I guess I should check my referrer logs more often. It seems that not only are some sites lifting some of the graphics from this site — but in unbelievably arrogant fashion — some are even linking directly to the images on my server!

What’s hilarious about this is that it is no accident. I could see if someone grabs my CSS file to tinker with it — even publicly. But I link to images with a relative path. Meaning someone has to go out of their way to add my images to their CSS.

It’s bad enough to steal someone’s graphics — but to steal them and the bandwidth it takes to serve them from the victim’s site is just plain ridiculous.

</kneeJerkRant>

For the record and because I get asked now and then, I have no problems at all with people using any and all of the markup and/or CSS from this site. Take it, modify it, make it your own, experiment with it — this is how we all learn. But I draw the line on graphics. I can’t prevent it of course, but for god’s sakes if you’re gonna steal them, put them on your own server. Mmm ‘kay?

I’m certain I’m not the only one that’s run into this problem?

Update: It only took one comment to knock some sense into me. A simple .htaccess dropped into the /images/ directory prevents anyone from referencing your images from any other server but your own. I’ve just implemented this handy tip from Scriptygoddess and it appears to be working like a charm.

25 Comments

2004 Bloggies

Posted at 2:15 PM

Today is your last chance to vote for the 2004 Bloggies. Thanks to all who voted to nominate SimpleBits for “Best-Designed Weblog”. I’m touched. The category is full of fantastically designed sites — so if you haven’t yet voted, go to it!

Comments are Down

Posted at 7:50 AM

I’ve just about had it with comments. This morning I’ve been flooded again (for about the 10th time) with about 100 random spam comments, strewn all over the archives. I’m tired of this.

Commenting is disabled (temporarily) — maybe even until MT has comment registration. Dealing with comment spam is just plain ridiculous. Argh!

Update: Thanks to all for their suggestions in combating the evil comment spam. I’ve installed Jay Allen’s MT-Blacklist plugin for Movable Type. I’ve had pretty good success with it in the past on a few other sites. If anything, it’ll make deleting unwanted comments a heck of a lot easier. Next up is to figure out how to automatically turn off comments on older posts… Comments are back on! Yay.

11 Comments

Bananaphone and New Sidebars

Posted at 2:04 PM

A few days ago I brought a banana with me to work and subsequently forgot that it was in my bag. Later, when I rediscovered it on the way home, I had a funny thought. What if I pretended to talk into the banana like I was on a cell phone while walking through the train station. A real conversation — and something possibly a bit louder than normal, like:

“Yeah… The McDougal file is all sorts of messed up. Smitty from accounting entered some bogus numbers on the DL5 forms… Right… We’re screwed! Listen, I gotta go, I’m about to get on the train…. Right… see you tomorrow.

The key is to make it a legimate conversation without cracking a smile. I didn’t actually try it, of course. I guess you’d have to be there.

New Sidebars

You may have noticed the new color sidebars. Thought I’d add some definition over there. If you liked the minimalism of the old-school sidebar — don’t worry. The third icon under “Switch Theme” will bring you back.

I’m still working out some final kinks, but for the most part things should be normal. I’ve found that longish pre statements cause the sidebar’s background to get stuck in IE6/Win. Longish pre statements seem to cause other problems in general. Maybe I should avoid longish pre statements.

Get ready for the next quiz question, coming soon.