Why we dumped pretty Shopify – and 2-second mobile speed.

WordPress Mobile Speed

Updated: July 2020


There are no affiliate links on PagePipe.

While we’re not selling jewels, the Shopify aesthetic at Awe grabbed our attention. The UX and speed leave a lot to be desired, but the feeling is good enough to make up for it.

Is it a cliché store design? Yeah. But that may be the expectation. If you get too creative (expressive noise), you won’t make sales (confusion of choices). People can’t find things when convention isn’t followed.

Four sample web pages from Awe ecommerce:

1. above ABOUT PAGE

2. above CATALOG PAGE

3. above HOMEPAGE

4. above PRODUCT PAGE

This site is a common Shopify example. They throw millions of bucks making their services fast loading. But silly designers still slow down Shopify pages with apathy. It could load in under 1 second. Instead, instead it’s 3 seconds. Is that horrible?

It depends upon the audience. If they are a mobile audience – YES. It’s a waste of bandwidth from being careless or apathetic about speed strategy. Speed is the first hurdle to a good user experience. UX is about hospitality.

UX observations of these Shopify pages:

COLOR

Color is the biggest influence of quality and habitat cuing after speed. “Does it feel good to be here?” The large images set an elegant mood with female lifestyle inference. They use white space and solid colors. Elegant themes generally have higher usage of blacks and metallic colors. We could say tan is gold with no reflections and gray is silver with no glint – and that is believable. It has a blackish footer. We’ll judge this site theme as elegant. It looks like their specialty is gold and silver – so that works.

Sliders

Sliders don’t work unless they tell a story. A single non-moving image is better. Is this a picture story? We can’t tell – but we guess not. Mere glamour shots. The slider was “present” and the designers couldn’t resist not filling it. We’ve written about this:

REFERENCE: http://pagepipe.com/what-slider-is-the-fastest-loading/

And this caustic collection in this free PDF format:
http://pagepipe.com/wp-content/uploads/2015/04/sliders.pdf

Some core web UX philosophy: Avoid sliders unless they tell a captioned 3- or 4-panel story. The imagery better be good. No image links. No rollover pause control. This flub disables the story – a negative feature.

Almost always, we’re anti-animation. No moving parts on a web page. Why? Have you ever tried to read a page with a fly walking around on it? Distraction.

That doesn’t mean we haven’t experimented with motion. But the attention trickery is usually a UX failure.

These pages have minimal animation – but no animation is good. It’s often a content-cramming ploy.

HERO IMAGES

Our reference about building big hero images that are fast loading:

REFERENCE: http://pagepipe.com/the-fastest-alternatives-to-heavy-jpeg-images-for-page-speed/

There won’t be a test. So skim them.

LOGO

Logos are overrated. We like the simplistic classic balance of this clever logotype. Clever is usually badness. No icon or symbol wasting space in the header. That’s good.

REFERENCE: http://pagepipe.com/why-changing-your-logo-wont-save-your-web-business/

NAVBAR

We’re not in love with double layer navigation bars. Bad UX. One or the other gets ignored. It’s a trend or a fad. Is it a solution? It shoves everything down the page a little further. Vertical waste is negative. We don’t like the dropdown menus that cover content. Is there no alternative?

IMAGE SWAPS

Do we like the gimmicky photo image swaps on rollover? No. It’s hiding the content. It may be cleaner but it doesn’t promote product understanding. We’d rather have a magnifier show product detail.

POPUP

Do we like the annoying signup popup offer? Nope.

REFERENCE: http://pagepipe.com/faster-and-free-alternative-to-optinmonster-wordpress-plugin/

They’d have better UX with static signup in the footer or embedded in the body content. And faster-loading pages, too.

REFERENCE: http://pagepipe.com/speed-up-mailchimp-for-fastest-loading-wordpress/

CHAT

The coolness feature of the day. Iron boat anchor and it’s live in a few minutes. We tested it. It says Jill will answer but Sharon did (Screener of Incoming Calls?) and she’s a real person. This costs money. She disappeared for 25 minutes when we asked her location and if she worked for Shopify. And she promised to “answer any & all questions.” Disappointment.

But usually chat is fake.

Then Real Jill came online and said she was the only one in the office on the holiday and was swamped. Now that’s the real story. We told her she deserved a raise.

REFERENCE: http://pagepipe.com/dumping-livechat-for-speed/

Is Shopify bulletproof?

No. You can easily overbuild slow sites there, too.


Our lame store-building experience with Shopify. Fast (under 2 seconds) but not good functionality.

Q&A with Kendra Heim, PagePipe Staff

1How hard was it to set up a new account?
Super easy. Enter a valid email address, create a password, answer a couple questions about your business, and finally enter your personal information (physical address, name, phone number.)

2Got any reference on how to set up an account?


3Tell us about the decisions you made when making the store. What was most difficult?
The most difficult part was figuring out how to make the home page a viable storefront, or more accurately a viable catalog page.

4What are the limitations or design constraints with free Shopify?
There are only 8 free themes to choose from. Each has its set parameters and variations. These include menu placement, logo placement, added functions etc. You need to do some looking to decide which fits your specific needs.

For our store, we chose Minimal with the vintage style. You can’t add much design to the page, only pre-designed elements, and this doesn’t work freely on every page. Some pages allow you to add elements, while some do not. This is good and bad. It keeps websites cleaner and better looking if those using the design tools aren’t familiar with design, but it also cripples your ability to design if you do understand how.

You can change colors. But you can’t add any color blocks or change the location of the text, or how the text alignment, etc. You can’t add a photo and change the size or move it around. The design is foolproof but kills a creative mind.

One problem was trying to make the homepage a catalog page. There were ways to add featured products and collections, however, clicking on these would then take you to a product page or another catalog page. It was adding steps. To get around this, we used a simple image and text element with a button and linked this button to an ordering page. While there is one extra page for ordering, it’s better than having multiple added pages.

Another reason this was necessary was to ensure we could use an app for quantity bundle discounts. There are some free apps. They allow you to apply a bundle to only one product before you need to purchase the app. We had 4 products. In order to get discounts on all 4 products, we created one product with 4 variations. This allowed us to use a free discount app. The app we chose was QD because the discount information wasn’t obnoxiously placed on the product page.

What do you hate most about Shopify?
I can’t move anything or add what I want, ie. text and photos.

5If you had it to do over again, what would you do differently?
Find a theme that matched as close to what I wanted first. I wasted time trying to get something to work that probably never would have.

6How much did Shopify tempt you upselling paid features?
I didn’t feel tempted because I didn’t want to buy anything. But, they do cripple you so much that they make purchasing more apps and features appealing. It seems easier than figuring out a workaround.

7What was the hardest limitation to deal with?
The set elements and trying to get their idea of a homepage to work with what we actually wanted as a homepage which was a catalog.

8What helpful tips would you give someone learning Shopify?
Keep it simple.

 

9What were the original goals for the project? Did you achieve them?
Create a storefront using Shopify. The home page needs to be a catalog page. There should be product pages for each product. It should integrate with a WordPress site. I think I did manage the original goals, but we also found out that more had to be done on WordPress than originally thought. Shopify would not let you have product information pages for what we wanted, so Shopify became strictly a store. The WordPress site will need to have the pages for product information and contact information while Shopify manages the store by using a catalog home page, an ordering page, and a cart. The ordering page is similar to the cart, but we can’t get around that.

Our contempt is about fake freebies. Shopify is a bait-and-switch worst-case and best-case an upselling ploy. They deliberately cripple the product so it’s practically useless. This is a common marketing strategy deplored by idealists. Unless it is the idealist’s business that profits from it.

NOTE: Why were we even tempted to examine Shopify when we write about WordPress speed?  It’s a struggle to get 3- to 4-second page loads on shared hosting with WooCommerce. But when “free” is your criteria, Shopify is insufficient in that class.

Conclusion: We scrapped the idea of a hybrid site combining WordPress blog and a Shopify store. To restrictive without shelling out money for extras.

Godspeed-

Steve Teare
performance engineer

 

More Unconventional Speed Tips from PagePipe

Yoast-SEO-button-big-opt

 

If MailChimp messes up delivering your free report, email us and we’ll kick their monkey butt.


 

Other Related Resources

Build with Empathy
GIVE SPEED