A comprehensive website renewal for PAM
We began our collaboration with the Service Union United (PAM) in June 2022 with the goal of creating a reliable, scalable, and future-proof online service. The new website serves as an essential information hub for workers in the service industry, enhances the visibility of PAM’s advocacy efforts, and encourages visitors to join as members.
Starting points and objectives
The pam.fi online service, is a critical information source for workers in the service industry. The previous website lacked the flexibility and cost-efficiency to effectively meet PAM’s evolving communication needs.
The project aimed to deliver a comprehensive solution including a refreshed design, improved structure, and a modern technical implementation. PAM sought a cost-effective service that would be technically robust and scalable to adapt to changing demands. The goal was to create a long-lasting platform that would support PAM in achieving its objectives now and in the future.
The new website needed to be visually engaging, modern, and distinct from similar online services. Both current and potential members needed to recognize PAM as a representative of their interests. Advocacy work and member benefits had to be presented clearly, ensuring every user could understand the value of the union’s work and the advantages of membership.
A better user and maintenance experience
We organized the content into clear structural data sets and cross-cutting themes. The new online service highlights key areas such as labor market information, collective agreements, member services and benefits, and advocacy work. Collective agreements were fully integrated into the new service. The visibility of member benefits and services was enhanced by embedding them across all site content.
The user experience was improved in multiple ways. Every page was designed to function as a potential landing page. We enabled diverse navigation paths to content, added clear calls-to-action on different pages, and introduced a user-friendly search function. The overall experience is now simple, flexible, and easy to manage for site administrators.
Content types such as articles, events, and member benefits were created as standalone entities. Articles can now be linked to various content pages, and updates to an article automatically reflect wherever it is embedded. For events, we implemented a dedicated event calendar where users can filter events using open text search or categorized filters. Trainings utilize the same content type as events but are imported into WordPress via integration from an external system. Calculators were developed as independent blocks, allowing them to be embedded alongside any other content on the site.
Accessibility at the core of design
Before visual design, we created wireframes — blueprints outlining the site’s content structure and various elements. These wireframes helped visualize not only the structure of the service but also its modularity, demonstrating how the site would be built from custom elements. They provided a clear picture of the site’s framework, content grouping, and overall layout.
Using the wireframes as a foundation, we designed the visual identity of the site, guided by PAM’s new brand and graphic guidelines. The visual design process was carried out in close collaboration with PAM representatives. The layout and appearance were implemented responsively, ensuring the site adapts seamlessly to different screen sizes and devices.
Given that accessibility was defined as a key technical goal, we prioritized it from the start of the design process. The new site meets the WCAG 2.1 AA accessibility standards. During UI design, we ensured multiple navigation options, logical site navigation, and compatibility with screen readers, making the service intuitive and inclusive for all users.
Optimizing performance for better search engine visibility
The PAM website contains a wealth of informational content that serves as a key driver for attracting visitors from search engines.
Search engine optimization and content structuring were therefore essential from the design phase onward. We ensured, for example, that the heading hierarchy was implemented logically and that the URL structure was optimized for SEO. Since a large portion of the site’s traffic is organic, we focused on maintaining strong search engine visibility throughout the renewal. We also provided guidance to PAM’s content creators to ensure SEO best practices were followed.
We took responsibility for the technical aspects of SEO and supported PAM’s team with the planning of redirections. During development, we also incorporated Google’s Core Web Vitals and focused on optimizing site performance. This included improving image formats and compression, enhancing the speed of frontend code, optimizing server performance, caching strategies, and managing third-party code used on the site.
A modular solution for evolving needs
The technical goals for the project included ensuring the long lifecycle of the online service, creating a modular site that could adapt to future needs, and making sure the site’s performance was excellent. Cost-effectiveness was also a key focus.
We developed PAM’s new website using the WordPress content management system, leveraging the Gutenberg editor for seamless and efficient content management. With Gutenberg, content creators can quickly build new pages and easily manage all content. Instead of static templates, we built pages using customizable blocks, allowing for broad changes without requiring the help of developers.
We integrated several systems into PAM’s new online service. The eTaika integration brings training content to the site, while the WoodWing Studio integration adds collective agreements. Custom plugins were developed for these integrations. The user interface for the site’s calculators was built using React, ensuring fast interactions without the need for page reloads.
We thoroughly tested the usability, accessibility and functionalities of the service before the launch. Usability and accessibility played a significant role in the design phase. Design outcomes were regularly peer-reviewed in meetings, making it easy to identify usability challenges and address them right away.
Continuous development and next steps
Our goal is to continuously improve PAM’s online service. In addition to our Care team that handles maintenance and security, a dedicated project team is available to address PAM’s needs and requests. We have already started implementing new requests swiftly following the launch of the website, ensuring ongoing development and adaptation to meet PAM’s evolving needs.
