Our Ambition: Design, Speed, Security
WebWhim provides web and graphic design services to SME companies located around Cambridge. We work hard to ensure that the new websites we build are beautiful, fast, and secure.
In 2004, when we completed our first web design project, we only used bespoke hand-coding (HTML, CSS, JavaScript) to mark up and automate our websites. Since then, web design trends, standards, and requirements changed tremendously. With it, clients’ requirements grew. Nowadays, clients want to equip a new website with all fancy and essential functionalities such as eCommerce, animations, and interactivity features. As a result, the web designer needs to have the skills and knowledge of a whole team of designers and developers – the task for superhumans. Alternatively, a web designer can master all tips and tricks of advanced Content Management Systems such as WordPress, SquareSpace, or Wix.
Many tools can be used to build a website, and especially an eCommerce website. We discuss below the techniques and resources used to balance bespoke web design customisation options with achievable speed and security and how their choice of tools affects the webpage performance.
Bespoke hand-coding
Until the era of user-friendly CMSs, most web design companies, including WebWhim, hand-coded websites using simple HTML editors. Nowadays, frontend developers need to be fluent with JS libraries like jQuery, CSS3 and JS frameworks like Bootstrap and AngularJS, CSS preprocessors like SASS and LESS, JS runtime Nodes.js, and Gulp toolkit. All these tools improve the web developer’s efficiency but make it impossible to maintain the website for less experienced users. After all, even professional web developers in large corporations tend to switch to more straightforward Content Management Systems (CMS) like Drupal to simplify their website’s maintenance. The hand-coded websites are now out of fashion, and their share in the overall websites is in rapid decline, replaced mainly with user-friendly CMSs like WordPress.
The most popular Content Management Systems (CMS) as we know them now have been developed during the last decade to allow the layperson to quickly build, edit, and modify websites. The most prominent of them – WordPress – was initially designed to fill the custom content in the predetermined spaces in the theme layout. Since its release a decade ago, WordPress becomes more sophisticated. In 2020, Elementor Pro page builder had changed the game by providing the Theme Builder for developing dynamic and fully customisable WordPress sites, so they don’t look like just “another clone”. However, with each release of Elementor, the Google Mobile Page Speed Score for websites built with Elementor Pro continuously falls. The development team of Elementor derailed by focusing on extra functionality at the expense of performance for websites. Some web designers are adopting a newer page building tool, based on the Kadence Theme and Kadence Blocks, to recreate Elementor website designs. Kadence is a simple, easy-to-use platform that works great on mobile devices because it loads the jQuery library only when needed.
Kadence’s menu is built without the use of jQuery. So, if you’re not loading carousels or galleries that support Masonry, the JavaScript in your page will run without jQuery for a perfect 100 score on the Google Mobile PageSpeed Insights test.
How secure are WordPress websites?
Small businesses generally don’t have the security of their websites high enough on the priority list until the first successful attack. Unfortunately, hacks are a reality, and their malicious nature can turn a successful website into a nightmare in seconds. Sadly, that is a consequence of the popularity and simplicity of using WordPress among the public, especially if combined with a free-to-use but highly vulnerable WooCommerce plugin.
When the attack is successful, there will most likely be data breach concerns, privacy issues, customers’ notifications, and government authorities’ reporting. It is not just a small hassle.
Case Study
WebWhim had recently served a client whose brochure/WooCommerce website became very slow – about 25 seconds to open a page on a desktop device. After investigation, we identified that the client’s website was hacked at least four years ago and used as a farm for keeping a massive amount of backlinks by the blackhat SEO intruder. The size of the client’s database grew out of control to 15GB (with the typical limit of 1Gb for WordPress databases), adding every 3 minutes for the last four years a backlink and a related descriptive text.
The good news is that we had managed to remove malware using WordFence. The bad news is that a hosting provider did not automatically notify a client that his database exceeded the size limit. There is no way to back up a database of this size using any regular tools or backup plugin. Without a backup, there is a significant risk to lose the whole website during the cleaning procedure with WP-Optimize or a similar tool. The time was ticking. Therefore the only solution that remained was to recreate this website anew manually, host it with a different provider, and add another security level – we had chosen WordFence.
This action alone improved website download time tenfold from 25 to 2.0 seconds. The client is now running his website in a much more secure environment. Nevertheless, the website is never safe if there is no routine security maintenance in place. The number of attacks on the client website is still very high and quite persistent – about one attempt per 30 minutes from the different IP addresses each day after the move. Fortunately, so far, the hoster and the Wordfence plugin are doing their job of blocking the hackers.
The next step will be to replace the WooCommerce plugin with Ecwid Ecommerce Shopping Cart, move DNS hosting to Cloudflare, and add a scheduled weekly cleanup of the database.
To WordPress, or not to WordPress? That is the question.
If you are happy to follow a template-driven website design, you might be better off with an alternative platform like Weebly. It is a close-code platform optimised for a much faster upload speed than the typical WordPress theme-based website. However, the WordPress platform gives an advanced designer the power to develop any layout with a page builder without coding.
A knowledgeable designer can hand-craft a very advanced WordPress website that will match the customer’s needs. Such a website will have a custom-built template with a dash of backend wizardry performed by carefully selected plugins.
WordPress has at least four times larger share of the market than the combined share of other four significant competitors like Wix, Squarespace, Weebly, and Shopify.
The Google speed score for each platform can be evaluated by selecting just about five websites on each platform. Most websites show pathetically slow performance, and there is a range of readings for websites made using the same platform. We have observed that the Wix and Shopify speed is similar, but Squarespace delivers even slower performance, especially for mobile users. Weebly speed is slightly ahead of all of the rest.
When using Cloudflare CDN, most geolocations are served from the nearby server network except for Bahrain(served from Germany), India (served from Singapore) and South Korea (served from Japan).
The Squarespace customer base is stagnating for the last couple of years. Unless Squarespace manages to deliver new features, it might start to decline. The niche offering – a stylish website with limited customisation options – is also under attack by Weebly, who provides free hosting but nevertheless struggles to offer exciting new features to eCommerce users since its acquisition by Square in 2018.
The sites built with Weebly show substantially faster speed than Wix, Shopify, and Squarespace, but its market share is about three times smaller. And there is a good reason why most users stay away from Weebly. The Weebly platform is famous for its decision to make any changes to the website as final and irreversible. The user does not have to save their editing as it is done automatically. But the platform has no option to undo the changes or restore from the backup if something goes wrong. WordPress users have access to the unlimited undo function using the long history of changes in the Elementor Pro editor. We are enjoying the staging environment for making changes to the design before applying them to the working website. We have for granted regular automatic backups performed by the hosting provider and the capability to restore from the selected backup in the CPanel. It is incomprehensible to consider moving from WordPress to Weebly as you will have to have the bomb disposal squad member’s nerves to work with Weebly.
The Shopify platform’s impressive recent growth evident in the timeline Figure is mostly related to their extensive support for a dropshipping business model. This alone will help grow their user base even without improving slow page loading speed on mobile devices.
And please remember, because you own a rifle doesn’t make you a hunter. Just because you own a car doesn’t make you a racing champion. Owning a website building tool doesn’t make you a skilled web designer.
Shopify’s rapid growth during the last couple of years exposes a well-hidden secret issue with the WordPress platform – its compromised security. WordPress accounts for 94% of all hacked websites, with its vulnerable plugins the prime attack vector. Especially attractive for hackers are WordPress websites with vulnerable WooCommerce plugin.
With over 4.5 million installations (or about 16% of all WordPress websites), WooCommerce is the most popular but also one of the most vulnerable eCommerce plugin ever. Since it is designed to handle and accumulate customer’s personal and payment details, this plugin remains very attractive to hackers. The attack points are the WooCommerce Checkout Payment Gateway plugin, an XSS vulnerability in the cart plugin that allows remote injection of arbitrary web script, and a flaw in the WordPress permission system used by these plugins. For example, in April 2020, researchers from security firm WebArx reported that Hackers are actively attempting to exploit numerous flaws in the Discount Rules for WooCommerce. Please don’t be surprised if your WooCommerce site is HACKED.
The main competitors to WooCommerce shown in the pie chart are Wix, Shopify, and Squarespace platforms. They provide fully hosted eCommerce websites, and by being a closed-source platform, presents a much more secure environment than WordPress. The top three options, such as WooCommerce, Wix, and Shopify are on the growing trend. The Squarespace is stagnating. The fifth option, Magento, is continuously shrinking– reducing its share fivefold during the last five years. It looks safe to recommend that no new online stores should be based on Magento in 2021.
The future of the Shopify platform is not without clouds. Their online store themes are restricted to basic customisation to improve the upload speed, similar to what you will experience with your Amazon and eBay marketplaces. As a result, too many online stores look identical to each other. However, Shopify clients are still suffering from the slow upload speed. The website loading speed is especially frustrating on mobile devices, severely undermining business revenue and dissatisfying users. For this moment in time, the issue has not yet been fixed by the company developers.
For those who are happy to keep using the standard eCommerce design template, the platforms from Weebly provide a faster page loading speed. Slow pages never rank high in organic results and are less efficient in converting paid clicks – and this issue is even more important for the eCommerce websites owners. But please be mindful of the lack of undo and restore from backup in the Weebly platform’s functionalities.
While no website is immune to hacking, the client’s data and revenue can still be protected. The trick is to separate the inventory and checkout of your eCommerce from your WordPress website. If you take eCommerce out of the WordPress equation, it will reduce the number of potentially vulnerable plugins you need. The removal of WooCommerce will save on costs to set up firewalls, implement ongoing security patches and malware remediation. It will also dramatically improve your page loading speed and increase your Google ranking leading to more organic traffic and better conversion of paid clicks.
There are at least two options: Ecwid and underutilised WP Shopify.
Although WebWhim is continually improving its WordPress security know-how and doing its best to harden client’s websites against hackers, we are not as sophisticated as the Ecwid security team’s professionals. Therefore, we highly recommend everyone who is thinking of establishing an online store to trust its protection to the Ecwid team.
With Ecwid, you get all the functionality of an online store. Your site visitors can search your products, filter products by categories, sort products using available properties, pay with preferred currency and do other familiar UI/UX actions. Everything happens on your site, including the checkout page design, making for a smooth and satisfying user experience. Ecwid is the easiest to use and the most affordable e-commerce solution; you can enjoy a free version if you sell no more than ten products.
Ecwid is a popular eCommerce option on Wix due to the deficiencies of the native Wix Store platform. About 60% of all Ecwid websites are using Wix as a front-end. The 15% of overall Ecwid stores are hosted using WordPress, slowly gaining its fan club there. The remaining 25% of the Ecwid eCommerce store’s instances are implemented on fully customised hand-coded fast websites.
Ecwid offers an online shop functionality using its own back-end servers without requesting access to the local database at your origin server. Therefore it is ideally suited for resilient static WordPress websites. Such websites are developed using the WordPress platform, the page builder plugin, and some other plugins. Then they are fully cached and delivered as the static pages disconnected from the database, eliminating a range of vulnerabilities. The commercial platform for simplifying such an approach is
Strattic, which provides tons of advice on implementing dynamic functions such as forms, search, chats, automated emails and everything else required on your static pages. Alternatively, much faster loading pages can be developed using pure HTML and CSS WordPress builder
LiveCanvas, based on Bootstrap open-source front-end toolkit. LiveCanvas can natively export the website with a clean code as a static, stand-alone version hosted outside of the WordPress environment. Using software stack such as WordPress – PicostrapTheme – LiveCanvas – Microthemer CSS editor – Ecwid integration code – Rank Math SEO –
WP2Static – BunnyCDN, the user of WordPress platform can quickly develop clean static online shop hosted directly on BunnyCDN
geo-replicated storage. Such a website will run without loading the bloated jQuery library, which is an essential major step for achieving superfast JavaScript evaluation and parsing. This “headless” website approach will provide improved protection against security threads typical for dynamically-served WordPress websites. But most importantly, your website will have blazing fast loading pages even on mobile devices. You can still have some “dynamic” style functionalities like Search, Comment, Contact Form 7, Users, and WPML – but for Comments and Contact Form, you will have to follow instructions
available here to set up restricted access to the database of your original WordPress installation. You will need to use the
Multiple Domain plugin and set up all required permissions and restrictions using VPS hosting for your original WordPress website. To follow this path, you have to involve a web design agency comfortable with editing HTML, CSS, adjusting JS, following technical instructions for setting up VPS permissions and maintaining regular backups.
Suppose the worst has happened and hackers destroyed your dynamic WordPress or static website. In that case, the business can recover its website from the server backup. However, your eCommerce data will remain in safe hands – Ecwid stores your customer’s data as entirely separate from the WordPress environment and uses independent authentication. It ensures that customer’s data and all transactions logs are safe.
Another benefit of using Ecwid is a reduced load on the web hosting server. Many shared hosts limit or suspend websites that cause much load on the server, and so all of a sudden might start returning the “error 503” messages. Ecwid will process all required amount of customer requests on their servers build precisely for this purpose. Therefore you can convert your cheaper hosting provider into a stable platform that doesn’t crush under pressure.
Ecwid was created with a small business in mind. The platform is user-friendly and allows anyone with any level of experience to use it with ease. At the same time, the platform is powerful enough to handle eCommerce application. It is simple to learn Ecwid compared to WooCommerce. Using Ecwid reduces running costs for small businesses whose staff will quickly understand how to operate the system. In Ecwid, each backend setup of a client store is essentially the same. Ecwid provides detailed documentation and the “Help” directory. Clients can also get technical support directly from their Ecwid dashboard. Effectively, Ecwid is a “hub” for online multi-channel sales integrating business website, Amazon, eBay, and social media platforms like Facebook. Using Ecwid will save your budget. The initial development phase can be completed much faster. Online shop integrated with Ecwid will not require advanced maintenance by an external “WordPress guru”. Business owners can enhance their eCommerce operations independently from the WordPress installation. If the business decides to change WordPress developer, Ecwid will keep your eCommerce backend unaffected.
On a technical level, it is worth to emphasise the integration of Ecwid with the Guttenberg block editor, Kadence Blocks, Elementor Pro, Automatic Platform Optimisation (APO) service from Cloudflare, and Google Merchant Center. Using Ecwid instead of WooCommerce will accelerate your website’s page load speed and, therefore, will help gain at least 50% more business with the users. WooCommerce has a terrible reputation as the most resource-intensive plugin in the WordPress ecosystem.
With the WP Shopify, your team will be able to use the powerful & sleek product management features of Shopify for managing products listed on your fast and fully customisable WordPress website. For example, when you change the product’s price or title on your Shopify platform, this change will be replicated on your WordPress website. You do not need to worry about how to handle online payments. Once the buyer hits the checkout button, they are redirected to your Shopify checkout page to complete the transaction. In other words, you will use the Shopify server to process payments.
With WP Shopify, customers can enjoy attractive and familiar effects such as cart slide-out. Whenever the user is ready to make the purchase, the user is redirected to the default Shopify checkout page. The online-shop owner does not need to worry about building a dedicated checkout page. You just need to use your account at Shopify to customise the checkout page layout to assure design consistency with the store cart implemented on the WordPress website.
Our design services include web and graphic design. We help with everything, from logos for your company to eCommerce stores. We offer advice about web hosting solutions, as well as technical search engine optimisation. We might be a small company, but we are more than able to accommodate all your needs.
