I’m working with a small non-profit in California on a large web redesign that includes performing user research and developing a content strategy before moving into design. Because of a limited budget, our user research phase only included an online survey and a Google Analytics review of their current site. However, once the user research was underway, we ran into a few issues.
I designed the online survey with mostly closed-ended questions to uncover patterns among responses that differentiated the user groups (e.g. their relationship with the organization, interests, prime motivators, etc). Two hundred individuals completed our online survey, but my analysis revealed that roughly 80% of participants fell into the same user group—leaving relatively little data to identify patterns among the other user groups.
Google Analytics data from the current site was limited as well because of minimal traffic and visitor engagement. I pulled some basic audience data but struggled to recognize many useful trends or themes from users’ online behaviors.
Our user group definitions wouldn’t be backed by solid data which felt too risky to base our content strategy and design decisions on—especially since this was the first user research of any kind the organization had performed. So, to feel more confident in our user groups models, we expanded the user research activities to include:
1. User Group Workshop
We invited staff who regularly engaged with the organization's constituents to a workshop to round-out the user models the project manager and I had created. They spent a morning sharing assumptions about the user groups’ attitudes + beliefs, interest + motivation, experiences, concerns, digital behavior and demographics. Their ideas generated more well-rounded definitions than just the project manager and I could produce as a team of two.
User group workshop I facilitated from Seattle with staff in California
2. Second Online Survey
We needed to attract more diverse participants for our second survey to gather information on more user groups. We asked ally organizations to promote the survey and created targeted Facebook ads to users that fell into our segments. Combining the two surveys, we had 300+ participants and had much more—and better—data to analyze.
The second survey provided more data to identify patterns for user groups
3. User Interviews
Staff conducted interviews with two to three people from the three groups we identified as our primary user groups. The interviews helped us understand participant preferences and attitudes. They provided extremely useful information that helped validate or negate assumptions we’d formed.
After adding these three research activities, we have a solid grasp of our users' needs. We just finished up creating personas and I feel much more confident that they accurately define our users. I'm grateful to have a client that recognized the importance of user research!
The user interviews proved extremely useful for rounding out our personas
A limited budget or timeline for user research can be challenging. As more information is uncovered, unpredictable issues can arise. Having the ability to adjust a timeline and scope of work is important to ensure a web redesign project accurately addresses users’ needs.
Professional Data Analysts is a full-service program evaluation firm dedicated to helping health initiatives succeed with effective data-centric solutions. PDA’s old site was designed in 2007—they needed a responsive site that represented the look of their new logo and branding.
Based on feedback from PDA, I tailored a plan that didn’t delve too deep into user research but was still founded on a user-centered design. Over a six-month process, we developed a content strategy that met the company’s objectives and focused on their users’ needs. We came up with a colorful, approachable site designed to fit PDA's updated brand identity—and that looks good on any size device.
"Carrie spent ample time getting to know us and our needs before jumping in. She was responsive to our needs and expectations, but also able to clearly communicate when she didn't agree with our ideas based on her experience as a web designer. Carrie also has a great eye on design. This was such a wonderful collaboration. We’re all so, so, so happy with the finished website—she did a fantastic job."
—Harlan Luxenberg, CEO
“It was a pleasure working with Carrie to redesign our company website. She guided me through every step of the process, making it fun and easy. Carrie taught me so much about SEO, writing for the web, elements of a strong website, and more. She created a visually appealing, responsive website that we can be proud of. I hope to work with Carrie again on future design projects!”
—Kelly Laurel, Operations Manager
We wanted PDA’s authenticity and approachability to shine on their new site, so I encouraged them to use real photos of their teams in action instead of stock photos. I provided direction and mood boards for their photographer to ensure we ended up with photos for the site that were tasteful and usable. I adhered to the principles of accessible design across the entire site and went with a duotone design on hero images so headings and subheads are legible.
To help prospective clients feel confident in PDA’s work, we designed the consulting service area pages to automatically pull in related staff and work highlights tagged under those service areas. The work highlights are also organized by service areas.
We incorporated both collapsible accordion boxes and flip cards to allow visitors who wanted more information learn more without leaving the page. These features enabled us to provide a lot of information without making the page feel too dense or text heavy. On mobile, the accordion boxes still function the same but the flip cards have all of the information.
As with all sites I build for clients, PDA can easily edit content and add or remove pages on their own. (Having worked much of my career for non-profits, sustainability is important to me. I make sure my clients aren’t dependent on me to maintain beautiful, usable sites.)
Activities + Deliverables
Have a website you need help with?
Peace Coffee is an amazing fair trade, organic coffee roaster based in Minneapolis. Since 2016 I've enjoyed working with them on various content strategy and user experience (ux) design activities to make improvements to their existing site and prepare for a new website in 2019.
By spring of 2018, we’d worked our way through the following ux and content strategy activities:
We learned last summer our web redesign timeline was dramatically shortened when the company decided to move from Salesforce to Netsuite in time for the 2018 holiday season. Our web team needed to design and build a new website on a new platform—Wordpress + Woo Commerce—in just a few months.
The homepage and a sample product page from Peace Coffee's old website
"Carrie kept our team productive and focused during our expedited timeline for the new site. She added huge expertise every step of the way. She is flexible and capable of playing many roles from project manager, content strategist, UX developer and designer, team cheerleader, basically whatever we needed from her she found a way to help us add value to our new website. The results speak for themselves and are a testament to her incredible work ethic and skills!"
—Melanee Meegan, Director of Marketing
Peace's website was built in 2011 on a now-obsolete platform that didn’t offer many of the eCommerce features that are considered standard these days. The design was dated and not as responsive as we would’ve liked.
Because we had to move quickly, I pared down the content strategy and ux design activities to the bare minimum. We swiftly worked our way through the following:
Sketches and wireframe samples - click to enlarge
The new website launched December 1st and is a drastic improvement over the previous site. While not enough time has passed to draw strong conclusions from Analytics, the new site is already outperforming the old site. Here are a few results from the first two months compared to the same period the previous year:
The homepage and a sample product page on Peace's new website - click to enlarge
Not only do I encourage you to peruse their website to check out the new and improved design but you should also order some of their coffee. It's the best!
Have a website you need help with?
I took a look back on the projects and clients I've worked with over the past year. It was a fun exercise to reflect on the types of projects I've worked on and also to think about where I'm heading.
I recently set up a Mailchimp automation for a client to welcome new subscribers to their email list. The onboarding series included multiple emails for several weeks introducing the subscriber to the non-profit’s work. After completing the series, the subscriber would be dropped into list to receive the organization’s regular weekly email campaigns.
Through testing the automation, I learned that Mailchimp doesn’t automatically exclude subscribers in Onboarding Series Automations from receiving regular emails—so a new subscriber in the automation would receive both the onboarding emails and the regular emails.
This makes no sense--why would an organization working to build donor/customer relationships through an onboarding series want the subscriber to receive regular emails, too?
I worked with Mailchimp support trying a handful of potential solutions to exclude subscribers in automations from receiving regular campaigns. They were clunky and left room for error—like their first suggestion to add conditions based on automation activity shown here:
Having to add 2 conditions per automation might be okay if you're only running one Automation Series. But if you have more than one like my client, these conditions become unwieldy and leave a lot of room for error. Furthermore, non-pro accounts are limited to 5 conditions per campaign—so if you have more than two automations going, you wouldn't be able to exclude all subscribers in automation.
I came up with a solution that I tested with their support. It works and there's just one condition that needs to be applied to new campaigns, but it does use up the post-sending list action for your last email.
Based on my conversation with Mailchimp support (see screenshot below), I'm hoping that they'll soon offer an easier way to exclude subscribers in automation.
The end of my Mailchimp support transcript. "Alicia" agrees and is forwarding along the request to make automation exclusions easier :)
Mailchimp Automation Exclusion Solution
Make subscribers a part of a group during automation that’s excluded from regular campaigns. When they’re done with automation, remove them from the list.
Steps to exclude automation emails from new campaigns
Setting up your automation
Making sure that you add subscribers to a group while they're in automation is a necessary step to be able to easily exclude them from new campaigns.
Setting up new campaigns
Whenever you send out a new campaign, you'll need to manually exclude the subscribers in the automation series from your email. To do this, follow these steps:
Mailchimp Testing Fun Fact
When testing a signup form or automation in Mailchimp, constantly having to delete an email address is annoying and it doesn’t always work. Did you know that you can add a + after your email address in Gmail accounts to create a temporary email alias?
Example – if my original email was email@example.com, I could add firstname.lastname@example.org or email@example.com to test my automation multiple times.
Interested in setting up an automation?
Marcy Porus-Gottlieb is an Executive Coach based in Seattle. Last year she decided to update her website with a fresh design and new content to reflect the new direction of her coaching services.
Since launching the new site in October 2017, traffic has surged and visitors are more engaged—unique visitors and pageviews have nearly tripled. Furthermore, search traffic has doubled so Marcy’s site is ranking higher, thus increasing her reach with prospective clients.
"Carrie’s expertise and guidance in creating my new website were invaluable. The combination of her web and design expertise, her business savvy and her cheerful demeanor—made her an absolute delight to work with. I’m enjoying and benefiting from the increased traffic to my site, but take most pleasure in the positive comments I’m receiving, 'your site is not only beautiful but really expresses who you are and what you do.' Carrie has been a marvelous partner and I look forward to engaging her again in the future."
Marcy’s website was outdated—both design- and content-wise. It felt text heavy and lacked clear calls to action. While Marcy is an excellent writer, her writing wasn’t optimized for the web.
When we first met, Marcy was ready to dive straight into design—the fun stuff! I helped Marcy realize that to build a strong website and optimal user experience, we first needed to focus on user research to define and understand her target audience, perform multiple activities to ensure all written content satisfied their needs, and then get to design.
To cut down on project costs, I coached Marcy through some activities that she could do on her own. We created an online survey to get feedback from current clients. A competitive analysis of four websites offered design and content inspiration and guidance for the new site's information architecture. Marcy rewrote most copy that experience multiple rounds of edits and I edited her blog posts to optimize them for web consumption.
I refreshed Marcy’s logo and created a new style guide reflecting the logo’s new font and design. Once the website was ready to launch, I set Marcy up with a Mailchimp account, created templates to easily send emails and taught her how to use the platform. Lastly, I guided Marcy through setting up a Google Business page to improve her search ranking.
Activities + Deliverables
Interested in updating your own website?
I’ve built dozens of websites with Weebly but recently built a website for a client in Squarespace for the first time. I had high expectations (because of Squarespace’s strong branding, I suppose) and it does surpass Weebly in a few areas, but I was surprised to find it didn’t excel in SEO.
Weebly vs Squarespace: SEO Features
While many factors contribute to a site’s search ranking (here are a few) I decided to compare six fundamental factors that are quite platform-dependent—rather than other SEO factors like domain trust, content, backlinks, etc.—especially for folks who don’t know how to do any coding.
Side note: I did a little testing as well with page speed for sites made with both platforms but wasn't able to draw strong enough conclusion to include them here.
Below I take a deeper dive with three SEO factors where the platforms are lagging and present workarounds for their weaknesses.
SEO Factor: Alt text
What is alt text?
Alt text is used to describe images to improve web accessibility (they’re used by screen readers for blind and visually impaired users).
How does alt text help with SEO?
Alt text supports your overall SEO strategy because web crawlers use it to help determine what an image is (since they can’t see it) and the content surrounding the image.
Weebly and alt text
Weebly offers an alt text field for individual images (right click on image > Advanced) and gallery images (click on uploaded image > alt text option appears).
Squarespace and alt text
Squarespace only offers a field truly dedicated to alt text for a “product image.” Their support section lists ways to use other features for alt text but these options don’t always work. For example, Squarespace says the caption field can serve as alt text for single images—but if you actually want to use the caption for the picture, it won’t also work for alt text.
SEO Factor: Heading Tags
What are heading tags?
A heading tag is the HTML code that indicates a heading on a website. A heading can carry various tags, depending on the defaults provided by your website builder platform. H1 holds the most importance in the heading tag hierarchy, followed by H2 and on down to H6.
How do heading tags help with SEO?
Moz’s 2015 search engine ranking factors report found that tags are part of the third most influential factor group in SEO rankings. Just as headings provide structure for your content and make it more digestible for your readers by highlighting important topics, they also help search engines understand what content is on your page. Using an H1 tag tells the search engines what your page is about—your H1 tag should support your SEO strategy.
Squarespace and heading tags
Squarespace offers H1 to H3 tags that a user can change font, size, weight, etc. in the style editor.
Weebly heading tags
Weebly doesn’t offer H1 heading tags—all headings and even blog post titles are H2.
Inspecting the coding of Weebly shows it's "Title" tags only carry a H1 heading tag
There’s this free plugin that enables you to add H1 but it doesn’t carry the font style of the theme and you can’t change the font.
You can also insert an Embed Code field and manually put your <H1></H1> tags around your heading.
Further learning on heading tags
SEO Factor: Meta Description
What is a meta description?
A meta description is the HTML code used to describe a page in search engine results. It’s also the content that social platforms use to describe your page.
How do meta descriptions help with SEO?
Technically meta descriptions don’t contribute to your search engine ranking but they do help make your search results stand out—it’s a way to describe the content on your page and pull users in. A well-written meta description can entice users to select your site over others.
Weebly and meta descriptions
Weebly has a description field for each page. Prior to writing this blog post, I’d assumed the description field worked perfectly well. But upon testing it, I’ve found that Weebly’s page description field actually doesn’t work for search engines (it does however work on social platforms). So in order to have a proper meta description, you should follow step #1 below.
Squarespace and meta descriptions
Squarespace provides a field for meta descriptions but if you’re using a banner image, the description is the field is automatically used as the heading on your banner image.
Image A shows how the meta description pulled in the text from the banner. This meta description doesn’t provide copy or context to make this description stand out on in search engine results. Image B shows the search result after using a workaround that enabled us to have both a banner image and a strong meta description. Confused? Clicking through to the actual page may help.
A work-around exists to get the meta description you want for a page with a banner image on Squarespace. Instead of adding a banner image to your page, add a slideshow to the top of the page and just add one image. A few tips on using this feature:
The above slideshow option doesn't work for a blog posts, however. Blog posts do have excerpt fields that serve as the meta description but most likely you’ll want your excerpt to be longer than 160 characters because it's used for the excerpt on the blog landing page—it’s challenging to have this be useful for both purposes.
This is the excerpt field on Squarespace's blog. You can see how it's likely that you'll want to use more than 160 characters for the excerpt.
One last note on meta descriptions in Squarespace: I read about an alternative option to add HTML code into the header code field under Advanced Page Settings but I tried and it didn't work.
Further learning on meta descriptions
Overall SEO Winner?
After doing this analysis, I don't believe SEO shouldn't be a deciding factor when choosing between the Weebly and Squarespace. Each has its strengths and weaknesses but you can for the most part use the workarounds to fully implement SEO on your site. However, I do believe both platforms drop the ball with meta descriptions. While these technically don't help with a site's rankings, they are extremely important for getting users from a search page to your site.
Do you use these platforms and have better workarounds or a different opinion? If so, I’d love to hear your thoughts!
One way to ensure data is used to inform business decisions is to create reports that non-numbers people can understand, too. Google announced a free version of it's Data Studio in 2016 as a way to turn "data into informative dashboards and reports that are easy to read, easy to share, and fully customizable." I've been meaning to check it out and a recent project to produce e-commerce reports for my client Peace Coffee was a perfect excuse to give it a spin.
Google Data Studio can connect data from its suite of products (i.e. Analytics, Adwords, YouTube, etc.) and it can even import other data provided it's in a Google Sheet (so you could export Facebook data into a Google Sheet to connect it to Data Studio). Here's a full list of the data connections you can use. Below are some pros and cons of Google Data Studio I uncovered.
Google Data Studio pros
Reporting that compares Analytics to Data Studio. Click to enlarge.
Google Data Studio cons
When viewing the report not signed into the Google Data account,
a system error appeared where the conversion rate data was supposed to be.
Google Data Studio tips
Give it a whirl
Despite Data Studio's drawbacks, it's still an incredibly powerful (and free!) tool that has the ability to take your Analytics reporting to a new level. Data Studio is still in beta so I'm hoping the glitches will soon be worked out. I just spent a few hours with it and think there's a ton more that I have yet to discover. I definitely recommend that you play around with it to see what you think.
If you're interested in saving time or getting guidance, I'd love to help you get your reporting dialed in.
I learned that sharing a report can be challenging. Whoever you share your report with has to be logged in and even when they are, the link doesn't send them directly to the report but rather the Google Data Studio report landing page. I found the best work around was to embed the report onto a web page and send them a link to the web page. I find this to be an extreme drawback of the platform.
Forterra is a Seattle-based non-profit organization working in urban and rural land conservation. They had a limited budget to use an external design agency to revamp their two-year-old website. They wanted to ensure they got the most bang for their buck so I helped them determine the scope and direction of the update by learning about their users and assessing the state of their existing digital content.
"Carrie helped us evaluate our website’s issues holistically and make data-driven changes after testing with actual users—something we'd never done before."
—Lucy Shirley, Digital Media Manager, Forterra
While just two years old, Forterra's website had its share of issues. They'd heard complaints from visitors and key stakeholders alike: users struggled to find what they were looking for and the website wasn't meeting internal needs either. Forterra knew the site's bounce rate was higher than average but they didn't know why. They had ideas on possible problem areas but were making a lot of assumptions grounded in personal opinion—not on actual user research.
I collaborated with Forterra's Digital Media Manager to develop a plan that fit their short timeline and limited budget. I worked to cut down the project costs by creating templates and coaching her through some of the activities to do on her own. Through user research across multiple social channels and the website, we identified key audience insights. Through qualitative and quantitative content audits, we identified the "low-hanging fruit"—changes to improve the user experience that could be done in-house to save Forterra money. We conducted a stakeholder workshop that provided useful user insights from different departments and increased buy-in for the redesign. We performed usability testing and card sorting with users to find critical pain points. Once we conducted the following activities, I delivered Forterra with a report with recommendations to guide their web updates with the designers.
Activities + Deliverables
The other day I received a last minute request from Forterra to shoot some photos of the Central District in Seattle. They were closing on a landmark deal with Africatown Community Land Trust to guarantee affordable, subsidized housing in the heart of a quickly gentrifying neighborhood and needed some photos to use online and in future collateral.
I had a few free hours and jumped on my bike to shoot some photos on a gorgeous day. Because it was the middle of a week day, I wasn't able to capture as many people in the photos but I do think they captured the spirit of the neighborhood. Here are a handful of the photos.
See how Forterra used them and read more about their awesome work on their blog!
Click to enlarge