A blog by the Brick Factory The Brick Factory

E-Commerce 101

So you’ve decided to start selling your products online but you already have a website. You want it to look great, you want to give your users a great experience, and you don’t want to break the bank.

When deciding the best way to integrate ecommerce into your site, you have a few options.
You could:

  1. Purchase an add-on to your current content management system;
  2. Build your store on an ecommerce platform and integrate it with your current site as best you can; or
  3. Take this as an opportunity to rebuild your site, integrating ecommerce at ground level.

Below, we explore some of your options for e-commerce integration. This list is by no means exhaustive, but rather an overview meant to introduce you to the e-commerce landscape.

Add-ons (Plugins, Modules & Extensions)

The Basics:

Add-Ons integrate with the Content Management System  (i.e. WordPress, Joomla, Drupal, etc.) of your current website. Once purchased, they introduce some, often limited, e-commerce functionality. Depending on the CMS, these may be referred to as Plug-ins, Modules, or Extensions. Because the transaction occurs on your existing site, organizations that utilize add-ons are responsible for hosting and security.

Popular add-ons include Cart 66 and WooCommerce for WordPress, Eshop and Joomcommerce for Joomla, and Drupal Commerce for Drupal.

Why you might choose an add-on:

  • You’ve already invested in custom design. Add-ons allow you to work within the design options of your CMS. This often gives an organization the ability to skin the add-on to match the existing design (whereas users of other e-commerce products are usually confined to limited themes).
  • You’re working within a limited budget. Add-ons are often the most affordable ways to integrate ecommerce into your site, but the price discrepancy between an add-on and integrating with a platform could be quite small, so do your research.


Third-Party Platforms

The Basics:

Platforms are software technologies that provide the suite of services needed to set up an online shop.

There are countless platforms available, and most fall into two distinct categories: commercial products and open-source softwares. Commercial products are ideal for small businesses just getting started with ecommerce, especially if your growth plans are limited or unclear. Open-source softwares provide greater flexibility (almost unlimited customization) but absolutely require development skills to successfully implement, making them a good fit for businesses with lofty growth goals, internal development teams, and large, complicated inventories.

Popular platforms include the commercial products offered by Shopify and Magento, an open-source software and community.

The biggest benefit of third-party platforms is functionality. Regardless of whether you choose an open-source or a commercial product, the feature offering is going to be far more robust than that of an add-on.

Why you might choose a third-party platform:

  • You have a very large product catalog. Your inventory might be too unwieldy to manage using an add-on.
  • You want a wide variety of purchase/shipping options.
  • You want worry-free security. The platform is responsible for ensuring secure transactions
  • You are looking for other special features like sorting, inventory, or hosting.

When choosing a platform, consider:

  • Cost: every platform has a unique pricing structure, often dependent upon product number, storage, and features. Carefully compare the pricing to choose what makes the most sense for your organization.
  • Design Options: While some platforms are famous for their themes, some offer more limited options.
  • User Interface: Some platforms are more user-friendly than others.
  • Development complexity: Some platforms are plug-and play, others require a breadth of development knowledge to operate. Make sure you have the skills needed to both setup and manage your store.


Rebuild Your Site

The Basics:

If you envision a seamless ecommerce integration, now could be your opportunity to start with a blank slate. Chances are, if you’re integrating e-commerce, the user journey of your site is about to change dramatically. Redoing the site will give you the opportunity to organically weave shopping into both the UX and the design. This could potentially include the use of add-ons or third-party platforms, or it might involve a custom approach. There are several ways to add ecommerce without redoing the site, but it’s never going to have the same seamlessness in experience and aesthetics as a complete refresh.

Why you may want to consider rebuilding:

  • Your site is outdated – it was designed and developed 2+ years ago.
  • You expect e-commerce to be a priority for your users – they will spend most of their time on the site shopping.
  • You have relatively flexible timeline and budget.

We strongly recommend considering a full rebuild first – it will give you the most options for design and integration, will result in the most polished and user-friendly product, and in many cases will not be dramatically more expensive than utilizing add-ons or platforms to your current site.


Like many aspects of the web development process, the “best” solution will be the one that is the best fit for your budget, goals, timeline, web development skill, business plan, and priorities. Depending on these factors, any of the three options outlined above could be the right choice for you and your organization, so do your research and consult with your web development provider before proceeding.


2015 Webby Award Winners: Going Beyond Consumer Brands

When it comes to noteworthy design and innovative functionality, consumer brands usually get the most recognition. Luckily, The Webby Awards, the leading international award honoring excellence on the Internet, categorizes its web submissions so that nonprofit organizations aren’t competing directly with the Volkswagens and Samsungs of the world.

In choosing winners, the Webby committee judges websites on the following merits: content, structure & navigation, visual design, functionality, interactivity, and overall experience. In 2015, the Webbys honored superior web achievements in over 60 categories.

Here, we examine winners in four categories that go beyond the consumer brand: Education, Nonprofits, Associations, and Activism.

2015 Education Winner


Infoguide: The Sunni-Shia Divide
Council on Foreign Relations

When designing this Infoguide about the Sunni-Shia Divide in the Middle East, the Council on Foreign Relations was faced with a challenge: somber, academic subject matter and a ton of it.

They deployed multiple tactics to divide and present the content, most of which were very successful. The result is a digestible and navigable reading experience.

What We Love:

  • Use of infographics to highlight important information and break up content sections.

  • Interactive Visuals. Upon closer inspection, graphical section breaks include an interactive timeline and map in which the user can customize their exploration of the content.

What We Might Have Done Differently:

  • Fixed top navigation. We found the fixed menu a bit distracting for such a long-form piece, but acknowledge the importance of keeping the dense content navigable. We might suggest a ‘hide on scroll down, show on scroll up’ approach, or making the navigation accessible through a button like on many mobile sites.

Also Noteworthy:

  • The site is built using Angular JS and utilizes tools like Timeline JS for the interactive elements.



2015 Nonprofits Winner


More than a Costume Ebola Campaign landing page
Doctors of the World

There is a growing movement in the web design community toward a clean and simple aesthetic. Not necessarily toward sparseness – although without great care that could easily be the result – but rather the stripping away of information and design elements that could be considered extraneous. This site does just that, leaving the user with a clear, uncluttered journey.

Created as a piece of the integrated More than a Costume campaign, this donation site was built to give potential donors an easy portal through which to donate to Doctors of the World’s efforts to combat the 2014 Ebola Outbreak in West Africa.

What We Love:

  • Clean Design. As mentioned above mentioned, this site is an excellent example of a pared down approach to design.
  • Easy Donation Interface. Donations are powered by Stripe.js – It’s simple, easy to set up, and appears seamless and straightforward when integrated.

What We Might Have Done Differently:

  • Kick the story up a notch. Simple design can let copy and calls to action really sing. As straightforward as the campaign is, we might have provided a bit more explanation and urgency to the narrative. This could have included an introduction to the cause and an appeal to donate.

Also Noteworthy:

  • The site uses Foundation, a very advanced and complex responsive front-end framework, which is a bit surprising due to the simplicity of the content and the one-page layout.


2015 Association Winner


Visit California
California Travel & Tourism Commission

For 2015, the California Travel & Tourism Commission set out to create a digital home for their “Dream Big” brand marketing platform.

Created in Drupal, the site emphasizes beautiful photography and conveys a light, airy feel – an excellent fit for the subject matter. Most noteworthy, perhaps, is the top navigation style. The site was almost certainly designed mobile/tablet first, and the designers made the bold choice of keeping a mobile-style navigation even on the desktop version.

What We Love:

  • Interesting Functionality. The only content featured in the top nav is an interactive California map. Clicking a region unveils background information and clickable content.


  • User Experience on Mobile & Tablet. Designed with these users in mind, the site is suitable and intuitive on smaller devices.


What We Might Have Done Differently:

  • The mobile-style navigation is slightly problematic here. The navigation is both the gateway to the content and the only way for the user to filter what otherwise feels like an infinite scroll of information. It would have been beneficial to customize the navigation for desktop users.

Also Noteworthy:


2015 Activism Winner


Last Days’ End Ivory Funded Terrorism campaign page

When Oscar-Winning director Kathryn Bigelow partnered with WildAid to create a short animated film exposing the connection between elephant poaching and terrorism, they also decided to create an online home for the campaign.

What We Love:

  • It’s all about the art. This site relies heavily on the visual to do the talking. The hero area features clips from the film, and the motif (which manages to strike the very difficult balance of somber, but not depressing) is carried consistently throughout the site.
  • The Story. Kept crisp and persuasive, the copy informs and complements the video.

What We Might Have Done Differently:

  • Organize the Calls to Action. After digesting the information and enjoying the beautiful art, there are a whopping six ways for a user to take action. Presented in a tile format near the bottom of the page, the result is slightly overwhelming. We might have prioritized or focused this section to give the casual user a bit of direction.


Also Noteworthy:

  • No CMS. The site appears to have been created without using a Content Management System. For one-off sites with only a few pages, it’s sometimes easier to do away with the CMS.


Learning from the Best: Key Takeaways

Nonprofit, education, activism, and associations can be tricky subject matter to translate to web. Design, UX, and programming need to be customized to address industry-specific challenges such as long-form content, serious subject matter, potentially limited budget, creative restrictions, and more.

But these challenges also provide ample opportunity for deploying of-the-moment trends to great effect. Here’s some learnings from this batch of Webby winners:

  • Simplicity is good but don’t go overboard. Make sure your content is accessible and your story is being told.
  • Unsurprisingly, excellent artwork will turn heads. But exercising restraint, giving it a branded and uncluttered home in which to shine is just as important.
  • If you have a ton of content, break it up and allow the user to easily filter through it.
  • Interactive tools, from the most simple to the most complex, can be utilized to keep the user engaged and attentive.

With the right strategy, a website in any industry can be beautiful, functional, and intuitive. If your curiosity has been piqued, have a look at the Webby winners in other categories here.


How Using “The Elements of Style” Can Help Your SEO

Stylish websites show up at the top of search results.

When I say stylish, I don’t mean minimalistic websites with a black-and-white color scheme. I’m talking about websites with great, stylish writing. These sites feature a strong, unique writing voice that showcases their organization’s identity and help it stand out to readers and search engines alike.

Search engine optimization (SEO) is important because some studies suggest that organic search can drive more than 50 percent of web traffic. Showing up on the top page of search results is key to getting that traffic to come your way. To do that, you need style.

William Strunk Jr. published the first edition of The Elements of Style, the premier English writing style manual, almost 100 years ago. E.B. White later expanded and modernized the manual, and  the advice is still relevant today. Search engines are looking for some of the same things that readers have been for hundreds of years: clear examples of great content. (Whether search engines’ oh-so-secretive algorithms do a good job of assessing quality is another debate.) But for now, let’s see how writing by the The Elements of Style will get your blog post/web copy/etc. in the good graces of Google.

1)   Active voice

Search engines analyze a variety of things in the 0.33 seconds it takes to display search results, but the most important is what your website is about. The clearest way to convey that is by writing in active voice.

Always make sure that your subject is the one doing the action. For example, you would want the headline on your page to read, “Organization lobbied Congress,” rather than “Congress lobbied by organization.” (Organization is the subject.) The latter might lead the search engine to believe your post is about Congress, rather than the efforts of your organization.

Search engines also assume that the most important keywords in headlines and titles come at the beginning, so writing in active voice will ensure that the subject is at the beginning of the headline.

In general, it’s good practice to do all of your writing, not just the headline, in active voice because it’s easy to understand on the first read and it cuts down the word count.

Which brings us to the next one…

2)   Omit needless words

Strunk and White are huge advocates for concise writing. Not only does it make for a stronger argument; it also makes a strong case for your post in search results. Search engines usually display a snippet, or description, that helps people discern which site has the information they’re looking for. Many of these blurbs are pulled from the meta-description, but sometimes, if a few sentences of the post particularly match the search query, those sentences might be used as the snippet instead. Those descriptions are usually truncated around 150 characters, so omitting needless words will help make the most of that character limit.

Here’s an example of a snippet that didn’t follow The Elements of Style:

Why Printed Books Matter
Jan 16, 2013 – There is no doubt that people love printed books. The question as to whether these books will survive in a world of electronic readers is…

Now, omit the needless words and another complete thought now fits in the blurb.

Why Printed Books Matter
Jan 16, 2013 – Without a doubt, people love printed books. Whether these books will survive in a world of electronic readers is up to the students who…

It might not look that different from the first example, but being able to fit the extra words, particularly “students” gives the audience a better idea of what the argument will be. Perhaps they are a student, so they’ll be more likely to click on this link to find out why they are important to the future of printed books.

3)   Put statements in positive form

People rarely search for things they don’t want.  That’s why you should follow Strunk and White’s advice to only use the word not when you really mean it. “Why Latin is Useless” is a much stronger headline than “Why Latin Is Not Very Useful.” Plus people who are searching for others who feel disillusioned with the ancient language will not be searching for keywords that include “useful” and “Latin”” in the same sentence.

More proof: positive-form keywords are searched for more frequently. According to Google’s keyword planner, “useful” and “uselessness” average about 33,100 searches per month. The keyword “not useful” only averages 320 searches per month.

4)   Do not overwrite

“When writing with a computer, you must guard against wordiness.  The click and flow of a word processor can be seductive, and you may find yourself adding a few unnecessary words or even a whole passage just to experience the pleasure of running your fingers over the keyboard and watching your words appear on the screen.”

White and Strunk perfectly described my guilty pleasure. Make sure your content is focused. Search engines not only look for the search query within the body of your post, but it also looks for keywords that are commonly related to the search query. For example, if you’re writing about e-books, the search engine might also look for words like “e-reader,” “download,” “authors.” Keep that in mind next time you want to take a couple paragraphs to go on a tangent about pineapples. The search engine might get suspicious of the lack of related keywords and rank your page lower.

5)   Write with nouns and verbs

This is a pretty much a theme throughout the entire Elements of Style guide. Be specific. Those adverbs like “really” and “very” don’t add meaning to your sentence. Using too many pronouns can make it confusing as to who’s doing what.

Now, let’s say you’re writing a sentence to link to a video somewhere else on your blog. You may be tempted to write a link that says, “Click here.” Not only is that language bad for usability, it also does nothing for your SEO.

Instead of interrupting the flow and style of your writing with a “click here,” use specific nouns and verbs to indicate where the link really takes you. “Download file,” “Sponsors list,” and “Video of epic snowboarding fail,” are all much more useful links.

People want to know what they’re clicking on, and the more people that click on your links, the better SEO for the video. Those specific anchor tags will also help put more keywords in the blog post and help establish link relevancy, all important factors in SEO.


The Elements of Style was never meant to be a bible of SEO hacks. It provides guidelines for good writing, and that’s the real way to get an audience.

Strunk, William, and E.B. White. The Elements of Style. New York: Penguin, 2005. Print.


Surviving Mobilegeddon: What you need to know about Google’s New Algorithm

A few weeks ago, Google announced a major change to its algorithm that will favor mobile-friendly websites in search results on mobile devices. Maybe you heard the word “mobilegeddon” buzzing around?  Google says this change will make it easier to get “relevant, high quality search results that are optimized for their devices” when searching from a smartphone or tablet.

But what does this all really mean? And how will it actually impact your organization?

All hype aside, here’s what you need to know:

Understanding Mobile-Friendly Design

Simply put, mobile-friendly design aims to ensure that your website can be easily viewed from a mobile device.  This can be achieved through responsive design (website resizes based on the size of your screen) or a mobile specific site (a different template is used based on the device you’re using).

But why does this really matter? The verdict is unanimous; we’re no longer living in a one-screen world and that’s changed the way people use the internet.

Earlier this year, we shared just how big an impact the rise of smartphones and tablets is having on our clients’ web traffic, with around 32% of visitors coming from these devices. And industry trends mirror this statistic. In fact, last week, Google announced that more “Google searches take place on mobile devices than on computers in 10 countries including the US and Japan.”

Are you Mobile-Friendly?

First things first: Is your site mobile friendly?
More importantly, does Google think your site is mobile friendly?

In anticipation of the update, Google provided us with a handy tool that answers just that. Enter your website’s URL and wait for the moment of truth.

If you’re mobile friendly, congrats! Google will factor this into your rank, potentially improving where your site lands in Google search results on mobile devices.

If you’re not mobile friendly, hold back the tears. Google will tell you what’s wrong with your site and offers tips and suggestions for improving it. But before you dive in and make any major changes to your website, it’s important to understand the impact this has on your website traffic and what you can do about it.

Data is your Friend

While, overall, mobile traffic is certainly increasing, every case is unique. Hop on Google Analytics and look at the percentage of visitors who actually come to your site from mobile devices. More importantly, look at the percentage of mobile visitors accessing your site from Google.

Google Analytics will help you determine if a change in your ranking could result in a major loss in traffic for your organization or if it will go unnoticed. For example, one of our clients sees more than 25% of their traffic come from mobile search. For another client, mobile search results in less than 2% of their visitors. What you find can mean the difference between a potential loss of 20 visitors…or 2,000.

Note: Make sure you benchmark your traffic before and after the switch to see the real results. Keep in mind that Google’s rollout of this algorithm has not been instantaneous so it may be another week or two until you have clean data.

Know your Options

So you failed. And you’re expecting a change in your traffic. What can you do?

Mobile Redesign. The most obvious solution to Google’s algorithm change is a mobile redesign of your site. While there are several viable approaches,  we always advocate for a responsive design…and so does Google. While a mobile specific site will still meet Google’s requirements, they are not preferred.

Mobile sites can be easier to implement, but more difficult to manage (requiring maintenance of both desktop and mobile versions). A responsive site simply creates a more seamless experience for the user.  Content can be easily shared across devices, page load times are often faster, and there’s a single URL for all versions, which can all help improve your SEO.  Talk to a web developer and see what’s right for you.

Mobile Optimization. It’s not all about the platform. While having that mobile-friendly design is key, ensuring your content is optimized for mobile can be just as important.

From the technical side, make sure the content you’re adding to the site is playable on all devices. Don’t block CSS, JavaScript and image files, and focus on load speed. For example, content created in Flash won’t load on Apple’s mobile devices. If your visitors can’t use your site on mobile, having a mobile-friendly template is pointless.

Approach your content from a mobile perspective. Some tips to keep in mind:

  • Remember the screen size people will be viewing your site on and how much content will actually be visible at a given time.
  • Use short headlines with easily readable text.
  • Place clear calls to action and important content up top. Assume your visitors won’t scroll all the way to the bottom.
  • Can you touch it? Leave enough space between links where it’s actually usable on a touchscreen device.

Lessons Learned

This algorithm change was inevitable and the right direction for Google, the industry, and most importantly, the end-user.  Take advantage of this change and join the ranks of a mobile-friendly world today.  Your organization and your visitors will thank you.


Struggling with donations? 7 secrets to nonprofit marketing

The biggest misconception about nonprofit marketing is that you need money to make an impact. False. In fact, studies show that today’s Americans are more inclined than ever to look for ways to give. In 2014, the number of online donors increased by 15 percent.

Although Americans like to engage with social-conscious brands and seem to be giving more than ever, many nonprofits struggle with converting support into donations. Seventy-nine percent of consumers say they would donate if given the opportunity, but only 65 percent have actually done so this past year.

Here are seven ways to make sure your organization meets its donation goals this year:

1. Understand your audience

Understanding what motivates potential supporters is crucial to making emotional connections with them, thereby increasing donations.

A recent study by Charity Dynamics and NTEN found that the more individuals feel connected to organizations, the more likely they are to show support in the form of donations, volunteering, event participation and issue advocacy.

Put simply, once you know your audience, you’ll be able to craft donation asks that resonate with them, thus leading to increased financial support. Asking questions similar to the following can help you understand target publics:

  • What type of people care about our organization? Why do they care?
  • How old are people in our target audience? What social media platforms do they use?
  • Where does our target audience get their news? What are their interests?
  • What demographics are missing from our donation list? How can we turn those supporters into donors?

2. Create a plan

Hooking your audience with a compelling message is only the first step toward creating a loyal following. Unfortunately, however, most marketers stop here.

As many as 40 percent of marketers don’t back their messages with a defined content strategy—a plan for improvement based on audience reactions to stories, keywords, headlines, images, videos, infographics and general message organization. Maybe this is why 71 percent of Americans report being confused by the message companies use to talk about their efforts and impacts.

Now more than ever, it is important for websites to be optimized with messages that direct visitors to content that motivates donation, or conversion. Taking a pledge, signing a petition, making a donation, or subscribing to a listserv are all examples of conversions, and all are direct results of  a successful content strategy.

The best way to create a successful content strategy is to experiment with the above content types and adjust your content over time.

3. Implement with simple design.

Design matters. If your visitors have to click more than once to make a donation, you’re making them work too hard. Remember: visitors do not equal dollars. Attracting visitors to your website is only half the battle, the other half is directing their attention to the donation page. Ask yourself: Is it easy to find? Is it compelling? Does it make an emotional connection?

IUCN Red List does a great job of creating a user-friendly donation page with a compelling explanation to supplement the ask. Once a visitor makes the decision to donate, they are taken to a page that is aesthetically pleasing and free from clutter. The bright green “Donate” button contrasts well with the red navigation bar, and the site is optimized for mobile. This website gets an A+ for messaging, aesthetics and and user friendliness. Where’s my wallet?

IUCN donation page


4. Be safe with donors’ money, not sorry.

Although people are becoming more comfortable completing transactions on the internet and via smartphone, donors like to know that you’re taking their money seriously. Requesting a Trust or SSL seal for the bottom of a donation form can do wonders for improving the perceived security of your website.

Integrating online payment systems like PayPal can also boost perceived security of your organization and save donors valuable time and attention. PayPal securely stores customer information so they can skip forms and make contributions with a click of a button.


5. Use levels and explanations

Creating donation levels can be crucial to the success of your campaign strategy, but is a decision that should not be taken lightly. Ask too little and you risk receiving less money than a donor originally anticipated giving; ask too much and you may scare people away.

A good strategy for determining your donation levels is to take a look at your recent donation history. What was your lowest gift last year? What was your highest gift last year?

Consider making the lowest donation level $5-$10 higher than your lowest gift to encourage larger giving. When determining your highest increment, use similar logic. If you rarely see gifts larger than $500 then don’t list $5,000 as your highest level. No matter what you choose, run giving levels for a test period, then stop, evaluate, and adjust accordingly.

SaturdayPlace.org does an excellent job at using donation levels to explain exactly where their donations go. Not only does the website allow you to choose the increment at which to donate, but the donation page also uses infographics and a scroll bar to explain exactly what each contribution will provide for the organization’s end users. Explanations help users visualize their gift coming to life, which makes them feel more connected to the cause, and ultimately, more likely to donate.


6. Reward donors.

People like gifts. Plain and simple. Gifts remind donors of the causes they care about and reinforce the notion that their contributions are appreciated. But appreciation can come in many shapes and sizes.

Too often we see nonprofits spend frivolously on swag thinking it’s the golden ticket to donors’ wallets when they can be saving hundreds of dollars rewarding supporters with free giveaways like e-books, exclusive web content, or even digital thank you letters.

Although traditional, WWF does a great job at rewarding donors. I mean, who doesn’t like free T-shirts and tiger totes?


7. Go mobile!

If you glean anything from this blog post, I hope it’s this: Go mobile! Studies show that responsive design doubles giving on mobile devices.

In addition, each usable email sent during an average nonprofit fundraising campaign nets $12.46 in revenue. This statistic holds a lot of weight when you consider how much mobile email is on the rise. By the end of 2018, worldwide mobile email users are expected to total over 2.2 billion—that’s 80 percent of all email users and more than 30 percent of the world. Woah.

Recent news about Google’s algorithm further backs the decision to go mobile. This week, Google announced its plans to make serious changes to the way it ranks websites. Starting April 21, Google’s algorithm began favoring responsive websites (sites that change format when resized on tablets and smartphones). Put simply, if your site isn’t optimized for mobile devices, you will likely see a hit to your ranking on mobile searches. Time for a redesign? We can help.

Does your site pass the “mobile friendly” test? Use this tool to find out.