Don’t let your website slow down because of incorrectly sized images!

Sizing images incorrectly for your website can have a number of negative ramifications. Size them too small and they might look pixelated, but size them too large and they might impact the SEO for your site. Images that are too large can lead to slow load times, a higher bounce rate, and a lower SEO ranking.  

Putting time into figuring out the correct image resolution is worth your time, because high-quality visuals and a high-ranking site can say a lot about your brand. 

The trickiest part is there’s no such thing as a set size. Your feature images won’t necessarily match the dimensions of your homepage banner, full-width visuals won’t mirror blog post images, carousels will differ from collages...and so on.

 So, here are a few helpful hacks to help you figure out just what size your images need to be:

Use an extension

Tip: Chrome’s favored by most web developers and designers – if it’s not already your default browser, we suggest giving it a try! It’s especially handy if you’re in the process of building a new website.

For this trick, you’ll have to download and utilize Chrome as your Internet browser. If you don’t already use Chrome, you can download it here!

Once Chrome is downloaded and installed, you’ll also need to download Chrome’s image size extension. Once installed, you’ll be able to find out the size needed for every single element of your site.

Use the inspector tool

Another way to determine image size using Chrome is the inspector tool. This tool is built in, no extension or download needed. 

Step 1: Hit F12 or right click your mouse and go to “Inspect Element.”  

Step 2: Click on the image you’re looking to determine dimensions for, and you’ll be shown the information you need. Note that the first number is always the width.

 If you’re using another browser, you can still use this method, the process might just vary slightly -- here are a couple of video tutorials for Safari and Firefox users.

Bigger isn’t always better

 New to resolution? Read up on it in this blog.

Not sure which file format to use? Get the lowdown here.

In the world of print, the higher the image resolution the better. It results in a high-quality end product and has zero negative implications. When it comes to web that philosophy is flipped on its head. 

In the online world, large file sizes can hurt you --  they can slow your page load speed down, interfere with your visitors’ user experience and even damage your organic SEO rankings. You’ll want to use an image size that still appears crisp and clear – but isn’t so large that it negatively impacts your site. Here’s a few tips for striking that balance: 

• Find out the exact dimensions you need, and resize your images in Photoshop or Canva for a tailored photo size. 

• Try not to let large images or full-screen backgrounds exceed 1MB -- if it does, it could be a sign your dimensions or resolution are unnecessarily high.

• The recommended width for full-screen backgrounds is 2000px.

• Smaller images around your site - like thumbnails, blog headers and in-content pictures, should be no more than 300MB.

• If you’ve got the option in Adobe Suite, always ‘Save for web’ -- this will ensure your image’s saved at a web-friendly resolution by default. 

---

Hue & Tone Creative: Websites for Greensboro and beyond

Already feeling overwhelmed? Let us handle your web design for you. Whether you want support finding the right photography for your site, resizing what you’ve already got, or building your website from the ground up, we’ve got the solution. Reach out at (336) 365-8559 or hannah@hueandtonecreative.com to get the process started!

Be bold and stand out from the crowd with a good meta description.

When you’re creating an email campaign you probably put a lot of thought into your subject lines, right? Because you want as many people as possible to open them.

Well, when you write a blog post or product page, do you put just as much effort into your meta description?

No? Then you might as well just tell organic visitors to check out the next search result down.

What’s a meta description?

A meta description is a snippet of text (usually around 155 characters) that appears below your page’s title in search results. It advertises the content on that page and it’s your chance to tell people why they need to click through to your site - and not your competitors. 

Time and time again though, people leave their meta descriptions down to chance, banking on Google picking a killer excerpt from their page. But, if you want to smash your SEO targets, that just won’t do. 

A properly put together meta description can:

• Improve organic click-through rates

• Increase SEO-lead visits

• Reduce bounce rates

• Support conversion targets

How to write a click-worthy meta description

1. Keep an eye on your length: Make sure all your important information is in the first 155 characters. After that, there’s a good chance whatever you write will get truncated and no-one will see it. As with any type of writing, short, snappy and to-the-point wins every time.

2. Inspire action: Let searchers know what they’ll walk away with if they enter your site by clearly communicating key benefits and inducing a sense of urgency. 

For example, if it’s a blog on ‘Why meta descriptions are important’ don’t just start summarizing the page’s content, dive straight in with the benefits, a bit like this:

Increase your organic traffic, leads and conversions today by understanding and implementing the power of your page’s meta descriptions.

3. Include a call-to-action (CTA): Remember, your meta description is your sales pitch for the page it’s linked to, so make use of CTAs like you would with any other type of advert. Phrases like ‘learn more’, ‘get it now, ‘come on in’, and ‘try for free’ ought to do the trick.

4. Use relevant keywords: Don’t go keyword crazy by adding keywords into every other word because you think keywords are the answer to your keyword problems. See what we did there? Keep it natural. 

Generally speaking, Google’s more likely to use a meta description that includes text that matches all or part of a searcher’s query. 

As an added bonus, they’ll also highlight corresponding keywords making your listing even more compelling, like this:

 5. Make sure it matches your content: Luring people into your site with misleading meta descriptions won’t work; Google’s smarter than that and they’ve been known to penalize people for it.

It’s not just for Google’s sake though. Enticing visitors in under false pretences will just irritate them and result in more bounces straight back out as soon as they realize they’ve been taken for a ride, and that won’t do your reputation any favors.

---

Hue & Tone Creative: greensboro graphic design

If you know what you need to do but you don’t have the manpower to do it, we can help. We’re pros when it comes to creating copy and design that converts. Get in touch with the team at (336) 365-8559 or hannah@hueandtonecreative.com to take the first step.