What I Learned At The Filament Group

I've done web development and design for under a year...

I've interned at the Filament Group for under 3 Months...

And this is some of the stuff i've learned since then...


The even the most elegant design fails if the user cannot load it. Load things conditionally! Users pay for everything downloaded, which is typically your entire page. Avoid penalizing users.

Content Strategy is important. Atomizing it to adaptive content can be valuable (look into symphony CMS?).

HTML is the fundamental content structure on the page. Don't use it for something it's not mean't be. Get things right in the first place. Progressive Enhancement can live within web apps.

Don't always use the hot new thing just because you can. You're designing for users, not other developers.

Mobile Devices are the future. Prepare accordingly.

Open Source is cool. So is Hacking.

There are plenty of problems that still need to be solved. Solve them.

_Conventions & _Best Practices

Using "<!-- section -->" at the end of each class / id is a great convention. Learned to encode entities, like above. Also, Data attributes are kewl.

Don't use all of the HTML5 elements for the sake of older browsers.

Documentation is important. There's an elegance in using live code in your documentation, even it's harder to do.

Don't make things Javascript dependant. Use normalizer to serve basic styles to all browsers. Concatinate to minimize HTTP requests! (This site is using Scott's Quick Concat). eCSSential vs. Native vs. a lump Concatination yields different pros and cons. GZIP things!

Learned to what most of the tools in South Street do. jQuery can be unneccesarily heavy sometimes...

Javascript does a lot of things people try and do with serverside code.

Russian Doll Caching is cool. Webkit is meh.

_Responsive Design

Learned there are multiple ways to approach it. Some better than others. It's in its infancy, we're all trying to figure it out now. It's exciting.

There are some big hurdles.

Responsive Images! Picture Element > Perl Script Throw Up. HTML5 specs == A nightmare. Props to you Mat.

Em's and Rems + media queries!

Learned that all mobile devices have their perks/quirks *cough*android*cough*. CSS3 transitions are spotty. As more and more devices emerge, we will have more variations to account for. Make your Responsive Sites as responsibly and as future friendly as possible.

Don't rely on Server Side / UA sniffing. It's gross and not future friendly.

Responsive Advertisements have a longgg way to go.

Responsive Design can be applied on commerical, high profile sites. Google is in favor of RWD.


Web design is a combination of aesthics and functionality. The two can't live without each other.

PNG and Gif compression differs. Set up the design and optimize accordingly.

Design iteratively. Browsers and devices have so many perks, there's no replacement for live tests.

Serve HD and SD icons to their appropriate devices via media queries. Don't serve HD images to all users. Uncool!

UI design still doesn't have a perfect workflow. Especially when serving HD and SD assets with alpha transparency and the ability to finesse. Pixel pushing and finessing needs to happen in order to get things consistant accross multiple devices. It's not easy to preserve this across a workflow.

Typography is just as important if not more important as it is in Print Design. Developers / Web Designers are starting to understand this, which is awesome.


Switched from Coda to Sublime Text 2. Much better with package control, linters, and Zencoding.

Learned basics of Git / GitHub. Learned basic -bash. Learned how to use Git through Terminal without a client.

Things can explode in Git. Learned there are ways to fix explosions. Time machine style.

Did some basic stuff with SASS and COMPASS. It can be nice. Or really mean.

Icons fonts with resolution independance are getting there.

Learned about Jekyll and Jenkins and what they do (as an abstraction). Blogging while maintaining quality comments is a challenge. Cloned the Jekyll repo and considered its use in my personal sites.

Some bugs just take a while to squash. When that happens just ask someone who knows much better then you do.

Good communication and a healthy relationship with clients is very crucial.

_Life Lessons

Just because people have a lot of followers on twitter doesn't mean you should believe what they say. Just because an article in .net or Smashing Magazine is published, doesn't mean it's the authority on the subject. Think for yourself.

Design and Development are constantly evolving in the fast paced technology relm. This leaves room to innovate, as well as gives us new contraints to work within. Embrace both and have fun.

Don't trust e_books.

GIFs can speak louder than words.

The key toss trick.

Always carry a roll of quarters.

The MBTA is... the MBTA.

There are some twitter accounts with daily doses of wisdom. Like this.

Thank you to: Todd Parker, Patty Toland, Mat “Wilto” Marquis, Scott Jehl, Maggie Costello Wachs,
Zach Leatherman, Jeff Lembeck, and Ethan Marcotte.

Filament Group Only Access.
User: 'fg' Password: Mister "_______" (Case Sensitive)

*Proceed to Filament Group Members only Site*