Web Design and Development
I got interested in web design and development as a means to an end, namely understanding and improving our store's website: grothmusic.com. Like the ecommerce sites of most small and mid-sized companies, grothmusic.com utilizes a third party shopping cart platform. The platform is proprietary, but in turn relies on a variety of other popular frameworks (ASP.NET, Bootstrap), libraries (Jquery), and APIs (Google reCAPTCHA, Analytics, Web Fonts, etc.). It serves its purpose, but its one-size-fits-all design has limitations. As I tried to customize it to the unique needs of our classical sheet music business, I found it to be rigid, complex, bulky, secret, and, perhaps worst of all, slow.
At the start of the pandemic, and with lots of help from a professional devleoper named Martin, I set about improving the look, functionality and speed of our site. We added new code for things like structured data, a better (and free) custom search, surfacing previously hidden data (composer!), and many other small but cumulatively important changes. Over time, with most basic UI issues having been addressed, my work became focused on site speed. I set a goal of meeting Google's Core Web Vitals thresholds, their standards for page load speed, stability, and interactivity. The metric that our site had the most trouble with was Largest Contentful Paint (LCP), the time it takes for the largest element on any given page to become visible to the user. LCP must average under 2.5 seconds. When I first began taking measurements, our LCP was over 6 seconds.
Improving performance turned out to be an exercise in deconstruction, figuring out which aspects of the shopping cart platform were extraneous or redundant (or even nefarious) and then removing or reducing them without breaking anything. The key was reducing the amount of CSS and Javascript being served and optimizing how it is loaded by the browser. Managing image size and delivery was also important. These solutions are straightforward enough, but for me, a musician with no prior coding experience, the learning curve was steep. It entailed learning HTML, CSS, a smattering of Javascript, JQuery and SQL, and the concepts behind ASP.NET MVC and our particular shopping cart platform. I also had to learn the tools of the trade, namely VS Code, source control (Bitbucket), Inkscape for manipulating SVGs, WebPageTest and PageSpeed Insights for analyzing page load, Google Search Console and Analytics, Chrome DevTools, and so on. It took two years, but in March of 2022 our site began passing the Core Web Vitals assessment. With the exception of a few bumps along the way it has passed ever since.
While working on the Groth site, web design and devlopment has become a fun and useful hobby for me. It's a complimentary discipline to playing the clarinet (analog vs. digital, tradition vs. hyper-evolution, collaborative vs. mostly solitary, physical vs. abstract) and there is always more to learn. It also has tangible benefits for our company and our customers.