A Place For Mom

  • Web

FreshWorks Studio provided high quality nearshoring services and built a brand new Canadian website for a Place for Mom, an iconic Seattle-based senior living referral service.

Project Summary

FreshWorks Studio built a brand new Canadian website for A Place For Mom (APFM), an iconic US-based senior living referral service. The new site integrates reusable components, SEO best practices, improved accessibility features, localization, and internationalization. By creating English and French versions, APFM now has an adaptable site for all Canadians while the new technology stack we used is faster, better performing, modernized, and easier to maintain moving forward. 

Having launched the first version, we are working to further simplify the website designs and layout with the goal of continuously creating a more and more intuitive and seamless user experience. The new stack is intended to be used for a new version of their US site as well as other websites planned for future development that will help APFM firmly establish their international presence.

Build
Adaptive
Based in
Seattle
Enterprise
Sector

"In the very beginning, we went down to Seattle and said "hey, we’re from Canada, and we’re here to make an app for you!""

Rachit Khare

APFM Project Manager

"In the very beginning, we went down to Seattle and said "hey, we’re from Canada, and we’re here to make an app for you!""

Rachit Khare

APFM Project Manager

The Challenge

For 15 years, A Place For Mom has been the leading senior referral service in the United States, operating in all 50 states and drawing over 1.5 million page views each month. A Place For Mom (APFM) recognized a growing need for their services in the Canadian market, acknowledging that their online platforms were becoming outdated in a rapidly evolving online environment. The site itself was functional, providing localized search results and a straightforward lead capture process. However the old legacy code, a retro colour scheme, and a cluttered dashboard just weren’t going to cut it. 

APFM’s online platform needed a facelift (both aesthetically and in the codebase) in order to stay competitive in the Canadian market. First and foremost, the APFM team needed a site that is extremely fast, SEO sensitive, and highly performant both on desktop and mobile.

Who better to build a Canadian site than a Canadian development team?

The Solution

A key requirement was to create a white label solution that can be extended to other APFM websites and applications launched in Canada, the US, and abroad. The end goal was to share the benefits of a modernized code base while allowing the sites to maintain their iconic APFM look and feel. 

Our solution was to create a UI Library of reusable components (such as call-to-action buttons, photo galleries, and input fields) that can be consistently shared among various web applications. The UI Library styles can be manipulated in order to change common style elements (i.e., the primary and secondary colour schemes) to give a particular website or page its own style while maintaining a consistent feel across the family of APFM websites. 

The site that FreshWorks built for us is going to be the template for everything else.

Bernie Ziegler

Director of Quality Assurance, APFM

Performance

Research shows that page speed is critical in attracting and retaining users on your website. The APFM website’s business model is geared towards getting users to provide their contact information so that the Senior Living Advisors can provide them with a service that is tailored to the user’s needs. In order to achieve accurate data handling without compromising speed, we used the ReactJS library and an internally designed Web Accelerator that caches API responses to ensure minimal latency. What does this mean? The site is fast. Really fast.

Furthermore, we consistently ran a set of tools to ensure we identify heavy and render blocking elements that impact page speed in order to enable us to optimize our JavaScript and CSS styles. The application is also built with support for localization of content. This allows the site to cater to both Canadian and American audiences and provides the ability to render content in English or French depending on the visitor’s location which will make the future French-Canadian audience very happy. 

Monitoring and Alerting

Capturing leads is at the heart of APFM’s business model.  By nature, web applications can experience spikes in traffic, issues with throttling and a number of other factors that can lead to users dropping off. With this in mind, it is imperative to always be on the lookout for certain events which may impede user experience or worse, take down the website completely.

New Relic is a service which allows for the configuration of a number of key transactions and subsequent alerting mechanisms. FreshWorks set up a number of events based on certain thresholds being crossed (such as the number of current users on the site) to send out alerts via different channels (email, Slack, etc.). This will instantly notify key personnel of any potential risks on the website. Furthermore, key events are automatically logged in the ELK stack (ElasticSearch, Logstash and Kibana) and can be investigated in instances of lead submission failure. Investigating events allows for the development of more peculiar and comprehensive use cases to continuously improve the quality and performance of the website.

Improved SEO

SEO is perhaps the most critical aspect of the project, as APFM’s (wildly impressive) organic search ranking is to thank for the bulk of their online revenue. In order to reap the performance benefits of the ReactJS library and also allow the site to be discovered by web crawlers, the website had to be Server Side Rendered. FreshWorks employed NextJ to achieve this. Other SEO best practices such as using canonicals and hreflang attributes were implemented to provide the most relevant information for crawlers and yield higher rankings.

Maintaining a website which spans thousands of pages requires a lot of overhead to ensure content and cross-links are up to date. The presence of old or outdated links on a website can have a negative impact on organic search engine rankings. We used tools that would simulate crawlers in order for us to discover any broken links, redirects etc. and then fix these promptly as they were discovered.

Accessibility

Another key requirement was to meet Accessibility requirements for users with visual impairments that require the use of screen readers. We worked closely with APFM’s design team to offer recommendations to improve the accessibility scores while ensuring the best experience for visually impaired users. As a result we implemented the appropriate use of heading tags while structuring the page in HTML to ensure a consistent visual design.

Accessibility

Another key requirement was to meet Accessibility requirements for users with visual impairments that require the use of screen readers. We worked closely with APFM’s design team to offer recommendations to improve the accessibility scores while ensuring the best experience for visually impaired users. As a result we implemented the appropriate use of heading tags while structuring the page in HTML to ensure a consistent visual design.

The Features

The architecture is at an enterprise-level with multiple downstream systems that capture information and integrate with other internal services. It utilizes a number of Content Delivery Networks (CDNs) to serve assets and static content faster. There is a destination page that lists communities within designated areas specified by users through search criteria. The new platform integrates with Google Analytics and allows for localization that will ultimately be extended to countries beyond Canada as the company expands its presence globally.

Performance
Mobile First
Monitoring and Alerting
Improved SEO
Accessibility
Faster page speed, localized search results, internationalization features.
The new application is mobile first and responsive.
Key events will now be logged and investigated using the ELK stack (ElasticSearch, Logstash and Kibana) to ensure better service and continuous improvement.
Implementation of SEO best practices and a site that is Server Side Rendered will result in higher search result rankings.
Additional backend features contribute to higher accessibility scores and therefore higher search rankings.

Technologies Used

The A Place for Mom frontend was built using ReactJS, HTML CSS, and JavaScript, while the backend relies on TypeScript and NodeJS.

View the Website

What's Next

Research shows that page performance is critical in attracting and retaining users on your website. 

As APFM continues to expand their operations and seek growth internationally, endless opportunities lie down the road ahead. 

With the successful launch of the APFM Canadian website completed, the team down in Seattle already has big plans for their next steps in developing new websites for the US and international markets.

What the Client is Saying:

5
Quality
4.5
Schedule
4.5
Cost
4.5

The site that FreshWorks built for us is going to be the template for everything else

"FreshWorks Studio delivered a high-quality and stable app, and they’re currently assisting with the QA process. It’s been a seamless collaboration. The team offers valuable solutions to each challenge, completes tasks on schedule, and shows a strong commitment to the final product’s success."

Bernie Ziegler

Director of Quality Assurance, APFM

Ready to develop your project beyond expectations?