Bagels & Beans

Redesigning and building a new WordPress website for Bagels & Beans.

Current website

To start, I conducted a short technical analysis on the current Bagels & Beans website to expose possible issues and get insights in how to improve page loads with the new website.

We also looked at the current website's design to call out flaws and things we felt could be improved. As you can see in the slides below there are multiple issues that can be fixed quite easily such as a navigation menu taking up too much space, inconsistent styling, and faulty code in the footer, which all look very unprofessional.

Building a new website

Since the current website was built on WordPress, we decided to build the new website on WordPress as well. I was able to set this up for my group so everyone could get started on slowly implementing a theme and key features.

The website uses a simple theme that fits the branding for Bagels & Beans. I was responsible for handling the infrastructure of the website and helping out others with building the website where needed, such as fixing the menu or footer. As I had previous experience in building WordPress websites, I wanted to let my teammates take the reigns on learning how to use Elementor to build blocks for the new website, while I assisted them and worked on implementing other things such as SEO and Analytics.

Analytics

I wanted to analyze the Google Analytics dashboard for insights in the current Bagels & Beans website and export useful reports for this project.

Unfortunately, due to access limitations I was only able to ask Bagels & Beans for exports, instead of going through the dashboard myself. I asked for the following exports so that we could analyze these further and figure out appropriate improvements to these metrics:

- Device ratio (mobile vs. desktop)
- Bounce rate
- Average session duration

Bagels & Beans provided these metrics for us and after one of my group mates, Jaqueline, analysed majority of the exported analytics, we were able to come to conclusions like:

- We should focus on the mobile version of the website since 60% of users were mobile users.
- The new website shouldn't have any broken 404 links as these negatively affect the current website.

For the new website, I created a new Google Analytics property and connected it to our WordPress site via the MonsterInsights plugin. Since this website was merely a temporary prototype, no useful data was gathered during the project that could be analyzed.

Because I wasn't able to make my own reports for this projects, I wanted to advise Bagels & Beans on what to use for their analytics going forward, so I conducted some Analytics research

SEO

To improve the SEO of our new website I started by adding the Yoast SEO plugin to our WordPress prototype.

Bagels & Beans - New website - Yoast configuration

After finishing the configuration, Yoast had no other suggestions or issues that they found on our website.

By making sure I completed all of Yoast's recommendations for technical SEO, such as making sure all images had proper titles and alt text, headings are based on important keywords, and paragraphs contain important keywords, I was able to complete the technical side of the SEO for this project by myself.

For off-page SEO, my group mates were able to gather relevant keywords from tools such as Ahrefs. To strengthen these keywords, I conducted keyword research by analysing the Google Search Console results for the current website and looking at Google Maps results using Google Sheets plugins, aswell as looking at Google Search Console data and previously mentioned Ahrefs data.

Keyword research

Handover

For our final advisory report and handover, I wrote the technical migration guide on how Bagels & Beans can implement our prototype into their own environment. I also helped clean up some technical errors in this report when it comes to WordPress plugins and SEO.

Website migration guide

Final advisory report

What went well?

The communication with the stakeholders went well, we regularly asked them how they felt about working with us and they were always positive. We were able to keep them updated on progress and ask for feedback where needed.

The stakeholders let us know throughout the project that they were happy

What could've gone better?

At the third sprint review, Koen, our assessor for this project, gave us the feedback that the structure of the sprint review was lacking a bit and almost felt like a Q&A.

We were able to fix this by preparing a presentation for the next sprint review and making sure we had a structured approach in presenting our progress, aswell as thinking of any relevant questions we might ask the stakeholders beforehand.

As for analytics, I was hoping to learn a bit more about Google Analytics by browsing through a dashboard filled with data and exporting relevant information, but due to access limitations the only dashboard I was able to access was our own prototype's which lacks informative data.

What did I learn?

During this project I learned a lot about how analytics can be used to improve a website from a monetary perspective, by gathering data from different sources and looking at how users behave on a website.

I also learned how to communicate with stakeholders as I was responsible for all communication with the stakeholder, as well as the presentations for the sprint reviews. It helped me develop as a professional.