The Immigration Project is a non-profit organization that provides legal services to immigrants in southern Illinois. I connected with them while working with Catchafire, the organization that matches volunteers with organizations in need of assistance.
At our first meeting, The Immigration Project folks brought these thoughts to the table:
- They thought their WordPress site looked “old”
- It didn’t function properly on cellphones
- They didn’t know the last time that it had been updated technically
- Users, who are typically immigrants seeking services, and who often don’t speak fluent English, had trouble understanding the site:
- Although Google Translate was in use, the buttons to select this option were oddly placed and perhaps difficult to find.
- Google Translate functionality doesn’t lend itself to nuances. Things were, quite literally, getting lost in translation.
I agreed with these initial thoughts, and after I took a closer look, I found some other challenges to address too.
Here’s a look at some parts of the old site. Note the “old-fashioned” look that comes from small images and lots of text. Note also that the information isn’t organized into sections; it is presented more like printed text: arranged in a series of paragraphs that require quite a bit of scrolling. Some elements (like the “Select Language” button) hide other elements.
After assessing their site, I identified these challenges to address:
- Make the site responsive (that is, functional and attractive on all kinds of screens and devices)
- Many users around the world, but particularly those outside the US, rely on cellphones as their only means of internet access.
- Since most of the site’s core users have lived outside of the US, it was therefore likely that a higher proportion of them viewed the site on a phone.
- Therefore, it was imperative to make the site responsive for devices besides desktop computers.
- Increase site speed: it was unacceptably slow by contemporary standards. This is bad for users and SEO alike.
- Provide greater access for users whose English was not fluent
- Make sure that technical pieces related to maintenance and security were in order
- Design/aesthetics: make the site more visually engaging for contemporary users
- Photos were small and dark by today’s standards
- The color palette and overall design were not unified, taking away from a sense of “flow” throughout the site
- Contrast of text and background could be improved to make reading easier, and more accessible for those with disabilities
- The site needed to be easy to maintain. With no dedicated web team on staff at TIP, maintenance and content creation needed to be simple and streamlined, with absolutely no code to edit
- COVID-19 challenges:
- An organized section on COVID-related information and resources was needed, in a prominent place.
- At the time that the lockdown began in March 2020, a professional photographer had been due to come to the office to take head shots of all staff. Because this in-person activity had to be canceled indefinitely, The Immigration Project worried that their new staff would go unrecognized, and that veteran staff would continue to have mismatched photos. This was not in keeping with their desire to present a more professional, unified face to the world.
Under the Hood
Once I began work, I encountered a couple of additional challenges:
Unbeknownst to anyone, as their site grew with posts, pages, and images, it had outgrown their hosting plan which had been in place for many years. When I attempted to backup the site to perform the first steps of the redesign, the backup didn’t work. It appeared that the issue was an overloaded hosting plan that had run out of space and memory. Sure enough, the web host confirmed that their current plan was simply too lean for how much they’d grown.
Then, there were various pauses in the work. COVID was always a dark horse. Also, the 2020 election and subsequent change of administration caused numerous changes to immigration laws. These changes rightfully pulled focus from website updates as staff addressed an avalanche of legal matters. In the meantime, grants were being written and awarded, and a whole new program and building called The Welcoming Center was built! Now, additional services, not just legal, could be offered.
The solution for all these moving parts was multi-pronged and complex:
- Any design solution needed to be responsive. The good news is that this is easy to do, and it would remain a #1 goal.
- Speed was addressed by:
- A new web host, with a more robust hosting plan.
- A clean-up of the database and files. Unused or overly large images were removed from the server. This optimization cleared over 217 MB of space. (If that sounds like a lot – it is!)
- Providing greater access, ease of use, and confidence in the process for multi-lingual users:
- Given that the majority of users would need quality translation in order to use the site properly, I recommending making the site multi-lingual, with a true translation devoted to each page. Now, Spanish and French speakers (the majority of TIP’s clients) can have the same experience on the website as English speakers.
- The site needed to present The Immigration Project as a knowledgeable leader in the field of immigration law, while conveying a reassuring presence to immigrants who may be wary of approaching the legal system
- Various technical pieces were addressed, such as removing outdated plugins, improving SEO, providing accessibility for users with disabilities, and getting the website in compliance with privacy laws.
- The redesign:
- presents a site that is easy to navigate, read, and understand
- Creates opportunities for increased user engagement with:
- The option to choose French or Spanish translation appears right in the menu, at the top of each page
- An emphasis on visuals:
- larger, brighter images
- Bright theme colors in a unified palette that complements the logo
- Organized sections and columns
- Address all issues of accessibility for users with disabilities – from contrast, to size, to behind-the-scenes “alt text.” (Incidentally, these accessibility improvements also improve SEO.)
- Use of personal quotes from previous clients who explain the benefits of working with The Immigration Project
- Increased opportunities to collaborate with The Immigration Project:
- A calendar on each page via the footer notifies users about upcoming events
- A prominent Donate button for those who are in a position to do so
- A Get Involved page, for those who are in a position to do so, displays opportunities to volunteer and collaborate
- Given the lack of coding experience among staff, I felt that the site should be built with a web builder. This has some disadvantages with WordPress (notably, a loss of speed) but it would enable staff to maintain the site’s look and feel, without fears of “breaking” anything. I could also leave them templates for layouts that they wanted to replicate. In this case, I felt it was worth the slight trade-off in speed, especially since I’d already made the site run much faster by trimming the database and files. I chose Elementor.
- I created a COVID section on the home page, which clearly directed users to another page of organized information and resources.
- To creatively solve the dilemma posed by the lack of professional photos, I proposed that each staff member take a selfie of themselves in their own home, which I would then turn into an elegant black-and-white line drawing with Photoshop. Image editing could mask their origin as selfies, create uniform backgrounds, and adjust any lighting, focus or compositional issues.
- These beautiful portraits convey the professionalism of the organization while allowing users to get to know The Immigration Project’s staff and board members. They look so good that you’d never know that this was a Plan B option.
The redesigned site is engaging and clearly communicates the authenticity and sincerity of The Immigration Project, its professionalism and knowledge, and its commitment to the community. The site is also speedier, better suited for search engines, and in compliance with legal requirements for accessibility and privacy.