Building the Website
This piece is part of my month-long project of building brand awareness for a local business, The Blossom Lounge, by creating a new website and making their content more accessible to customers. Feel free to come and follow along on my journey!
This week consisted of mainly working on building The Blossom Lounge’s website. I used the information on their current site and the research I did last week to put together this website.
Last Week
Last week, I made preparations for the month. I planned out my project, made an outline, set up my schedule for the month, and did SEO research. This all built the foundation I needed to do this week’s work.
What I did this week was:
- Build a Home page
- Build an “About” page
- Put together a “Services” page
- Make a “Book Now” page
- Embed a Taskeo form
- Make a “Contact” page
- Add images
- Write copy
- Format pages to be mobile-friendly
- Add internal links
- Write two blog posts
- Film one Loom video
Home Page
Since the Home page is the page with the most traffic and where most visitors start out, I wanted to make sure it looked good and was easy to navigate. I kept the same color scheme as the original site and tried to format it in a way that was easy to scroll through and that emphasized the important information without it being overwhelming.
I added all the useful information about the location of the store, business hours, etc. I also made a few important words and phrases bold to make them stand out from the rest of the page.
“About” Page
This page is where the information about the company and the staff will be. I currently don’t have any information about the company that I can add, but I have put placeholders for pictures of the staff, their names, and their Instagram accounts. I linked their Instagram accounts because that seems to be the social media outlet that they’re the most active on.
“Services” Page
The “Services” page was where I had a little trouble. They offer many services and each one requires some explanation, so it took me a bit of time to figure out how to approach this. I knew adding everything to one page would overwhelm a visitor, so I tried to think of a way to break everything up into consumable chunks.
What I ended up doing was separating the services into three different categories. I wrote a brief description of each category on the “Services” page and linked them to each of their own hidden pages. These hidden pages don’t show on the page tabs at the top of the screen, and users can only access these from the links on the “Services” page.
I also broke down all the services into smaller categories before going into detail about each service that’s offered.
“Book Now” Page & Taskeo
This page is where people can go to make appointments. I embedded a booking form from an outside source called Taskeo. People can easily book an appointment through this form on the “Book Now” page.
Below the form, I also included a brief description and link to the “Services” page. This is just in case a customer was looking to book an appointment but hadn’t looked through the services offered yet.
“Contact” Page
The “Contact” page is where customers can ask any questions or concerns they have. The contact form on this page makes doing this easy and seamless. Additional information about the business is also on this page like their number, email, business hours, and store location.
Images
To first catch the readers’ attention, I added images of past work the business has done. Taking what I learned from the SEO research I did last week, I also added alt text and set the load to “lazy” for every image I added.
Copywriting
To then keep the readers’ attention, I wrote copy that was short and inviting. The purpose of the images was to first draw them in, then for the copy to keep their attention and make them want to click on whatever link I wrote the copy for.
Mobile-Friendly
A huge portion of the population uses mobile devices to do their browsing, which is why making a website mobile-friendly is important. Webflow, the tool I used to make my website, offers a feature that allows you to view your website from different screen sizes. This feature helped me to adjust and move things around according to the screen sizes.
To be completely transparent, this is the part that I had the most trouble with. I realized that changing the formatting sometimes messed things up in another page or screen size. After some frustration, I slowly but surely figured out how to work things out. Webflow’s video tutorials were a big help in this step.
Internal Links
Internal links help with optimization and navigation, and I added them where they made sense. For example, I mentioned adding a link to the “Services” page on the “Book Now” page. How I have the service information set up also uses internal linking. I also linked the “Book Now” page to the footer of every page.
Internal links can help guide the users to another page with the information they want and help them navigate their way through your site.
Blog Posts
I wrote two blog posts this week, one specifically about the website I built, and the second is what you’re currently reading. In the first blog post, I talked a little about the old website before going over the different aspects of the new site.
Video
Since writing about just the Home page took about seven pages, I filmed a short video going over the other pages of the website. I talked about the setup of everything and the thought process behind it.
What I learned
This week I learned how much preparation can pay off and the time that goes into building a website. The prep work I did last week helped me to prioritize and stay on track while the research I did helped me to incorporate optimization tactics.
Mostly, building a site isn’t difficult, but it’s very time consuming. It’s mostly made up of small decisions and edits that are all put together. Like I mentioned earlier, the part I had trouble with the most was making the site mobile-friendly. Watching Webflow tutorials helped me to better understand aspects of their site editor.
What I Would Do Differently
The key thing I would do differently would be how I worked on this project. This week, I kept working on my things for hours on end with no breaks, and by the end, I felt drained. Regardless of the work I got done, at the end of these sessions, I would feel discouraged.
It wouldn’t be until I re-approached the work with fresh eyes the next day that I could progress. Setting realistic expectations for myself is something I’m still working on and am hoping to improve.
Coming Up Next
Next week, I am going to be adding a chatbot and an FAQ page to the website. These two things will help improve the user experience and provide whatever information a customer could want. I am going to film a video going over these additions and write another weekly update.
