Pemaquid Communications

Pemaquid Communications recently designed and relaunched a Web site for annie|catherine, a dynamic duo that produces designer stationery and related accesories from their studio in the Dana Warp Mill in Westbrook, Maine.

Their products include cards for most important occasions - birthdays, holidays, thank yous and other note cards - as well as calendars, picture frames, wrapping paper and prints of the amazing and colorful paintings of Catherine Breer (she’s the “catherine”).

Working with Catherine and her partner, Annie Darling - graphic artists every bit as talented as our own design team - made for an interesting project. Our challenge was to translate the very clear vision they had for the look of the site into something that would be pixel perfect across all browsers.

That’s why making sure the xHTML and CSS was valid was so important. That’s also why we used a “sIFR” (Flash image replacement) javascript to render the page titles in the specific font requested by the Client.

A custom version of our Pemaquid Commerce content management system for e-commerce allows annie|catherine to easily update product images, prices and descriptions, review and process orders and update other site content including Store Locations, Reps, News and Events. They can also create custom promotional pages.

Finally, we developed an easy-to-use e-newsletter manager that allows a|c to send email promotions at will using a simple yet elegant template Pemaquid designed for them.

If you’re looking for great looking designer stationery or fun holiday cards in advance of the holiday season (Gosh! Is it that time of year already?), you definitely ought to surf on over and have a look.

annie|catherine is graciously offering readers of this blog a 20% discount if they enter the promotional code “adcb” at checkout (good through October 31).

At Pemaquid, we’ve never won any awards for our Web design (we have come close) and we don’t care if we never do.

Often, the criteria for winning a design award and the criteria for making something useful are completely different.

Donald A. Norman, of the Nielsen-Norman group, in his book The Design of Everyday Things illustrates this point wonderfully in telling how two office buildings were designed:

There really were two designs: one in Seattle, with heavy participation by the users, and one in Los Angeles, designed in the conventional manner by architects. Which design do the users prefer? Why the Seattle one, of course. Which one got the award? Why the Los Angeles one, of course.

Aesthetics are important, for sure. But in designing Web sites for our Clients, we’ll pick useful over award-winning every time.

OK, so you’ve decided you want to add a blog to your Web site - a good move since. pound for pound, frequently-updated sites tend to grab higher search engine rankings than their peers who go without. So you download a copy of Wordpress, an open source blog platform that has all the features you’re looking for. Great.

Next, you want your blog to have the same look and feel - theme, if you will - as the rest of your Web site. Your designer cracks open the Wordpress blog in Dreamweaver and gasps at all the PHP code in the templating system. Skilled as she is with HTML, your designer can’t make heads or tails of the CSS or PHP.

Not to worry. Pemaquid has designed Wordpress blogs for a number of Clients. In fact, this blog you’re reading is a Wordpress blog (though an imperfect one - ever heard the one about the cobbler’s children who had no shoes?).

So if you’re looking to add a Wordpress blog (or Typepad blog, or any other flavor), contact us and we’ll get you set up. We’ll do it fast too (48 hour turnaround is doable), if necessary.

If you’re a Web designer, 2007 is the year that Internet Explorer 6 became “the new Netscape 4″. Actually, no, things could never be that bad again, but when you’re designing Web sites using CSS and Web standards, IE6 is the one that now throws up the most humdingers.

A question I often hear from other designers is why, with IE7 and Firefox offering better support for Web standards, aren’t more people upgrading from IE6? (The latest browser statistics show IE6 use falling from about 42% to 36% during the past 8 months.)

The reason has to do with usability and cost-benefit analysis.

While most Web designers wouldn’t dream of using IE6 as their primary browser these days, especially with add-ons like the Web developer toolbar and Firebug available for Firefox, it works just fine for what most people want to do online. Checking email, reading up on sports scores and stock prices, buying shirts from LL Bean and using social network sites like LinkedIn, Flickr, Facebook and MySpace all can be done just fine w/IE6. There’s no compelling reason to switch.

Kevin Hale of Particle Tree has written an interesting article on the subject.

The upshot for Web designers? Remember to focus on usability when working with Clients to design features for an interactive Web site. Think about how customers, employees and other groups will do on your site before investing a lot of development time in creating a cool Web site feature that won’t get used all that much.

And it looks like IE6 will be with us for some time to come.

Eric Meyer, one of the zen masters of CSS coding, has a new product out called CSS Sculptor that makes creating Web standards compliant layouts as easy as pie.

CSS Sculptor integrates w/Dreamweaver, and has templates for more than two dozen of the most common layouts, whether they be fixed-width, liquid, fruit-juicy or nutty-crunchy.

So if you’re a Web designer who’s just coming up the CSS learning curve, you might consider adding CSS Sculptor to your tool kit. Rock on!

Striped backgrounds are a bit like last year’s music now, but this is a handy tool for creating them:
Stripe Generator.

I saw a real “whopper” the other day (pun intended). I called up a Web page, and after a momentary lag as a Flash file loaded, a giant bass jumped onto my screen.

Boy, talk about a “splash page”.

An audio soundtrack of a babbling brook lingered in the background as I browsed the page.

I guess to some Web designer, somewhere, it must have seemed like a good idea at the time.

The owner of the Web site, however, was not amused. The fish had leaped into his eyeballs dozens of times and what started out as a nifty little dash of motion and sound had turned into an annoying intrusion onto the user experience.

Remember the last time you heard a good joke? It was a real belly-shaker when you first heard it, right? Now imagine hearing the same joke, at the same time, every day for an entire month. On the 31st telling, would it still be as fun to hear as it was the first time?

When designing a Web site, creativity is always a good thing, but designers need to make sure that the visual design and the interactivity don’t get in the way of what the site visitor is looking to do. Otherwise, no one will come to swim in your pond.

Web designers are often tempted to try the latest flashy technique. After all, that’s what makes Web design fun. Before you upload that snazzy whizbang, however, think of the impact your flying fish will have on potential visitors… potential customers… and especially your brand.

And as for the proud owner of the Web site w/t/giant jumping bass? He’ll be throwing that one back.

In the last couple of days a great new bookmarklet has hit the streets for Web designers far and wide. It’s called the XRAY.

Like it’s namesake, it gives you an easy way to view the “bones” of a Web site. Turn on the XRAY, click on a page element, and instantly see the CSS associated w/that element. A great time-saver!

Better yet, I’m told it even works in Safari, though I haven’t yet tried that. Firefox is a breeze. Sorry, no IE version at this time.

MaineToday.com launched a new look last Wednesday - kudos to designer Wendy Clark and company! Very Web 2.0-y (gradients…speech bubbles rollovers…fades…signature mid-blue color for link text…)

There’s a lot of information there w/o getting too busy. Five good-sized images rotate through the marquee space and I especially like the calendar layout (”next seven days”) that will take you to that day’s events w/just one click (rollover gives you a speech bubble w/a featured event w/zero clicks).

One thing that threw me for a bit: it’s not obvious where you click to go to the Portland Press Herald or other newspaper sites in their group. For some reason my eye wasn’t immediately drawn to the “Hey, this look is different!” heading and the newspaper logos there (a little banner-blindness?). I finally did notice the links in the footer of the page.

All in all a great look as MaineToday positions itself as more of a social network user experience.

There are a lot of sites out there that are “under construction”. It’s easy to find an entire site that’s under construction, like TaxpayerBillofRights.com, or maybe just a section or a page is in the works. I have a couple of thoughts on this.

First, in terms of usability, I’m not sure it’s a good idea to have a section of your site that’s under construction, especially if it’s in your site’s navigation.

People will click a link expecting to see “T-shirts”, “boats”, “free beer” or “hot sexy singles” - whatever. Instead they’ll see… nothing. You’ll leave people disappointed (especially those seeking the sexy singles). Not a good impression for your site.

It would be better in most cases to either leave out that page/section completely, until it’s ready, or at the very least, put more enticing information about the content that’s coming soon and, ideally, a date when the page will be ready for a return visit. Then at least you can encourage people to come back.

My second thought has to do with search engine optimization. If you are selling products online and have plans for line extension (you sell shirts and will expand to sell pants), you may want to have some sort of page that has some copy optimized for the new product line, to give the search engine spiders something to latch onto and bring the Googlers over to your site even before the line is out, in a form of advance online marketing.

Anything, though is better than “Under Construction”, which simply sends the message that your Web designer hasn’t built a page yet and there’s no telling when it might get done…

Apple has launched Safari 3, the latest version of its Web browser. Probably the most interesting thing about it is that for the first time it is available for Windows.

In terms of Web design, one of the good things about this announcement is that Web designers will now - finally - be able to apply CSS to form elements like input and submit.

Downloading….

We’re excited about some new features we’ve added to Portland Diner, the restaurant guide for Southern Maine. There are expanded listing pages and Google Map links to each restaurant in the system.

Even better, you can now create your own account and then rate restaurants and add your own mini-review.

More features coming soon. In the meantime - Bon Appetit!

When you add features to a Web site (or Swiss Army Knife), does it make it easier to use? Umm, no.

There’s an interesting phenomenon that takes place during the development of any type of product. More and more features are requested and often packed into the product to satisfy customer demand, but when the product is launched, many of those features are never used.

It’s called The Feature Paradox. It’s like the old 80-20 rule: 80 percent of people will use 20 percent of an interactive Web site’s features. But they always seem to want those other features, those bells and whistles - like some insurance policy - in case they’re ever needed.

If you’re responsible for redesigning your company’s Web site, you might want to remember The Feature Paradox and avoid adding functionality that will be used only in edge cases. Focusing on usability - how people in your organization will use your Web site - can help keep you from spending excessive time and money on features that people will rarely use and which in some cases might not even contribute to a project’s ROI.

(Tip of the hat to Typestorming)

Many people in our business talk a lot about the importance of “Web Strategy”. In most cases that means investing in search engine optimization to bring people to your Web site. It’s a sales pitch that’s pretty easy to grasp - if you get more people to your site, in theory you’ll get more sales.

But if your Web site isn’t well designed, all the money spent on Web Strategy will be wasted. You’ll be bringing people over from Google to see… a really-bad-Web-site. People don’t stick around really-bad-Web-sites that are clunky… confusing… hard to use… hijack the Back Button… don’t allow you to bookmark backpages (Flash sites are notorious for this)… Most importantly, people don’t buy stuff from them.

Businesses that invest in search engine optimization but that have a really-bad-Web-site end up like the Boy Who Cried Wolf - they may have the #1 position in Google, but after a while nobody pays attention.

Don’t get me wrong - having a Web Strategy is a great idea - but it’s even more important to make sure you get the Web Design right.

Portland Diner is a restaurant directory we created and we’ve been playing around with it for awhile now. When it was first built, no other local site would let you search for a “Thai place in Yarmouth that has ‘Royal‘ (or something like that)” in the name.

In other words, you might know where the place was and maybe part of its name, but no site would let you track it down.

Portland Diner takes care of that. And it’s a good learning tool for Web-heads; we’ve been letting people kick the design, CSS and programming around - a Portland Web designer’s sandbox, if you will.

We’re planning on adding some additional features, such as the ability for anyone to add a review, and for restaurant owners to add a menu and maybe photos of the dining room. Stay tuned, and in the meantime - Bon Appetit!

Pemaquid has launched a redesigned Web site for the Southern Midcoast Maine Chamber, the chamber of commerce based in Topsham and which represents the towns from Brunswick to Wiscasset.

We loaded it up w/alot of goodies found on no other Chamber of Commerce site in Maine, including:

• An Interactive Regional Map that is a Google Maps Mashup. Want to know where the Sebasco Harbor Resort Golf Course or Popham Beach are located? Check the box and see the Google dart.
• the swfIR (pronounced “swif-fer”) for spiffing up (I guess that’s “swiffing up”) ordinary photos that Chamber staff upload through the site’s content management system. The swfIR adds borders, shading and other effects on the fly but still supports the site’s standards-based design concept. You can see the swfIR in action dressing up the photos on the left side of the home page.
• MyMidcoast - a handy, basic, trip planner that allows people who sign up for an account to collect a list of events, restaurants, lodging establishments and activities for their next visit to Midcoast Maine.
• Microformatting of listings in the Member Directory that allows you to save a business’ contact information as a vcard and import it into a desktop address book application like MS Outlook.

The site also has a custom version of the Pemaquid Content Manager, allowing every one of the Chamber’s 700+ members to log in at any time and update their member listings and post news and events, all moderated by Chamber staff. MidcoastMaine.com also boasts a simple ad server and e-commerce features.

We know lots about real estate agents, lawyers, doctors, butchers, bakers and candelstick makers, but when it comes to Web designers worldwide (let alone Web designers in Maine) there’s not alot of information about who’s doing what. Jeffrey Zeldman and the folks at A List Apart are aiming to change all that with the first annual Web Design Survey.

Tonight I took the survey - yes, on a Friday night, I have no life offline, folks - and if you’re a designer, you should too (um, no, I didn’t mean you should take it on Friday night).

Hopefully, finding out more about Web designers in general is a first step towards doing something that could be considered even more important - developing Best Practices and professional standards for the industry. (Kind of like a Web Standards Project for the people who do design, perhaps?)

In a way, it’s interesting to think that there are licensing procedures or certifications for other professions (like those real estate agents, lawyers and doctors) but none that I can think of for the guy who’s going to design your e-commerce app.

No this is not about hiring a Web Designer for Pemaquid - though that’ll happen soon enough - it’s about how to select the company that’s going to build or redesign your site.

Recently I was reading an article in which the question was whether a potential Client should pick a Web design firm based on how much experience the Web design company had in the Client business’ industry.

I’d wager that that misses the point. When selecting a Web design firm - whether your business is in Portland, Maine or Portland, Oregon - the most important thing is not how much the designer knows about your industry, it’s how much they know about Web design.

There are plenty of firms out there w/marketing expertise in a particular industry, and they even may have built lots of sites, but all the industry savvy in the world will not help them understand the psychology of how people surf a Web site and how to make that site engaging and easy-to-use - a resource for its audiences.

The Eagle Has Landed (sorry, I always wanted to say that…)

If you haven’t already, you might want to join the rapidly-growing group of people who are making the EagleCam, managed by the BioDiversity Research Institute of Gorham, Maine, one of the most popular sites on the Web. So far, viewers have seen romance (eagle-style), battles-against-the-elements (the birds have braved four storms, including an unusually heavy snowfall), suspense (had their eggs survived those storms?) and a surprise plot twist (a chick was born April 11 after biologists had concluded that the birds had failed to keep the eggs warm enough to make it through the cold, harsh spring).

The EagleCam is proving to be Must-See TV. When the eagles returned to their nest about a month ago, the folks at BRI said traffic to the site exploded to 8 million hits in a single day as a result of an Associate Press story on the topic. Traffic died down a bit afterwards, but now that there’s a chick to watch, you can bet there will be another, even bigger spike.

There are a handful of eagle cams out there, but apparently at least Google seems to think BRI’s is important: It’s the #1 search result for “EagleCam”.

In late February BRI asked Pemaquid Communications to redesign the site. The challenge was to get the new look in place before the new addition to the family arrived. How it got done is a case study that could be the subject of a separate post, and the site is still a work in progress, but we got the major features/pages in place.

Future work may include working with National Geographic (provides the live feed) to upgrade the presentation of the live cam object code to bring it in line with Web Standards, placing the rest of the low-traffic back pages into the new look and feel and possibly putting together a photo gallery (BRI has tons of great wildlife photography). And don’t forget the EagleCam Blog (updated by wildlife biologists) and… the LoonCam (inactive right now).

Stay tuned…..

A couple of weeks ago the boys over at Happy Cog released to the wild an updated version of the swfir (pronounced “swif-fer”). For those keeping score, SWFIR stands for “Shockwave Flash Image Replacement”, and it’s an easy way to give the images on your Web site a little zing.

To get it to work, you add the swfir javascript function in the head tag of your page and then a 3-line javascript just before the close-body tag. The script looks for any image on your Web page with a class of “swfir” and replaces it w/a Flash object based on that image.

You can easily adjust the script parameters to give your target image a:

• border
• rounded corners
• shadow
• tilt

…and more. You can see a demo on swfir.com.

What’s more, the swfir was designed to support standards-based design concepts and works on all the major browsers.
This is a great feature for Web designers to add to sites with simple content management systems and that will be used by people with little knowledge of graphic design to upload photos. Instead of posting simple - and sometimes bland - photography, by building the swfir into a dynamic page template designers can easily make these sites look more sophisticated and professional.
Pemaquid is actually building the swfir into a new version of the Pemaquid Content Manager on site we’ll be launching in the next two weeks. Stay tuned for that.