030 – What are the steps to a successful website project?

Episode Transcription

Today’s episode all started based on a question a couple of prospective clients have asked me over the last few weeks, which is this, what is the process for a website redesign project? The truth is that there isn’t one right process. Having said that, I worked in non-profits for over 16 years, handling everything from websites to student information systems, to digital signage, to volunteer, signing kiosks. And I know that your time is limited. You’re busy with all the day-to-day tasks, and it’s hard to find time to really focus and give the proper attention that a website redesign project deserves. After I stopped working in nonprofits, I started Wow Digital Incorporated, and that was five and a half years ago. We’ve completed over 240 projects for non-profits charities, foundations, government, and community related organizations. We’ve nailed down our process. And today I want to walk you through what it is that we do and the order that we do it in so that if you want to take on the project and you have the time, you’ll know a process that works well as we go through this episode, I actually have our project management software open with all the different phases and components.

So I’m going to be walking through this, and I hope that I don’t get too technical for you. If you have any questions, please visit wowdigital.com/030, which is for this episode and leave a comment and we can have some dialogue or send me an email. You can reach me by emailing [email protected]. So the first thing you really need to consider is why is it that you want to redesign your website? Or if you don’t have a website at all, and you’re in a new organization, think about what it is that you want people to find out about your organization. So essentially for the rest of this episode, I’m going to presume that you have a website and you want to redesign it. You want to modernize it. You want to bring it into, you know, the year 2022 and beyond take into consideration some design trends in technology improvements.

A lot of people that are going on mobile, it probably accommodates for at least 30% of the website traffic that you’ve already got. Some organizations are talking about doing mobile first. And that’s an important thing to consider because as more people use their cell phones, more people are going to be browsing the web and looking at your website from their mobile device. So you always want to make sure that you have a great mobile version of your site for people to look at. Really what it comes down to is identifying what it is that is triggering you to want to redesign your website. And this is wrapped in with a research component and every project should really start with this. Ultimately, you want to identify what it is that sets your organization apart from other similar like organizations. You might think that you’re the only one doing what you do, but that’s likely not the case.

It’s important to take a look around, see what other organizations are doing, what their missions are and how you differentiate yourself.

Think about that. And then think about the people that you want to connect with your community. Identify who they are. Think about it in terms of demographics and psychographics. In episode 16 of the Nonprofit Digital Success podcast, I talk about psychographics and why it’s important to use them and leverage that kind of insight to reach donors and supporters. You should think about this in terms of your website as well, and what people are going to be drawn to your website. Why do they care about your organization and really understand the psychology behind what they do and why they do it. Once you’ve sorted out who your community is, who you want to reach out to it’s then time to think about strategy and tactics as well as your content.

So when somebody from your persona, from your avatar comes to your website, what is it that you want them to do? What do you want them to go and look at? How do you want them to engage with your organization? Do you want them to subscribe and sign up? Do you want them to join some kind of petition? Do you want them to donate? Do you want them to become a volunteer? There’s so many different options for so many different user groups that are out there. So identify what the user group is, and then the strategy and tactics for each one of those groups. Then as part of that same idea, think about your content. How are you going to word it? What is it that you’re going to say? What is the tone? What is your style? Being able to identify that type of information is really key to being able to have a successful website that resonates with your audience.

Something else that you want to do is take a look at your website analytics. If you don’t have analytics installed on your site today, get it installed, go to Google, set up a free Google Analytics account and put the code on your website.

So you can start trying to identify what type of content people are looking for on your website. What are the search terms that they’re looking for? How are they getting to your website and being able to identify that will allow you to have the knowledge behind what it is that you need to know in order to make smart decisions with your website, for example, what type of content should you produce moving forward? How are people using your website? What are the popular pages? All that type of information is really good insight to have about your audience.

If you want to take it even one step further, I highly recommend a product called Hotjar it’s at hotjar.com. And what it does is it allows you to take a heat map of the website. So you’ll know what part of the page they’re clicking on and how far down they’re scrolling and what the hot zones are of any particular webpage within your site. Don’t worry, it’s not expensive. They have a free version. If you’re just looking at a couple of pages on your site that you want to analyze. So taking all of that information about who’s using your website, why are they coming? Why do they care about your organization? The pages that they’re going to, how they’re clicking, what they’re clicking on, taking all of that information, wrapping it all up. You’ll have a really clear idea about the different types of ways that you can connect with your audience, through your website. Being empowered with that information you want to go back and think about the strategy and tactics that I discussed earlier.

How is it that you want to engage with your audience? What are new technology enhancements that you can add to your website to create the functionality? Is it a message board? Is it a membership site? Is there something else that needs to be part of your website in terms of technology requirements, to help you get to where you want to be in terms of your strategy and your tactics. Coming from there, you want to think about budgets. If you have time to do it yourself, that’s amazing. It’s really rare that nonprofits have the time within their regular everyday schedule to be able to take on such a big undertaking. If you don’t have the time, like I mentioned, think about your budget. Think about what’s realistic for what you want to achieve the rest of this episode. It doesn’t really matter whether you’re going to go with a vendor or do it yourself.

I’m going to walk through the remaining parts of the project so that you can take this on if you want to. And if you don’t want to, and you want to hire an organization or an agency or a freelancer to do the work, you’ll have a really good idea about the different parts of the project that you should be thinking about. And if your agency that you’re planning on working with, isn’t thinking about it, you should look elsewhere. So right off the bat, you would want to have a project kickoff meeting and you want to bring in all the stakeholders that are involved in the project. It might be other members from other divisions in your organization. You might want to include the foundation or research division in your project planning because you want to bring everybody in. You want to also consider having somebody from your IT team there.

If you have an IT team, it’s highly likely that they would be involved at some point, whether it’s updating domain names, setting up server space or getting you off the ground in terms of setting up an environment for you to work in, to create the redesign. Once you’ve got everybody in the room, you want to start talking about timelines, how fast you want this? Is there a specific deadline in mind? Is there an upcoming 50th anniversary or a hundredth anniversary of your organization? And you want to have a fresh new look for that? Is there a gala that’s coming up and you really want to promote it and have a really great website to showcase the amazing work that your organization does. So you want to build a comprehensive timeline that has all the major milestones of the project. Then you want to have everybody in agreement to have meetings maybe every other week or every week.

You wouldn’t want to go further than every other week because you might need opportunities to get input. You’re going to need opportunities to highlight and showcase and get people’s buy-in on what it is that you’ve been working on. For the meeting I highly recommend that you pick the same day and time whenever you’re scheduling it. So if you want to meet every other week, pick Wednesday morning at say 10 o’clock, and then, you know, every other week you’re going to have that send out a recurring calendar invite so everybody is reminded of it. And then they have it blocked off in their schedule. This isn’t to say that there won’t be communication between you and the other people in the team, in between the meetings. But at this point, you’re going to want to create that cadence that set every week or every other week, so that you’ve got the time set aside.

Once you have a project charter set and everybody is onboard and understands the intent, the purpose and the timelines, you want to start thinking about design and what people like.

Design is a very personal subject and some people really like green, some people really hate green. It’s all relevant to what your organization actually needs.

And it’s important for people and for you to set this idea right from the beginning that they need to take their personal preferences out of it. Having said that what we like to ask our clients to do is to go around online and just, you know, send us a couple of links for websites that they like, how they look, or how they interact or styling of something. So that we have an idea about what it is that draws their attention.

The reason for this is that when it comes down to getting into the design, it’s easier to get buy-in from something that, you know, people will resonate with, than something completely drastic and different than anything they’ve seen before. That’s not to say that something new and fresh won’t work well for your organization or get the buy-in. Next comes a little bit of techie type of work. You need to get a staging server set up where you can create and build and play without effecting your live website. You never want to do a website redesign on a live site until you’re ready to launch it. You also want to include any modules or plug-ins or third-party systems in the mix that you’re going to want to take advantage of. So for example, if your website was going to have its own multimedia video center, what software would you need built in with their website to make that actually work and come to life?

And while that tech stuff is being set up and put together, it could take, you know, just a couple of hours. If you’ve got a team on the ready, ready to do it, you want to also then take a look at your site map. I’ve gone through amazing site map projects, where we would take a website that had eight thousand – nine thousand pages and pair it down. And the way that we did that was a giant whiteboarding session in a boardroom. We took a huge wall and a ton of post-it notes. And prior to the meeting, I wrote down on all the post-it notes, a different section of the website. And I put them in order before the meeting on the wall. And I laid out the navigation that was currently in existence. I then had a second area where I would put what I thought everything should be.

So a proposed site map, and I mapped the current site map to a new site map. And we were able to over the course of three meetings, an hour and a half each, work together as a team with all the stakeholders to identify where everything should go from the about page or annual reports, right through to program sign up, and donations on the new site map from the current one.

Engaging stakeholders in a site mapping process is absolutely critical to the success of your project.

If they are not able to rationalize and understand where content is getting put, then you’re going to have problems down the road. And they’re going to ask you to move things back to where they were. It’s important during this time, when you’re thinking about site mapping to think about the end users perspective, not necessarily how your organization is aligned, your organization might have different silos.

You might have an area for volunteers. You might have an area for HR, an area for programs and services. You might have an area for community events. You want to bring all those people together, have one representative from each of those areas during the site map meeting. So they can understand, put their full and complete thought and wisdom behind it. And ideally, they’ll end up taking back that information to their departments to explain what’s happening and why it’s happening. Once you’ve identified all the pages, you want to go through a content mapping process, and that is taking content and saying, yes, on the homepage, we want to have this, this, this, and this and the rationale for it should all drive back to your personas and your strategy and tactics and what it is that you want people to achieve when they come to your website.

Chances are, is that if you’re going through a website redesign, or obviously if you’re creating a website from scratch, that you’re going to need some new content. It might not be the entire website, but it’s going to definitely be parts of it. If you’re revamping your homepage, there’s going to be areas where you need a new title or do you know, one or two sentences to put in, to fill up the space and explain what’s happening in that area. And this would be a great time to reach out to staff in the organization, volunteers, people that use your services and see if anybody is willing to become part of a beta testers group. And you can leverage this group of people to walk through the site map, meet with them, ask them what they think, find out if they think the way that you’ve organized, the site makes sense to them.

And if they’d be able to find what it is that they’re looking for, once you’ve identified the type of content that you want on the homepage, that’s where you need to start your design. You need to start with the homepage. All other pages in your website will flow from the design that you come up with for the homepage. It’s important to take everybody’s thoughts and opinions into account, whether you agree with them or not, and figure out the best way to create a website design that resonates, works well for your organization, is on brand, has the right look and feel, and is easy for people to use. Once you’ve got approval for the design of the homepage, it’s time to take a look at your site map and the other pages in your website that you want to have a great web design for.

This might be a contact page. It might be a donate page. It might be a programmer services page. It could be about the organization or your mission values, whatever it is that really stands out to you as a really key piece that you want to stand out on the website, then start working on designs for that. And you’ll find that it’s much easier and quicker to output those than it was for the homepage. You’ve already ironed out some of the major details, the fonts, the colors, the sizes of things for the homepage. So it’ll be much quicker at this point. It will be a great opportunity to involve that beta testers group to review the designs, make sure that it makes sense for them. And that it’s easy for them to work with. Going from the designs to development has many different processes that could be involved depending on the platform that you want to use to build your website.

If it’s only going to be one person working on the website, and they’re really great at coding, maybe you want to have just a static HTML site that is easy for them to update and edit. Maybe you want to use a hosted solution like Wix or Squarespace, or you want to do it your own with Joomla, Drupal, or WordPress, deciding on which platform you want to use based on the strategy and tactics and technical requirements that you have is the next step. Really identifying what that is, making sure that your IT team can support it and can get it up and running for you. So you can build it out. How you want is key. You take the designs, you start cutting them up, start creating the graphics as actual graphics, style sheet themes, and getting that working in the site. Once you have that, you want to do some testing at this point.

You want to make sure that for accessibility, there’s enough color contrast ratio in order to meet WCAG AA compliance, you need to have a 4.5:1 color contrast ratio. So that means you can’t have white text on a yellow box. It’s not going to have enough contrast for you. Once you have the templates built in the site, you want to do testing. You want to make sure that it works on mobile, on tablet and desktop devices. You also want to check on different operating systems. So you’re going to want to check with windows computers, with Mac computers, Android tablets, apple tablets, Android and Apple phones, and make sure that it looks good across all of the browsers. Once the templates are good and they’ve been accessibility tested, and you know that everything is spot on.

You want to make a backup of everything you want to make sure that if you ever need to, you’ve got a copy of those files.

Then you start working on putting content into the website. Copying and pasting is quite often one of the easiest ways to get your site up and running quickly. We often find that waiting on content is sometimes one of the things that holds up the project a lot, ensuring that you have media and editorial people within your department or within your team or contracted is really key to driving success. Getting them involved from the start of the project in terms of the navigation, and what things should be called is a really helpful thing to do. Once you have the homepage designed, getting that over to them at that time is a critical idea because they can start working on what all those new bits of content or that are needed to get that going. And you’re not going to end up waiting when the site is built.

Okay? So back to having all the templates created for whatever the platform is, your website is going to be running. The next thing you want to do is look at the extra functionality that you want it to have in your site. If it’s a message board, if it’s member signup, if it’s email system, get it all connected, get that technology in place and working properly and do your testing with it. Get your beta testers to test it. And here’s a little bit of a pro tip. While everybody is testing it. Make sure that you send them a Google Form or a form of some kind that they can fill out to submit their feedback on the website. This will allow you to create a list of items that you need to address. Maybe the fonts look just a little bit too big on a mobile device, and they have to scroll too much to read all the information.

Once you have the content in the website, you want to start accessibility, testing it as well. You want to make sure images have alt tags. The headings are the right headings and the right order, that starts with an H1, then H2, H3, H4, etc, and you’ve got it all set up. That’s not only going to help your website in terms of accessibility. It’s also going to help for search engine optimization. It’s important at this stage that you also get in touch with all the departments at your organization to make sure that they can access the website and review their content. They’re the experts in the work that they do. You might not be so well-versed in all the little intricacies of what’s involved in a volunteer application form, just as an example. Once all the content is in the website, everybody’s tested it.

You’ve accessibility reviewed it. You’ve tested it on devices and you know, everything is ready. And in there, this is when you need your IT team to do some of their magic. It’s time for them to activate the new site and make it go live. You want to make sure when it goes live, that everything still works. You want to make sure that any email functionality still works, that everything that is connected, let’s say to MailChimp or Constant Contact, that that is all still working and flowing properly. If the website is using a content management system, such as WordPress, that users are able to reset their passwords and they’re getting email notifications, it’s also important at this time to make sure that the site is running optimally, that it’s running quick and does what it needs to do without people having to wait for the website to load.

As part of the work that the IT team does for you. It would be really great if they could set up an archive area of your current website, that way, if there was something that you forgot or you need to access, or maybe there’s some old content that you decided, you know what we need to still go back and grab it and put it on the website. You have access to it to be able to do that. And that’s essentially what the entire website project involves. From our end, we have 132 point checklist that we use that is proprietary to us. Whenever we launch a website, we make sure that everything is taken care of right at the end. If you don’t have the time to handle this on your own, it’s important that you find a company that has experience in web design and specifically in non-profits, where they have a proven track record of success. This will provide you with the assurance that you’re working with a reputable company that can help you get your website up to speed with its new design. I hope that you’ve enjoyed today’s episode. And if you have any questions again, please visit wowdigital.com/030 for this episode, leave a comment, get in touch with me and remember, keep staying successful.

I hope you’ve enjoyed this episode and I’m looking forward to having you listen to the next ones that we’ve got coming up. If you’ve enjoyed this episode please leave feedback on iTunes or wherever you listen to this podcast, I’d love to hear your feedback and it would also help others find the show.

Be sure to check out the show notes for the episode, head over to wowdigital.com, click on podcast, and search for this episode number and you’ll find all the links, details, and other information that has been discussed in this episode.

Are there any other topics that you would like to hear about? Just send an email to [email protected]. Thanks for listening to the Non-profit Digital Success Podcast!