Customer story: STAFFLINK improves real estate website performance with Tinify CDN

“We are very focused on performance because the websites we build have very large quantities of images and they have to be very high-resolution. To give you an example, we serve up about 200GB of images alone from one website. So it didn’t just speed up the website when we use Tinify CDN, it was speeding up that import process.”

Matt Neal, project manager at STAFFLINK

STAFFLINK is a leading Australian company that provides digital solutions for the real estate industry. With a dedicated team of professionals, they help real estate professionals improve property management operations and increase productivity. 

In the online world of real estate, a big challenge is cramming in tons of high-resolution images for potential house buyers to view. Unfortunately, these images that are large in size contribute to sluggish website performance – imagine eager visitors seeking their dream home, only to be met with the frustrating spinning loading icon. To conquer this challenge, STAFFLINK uses Tinify CDN to build faster real estate websites.

Key results:

  • Efficient image handling: With Tinify CDN, STAFFLINK optimizes their clients’ image delivery process. Instead of manually resizing images for various screen sizes, they now upload raw images to their Amazon S3 bucket and let Tinify handle resizing and compression. This streamlined approach reduced manual efforts and improved efficiency.
  • Faster website load times: By serving optimized images through Tinify CDN, STAFFLINK significantly improved the loading times of their clients’ websites. This enhancement is particularly crucial for real estate websites, where high-resolution property images are integral to the user experience.
  • Simplified Development Workflow: STAFFLINK no longer needed to spend time on image compression and resizing, allowing their developers to focus on other aspects of website development and optimization.
  • Cost-effective solution: Tinify CDN’s competitive pricing structure appealed to STAFFLINK as the initial pricing tier provided an affordable entry point, making it feasible for them to scale their usage as needed.

Background: Looking for efficient image delivery

STAFFLINK’s project manager Matt Neal explained that uploading and storing images on Amazon S3 prompted them to explore the need for a reliable Content Delivery Network (CDN) to optimize image delivery. During their search, Tinify CDN came up as a solid option: 

“I’ve been using Tinify’s website to compress images since 2014. It does a really good job, it’s fast and free. Then I came across Tinify CDN when I was looking for alternatives to serving large amounts of high-resolution images.”

According to Matt, Tinify CDN was exactly what the team was looking for – it had the usual characteristics of a CDN while offering the option to compress and resize images on the fly:

“Our property listing pages typically present around 30 high-resolution images each. If we served them in their raw format, we’d literally have about 100 MB worth of images on one single page load. That’s just not possible.”

Matt Neal, project manager at STAFFLINK

Solution: Implementing Tinify CDN to automate image resizing and compression

Before implementing Tinify CDN, managing hundreds of property uploads involved a time-consuming process of resizing and compressing images:

“It’s a very long process dealing with hundreds of properties a day. Before, we’d wrestle with downloading, converting, resizing – you name it – so we were able to cut all that out. The first load might have a tiny delay as Tinify CDN works its compression magic, but all the heavy lifting is on its end, not ours.”

With an Image CDN like Tinify’s, STAFFLINK streamlined its image processing workflow, resulting in a significant speed boost in page loads. They solved the challenges tied to handling large images by automatically serving compressed, properly sized visuals. According to Matt, this is a “pretty big deal”:

“We are very focused on performance because the websites we build have very large quantities of images and they have to be very high-resolution. To give you an example, we serve up about 200GB of images alone from one website. So it didn’t just speed up the website when we use the CDN, it was speeding up that import process.”

Matt Neal, project manager at STAFFLINK

In addition, Matt says that Tinify CDN stands out from other providers due to its straightforward configuration. While considering alternatives, he found that many were either too complex or restrictive in terms of customization: “I spent maybe 30 minutes to an hour trying to get another CDN to work. And there were a whole bunch of issues. So then I went with Tinify, I tested it and it worked straight away.”

Conclusion

STAFFLINK, an Australian digital solutions provider for real estate, implemented Tinify CDN to automatically resize and compress hundreds of their clients’ property images. This results in quicker website loading times for STAFFLINK’s clients, positively impacting the experience of potential homebuyers. For STAFFLINK, Tinify CDN allowed them to simplify their workflow with just a few clicks, saving them from the trouble of resizing and compressing images using many time-consuming tools.

Need a way to make your image-heavy website load faster? Give Tinify CDN a try with our free trial!

Tinify’s image converter: Effortlessly convert images online with new tool

👏 Introducing Tinify’s Beta image converter tool!

Did you know that the idea for Tinify started on a train? It was one of those light-bulb moments when a web developer was tasked with creating a heavy-image website that simply wouldn’t load on mobile data for him. By the time the website finally loaded, his commute was over – well, perhaps it wasn’t as bad, but you get the idea. So, this got his team thinking: How can we make images load faster? It was from this point that Tinify, also known as TinyPNG, was born.

That was 10 years ago. Now, things have changed. New kinds of image files make websites load faster. People are using a format called WebP, which is smaller than the old ones like JPEG and PNG. While compressing images is still one of the quickest and most efficient fixes for slow websites, choosing the best image format and opting for next-gen formats are becoming equally important. To keep up with this trend, we’re introducing a new feature: Tinify’s image converter online tool.

Why is Tinify the best image converter tool?

Converting images online isn’t new – a quick search on Google will lead you to dozens of websites that convert images in multiple formats to JPEG or even WebP. But Tinify gives you a two-in-one tool by letting you do more than just convert images; you can also make them smaller with no quality loss all in one go. 

With Tinify’s image converter tool, you can now drag-and-drop your images and convert them from and to WebP, PNG and JPEG. Free and Web Pro users can convert three images per session. In the near future, users looking for limitless conversions can sign-up for Web Ultra, a new tier that includes both unlimited image conversions and compressions. Plus, every converted image gets automatically compressed, ensuring your website loads faster with the smallest file sizes.

How to convert images online with Tinify

Tinify’s image converter helps you find the best image version for optimal performance. You can choose from all available formats (JPEG, PNG, and WebP) and select the one with the smallest file size.

Whether you need to convert a high-resolution image to JPEG or you want to jump on the WebP trend, all you have to do is slide the converter button to the right, select the image format output, and you’re good to go! The interface is as simple as possible so you don’t waste time in complex configurations:

How to pick the best image format – from JPEG and PNG to the trendy WebP

Keep in mind that each image format has a distinct impact on your image size and, consequently, your website’s performance.

Since PNGs are generally larger than JPEGs, use them only for web graphics, logos, charts, and illustrations, especially when transparent backgrounds are required. JPEGs work best for photographs, but these days users are embracing the WebP trend.

Replacing PNG and JPEG images with WebP can further reduce loading times. In fact, Google introduced WebP precisely to serve as a superior alternative to these traditional image formats. Tinify users have been using WebP increasingly, with a monthly growth of over 80% compared to 2022. In the picture below, you can see that WebP performs better than other formats: 

Developers also have the option to convert and compress images using Tinify’s API developer subscription, with the first 500 compressions/conversions available for free. Soon, online users will be able to sign up for unlimited conversions. For more updates on Tinify’s latest features, follow us on Twitter or LinkedIn.

TL;DR

Web image formats have evolved, with WebP emerging as a smaller alternative to older formats like JPEG and PNG. Compressing images remains important, but choosing the right format is equally crucial for faster website performance. Tinify has unveiled a new feature – an online image converter tool that not only converts images but also compresses them seamlessly without quality loss. Try out our beta version on Tinify’s homepage.

Customer story: Web dev company Immer’s outstanding web performance with Tinify CDN

“Performance is more and more important for our clients, and by using Tinify CDN’s services we are able to get outstanding performance scores”

Michael Mol, Founder of Immer

Immer, a Dutch-based web development company, specializes in creating online platforms and websites primarily using Drupal’s content management system. The company’s core goal is to optimize website performance and deliver a seamless user experience. With this, it was a no-brainer for them to explore various Content Delivery Network (CDN) options, and ultimately sign-up for Tinify CDN.

Key results:

  • Simple configuration: Tinify CDN requires minimal technical changes, making it suitable for a small team like Immer. With it working quietly behind the scenes, Immer’s team of 10 employees can focus on other aspects of web development without investing time in complex setup and maintenance.
  • PNG and WebP format support: Tinify CDN stands out by compressing images on the fly, reducing file sizes by up to 80% without noticeable quality loss. At first, its focus on PNG compression was a crucial factor for Immer, and later, when they made the switch to WebP, they found it just as advantageous.
Immer's website

Why implement a CDN

In short, a CDN ensures that users around the world experience reduced latency and faster content delivery without any delay. This is possible because a CDN speeds up online content by delivering it from a network of servers located closer to the end user – the shorter the distance that data has to travel, the better. In this way, implementing a CDN is an easy way to improve website performance, as it requires minimal technical changes to configure it, and performance gains can be seen immediately. 

Immer’s founder Michael Mol explains that the company considered factors such as pricing, features, and support for their technical requirements when looking at CDN options. While there were other alternatives available, Immer was already familiar with Tinify’s image compression services, which they had previously tried out for free. Eventually, this was the defining factor for their choice:

“Obviously, we looked at alternatives, even free and cheaper options, but Tinify CDN had some great support for PNGs which sparked our interest.”

Michael Mol, Founder of Immer

Tinify CDN sets itself apart from other options by not only enhancing load times but also compressing images on the fly. For a company like Immer, this was important as they also build websites that are image-heavy. When using PNGs, which are typically larger than other image formats, the ability to upload and automatically display the compressed versions of the original images guarantees an even more optimized website. This is done by reducing the file size by up to 80% with unnoticeable changes in quality. 

For Michael, this feature is particularly useful for one of their customer segments: “For instance, we have customers in publishing, and these websites can have a lot of images, which compromises how fast a website loads for people who visit it. That’s where Tinify CDN comes in.”

Tinify CDN’s simplicity

Michael says that even though they didn’t have specific benchmarks, they noted instant improvements on website speed. Furthermore, as the team switched to using WebP – a next-gen format that reduces file sizes by up to a third compared to JPEG and PNG images – Michael highlighted the fact that Tinify CDN could compress this format even further.

Nonetheless, on day to day, Tinify CDN is but an unassuming cog in Immer’s machine, working quietly behind the scenes. For a small team like Immer, made up of 10 employees, it is important to not waste time on complex configurations. For Michael, simplicity is key:

“That’s what we expected from Tinify as well: it should just work, running in the background.”

Michael Mol, Founder of Immer

Does your team value simplicity? Read more about how you can improve your company’s website speed with just a few clicks here.

Conclusion

Tinify’s reputation for effective image compression and the unique benefit of supporting PNG compression were key factors in Immer’s decision-making process. For this web development company, Tinify CDN’s ability to improve web speed, coupled with efficient image compression and support for new formats like WebP, has been useful in maintaining their website performance.

How to optimize videos and images for better SEO traffic and conversion rates

This blog post was written in collaboration with VEED, a platform to help content creators easily create stunning videos, add subtitles, and grow their audiences. 

In today’s digital landscape, where visual content reigns supreme, optimizing images and videos on your website is not just a matter of aesthetics – it’s crucial for improving SEO traffic and driving higher conversion rates. Visual content can captivate your audience and convey information more effectively than text alone. In this how-to guide, we’ll explore the strategies and techniques to optimize your images and videos, enhancing your website’s search engine visibility and user engagement.

By the end of this blog, you’ll know:

  • Why visual content is king
  • How to optimize images for SEO
  • How to optimize videos for SEO
  • How to boost your social sharing

Importance of visual content for SEO

Visual content plays a vital role in enhancing Search Engine Optimization strategies. Images, videos, infographics, and charts can improve user engagement compared to plain text. Provide high-quality visuals to keep your users on your site longer, as it helps reduce the bounce rate. Having a low bounce rate indicates relevant and valuable content to users. Integrating images and videos makes your content more engaging and helps convey complex messages quickly. They can improve page ranking, increase social sharing, diversify content types for those with different learning styles, and more.

Choosing the right media format: images vs. videos

The decision between images and videos depends on your content goals. Pictures are ideal for showcasing products, infographics, and conveying information succinctly. On the other hand, videos are powerful for storytelling, demonstrations, and building a personal connection with your audience. Many video editor tools in the market can help you create professional videos, like VEED, designed for content creators, social publishers, dank memers, and anyone who wants to get involved in making video content. 

📷 How to optimize images for SEO

  • Compressing images

High-resolution images are stunning, but they can slow down your website. Strike a balance by compressing images without sacrificing quality using tools like Adobe Photoshop, or online with Tinify.

Compress your images with Tinify
  • Utilizing descriptive filenames and alt texts

Search engines rely on filenames and alt texts to understand image content. Be descriptive and include relevant keywords to enhance your images’ discoverability.

  • Using appropriate file formats

For photos or images with abundant colors, use JPEG, and for those with transparency or text, use PNG. You can use SVG for icons and simple graphics.

  • Implementing responsive design

Responsive design ensures your images adapt to different devices and screen sizes, improving user experience and SEO. Use CSS media queries to create a seamless transition between devices.

  • Structured data markup for image SEO

Implement structured data markups such as Schema.org to provide search engines with context about your images, leading to improved rankings and helping your pages be more visible in organic search.

📹 How to optimize videos for SEO

  • Hosting vs. embedding

Choosing between hosting videos on your site or embedding from platforms like YouTube affects loading speed and user experience. According to Pair Networks, hosting your videos is good; however, you need to have enough bandwidth for them to play. Using embedded videos is better because you don’t need much bandwidth since it’s hosted elsewhere.

  • Optimizing page speed

Consider non-simultaneous loading or embedding videos so that they don’t delay page loading, which prevents slow page speeds. 

  • Creating video thumbnails

Thumbnails act as gateways to your videos. Create custom, relevant, visually compelling thumbnails that accurately represent your video content to boost click-through rates.

  • Writing video titles and descriptions

Your video’s title and description should be captivating and keyword-rich. It improves SEO and gives viewers a clear idea of your video’s content.

  • Harnessing video transcripts or captions

Transcripts and captions make your videos accessible and enable search engines to index their content. It can lead to higher search rankings and a broader audience reach. Since this can be time-consuming, you can use VEED’s transcription tool to save time. 

Optimize videos with VEED's transcript service

Mobile-Friendly Optimization for Visual Content

With the surge in smartphone and tablet usage, more users access online content through their mobile devices than ever before. With this, optimizing your visual content for mobile devices is very important today. Having mobile-friendly visuals ensures a seamless and enjoyable user experience. This means that the content loads faster and is easy to navigate, leading to higher user satisfaction and lower bounce rates. In addition, it is more likely to be shared across social media channels, enhancing the content’s reach and potential to go viral. Lastly, it helps you rank in search engine results pages (SERP) as it’s one of Google’s ranking factors.

Amplify UX for SEO and Conversion Rates

User experience goes beyond being creative. It encompasses the user’s usability, accessibility, design, and the emotional response generated during the interaction on the site. User behavior is essential for search engines to determine the site’s quality. When users quickly leave a website, it indicates poor user experience and can negatively affect your SEO rankings. Having slow-loading pages can also disappoint users and lead to higher bounce rates. You must aim for longer dwell times, which entails creating valuable content that sends positive signals to search engines and consequently improves rankings.

Aside from that, mobile responsiveness plays a big part in user experience and SEO. Websites must adapt to various screen sizes, providing a consistent user experience, which search engines reward with better rankings. Here are some factors you need to review for more vital UX: 

  • Website Layout
  • Visual Design
  • Content Quality
  • Ease of Navigation
  • Overall Website Functionality

📱Boost Your Social Sharing

Finally, distributing your content is key. Here are some tips on improving your social media presence with your visual content:

  • Strengthen your visuals

Visual content is highly shareable and has the potential to go viral on different social platforms like Instagram and Facebook. Create visually appealing content that can tell a story and bring emotions to boost engagement. This video below guides you on how to create social media video content.

  • Use open graph meta tags

Don’t forget to put open graph meta tags for your images and videos to make your content shareable, clickable, and noticeable. It can help increase your brand visibility through search.

  • Integrate share buttons

Encourage users to share your visual content by integrating easy-to-use social media share buttons. It amplifies your reach and can drive more traffic to your website.

Conclusion

Optimizing images and videos for SEO is no longer optional – it’s a strategic necessity. You’ll build up your SEO, improve your user experience, and increase the likelihood of higher conversion rates. By implementing the tips in this guide, you can enhance your website’s visibility, engage your audience, and drive higher conversion rates.

If you want to get started with video content, try out VEED, a simple online video editor. If you want to trim, filter, rotate, crop, add text, draw, and more on your videos and need more time or the know-how, VEED is the tool designed precisely for you. We think video editing should be easy, simple, and accessible to all. It is designed for content creators, social publishers, dank memers, and anyone who wants to get involved in making video content. You just have to review video tools carefully, look for super easy tools to use, and give you the quality and all the features you need.

How to install Tinify CDN on your WordPress website

This blog post will walk you through the process of installing Tinify CDN on your WordPress website. It only takes a few minutes and you have the chance to try it out for 14 days with no credit card details required. By the end of this, your website will become faster and perform better for users!

One of the main advantages of using a WordPress website is the user-friendly interface that makes it perfect for both beginners and advanced users to manage their websites. Whether you have a small personal blog or a large enterprise website, WordPress allows you to scale your website by adding new content and integrate third-party services to extend the functionality of your website as your requirements evolve. 

This is how WordPress users can easily compress their images with our popular TinyPNG plugin to make their website faster on the go. But besides this, if you’re a WordPress user looking for even faster page load speeds, you can also take advantage of Tinify CDN – it only takes a few clicks!

Long, story short: Why use a CDN?

Is your WordPress website suffering from slow loading times? Or has your traffic volume increased? Does it contain large media files throughout its pages? Do you have an international audience? If you replied yes to any of these questions, then implementing a CDN is likely beneficial. 

CDNs improve website performance by reducing data travel distance and caching content in various geographic locations. A website that doesn’t use a CDN is dependent on a single server, in a single connection. This means that the further the users are from your location, the longer it takes for your content to load.

For example, when a person somewhere in Europe visits a website located in the US, the data has to travel a very long distance through servers, which consequently adds up to a longer loading time. However, when a website uses a CDN network, the data of the website will be loaded from a server closer to the user – in this case, somewhere in Europe. This drastically improves the performance of your website.

Tinify CDN is both an Image and Multi-CDN. This means two things: firstly, our CDN offers the ability to compress on the fly. Large images become the smallest size possible with no loss in quality, and this change, invisible to the eye, makes your website automatically faster. Secondly, we work with multiple Content Delivery Networks which ensures the greatest possible global coverage.  

1. Sign-up for Tinify CDN’s trial

Screenshot - Try Tinify CDN 14 days for free

Visit the Tinify CDN website and sign-up for an account. We give users the chance of trying it for free for 14 days, so no credit card details are required. You just need to provide your email address and website url.

If you’re already a Tinify user, you can also sign-up for a trial on your dashboard by clicking on the “CDN” link on the side-bar.

2. Obtain your Tinify CDN endpoint

Screenshot - Tinify CDN page

After signing-up, you’ll get a welcome email so you can log-in to your Tinify account. Once you do it, you can access your CDN dashboard. There, you’ll find your CDN endpoint, which looks like this: “https//xxxxx.tinify.com”. This is a sort of personal “configuration code” that allows you to connect your WordPress website to Tinify CDN. Copy this CDN endpoint as you’ll need it later.

3. Download the WordPress CDN plugin “CDN Enabler”

Screenshot - Download CDN Enabler WordPress plugin

Go to your WordPress dashboard and click on the “plugins” option on the side-bar. To configure a CDN in WordPress, you’ll need to download a plugin such as CDN Enabler

4. Configure the CDN on your WordPress account

Screenshot - Configure your CDN Enabler in "Settings"

After installing and activating the plugin, click on “Installed Plugins” on the side-bar and select the “Settings” under the CDN Enabler plugin. 

Screenshot - Copy your CDN Hostname to your WordPress

This will lead you to another page where you’ll see a field called “CDN Hostname”. Copy your Tinify CDN endpoint into this field. The last step is simply to click on the button “Save Changes”. That’s it!

How do you verify if Tinify CDN is working on your WordPress website?

Screenshot - Validate Tinify CDN by looking at the source code of one of your images

After enabling the CDN, visit your website and inspect the source code of the page. Look for the URLs of your static assets, such as CSS files, JavaScript files and, of course, images. If the URLs of those assets contain the Tinify CDN domain, it means the integration has been successful!

Watch the instructions video:

Choose one of the 3 Tinify CDN plans

Once you’re done with your 14-days trial, you can sign-up for one of our plans: Basic, Business and Enterprise. The basic subscription is made for personal websites and blogs, while the business plan caters to professional and e-commerce websites. If you have specific business needs and demand more support, you can contact us so we can create a tailored enterprise plan for you.

Do you have any questions about Tinify CDN or its implementation? Shoot us an email at support@tinify.com

Customer story: Learning platform LearnWorlds improved blog speed with Tinify’s API

“By having a lossless solution to optimize the images, we are usually reducing the image load of articles to under 1 MB, improving the speed and the Web Vitals”.

Nick Malekos, SEO Manager at LearnWorlds

LearnWorlds is an online learning platform and learning management system (LMS) that enables individuals, businesses, and organizations to create and deliver courses, training materials, and educational content to learners. It is designed to facilitate the creation of engaging and interactive online courses with various multimedia elements such as videos, quizzes, discussions, and assignments. 

Their website is filled with resources, templates, and articles to help users elevate their online courses. With this, one of their main concerns was to make sure that the number of images uploaded to illustrate their content did not translate into slow-loading pages. To overcome this challenge, their web development team recommended Tinify as a top solution for compressing images automatically on their blog. In this case study, we delve into LearnWorlds’ experience with Tinify’s service and the benefits they gained.

LearnWorlds' Website

Background

Before using Tinify, LearnWorlds employed various online free tools to optimize images on their blog, including converting them to WebP format or resizing them. According to Nick Malekos, SEO Manager at LearnWorlds, this was necessary when dealing with high-resolution images received from their design department:

Picture of Nick Malekos, SEO Manager at LearnWorlds

“In many cases, we are getting very high-resolution images from our design department to upload to the blog. This would mean articles with >3 MB of images if we were to use those.”

Nick Malekos, SEO Manager at LearnWorlds

Resizing images to fit the specific dimensions of a blog is one of the first steps to decrease their file size and cut on loading time. Next to this, adopting next-gen image formats such as WebP is a new way to make images smaller to speed up websites.

Unfortunately, free online solutions often resulted in quality issues and did not yield the desired performance improvements, says Nick. At the same time, optimizing images with no automation tools can become time-consuming, especially for a company like LearnWorlds that uploads several informative articles for their users.


LearnWorlds' website

LearnWorlds discovers Tinify

In their quest for an improved solution, the LearnWorlds’ web development team came across Tinify’s API Developer subscription as a way to automate image compression for their blog. Nick explains that this shift was a “big hands-off improvement” and adds:

“By having a lossless solution to optimize the images, we are usually reducing the image load of articles to under 1 MB, improving the speed and the Web Vitals”.

Nick Malekos, SEO Manager at LearnWorlds

Once they subscribed to Tinify’s API Developer plan, LearnWorlds automated the optimization of blog images, streamlining the process and enhancing web performance and Google Web Vitals, a set of metrics that measures the likelihood of a great user experience. 

From an internal perspective, this allowed their team to spend less time tweaking the file size of their images. Compared to the free image optimization tools they used previously, Tinify provided a significant improvement in image quality and overall performance. LearnWorlds found Tinify to be highly user-friendly. Their developers seamlessly integrated the service into their workflow, making it an effortless and efficient solution for optimizing images on their platform. Furthermore, with a monthly usage ranging from 500 to 1000 image compressions, Tinify’s service proved to be a cost-effective addition. 

Ultimately, as Nick mentioned, it improved their blog’s SEO by compressing images, reducing their size, and thereby contributing to faster loading speeds which helps LearnWorld rank higher on search engines.


Conclusion

LearnWorlds faced a challenge when dealing with high-resolution images received from their design department. Without proper optimization, these images would have led to articles with over 3 MB in image load. By utilizing Tinify’s lossless compression, LearnWorlds reduced the image load of articles to under 1 MB, significantly improving website speed and overall Web Vitals. The seamless integration and user-friendliness of Tinify’s API service made it the ideal choice for the LearnWorlds’ web development team in ways that free online tools couldn’t make it. 

Do you want to improve the load times of your company’s blog? Read more about Tinify’s API Developer here.

Tinify’s easy recipe for SEO basics and image compression

It’s probably safe to assume that any website owner reading this knows about SEO, which is about improving your website’s ranking on search engines to increase traffic. That should be doable, right? But on second thought, how exactly does that work?

In this blog post, we’ll help you with this by going through SEO basics. Think of your SEO as a three-course meal and the search engine as a fancy Michelin inspector: to get that star, you must excel equally on the three dishes. For your website, these are: on-page (content), off-page (authority), and technical. Let’s don that chef’s hat!

By the end of this post, you’ll know…

  • Exactly what to focus on to make your content more SEO-friendly.
  • Some actions you can take outside of your website to improve its popularity.
  • Basic technical improvements with little tech expertise – like compressing your images.
  • Further links on SEO if you want to learn more about this topic.

Time to prepare the food!

How to improve your on-page SEO?

On-page SEO is all about content. It includes tasks such as optimizing text, title and header tags, internal links, and URLs. 

  • URLs: When creating URLs, make sure to make them short, and include one or two keywords that represent your page best.
  • Title and header tags: The title and heading tags of your page (e.g. H1, H2, and H3 tags) should also include keywords. By following these tips, you can improve the chances of your content appearing in featured snippets on Google.
  • In addition, sub-sections bring structure and help users and search bots to easily read your content. Backlinko suggests website owners write question-based tags. After conducting a study with over 5 million Google search results, they found that question-based title tags have an above-average click-through-rate (so, more visitors).
  • Internal links: This refers to linking to pages within your own website. Make sure to incorporate relevant links so visitors can explore other pages.
  • Meta description: This is the description that shows up in search results below the page title. Make it brief, engaging, and informative. Semrush recommends keeping it under 120 characters, so mobile and desktop users can skim through the full summary of the page.
On-page SEO basics: A short meta description.

Lastly, quality text! After all, this is the backbone of your website. For pages that you’d like to optimize for SEO purposes, the recommended length is 1500 words. Besides, remember to include your keyword in the first 100 words of your first paragraph. 

Of course, not all pages need to be visible in search engines, so these tips apply to formats such as blog posts and product landing pages. If you’re a WordPress user, you can find free plugins (we use RankMath) that guide you through all these steps.

For ideas on what to write, conduct keyword research. Mailchimp compiled a basic guide on how to do this, but overall, track your analytics to understand what words visitors use to find you. Tools like Google Search Console can give you a good overview of keywords that are performing well on your website. 

In addition, if you’re new to SEO, you can target long-tail keywords – i.e. searches with three or more words – which are usually more specific but have lower competition. For instance, an example of a short tail would be “hotel”, and a long one “Amsterdam hotel twin room”. When looking at keywords, try to find what is the intent of your users behind those words. It’s all about getting into their shoes and figuring out what they are looking for.

How to improve your off-page SEO?

Off-page optimization is about all the actions taken outside of your website to improve its search engine rankings. This includes social media activity, directory listings and most important, backlinks. The latter refers to a link from one website to another one. When this happens, it’s like giving that website a vote of confidence, telling search engines that the content on the linked website is relevant and valuable.

All in all, the cornerstone of off-page SEO is authority building. Ahrefs refers to it as the “strength” of a particular domain to rank high in search engines. 

It is worth noting that SEO experts can’t reach an agreement on how important this is for SEO. While some point it out as playing a big role, others say that there is no proof that search engines like Google evaluate authority. Search bots are like black boxes, which means no one can ever say for certain how they work. Nonetheless, website popularity is a good indicator of how well your website is performing. Bluehost put it this way: a website referring back to yours is like word-of-mouth marketing.

If you want to check how your domain rates in authority, you can use MOZ’s domain authority checker, which tells you how likely your website is to appear in search engine result pages. In addition, Semrush also provides a backlink analytics tool, which also gives you an authority score.

Off-page SEO basics: Check how your domain authority.

Once you analyze your score, you can start by:

  • Building high-quality backlinks: Focus on building high-quality backlinks from reputable websites relevant to your industry or niche. You can use techniques like writing guest posts, asking websites that mention your brand to link to your website, as well as finding broken links related to your content and suggesting your website as a replacement. This will help you rank your website higher.
  • Focusing on social media: Social media platforms can be a great way to build brand awareness, increase engagement, and drive traffic to your website. Make sure to optimize your social media profiles and share high-quality content regularly.
  • Improving online reputation: Your online reputation can affect your SEO rankings. Encourage happy customers to leave positive reviews and address negative feedback right away.
  • Optimizing local SEO: If your business has a physical location, optimizing your website for local SEO can help improve your rankings in local search results. Claim your business on Google My Business, and make sure your NAP (name, address, phone number) is consistent across all directories.

How to improve your technical SEO?

The third and last thing to improve is your website’s technical SEO, which involves optimizing technical aspects to help search engines crawl, index, and rank it more effectively. In other words, the idea behind this is to make it easier for search bots to find your web pages, understand what they are about, and finally return the page that matches what users are searching for. 

One key element of technical SEO is website speed. A good rule of thumb is to make sure your website doesn’t take longer than 3 seconds to load as 40% of users will quit it. You can use tools like Google PageSpeed Insights to identify areas of improvement and optimize your website for faster loading. In this stage, you might find that your images are too heavy – this is one of the top reasons for a slow website. Fortunately, you can quickly fix this!

Firstly, you can check how much loading time you can save by compressing your images through Tinify’s Web Page Image Analyzer. Some experts recommend that your images shouldn’t be more than 1MB, but Shopify advises users to keep image files under 70KB. 

Technical SEO basics: Check your website speed.

To achieve this, you can compress your images on Tinify’s website, or use our Developer API. Our lossy compression algorithm is designed to automatically deliver the best optimization results without compromising image quality (this means that the changes are imperceptible to the human eye). Compressed images take up less space and require less bandwidth to load. This will significantly help improve your website’s loading speed, and in turn, increase your website’s ranking on search engines. 

Besides this, here are other tips you can implement that don’t require extra technical expertise:

  • Create an SEO-friendly site structure: Make sure your website has a clear and organized structure, with easy-to-use navigation and URLs that are simple to read and understand. All pages should be easy to find in a matter of a few clicks – this will also help search bots understand your content.
  • Create a Google Search account and submit your sitemap: Submitting your sitemap is like giving Google a map of all the pages on your website. This helps Google find and show your pages in search results faster and more accurately. It also helps you see how your website is doing in search results and any problems to fix. For a more detailed explanation, read Semrush’s article on this.
  • Make your website mobile-friendly: Mobile devices now account for the majority of internet traffic, so it’s crucial to have a mobile-friendly website. Use responsive design or dynamic serving to ensure your website is optimized for mobile devices. Most website templates – e.g. WordPress, Squarespace – are already prepared for this. Nonetheless, evaluate your website’s mobile version with Google PageSpeed Insights in case improvements are needed. 
  • Fix technical errors: Identify and fix technical errors like broken links, 404 pages, and duplicate content. Use tools like Google Search Console to monitor your website and identify errors.

And that’s it – you can now take your apron off… Well, not quite! Remember that SEO is a long-term strategy, which means that you won’t be able to see any results immediately. According to a survey conducted by Arhfes, it typically takes between 3 to 6 months to see any improvements, while Marketing Lab suggests up to one year, especially for new websites as they have less content and backlinks than older ones. It’s a slow-burning process, but eventually, you’ll see an increase in website traffic. Lastly, you need to consistently go back to these steps so you keep ranking higher. 


TL;DR:

SEO basics can be divided into three:

On-page SEO (content):
  • Optimize URLs, titles, and headers with relevant keywords.
  • Use internal links to relevant pages.
  • Write a concise and informative meta description.
  • Create quality content that’s at least 1500 words long and includes keywords.
  • Conduct keyword research to understand what words visitors use to find you.
  • Use tools like Google Search Console and RankMath to guide you.
Off-page SEO (website authority):
  • Building high-quality backlinks from reputable websites relevant to your industry is crucial for ranking higher.
  • Social media can help build brand awareness, increase engagement, and drive traffic to your website.
  • Online reputation affects SEO rankings, so encourage positive reviews and address negative feedback.
  • Optimizing your website for local SEO can improve your rankings in local search results.
  • Tools like Moz and Semrush can help you analyze your website’s authority score.
Technical SEO:
  • Make sure your website loads within 3 seconds and compress heavy images to reduce loading time.
  • Create an SEO-friendly site structure with clear navigation and simple URLs.
  • Submit your sitemap to Google Search for faster and more accurate indexing.
  • Make your website mobile-friendly with a responsive design or dynamic serving.
  • Fix technical errors such as broken links, 404 pages, and duplicate content.

Finally, remember that it might take up to a year to see any results but a consistent effort to improve your website’s SEO will eventually lead to more traffic.

Clear the confusion about Image CDN: Answering 4 essential questions

Much like everybody else these days, the Tinify team has been obsessed with ChatGPT to answer the most pertinent – and sometimes not so much – questions. So, when we asked this AI tool if CDNs – in particular Image CDNs – are popular, we got in return: “yes, they are very popular”. 

However, our personal experience tells us that being popular doesn’t mean that everybody understands it well. In fact, over the past couple of weeks, we’ve been interviewing some of our users only to realize that CDN is still a foreign concept to some of them. 

In today’s blog post, we asked our developers’ team to answer some of the users’ doubts about CDN. By the end of it, you should be able to assess if your website needs one and if Tinify CDN meets your needs.

Should you use a CDN?

“I think I should use a CDN – but I’m not sure.”

This one goes for the ones that have heard about CDN but can’t fully grasp its benefits. By now, you probably already know that a CDN improves the performance and speed of online content by delivering it from a network of servers located closer to the end user. In practice, this improves the load times of web pages, images, videos, and other types of content, which is great for visitors. But, does your website need more improvement?

The long answer to this question is as follows: if your website has slow loading times, high traffic volume, or large media files, then you probably need one. 

A CDN reduces the distance that data has to travel, which works perfectly when you have users who are located far away from your server, by caching your content in different geographic locations and thus reducing the amount of time it takes for the content to load. 

Even if you aren’t focused on an international audience, a CDN helps to offload your server by caching and distributing the load across multiple edge servers, which in return avoids downtime and reduces bandwidth costs.

The short answer is simpler, though. If you think you should use a CDN, you’re probably right. It can’t hurt to give it a try, since the benefits of using one are clear.

Now, the question is, out of all CDNs out there, which one is right for you? 

If you got here because you already compress your images, it means that you should take a look at Image CDNs. Unlike other CDNs, Image CDNs are designed to handle image-heavy websites – e.g. photography and design portfolios, as well as blogs and e-commerce. 

Large image files are one of the main reasons for a slow website and ultimately, this hurts your SEO. For some, resizing and compressing images isn’t enough to improve their website speed, and the missing puzzle might be to host images on a CDN. 

In addition, it’s important to remember that incorporating effective SEO strategies not only improves search engine rankings but also enhances user retention. This is because a website with a faster loading speed reduces bounce rates, which is the percentage of visitors who leave the website without exploring beyond the initial page. Put differently, if your website is swift and easy to navigate, not only will it receive recognition from search engines, but it will also increase the likelihood of users reading your content and taking action to make a purchase.

The main advantage of an Image CDN is that it distributes content over servers around the world, which means that it offloads the work of serving images from the main server. But more than this, an Image CDN gives you other advantages related to image handling, such as the ability to automatically optimize and resize images on the fly. 

This is what Tinify CDN is all about. As an Image CDN provider, we offer a compression algorithm that delivers the same results as Tinify’s website and API. Additionally, our content distribution servers enable even faster website speeds.

Tinify Multi-CDN

For website owners with regional or global audiences, it is worth noting that Tinify CDN is a Multi-CDN, so instead of relying on one CDN provider, we work with different Content Delivery Networks that ensure great coverage around the world. In practice, this means that we analyze which CDN has the fastest server to the user or offers the best response time. It’s important to note that relying on a single CDN provider may not provide optimal coverage worldwide, as they may not have servers in every country or region. However, by combining multiple CDNs, the likelihood of achieving excellent global coverage increases, allowing you to cater to the performance requirements of every visitor.

When considering costs, Tinify CDN starts with a basic plan of 15$ (best for personal websites and blogs) but we give users the chance to try it for free for two weeks, with no payment details required. 

In the end, how to understand if it was worth signing up for a CDN?

You should be able to evaluate if acquiring a CDN makes your life and the performance of your website better. Here are some ways to measure this:

  • Website Speed: Measure website speed before and after implementing a CDN using tools like Google PageSpeed Insights or WebPageTest. If there is a significant improvement, then signing up for a CDN was worth it.
  • User Experience: Track user behavior using tools like Google Analytics to see if there is an increase in user engagement, such as longer time on site, lower bounce rates, and increased conversions, as well as an increase in traffic from different regions. If there is an improvement in user experience, it might be due to a faster website.
  • Server Load: A CDN reduces server load by caching static files, reducing the number of requests to your server. If you see a decrease in server load, then signing up for a CDN was worth it.
  • Cost Savings: A CDN can reduce bandwidth costs by serving cached files from edge servers. If you see a decrease in bandwidth usage, then a CDN was a good investment. 

Is your current CDN the smartest way to go?

“I already use a CDN… But optimize my images first with Tinify.”

During our user interviews, we found that some API and Web Pro users accustomed to compressing images are unfamiliar with Tinify CDN and use other Image CDN providers to speed up their websites. We recognized that this adds unnecessary complexity to their workflows, which could be streamlined if they switched to Tinify CDN.

For example, we came across instances where customers were compressing images with our free drag-and-drop tool and then synchronizing them with some other CDN provider. Another user was compressing images with Tinify API but optimizing their website with different tools and CDN providers. While this may not be a significant inconvenience for a few images, it can become a hassle for multiple images that require different versions and design tweaks.

Tinify CDN provides a solution to streamline this process by eliminating the need to download, compress, and upload images again. By continuously uploading the latest pictures, users can automatically display the most compressed version of their images to their website visitors.

So, ask yourself: should I continue using my existing CDN which adds extra steps to my workflow, or can I switch to a more efficient CDN to save time?

Tinify CDN: Automatically compress your images

If this speaks to you, consider signing up for Tinify CDN. With it you have access to:

  • Automatic image optimization: Tinify CDN compresses images on websites, reducing file size by up to 80% for faster loading and less bandwidth consumption. 
  • Resizing made easy: Users can change the width, height, and aspect ratio of images through the URL, automatically cropping away uninteresting parts. 
  • Optimizing more than images: Tinify CDN can optimize static content, JavaScript files, and CSS stylesheets without requiring any changes from the user. 
  • Easy integration: Tinify CDN can be easily integrated into existing websites and applications using plugins or APIs.

Why not begin your free trial today? 🐼

Tinify CDN

TL;DR

  • Despite being popular, some people still don’t understand if they need a CDN.
  • If your website has slow loading times, high traffic, or large media files, an Image CDN could be helpful.
  • If you already resize and compress images, Tinify CDN might be the way to go, since it offers a compression algorithm for images and content distribution servers to boost website speed.
  • But long story short, if you think you might need one, you might as well give it a try – we offer a two-week trial, with no payment details necessary!
  • Lastly, if you already have a CDN that doesn’t automatically compress images, consider if you should switch to an Image CDN like Tinify CDN.

Tinify’s Developer API: New image converter feature to improve your workflow

“Can I convert JPG to WebP?”, “When will you develop a JPG converter?”, “Do you have an image converter?”. Yes, yes and yes. Tinify’s API image converter is live!

As an API subscriber, you can now convert your images from and to WebP, JPEG and PNG. Each conversion counts as one additional compression. This also means that all users can use the 500 monthly free compressions to convert their images to other formats.

How does Tinify’s image converter work?

API users can convert their images to their desired image type – for example, from PNG to JPG, or vice versa. 

As an API user, when you upload an image, you can convert it by making a “convert request”. In this request, you must specify the “image type” – that is, the format you wish to see returned. 

In addition to this, you can choose the option of returning the smallest of Tinify’s supported image formats (WebP, JPEG and PNG). For this, you need to specify multiple image types in your request. For example, if you specify two formats, Tinify’s API will convert the image to both formats and return the smallest type. 

Together with this, we released the “transform” option. This allows you to convert an image with a transparent background to a color of your choice, which is required if you want an image type that doesn’t support transparency (e.g. from PNG to JPEG). 

Why use Tinify’s image converter?

This image converter feature was one of the most requested by our users. It’s easy to understand why: there are plenty of image converters – some online and even for free – but most don’t compress images!

Tinify’s Developer API was first designed for image compression, but we’ve been working on new features since then. The most recent one was image resizing, which allows users to compress an image and generate other image sizes. The option to convert images into other formats is another step to further streamline the process for developers.

More importantly, this goes hand in hand with SEO strategies. For instance, Google PageSpeed Insights (which you can use to test and improve your website’s performance) advises users to switch to next-generation image formats, such as WebP. This means that its search engine prioritizes this image format. Tinify’s image converter makes it easier to comply with this requirement since you can easily convert your images to WebP. 

Getting into the WebP wave

WebP is an image file format created by Google for web use and it is supported by the main browsers (Chrome, Firefox, Edge, Opera, etc). It enables small file sizes while preserving the quality of images as much as possible. In this way, WebP images are smaller in size than PNG and JPEG images, making your website load faster. In this way, your users have faster access to your content and fewer bandwidth costs – which is especially important for mobile users.

Even though WebP is by definition smaller than other image types, it is worth noting that this image type can be even more optimized – Tinify’s algorithm does this automatically.

Image converter example - JPEG vs. compressed WebP
(Illustrative example)

API users can find all the information needed to start converting their images here. We also want to hear your thoughts on this feature – feel free to test it out and tag us on Twitter.

When will we have an online image converter?

It’s on our roadmap to have this feature available for the web interface. As soon as this is done, we’ll notify our users on Twitter and LinkedIn – follow us there so you don’t miss out on it!

TL;DR

  • Great news for our API users: you can now convert your images to other image types – WebP, JPEG, and PNG. 
  • It was one of the most requested features since other converter tools don’t compress images – now, you can easily do both.
  • The highlight here is that you can convert your images to WebP, which can improve your SEO.

Looking for an image size reducer? Learn 5 techniques to better optimize large images beyond compression

“Make PNG smaller”, “how to compress JPEG to 50KB”, and “image size reducer” are a few of the things users type to find a way to compress large images into small ones. However, there is more that users can do than compress their images. While this is key – after all, that’s what Tinify is about! – there are other ways to make sure your images are the smallest size possible.

Large images can slow down your website, which may lead to a negative user experience and even lower search engine rankings. While this may sound obvious, it is common for new bloggers and inexperienced website users to overlook this. The excitement of seeing our little corner of the internet come to life can make us blind to more technical points – like whether our website is taking two seconds more to load than what is recommended. 

So, if your website visitors are first presented with a loading symbol before accessing your content, keep on reading!

Let’s go over some tips and techniques for optimizing large image files to ensure that your website stays fast – including using an image size reducer:

  1. Use the right image format
  2. Use the right image dimensions
  3. Compress your images with Tinify’s image size reducer tool
  4. Convert your images to WebP
  5. Use lazy loading and image caching

“Panda promise” that this will work!

Use the right image format

The first step in optimizing large image files is to choose the right image format. The reason for this is that image formats make a big difference in terms of file size. For example, PNGs end up being larger in size than JPEGs. That’s why JPEG, the most common image format, is the best choice for photographs, while PNG should be used for web graphics, logos, charts, and illustrations, particularly because it handles transparent backgrounds.

Knowing these differences will help you save your images in the right format, which will ensure your website isn’t populated with image formats that are larger than necessary.

Use the right image dimensions: resize and crop images

Another factor that can affect the size of an image file is its dimensions. It’s usual for new website owners to overlook the size of their images, but with this, they might end up uploading too many large images.

Since most websites only display images at a specific size, find out the recommended sizes and resize your images according to them. For example, if you want to upload a header image to WordPress, your image doesn’t need to be larger than 1048×250 pixels. In the end, resizing decreases the file size even further, which will make your website load faster. 

You can resize and crop your images with built-in software on your computer. For Windows users, you can check this link for instructions on how to resize images using Paint. For macOS users, you can use Preview – learn how to here.

If you’re a technical user, you can sign-up for Tinify’s Developer API, which gives you the chance to resize your images within your code, as well as smart cropping options.

Use an image size reducer: Compress your images with Tinify

Another effective way to optimize large image files is to compress them. Image size reducer tools compress the file size of an image by removing unnecessary data and reducing the number of colors. Compression tools are quite effective at reducing the size of large images without any noticeable loss in quality.

According to the e-commerce platform Shopify, a good rule of thumb is to keep your image file size below 70KB. This can be difficult to achieve with large images, and that is why they recommend using image size reducer tools, like Tinify.

You can use Tinify as your go-to image size reducer tool.

While some compression tools give you the chance to choose the level of compression, Tinify’s algorithm is designed to optimize images to their fullest extent at the click of a button. So, when you upload an image to Tinify, we will analyze each image, and based on this, the best optimization level will automatically be determined. There’s so much website owners have to worry about that it’s important for us that they can save time in the process of optimizing their pictures.

If you have a website, you can use Tinify’s analyzer to discover how much loading time you’ll save by compressing your images.

To compress them, you can drop them directly to Tinify’s homepage and upload the compressed image back to your website. Free users have a limit of 5MB per image, but if you find yourself stuck with larger images, you can take advantage of our Web Pro subscription. For WordPress users and developers, there’s an easier way to compress images. All you have to do is to create a Tinify API account, and all your images will automatically be optimized for free up to 500 compressions. 

Convert your images to WebP

Okay, perhaps now your website loads faster than ever – no loading symbol to exhaust your visitors! However, when you add your website to Google’s web analyzer, you realize that more can be done to optimize your images… Like converting them to next-gen image formats. Unlike JPEG and PNG, next-gen image formats were created for web use, which means they’re smaller in size to load faster. 

One example of this is WebP, created by Google. It is similar to JPEG and PNG, but it can produce smaller image file sizes while maintaining the same quality. In this way, you can replace your PNG and JPEG images with WebP to cut even more on loading time. The downside is that this image format only works in modern browsers (Chrome, Firefox, Edge, Opera, etc), so you need to have a fallback option for Internet Explorer and older browsers. 

You can convert your images to WebP online or with Photoshop, and compress them after with Tinify. If you’re a technical user, you can take a look at Tinify’s API to automatically convert your PNG, JPEG, and WebP images. We hope to make this feature available to browser users later this year.

Use lazy loading and image caching

Once you’ve optimized your images, you can also implement a few things on your website to make them load in the best possible way. 

One trick is to implement lazy loading, a technique that delays the loading of images until they are needed. In other words, you can use lazy loading to defer the loading of images until the user scrolls down to the part of the page where they’re displayed. This can improve the initial loading time of the page and reduce the amount of data that needs to be transferred over the network. 

To implement lazy loading, you can use a lazy loading plugin or JavaScript libraries, such as LazyLoad, Lozad.js, and unveil.js. You can also use HTML attributes: the loading attribute can be used to specify the loading behavior of images. The attribute can be set to lazy which will only load the image when it comes into view. This is a native browser feature and is supported by most modern browsers. All in all, these tools allow you to specify which images should be lazy-loaded and when they should be loaded.

Lastly, another technique you can implement is image caching. It’s a technique that involves storing copies of images in a cache which stores the image temporarily in a proxy server or a browser cache. Image caching can be useful for reducing the amount of data that needs to be transferred over the network. It can also help to reduce the load on servers, as it reduces the number of requests that need to be handled. 

For example, a web browser will typically cache images that are downloaded as part of a webpage, so that they don’t need to be re-downloaded each time the user visits the page – this is one of the reasons why cookies exist. You can use a caching plugin for this, or a CDN (Content Delivery Network) so your images are served to users from a server that is geographically closer to them.

If you’re curious about this, Tinify’s CDN might be for you! Tinify’s CDN caches optimized versions of images, which makes it an “all in one” tool for reducing, compressing and caching your images.

TL;DR

If you’re stuck with large images that slow down your website, remember that using only an image size reducer might not be enough to solve this issue. Here are 5 ways to reduce and optimize large image files:

  • Use the right image format: JPEG for photographs and PNG for web graphics, logos, charts, and illustrations.
  • Use the right image dimensions: resize and crop images to the appropriate size by checking the appropriate dimensions for your website.
  • Compress your images with Tinify: Large images can be compressed by a lot with our image size reducer tool without any noticeable loss in quality.
  • Convert your images to WebP, a modern image format that can provide smaller file sizes than JPEG or PNG.
  • Use lazy loading to only load images when they are needed, and image caching to store images so they are served faster to your users.

Take advantage of next-gen images to make your website faster in 2023

One of the most read posts in Tinify’s blog is about WebP, a next-gen image format that offers better compression for a faster website. WebP – together with HEIF, AVIF, and JPEG 2000 – is slowly replacing the usual JPEG and PNG image formats. But while they aren’t new, only now more and more users are jumping on the bandwagon and serving images in next-gen formats. If you’re behind on this, don’t worry – the beginning of this new year is perfect timing to take your visuals to the next level.

In this blog post, we talk about:

  1. What are next-gen images and examples;
  2. Which next-gen image format is the best for your website;
  3. What are the advantages of using next-gen images;
  4. How to convert your images to next-gen formats using Tinify.

Ready? Let’s dive in!

What are next-gen images?

Next-gen (short for next generation) images are newer file types that were designed to render faster on the web. Unlike traditional image formats such as JPEG and PNG, they offer better compression, meaning that they can be smaller in file size while still maintaining high quality. 

These new formats include WebP, AVIF (AV1 Image File Format), HEIF (High-Efficiency Image File Format), and JPEG 2000 (JP2). Here is a summary of the key differences between these formats:

  • Compression algorithm: JPEG 2000 uses a wavelet-based compression algorithm, while WebP uses the VP8 and VP9 video coding formats, HEIF uses the HEVC (High Efficiency Video Coding) standard, and AVIF uses the AV1 video coding format. Wavelet-based compression can offer better compression ratios and image quality than the block-based compression algorithms used by VP8, VP9, and AV1, but it can also be more computationally intensive to decode.
  • File size and compression ratio: AVIF has the potential to achieve the best compression ratios and smallest file sizes of these formats due to its use of the AV1 codec. HEIF may also have an advantage in terms of compression ratio and file size due to its use of the HEVC codec. JPEG 2000 and WebP may have slightly larger file sizes, but can still offer good compression and image quality.
  • Features: All of these formats support lossless and lossy compression, as well as transparency. WebP also supports animation and color profiles, while HEIF supports 16-bit color depth and the ability to store multiple images in a single file. AVIF and JPEG 2000 do not currently support animation or color profiles.

Which next-gen image format is the best for your website?

In terms of compression ratio and file size, AVIF probably yields the best results. JPEG 2000 might also offer good compression ratios, but its wavelet-based compression algorithm can be more computationally intensive to decode, which may affect its performance in some applications.

In terms of browser support, WebP is currently the most widely supported of these formats. It is supported by all modern browsers, including Google Chrome, Mozilla Firefox, Microsoft Edge, and Apple Safari. AVIF and HEIF are also supported by many modern browsers, although their support is not as widespread as WebP. JPEG 2000 is less widely supported than the other formats, with limited support in some modern browsers.

Overall, all these formats offer good compression and image quality, but WebP has become the go-to next-gen image format due to its wider browser support. According to Google, WebP can reduce file sizes by up to a third compared to JPEG and PNG images. The only catch is that it is not supported by older browsers, such as Internet Explorer. However, a way around this is to have JPEG or PNG as a fallback and serve these instead in older browsers.  

What are the advantages of using next-gen images?

There are a few different ways in which using next-gen image formats can help you optimize your website. One is that they can help reduce the file size of your images, which can speed up your website’s load time. Another way is that they can improve the quality of your images, making them look better and more professional.

Moreover, next-gen images can also help you save money on bandwidth costs. This is because they are typically more efficient than traditional image formats, meaning that they use less data to achieve the same quality level. This means that you won’t have to pay as much for bandwidth when using next-gen image formats.

In a nutshell, these are the major benefits:

  • Smaller file sizes: Next-generation image formats are typically more efficient at compressing images, which can result in smaller file sizes. This can be especially beneficial for websites that need to load quickly.
  • Improved image quality: Some next-generation image formats offer improved image quality, especially at smaller file sizes. This can be useful for images that need to be displayed at a high resolution or with a lot of detail.
  • Enhanced features: Some next-gen images offer enhanced features that are not available with traditional image formats. For example, some next-generation image formats support transparency or animation, which can be useful for certain types of images.
  • Better performance: Next-gen images can often be decoded and displayed more quickly than traditional image formats, which can improve the overall performance of a website.
  • Reduced bandwidth usage: Using smaller file sizes can help to reduce the amount of bandwidth required to transfer images, which can be beneficial for websites with a large number of visitors or a global audience.

If you are still in two minds on whether you need to convert your JPEG and PNG images on your website, remember that even a one-second difference in loading time can have a big impact. According to Website Builder Expert:

  • A 1-second delay reduces customer satisfaction by 16%.
  • 40% of users wait no more than 3 seconds before abandoning a website.

Besides this, using next-gen images can help you boost your SEO. One of the biggest recommendations of the web analyzer Google PageSpeed Insights is to switch to next-gen image formats, such as WebP. So, if you want to rank higher on Google’s search engine, converting your website images to next-gen formats is worthwhile.

How to convert your images to next-gen formats

Since we launched the new image converter feature for Tinify API users, WebP has been the most converted image type – around 80%. If you’re an API user looking to improve your website speed, this new feature allows you to do that in just one step, simply by making a “convert request” in your code. The Tinify algorithm will automatically convert and compress your images. This assures that you have the smallest version possible of your image without losing quality. API users can find all the information needed to start converting their JPEG, PNG, and WebP images here

Next-gen images: JPEG vs. WebP example
Can you spot the difference?

For non-developer users – such as WordPress users – you’ll need to use a WebP image converter tool and manually upload your pictures into Tinify’s online tool to maximize the level of compression. After it, you must upload them manually to your website. In the future, along with image compression, we’ll also offer the image converter feature to Web Pro users. Keep an eye out for this on Twitter or LinkedIn!

TL;DR:

  • Next-gen images are designed to be faster on the web and offer better compression, allowing for smaller file sizes while maintaining high quality;
  • Examples of next-gen image formats include WebP, AVIF, HEIF, and JPEG 2000;
  • WebP is the most widely supported of these formats, but fallback options are necessary for older browsers;
  • Next-gen formats will improve your website speed and SEO, according to Google;
  • API users can convert PNG and JPEG images to WebP with the new image converter feature. 

Image compression plugin: Better images with Tinify WordPress Plugin

A simple way to increase the loading time of your website is to compress the images. If you have a WordPress website, Tinify’s image compression plugin might be very helpful. This plugin can automatically compress all your images by integrating with the popular image compression services from Tinify. You can choose between the different compression options, just how you like it!

Pros and cons WebP images

WebP is a by Google created image file format especially meant for web use. It’s a format that was created in 2010 but it’s still not widely used after all these years. The images can save a lot of storage and can make your webpages way faster which increases the user experience. However, the format is not supported by every browser yet and there is a risk of quality loss. Since more browsers accept the format, it’s getting more and more popular.

Developer API’s for better and faster image compression

An Developer API is a quick solution to compress a lot of images on your website in no time. Instead of manually uploading all your photos within an online compression tool, an API can do it all at once. It saves you a lot of time and besides, compressed images make your page speed way faster. It has a positive influence on how long users will stay on your webpage. But what is an API and how can you compress images with it?

WebP images: why should you use them to improve your website?

WebP is an image file format created by Google that is meant for web use. It enables small file sizes while preserving quality. There is barely a contrast between your original picture and the WebP image and there can be minimal quality loss or no loss. By using your files in WebP format on your website you save a lot of data storage which ensures that your website loads faster.