Web Stuff Archives - Page 6 of 6

Icons: web design influencing print

On my way to work yesterday, I noticed three instances where, it seemed to me, that print design is being informed by web design. Specifically, the prominent use of icons. I had my camera and took a few pictures. I’ll post more as I notice them.

Icons are used all over the place on the web. They offer visual references in navigation, content identification and add a little jazz to a page for little bandwidth cost. Sites like Icon Buffet offer people the chance to download free icons and trade with other community users.

Icons from Icon Buffett

So it makes sense, I suppose, that icons are creeping into packaging and branding. Drop shadows, curved corners and sequential numbering make me want to click on the box of this dishwasher soap:

dishwasher soap packaging

I want to click the “links” in the “header” of the box shown below:

Whole grain makes the whole day go better

They work just as well in signage, and this isn’t new of course. A look tells me quickly that I can get coffee, money and snacks here.

Put a tiger in your tank

I went to the web sites for these products and found that the branding there (which looks a little corporate and dated to my eyes) did not reflect the packaging.

I’ve also noticed web like layouts in some magazines. Paper versions of mail-order catalogs are closely coordinated with the web counterparts, and the visual similarities are easy to identify.

I have been looking for a rich text editor that I could drop onto a PHP form and that would not break my XHTML strict mark-up. I downloaded a handful of them, and tried various combinations within custom content management widgets that I’ve put together.

What I noticed is that a lot of them still use the <FONT> tag with various formatting attributes. Or worse – they weren’t free. This became something of a pet project.

I found two worth mentioning:

I like this one, and it made a good start with it. It’s based on the Mozilla Rich Text editing API included with Mozilla 1.3+. I spent some time figuring out how to get a MSSQL recordset into the form field via all the document.write gak, and then had to attend to other things. Some time went by before I could pick this up again.

I then discovered the FCKeditor, and was able to implement it within 20 minutes. I chose a simple format, meaning that I didn’t want to give my CMS users a lot of extraneousness options:

The extra option are mostly *not* accessible, but that’s ok. I don’t need them. The site CSS handles the styling – I want my user to be able to quickly input text and have it show up correctly when published. POW!

I did spend a little time looking how to format text myself, thinking it would be easy to use custom CSS classes, since that’s something I usually have full control over and do consistently – I could build them into the editor. I managed to get the several of the buttons done, and started on the text color picker when it was time to move on once again. I hope to return to it, and when I do, I’ll post the code up here. In the meantime, maybe give FCK a spin.