Revitalizing a Marketing Agency's Web Presence: A Successful Web Design and Migration
Case Studies

Revitalizing a Marketing Agency's Web Presence: A Successful Web Design and Migration

By Genesis Aguilar

Introduction

The HubSpot-hosted site migration project I led for a marketing agency involved a complete website redesign, architectural changes, content updates, and URL relocations. The main objective was to replace the outdated design with a modern, user-friendly website that reflected the brand and improved the user experience. Additionally, we aimed to address technical SEO issues for enhanced search engine visibility and performance.

Background

The previous website had limitations, including an outdated design that no longer aligned with the brand and a poorly structured architecture without a clear hierarchy or parent pages. The company also wanted to improve user engagement to increase leads and sales conversions. Thus, a website redesign was necessary to address these issues and meet the company's goals.

Planning and Approach

As the project lead, I developed a detailed action plan and collaborated with a writer for content creation. I organized the project into five stages to ensure progress updates and manage stakeholder expectations effectively.

  1. Site Architecture
  2. Execution
    - Design
    - Development Part I (Webflow)
    -Development Part II (HubSpot)
  3. Configuration and SEO
    - Page Configurations and Settings
    - SEO: Keyword research: On-Page, Technical
  4. Testing and Launch
    - Testing and Quality Assurance
    - Go Live
  5. Post Migration
    - Post-Migration Tasks
    - Ongoing Monitoring

Site Architecture

I collaborated with the CEO and the writer to map out the hierarchy of the site's navigation. Together, we determined which pages would be retained and which ones needed to be removed.

URL Mapping

To aid in the smooth transition, I also developed a comprehensive document that listed the existing URLs alongside their corresponding new navigation links. This URL mapping document would later be used to help determine the right URL redirections for later stages.

Site Architecture

Execution

Design

The execution phase involved designing and developing the website. I started with sketches and wireframes to visualize the layout and structure.

Development Part 1: Webflow

Using Webflow, I implemented the approved wireframe designs and customized a pre-existing template to get a headstart on development. Customizations were made to match the brand's style and follow the approved wireframes. Once the designs were finalized, I exported the files and imported them into HubSpot.

Development Part 2: HubSpot

In the second development phase, I worked in the Designer Manager creating the modules that consisted of the exported code, HuBL (HubSpot markup language), and custom HTML and CSS. I created 20 templates in total in Design Manager.

Configuration and SEO

Page Configurations

I created individual pages in HubSpot Editor setting up metadata, adding content, and images. About 82 new pages were individually created, including the homepage, services, about, team member posts, and more. Each page followed on-page SEO best practices.

SEO

I conducted keyword research to strategically place keywords for high-value pages such as services pages. The website underwent extensive testing to ensure device responsiveness and browser compatibility, which I did manually.

Go Live

Before launching the website, I set 301 URL redirections to the right URL changes to transfer SEO authority. The new pages were published gradually while archiving the old ones for a seamless transition.

Post-Migration

After the migration, I addressed any remaining design inconsistencies, resolved broken links or missing content, conducted additional testing, and monitored website performance using various analytics tools. Page speed tests were performed, and SEO audits were carried out to optimize performance and search visibility.

Challenges

Throughout the project, specific challenges and constraints were encountered. Limited resources and a small project team presented time constraints and competing priorities. Balancing the demands of other projects alongside the site migration project proved to be a significant challenge. However, I kept to the plan and continued to be meticulous about site development, testing, and technical SEO. I avoided speeding through or skipping steps to avoid mistakes.

SEO Considerations

SEO was a key focus throughout this project. I addressed major technical issues, such as page loading speed, lack of anchor text in the HTML, semantic HTML tags, orphan pages, long URL structures, and multiple h1 tags in templates. While developing the code, I ensured that the new templates resolved these issues. I followed a comprehensive on-page SEO checklist, including metadata setup, alt tags, keyword research and placement, and image lazy loading.

To manage the URL changes during the site launch, I implemented 301 redirects for all pages that relocated. Although I anticipated a potential decrease in traffic due to URL changes, I mitigated the impact by optimizing and maintaining the blog post URLs. As a result, the website experienced an increase in organic traffic after the launch. The overall health of the website's SEO improved, leading to higher rankings for certain keywords. The majority of the increased traffic was directed to the blog content, while other pages and newer content went through a transitional period before normalizing by the end of Q1 2023.

DataSource: SEMRush

Conclusion

The new website has successfully achieved its objectives, offering an aesthetically pleasing design, improved navigation, and faster performance. The site architecture has been revamped, providing a clear hierarchy and easy navigation. Landing page experiences are smooth, and the engaging content resonates with the audience.

Search engine rankings have improved as more pages gain authority, and the expected dip in traffic during the migration was minimal, thanks to the SEO strategies implemented beforehand. The positive reaction from the team has further boosted the website's visibility through social media sharing and commenting.

Feedback from Client

"You did a fantastic job, Genesis! We love the new site!"
CEO

"Great job, Genesis! You captured the essence of our company!"
VP of Business Development

"Love working with you Genesis Aguilar - you did an amazing job bringing our vision to life!"
Team Member