Common Media, Inc.

If you’re interested in capital markets, check out our newest client site, Tabb Forum.

filed under: Clients, Deploying sites, Ruby on Rails, Web development | comments (0) | read more...

It’s kind of a cryptic procedure, but this method really works for debugging the mysterious “SEVERE: Error listenerStart” I’ve been getting when a Spring app fails to load.

filed under: JavaEE, Web development | comments (0) | read more...

We only have our tongue a little bit in cheek when we say if you really want to improve your search engine results, you might want to consider relocating.

By way of example, let’s consider what happens when you search for “web development” near Amherst, MA. Google Maps shows results ordered by proximity to the center of town, and guess which web development company has an office closest to the center of Amherst?

When the Amherst College development offices move on-campus, there will be some closer-to-the-center addresses available, just in case you thought geography was irrelevant in today’s virtual world.

filed under: Business, Web development | comments (0) | read more...

Back in March, our friends at HitFix got some press from BusinessWeek, which listed them among “America’s Most Promising Startups.”

filed under: Web development | comments (0) | read more...

Another area CMI works in is taking complete designs from clients and rendering valid (X)HTML and CSS from the design documents. It feels like a pretty basic service, but it frees designers (who know what looks good) from the requirement of knowing HTML, and lets them create functional and interesting designs without worrying about how they’re going to realize them in markup. From the other direction, letting design proceed in parallel with code development means the developers won’t find themselves with working code and undesigned pages, a situation which (in our experience) usually leads to launching with a rushed and poorly-thought-out design.

We’ve mentioned our work on FlyFi before; the designers, Corey McPherson Nash, recently sent out a press release highlighting their role in the project.

Another project we worked on over the winter recently went live when Running USA launched their new site. Running USA, a trade organization promoting the sport and industry of running, started down the site overhaul road nearly a year ago. We consulted with them over the summer, assisting them in identifying the major issues to be addressed by a new site, drafting the eventual RFP, and advocating implementation of particular technologies. As the project moved forward, we worked with the project managers (a company apparently so busy they don’t have a completed website yet) to turn their wireframes and comps into valid templates.

In both cases, our deliverables don’t look like much in a desktop folder: a few .html files and even fewer .css files. But being able to count on the templates to deliver (and across browsers – thanks, Litmus) isn’t measured in file counts.

filed under: Business, Web development | comments (1) | read more...

There have been some big projects happening in the office over the last few months, which we’ll tell about when they’re public (there should be several emerging over the next few weeks). A smaller one, and I hope she’ll forgive me for describing her site that way, has emerged into the public light: we’ve been doing some Wordpress tweaking for Project Happily Ever After.

PHEA, as we call it in the office (any title that long needs a TLA, even if it’s a FLA) is run by a former colleague of mine from Runner’s World, Alisa Bowman, and it’s Wordpress at the core. Beyond that core, however, PHEA uses several plugins, a custom page configuration, and a very custom theme. Wrangling all those players became our job, with the primary goal of shifting the theme from a three-column layout which left the content column too narrow for embedded video to a two-column layout. The result is easier to read and places the reading focus where it belongs: on Alisa’s columns, not on the sidebar material.

We’d love to claim credit for this, but actually Alisa is that rare and delightful client who knew exactly what she wanted; she just didn’t know how to make it happen. We demonstrated potential changes on a staging installation on one of our servers, and when they were approved, used Subversion to push theme changes out to the live site.

We have a lot of respect for Wordpress as a lightweight publishing system which is easy for non-technical users to pick up, but PHEA demonstrates that for users with a clear idea of their site’s function and the patience to try a few different options, it can also be a powerful tool for creating a rich site which is worlds apart from a cookie-cutter blog.

filed under: Web development | comments (0) | read more...

There’s a hitch in CSS styling of HTML a tags (“anchor” tags). The problem is that a tags are used for two different purposes: to establish a target, or “anchor,” for a link (e.g. <a name="anchorname">Link to this</a>), or to mark a section of text as a hyperlink (e.g. <a href="#anchorname">links to that</a>).

The first use of anchors is rare, nowadays. Every page has a default anchor, named “#“, which is set at the top of the page, and authors rarely set additional ones. They’re most frequently seen on Wikipedia pages, of all places, where subsections of the larger page are all anchored.

The problem comes in styling. What happens is that the text which is wrapped as an anchor gets styled as though it’s a hyperlink, even though without an href= attribute, it won’t work as one. This discourages a lot of webmasters from using anchors. One typical stunt is to not wrap anything at all, to create the anchor as <a name="anchorname" /> or <a name="anchorname></a> (the latter style is how Wikipedia does it). This isn’t available, however, to people using some kind of WYSIWYG editor in a CMS.

The real solution is to properly style a tags, and by “properly” I mean “not the way the default browser styles do it.” That means clearing styles from the a tag, and applying link appearance only to the :link, :hover, :active and :visited pseudo-elements.

Here’s how we did this for a recent project:

• Style default a tags to look just like all other text:

a {
  text-decoration: inherit;
  font-style: inherit;
  color: inherit;
}

• Now define the a:link pseudo-element to look the way you want your hyperlinks to appear. This pseudo-element is often ignored, but it’s the key to not applying link styles to your anchors. (We apply the same style to the :visited pseudo-element.)

a:link, a:visited {
 border:none;
 text-decoration:underline;
 font-style:normal;
 color:black;
}

• Style the other pseudo-elements, because otherwise they won’t show differently from usual text (i.e. if :hover isn’t styled, links will appear to “disappear” when users mouse over them).

a:hover {
 text-decoration: none;
 color: #a3211f;
}

There’s no real trick here: all that’s involved is respecting the full definition of the a tag, and all the states allowed by its pseudo-elements.

filed under: Web development | comments (0) | read more...

The site we spent the later part of December working on is now in public beta. HitFix is not the kind of site Noah and I imagined ourselves working on when we got started; it’s a site about entertainment and popular culture with commentary by industry insiders. But they needed more bodies who knew Rails as they pushed to launch, and their designer knew us from his previous job, so we got a call.

We can’t take credit for any individual aspects of the HitFix site; what we did was work as a team with HitFix’s internal Rails developer, Elliott Blatt, to make the site Beta-ready. This meant taking Photoshop demos and making fully-functional pages from them, working at all levels of the Rails stack. (We’ve been joking that our work on this site was in defiance of Brooks’s Law.)

Elliott has been a thrill to work with, having more experience with Rails than either of us, and we were surprised to find him learning from us almost as much as we were learning from him. What we’ve learned from this site is significant as well; it’s impossible to detail all the small conventions we’ve learned from Elliott, but one big example was learning HAML and its CSS sister, SASS.

It has also been an experiment in decentralized development, as some of the HitFix team is in California, Elliott is in Cambridge, and we’re in Amherst.

We’re still in active development with HitFix, but as I mentioned before, the beta is up, so if you’d like to take a look, you may find it interesting.

filed under: Ruby on Rails, Web development | comments (0) | read more...

We’re a few days late on this one, but no, FlyFi has nothing to do with wireless internet access on commercial airlines. It’s the new name for Emergent Music, LLC’s music discovery service (formerly known as Goombah), which uses collaborative filtering technology to analyze your iTunes library (we’re not kidding) and recommend new tunes.

Common Media was involved in the FlyFi launch through our friends at Corey McPherson Nash, who masterminded the new design. CMN provided us with layered Photoshop files to represent pages in the new design; we used those to render XHTML/CSS files for the Emergent Music, LLC team, who replaced dummy content in our files with links back to data from their application. This is how I worked with the sharp designers at Sinauer Associates, my former employers, and we’re doing similar work for other companies even now. (More on those jobs when they’re public.)

FlyFi takes the Pandora model (starting from a single song and building a stream of related songs) and goes a step beyond by using entire libraries to build their recommendation streams, which they call “Grooves”.

Like us, Emergent Music, LLC has chosen not to hang out in the insular tech-centric communities around Boston or Silicon Valley: they’re based in Brunswick, Maine. (They’re not even the first Web 2.0 company to come out of Maine: LibraryThing is based in Portland. No, not the other Portland, the first one.)

filed under: Web development | comments (2) | read more...

Actually, it’s Legal OnRamp that’s profiled in the December American Lawyer, but BaselineNDA gets a mention as one of the value-added services available through “the ramp.” And there’s more Baseline in the pipeline.

filed under: Business, Web development | comments (0) | read more...