The biggest advantage of lowering your website’s loading time is that it will help tremendously in improving site’s usability and user experience which is essential for today’s online business.
There are many ways to get started with top-end optimization. Here are 5 ideas to get you going.
1. Get a good Web Host
The major factor that influences the speed of a website is the hosting of your WordPress website.
I have used many servers but the best option in terms of speed and service is without a doubt SiteGround.
They provide excellent loading speed and customer support guaranteed 24/7.
2. Use an effective catching plugin
WordPress pages are “dynamic.” This means they’re built on the fly every time someone visits a post or page on your website.
To build your pages, WordPress has to run a process to find the required information, put it all together, and then display it to your user.
A cache plugin generates static pages and improves the site pagespeed 2-5x faster. The cached pages are stored in the memory and when a user makes a request the pages are delivered from the cache. By this the php execution and the database requests are skipped.
There are a lot of good WordPress caching plugins available, but I recommend using either WP Fastest cache (free) or LiteSpeed Cache (free) plugin.
WP Fastest Cache was rated the #1 (free) cache plugin in this Facebook poll.
3. Compress your images
According to httparchive, in August 2016 the images are more than 64% of the weight of an average website. Usually they tend to weigh more than all of your CSS, JS and HTML combined!
If you have a website with lots of images you must optimize them to reduce the size. By reducing the image size, you´ll reduce web page size overall and save server´s bandwidth.
There are multiple ways to optimize the images, but doing without losing quality is the smart way. In this article, I’ve covered three types of tools.
Compress and reduce your image size up to 90% with Compressor while maintaining high-quality resolution. It supports JPEG, PNG, GIF & SVG and files size limit is 10 MB.
WebP is a raster image format from Google that’s designed specifically for the web. It provides lossless and lossy compression that allows web designers to show richer images at smaller file sizes.
WebP lossy images use predictive coding to encode the image. It reduces the file sizes by looking at the neighboring pixels to predict the values, and then only encodes the differences. Lossy images are up to 34% smaller than the comparable image as a JPEG and 26% than the same as PNG.
4. Avoid using unnecessary plugins
Excess plugins can make your job harder and more complicated than it needs to be and could affect the performance as well as the security of a website.
Actually, many times we have installed and activated plugins that we do not even know what they do or how to configure them.
So why do we have them there without doing anything consuming resources?
5. Keep your site up-to-date
WordPress is updated frequently. Each update will not only offer new features but it will also fix security issues and bugs. Your WordPress theme and plugins may have regular updates, too.
As a website owner, it’s your responsibility to keep your WordPress site, theme, and plugins updated to the latest versions. Not doing so may make your site slow and unreliable, and make you vulnerable to security threats.
Happy thursday my friends! I wanted to introducing Kate a feminine Photography WordPress theme in the shop, Etsy Shop and Creative Market.
Kate is a modern, sophisticated and clean WordPress theme designed for you to create your own gorgeous and eye-catching with feminine website. Its minimalist style makes it especially well-suited for photographers, bloggers, creatives.
This theme is clean, pretty, and super easy to navigate with a lot of options, that can help customizing you blog, changing Google fonts, colors, posts layouts and more.
I designed a color palette and mood board based on fresh spring colors (greens, blush and sand).
Moodboard Inspiration photo credits: Women | Ficus | Stationery | Casino| Texture
I´ve choosen two gorgeous Google Fonts that combines perfectly, Playfair Display and Nunito for body text.
And finally this is the new WordPress theme!!
Kate comes packed with powerful functionality and beautiful design:
>> Full-width slideshow
Slideshow on Homepage allows you to showcase any content you want.
>> Flexible & widgetized home to page
This enables you to display flexible top section in 3,6,4 or 8 widgets.
>> Theme Options powered by WordPress Customizer
Use the default color scheme or change colors and typography to match your branding (+ 300 beautiful Google fonts) and preview these changes in real time.
>> Custom Post Formats
You can easily and quickly create your blog archive in different layouts: default, columns, features images + content limit,…
>> Filterable portfolio or gallery lightbox
Custom Filterable Portfolio allows designers, artists, photographers to show off their projects, images or gallery to your site. (see it: portfolio). Choose two, three or four columns layouts and allow your readers filter by categories.
>> Compatible with Woocommerce
WooCommerce is a free eCommerce plugin that allows you to sell anything, beautifully ( physical, digital or affiliate products to earn commission ). I´ve customized style making the plugin perfectly integrated in theme (see it: shop).
>> Responsive Design
Fully responsive across all devices — looks great no matter how you’re viewing it (desktops, tablets, and phones).
>> Fade in effect on frontpage
Delays the loading of widgets until the user scrolls to them. This will reduce loading time on long pages with lots of images.
>> 3 different layouts
Choose to have full width pages, with 1 or 2 sidebars on the left or right.
>> Easy navigation
Sticky menu on scroll and floating back to top button help your visitors find the content they’re looking for quickly, without fuss.
>> Display a beautiful newsletter widget compatible with MailChimp, Aweber, MailPoet, ConvertKit,..
Add mailing lists forms and calls to action to widgets, an ideal way to convert more of your website visitors into active leads or email list subscribers.
>> Category index page
Category index page collects images and content from different posts categories creating a single destination where visitors can browse content easily. (see it: category index).
>> Coming soon and Landing page
A Coming Soon page and landing page is a temporary home page telling visitors that your site is under construction or announcing something. Theses pages do not have a header or footer and therefore, visitors are unable to navigate to the rest of your site.
>> Related posts
This provide a user-friendly way to get your visitors more engaged and browsing deeper into your website without any plugin.
>> Optional video background
You can add a video background in certain areas instead of full-width images.
>> Instagram feed
Full-width footer area for beautifully displaying your Instagram photos.
Collection of various visual and functional elements, which you can use in the post, page or widget editor ( Service boxes, call to actions, listings, …)
Feel free to check out this new WordPress theme.
KATE WORDPRESS DEMO
Many people who have bought some of my WordPress themes ask me How to fix blurry photos in WooCommerce so I´ve decided to make a really fast instructional tutorial.
If you’re having issues with your WooCommerce product images being too small, blurry or too big, this may be because of the image you’ve uploaded do not match your WooCommerce product image settings.
- First of all you should enter site admin panel and navigate to Appearance > Customizer in your WordPress dashboard.
2. Click on the WooCommerce option and select select Product Images.
3. Under the Products Images tab you should see the Display option, which defines the product images dimensions Width X Height in pixels. We need to change them.
Main Image Width is for your images on the shop page and for widgets.
Thumbnail with Single is for your images on the single product pages.
4. The minimum suggest width for main images is 600px and > 300 px for thumbnails
5. Once you have made your changes to the image dimensions, click ‘Save Changes’.
6. If you change the image dimensions after you have uploaded product images, you will need to download and run the Regenerate Thumbnails plugin just once Regenerate Thumbnails – this is to ensure that all affected images are resized to match the new dimensions.
That concludes my tutorial for fixing the blurry product images on your WooCommerce shop.