butterflysweb.com 5-2015

butterflysweb.com Home page, above the fold
butterflysweb.com Home page
Butterfly’s Web Home page. Visit it live at www.butterflysweb.com

The lovely and talented Héloïse Gerteiny of North Carolina was referred to me in 2008 by my mother, who met her when visiting my sister in Charlotte. Our first collaboration was a website to promote her brick and mortar boutique, Butterfly’s Jewelry and Treasures. Héloïse is fearless and intensely creative, and gave me lots of artistic freedom to experiment on the details of what became the most beautiful site I had done to date. Though she is all the way across the country from me, we had fun working together by remote and found each others ideas very inspiring. As she also worked for Bank of America, in time that endeavor faded and the site eventually went offline, but we remained in contact as friends, touching base from time to time.


In early May of 2015, that changed when she contacted me with her thoughts for a new website, butterflysweb.com. I’m always learning something new about this multi-talented woman, and this time it was that she actually makes yarn as well as creating things with it. Combinations of machine-spun and standard dyes, machine spun with natural dyes, and handspun with either type of dye all keep her busy filling orders for knitters and crochet enthusiasts. She markets the first type, created mostly to match sports team colors, through a shop called Charlotte Yarn. The customers who love those offerings are very different form those who appreciate her hand- or machine-spun yarns colored with natural dyes, many of which she makes herself from plants that yield dye that grow on her farm. Her beautiful colorways are inspiring..the beautiful colors achieved with natural dyes are truly amazing! So this website would be devoted to promoting her naturally-created yarns.

We had used a modified version of her original butterfly logo on Butterfly’s Jewelry and Treasures, and we modified it again for Butterfly’s Web. Once we had established the site’s structure, I created the menu and added her logo to the top navigation menu bar. It was quite small, and Héloïse wondered if it could be displayed with a greater height than the menu bar. A little discussion with the Divi developers at Elegant Themes gave me the information I needed to customize the logo’s size and behavior, which added a subtle movement and dimension to the site and made her very happy.

butterflysweb.com Retracting logo
This image shows the retracting logo, further customized with a drop shadow. I now use this style for most of the sites I create with the Divi theme.












The home page features a slider with more of her beautiful photography and welcomes visitors to the site with a peek at her yarn which leverages the visual interest of a parallax background, along with introductions to the other pages on the site and a contact form. Parallax is a bit challenging to explain without a visual reference, so I ask you to visit Butterfly’s Web to see it in action.

The About section for this site comes in three parts. The first page introduces the artist’s philosophy and how she extends it to her business, along with a little about herself. What makes this page really special is the slider, which includes beautiful photographs and minimalist informational text that illustrate her process of dying yarn with natural dyes. Next is a page devoted to a discussion of natural dyes and their care and handling, with more gorgeous shots illustrating her work and a contact form with a colorful yarn image in the background. Rounding up the About section is a page title Our Commitment. This page, created with a massive parallax effect to accentuate the image of the dog with the Great Spinning Wheel on a background of delicious spring green foliage, introduces her husband “the Zoomaster” and the animal charities they support, which visitors will also support when they purchase her yarn.

Intuitively I felt that Héloïse’s experience in the corporate world, which she was trying to escape with this venture, would serve her well when it came to blogging. Where many artists are reticent to begin, she leaped right in a proved me right! With each post her main blog page becomes more beautiful, with her lovely photography and thoughtful writing making it very worthwhile to follow. Artists, take notice! I cannot overstate how much this helps your site gather “gold stars” with the search engines and keeps visitors coming back for more, as well as giving them timely content they can easily share with their own networks.

Generally all the other links in a navigation menu are information gathering, and the Contact page comes last. Butterfly’s Web is no exception, but there is one external link worth noting, the Boutique link. Héloïse made the choice to sell her work at Etsy.com, and the Boutique link leads visitors there. While I’m always happy to create an ecommerce shop that’s incorporated into one’s website, selling at Etsy can be a smart choice for people whose work will not be buried in the depths of the more popular categories there.

Where the contact page on most sites is visually uninteresting and purely functional, Héloïse’s contact page is especially appealing. I encourage future clients to consider providing me with an image or two so I can dress theirs up as you see below. This will help “nudge” visitors to go ahead and make a connection with you, one of the primary objectives of having a website!
After thoroughly enjoying myself throughout the process and making this valued repeat client happy once again, I completed the site in mid-May, barely over two weeks after getting underway!

butterflysweb.com About page
This screenshot of the butterflysweb.com About page shows the slider we assembled to illustrate Héloïse’s process of hand-dying yarns with natural and wildcrafted dyes.
butterflysweb.com About Natural Dyes page
butterflysweb.com About Natural Dyes page, with illustrations and discussion of the care and handling of yarns colored with natural dyes.
butterflysweb.com Our Commitment page
butterflysweb.com Our Commitment page tells readers about the charities they will support by purchasing beautiful, natural, artisan yarns from Butterfly’s Web.
butterflysweb.com blog
I had a feeling that Héloïse would take to blogging with ease and her own characteristic grace, and her beautiful blog page tells me I was right! Visit to see it live and you will see that it keeps getting better with each new post.
butterflysweb.com Contact page
butterflysweb.com Contact page makes what’s otherwise a boring but necessary feature compelling and beautiful!