Before reading this, you may just want to explore EastonLions.org pages to see how they look and feel. Try desktop or phone, and if you have a tablet, that should work well too. You’re going to like the way it looks 😉
Why the Redesign?
The answer is three-fold:
Simplification: We just had too much to maintain and update. New editors needed less to take on.
Unused pages: Using Google Analytics, we were able to determine what pages people have been visiting over the past few years as well as pages that rarely, if ever, were used. This allowed us to cull the content down to the most useful and eliminate chaff and stale content.
New Tools: In 2020, we upgraded our WordPress to use the Gutenberg drag-and-drop block editor. It was a step up, but too hard to learn for non-technical editors. Site pages & posts had a scrappy sort of look, and the interface was quirky at best.
In November, I purchased Elementor for the Club’s WordPress site. What a difference! It is a professional block editor with tools and an intuitive interface that is light-years ahead of Gutenberg; easy to learn, easy to use. It’s like going from primitive Pete’s tool shed to Norm Abram’s Workshop. Content updates and collaboration with others is efficient through section templates and global widgets. Additionally, responsive pages can be optimized within each platform for desktop, tablet, and mobile phone. This capability makes our site look great on all three!
Lots! But there are three aspects most notably visible:
Menus – Top & Bottom: This has been simplified and a search box added! Where are the drop-downs? They were removed for a better experience on mobile devices. In 2018 site visitors were split 50/50 desktop vs mobile. In 2021 mobile use is at 70% and for the 2021 Holiday Festival we topped 80%. These data are from our Club’s Google Analytics account.
With mobile usage increasing, simplifying menus and optimizing features for both desktop and mobile makes sense, both for the user and our messaging. Elementor let’s us tackle this with ease. Most old sub-menu items were moved to buttons in the top hero section of each page. For our annual events I added a special menu bar to allow jumping between them.
Our Homepage: A homepage needs to convey who we are and what we do. Content, like the call to action (CTA) cards, focus on our core events and club purpose. It should also be simple to updated.
The top Hero section will change most frequently, the rest will remain stable with only minor periodic tweaks needed.
The 7 global CTA cards connect to our annual event and Easton Live pages. Click any to open up the event homepage. The cards are also on the Events listing page. What’s neat is when a card is updated on one page, the other page is automatically updated, thanks to global widgets.
Page consistency: All pages now have a cohesive consistent look. The primary menu pages have a similar structure as do our annual event and Easton Live pages.
Each page uses a divider line with the Lions logo in the top hero section. This is followed by a title, subtitles, dates, and buttons relevant to the content.
Each hero background uses a relevant image for the section that can easily be swapped out and the text on top is updated independent of the image. This simplifies the workflow, allowing independent updates for images and text. No need to create a combine graphic in Canva.com.
Works in Progress
Holiday Festival: I received many positive comments on the Holiday event page. There is a lot going on there. It has many neat features, like the map and links to sections, but we will refine it for next year to make it easier to use and consistent with how the other event pages develop.
Auction and Celebration: We are still working to update content on these event pages. As Gary and Dale feed me info and content, the pages will evolve as things gel. We decided to have two pages for this gala event as the auction and celebration really have different needs. Those should be ready to roll in January! (I hope?)