It's Launch Time!

by George DeMet

For over a year, we’ve been telling folks everywhere that we think the future of the Web lies in having sites that are responsive to whatever device a visitor is using. Regardless of whether you’re on a desktop, laptop, smartphone, tablet, or other device, the website should fit your screen and deliver a great user experience. For more on why this is so important, check out John Albin Wilkins’ recent post on the topic.

When it came time to redesign our own website, we knew that we needed to practice what we preach. We also wanted a site that better highlighted our capabilities, our team, and our personality as a company.

Launch!

And of course, we wanted to be able to take advantage of the new opportunities offered by Drupal 7 and the Workbench suite of modules, which streamline the process of managing content. (Workbench also had its 1.0 release last week!)

To accomplish all of this in a very short amount of time while working around client projects required a true team effort:

Michael Mesker and Jen Simmons took the lead on designing the new front-end for the site. Michael was primarily responsible for the branding, illustrations, and style guide, while Jen focused on working out the user experience, the layout, and how the site behaves responsively. Additional illustrations were provided by the newest member of the Palantir team, Patrick Grady.

Ken Rickard did the Drupal 6 content migration and set up the base Drupal 7 installation before passing lead engineering duties off to Larry Garfield, who developed the remainder of the site’s technical architecture. Steve Persch also jumped in to provide assistance as needed.

The theming work was done by John Albin Wlikins and Pat Teglia using the latest Drupal 7 release of the Zen base theme, which utilizes Sass (Syntactically Awesome Stylesheets) and CSS3 media queries to deliver stylesheets that adapt on-the-fly based on the user’s screen resolution. I think it’s pretty safe to say that when it comes to Drupal, the latest versions of Zen are at the cutting edge of emerging Web technologies and responsive capabilities.

Content development was done by me, with assistance from Dana DeMet and the rest of the team. Carter Stowell was responsible for coordinating efforts and making sure that team members had time available to work on the project.

We hope you’ll take an opportunity to check out the new site and pardon any dust you might see around as a result of the site-building process. During development, we amassed a pretty long laundry list of cool features and content additions that we’re planning to roll out over the coming months. We see our site as an opportunity to try out new things and keep evolving along with the changing face of the Web.

George DeMet

George is the founder and co-owner of Palantir. He has a BA from Northwestern University and specializes in strategic leadership in user interface, usability and standards compliant development. He has over 17 years of experience in Internet design and development, and is a member of the Drupal Association's advisory board. George provides consultation, project planning, training, and user-side development leadership.

More articles by George >

Comments

Nice job on the layout; I'm very happy to see more sites use a layout that looks great no matter how narrow my browser is (no more side scrolling!).

Just wish you had cleaned up the comment form - it's too Drupally (long). Drop the subject field ;-)

Jeff Geerling —

The "blog" landing page is the most interesting of all of them, I found that unexpected. The rest of the site looks like, well, a website, so that ain't too bad. The "responsive" nature of the site seems to work pretty well, so that is great. Nice work. I really like all the new illustrations.

Kristian Bjornard —

The blog landing page was fun to build. It's actually a single View, using the Views Context display type. That allowed us to break up a single View into several different content panes in Panels and then position them however we want. Hat tip to EclipseGC for reminding me how to do that. :-)

Larry Garfield —

Implementing search functionality is something that wasn't deemed a launch blocker, but is a feature that should be coming soon, at least for the blog section.

George DeMet —

Nice work Guys!
[But you should give John a chance to switch off his SASS debug comments and enable CSS aggregation!]

Alan Burke —

This is all very nice, and I know I'll be cast out among the heathens for this, but why is everybody calling this responsive design? There's nothing responsive about it. A Web server responds, not a design. This is perhaps 'flexible' or 'adaptive' design, but it's not responsive. I'm not clicking a button, or asking for anything. The design is, I suppose "responding" to the client type and client dimensions, but since it is not providing new data (ie, a response) based on this information, it is far more accurate to call this "adaptive" or "flexible" design techniques.

As I said, what a waste of time for me to even write this comment. It seems we can't go a week in tech without the dumbest terms becoming vogue, and "responsive," regardless of its inaccuracy, appears already to have won the day. I wish more CS people were forced to appreciate actual language rather than programming constructs and corporate jargon, wherein terms are used for their ability to garner clients, rather than their accurate reflection of what a product or technique does.

/signed,
Cranky Language Lover

Crank —

I generally think responsive design is great in terms of its dynamism, and in many ways this seems to fix problems inherent in creating specific experiences for each type of mobile device.

However, one question/objection that came up in my mind immediately is "what about load times?"

Here's what I mean: if we are loading desktop-sized pictures but then either hiding or resizing them, and if we're adding extra CSS to deal with different screen sizes, won't that result in a significantly larger page download size as compared to, say, a mobile version that comes ready-made with smaller image files and only the necessary CSS? This might be especially true on slower (e.g. 3G) mobile connections.

I'm curious what people think about this.

Nathan —

After doing some further research, it seems best to use Scott Jehl's "Responsive Images" technique, for which there is a Drupal 7 module. In addition, we could couple this technique with use of the Mobile Tools and Context Modules. For instance, we can show/hide whole blocks based on device context.

So, in some instances, we use Responsive Images to automatically load a down-scaled image that is easier on the mobile bandwidth. And, in other use cases-- let's say, for instance, we want to show an image-based slideshow for desktops and iPads, but a text-based slideshow for all devices under 480px-- we can use Context and Mobile Tools modules to switch entire blocks in and out.

Nathan —