hero images – Iceberg Web Design https://www.icebergwebdesign.com Wed, 23 Jun 2021 16:01:54 +0000 en-US hourly 1 https://wordpress.org/?v=5.8.3 https://www.icebergwebdesign.com/wp-content/uploads/2019/03/cropped-iceberg-favicon-32x32.jpg hero images – Iceberg Web Design https://www.icebergwebdesign.com 32 32 How to Use Images on your Website https://www.icebergwebdesign.com/2020/11/images-on-your-website/ Mon, 16 Nov 2020 18:35:29 +0000 http://dev2020.icebergwebdesign.com/?p=15436 Early websites were text-heavy, with a few images sprinkled throughout the pages. Today’s websites have large, high-quality photos that dominate every page of your site. Finding the right ones are essential. Unfortunately, many people take shortcuts that are not in line with best practices. Here are some things to keep in mind when gathering and […]

The post How to Use Images on your Website appeared first on Iceberg Web Design.

]]>
Early websites were text-heavy, with a few images sprinkled throughout the pages. Today’s websites have large, high-quality photos that dominate every page of your site. Finding the right ones are essential. Unfortunately, many people take shortcuts that are not in line with best practices. Here are some things to keep in mind when gathering and using images for your site.

Designer Working On Images and Computer

Avoid Google Images

It is easy to do a Google search and find pictures that would look great on your site. Unfortunately, most of the images you see will be under copyright. If you use one of them, it can lead to a lawsuit with a hefty fine. There are much better ways to find images for your site, including:

  •         Taking your own pictures
  •         Purchasing images from one of the many sites that sells them
  •         Using open-source images

How to use open source images

There are several great ways to find open-source images on the web. One great source is Unsplash.  While these images are free and don’t require any attribution, giving the photographer and Unsplash credit is the right thing to do. To learn more about attribution, check out Grow’s article, “7 Best Sources for Finding Open Source Images For Your Blog.” This article includes ideas of where to look and some crucial things to keep in mind when using open source images.

Investing in an image warehouse

There are many websites where you can pay a small fee for the right to use their image on your site. You can choose to pay a monthly fee for multiple (and even unlimited) photos or pay per image.

Check out this article by Bluleadz.com for, “The 25 Very Best Stock Image Websites You Need in 2020 to Add Visual Flair.” By buying the right to use images, you can be assured that you are legally safe and ethically sound.

Using Alt Tags, Descriptions, and Image Title Tags

Often people focus on SEO for the words on their website without taking advantage of the benefits that come from optimizing their images. You can bring traffic to your website using proper alt tags, descriptions, and titles on your photos.

Alt Tags

Alternate text is an accessibility tool that tells visually impaired users to know the image by enabling screen readers to read them the alt text for the picture. Have you ever had a broken image on your site? When this happens, you see a little box with a few words next to it. Those words are the alt text. In this situation, they even benefit non-visually impaired users by sharing what they should be seeing. You can find out more about Alternative Text and how to use it in WPBeginner’s “Beginner’s Guide to Image SEO – Optimize Images for Search Engines.”

Image Descriptions and Title Tags

An image description also assists the visually impaired, but it is more detailed than alternative text. When optimizing images, don’t choose one or the other, but include both. An unlikely source for how to do this well comes from the American Anthropological Association. Check out their fascinating guide. And WP Promote shares why optimizing the image title is vital. It would be best if you always changed the image file name. Find out why and how in their guide.

Need Help?

Hopefully, this will expand your understanding of how to use images effectively. If you would like us to make things even easier for you, contact Iceberg Web Design to see how we can optimize your images and more. If you prefer, give us a call at 763-350-8762. We are web developers who answer the phone!

The post How to Use Images on your Website appeared first on Iceberg Web Design.

]]>
Everyone Needs A Hero https://www.icebergwebdesign.com/2020/03/everyone-needs-a-hero/ Tue, 10 Mar 2020 14:30:36 +0000 http://dev2020.icebergwebdesign.com/?p=14869 Heroes are one of the biggest website trends of 2020. They can help you make a powerful first impression. Not a superhero—a website hero! A hero is the first thing a user encounters on the homepage of a website. It usually takes up most of the screen space and has a minimal amount of text […]

The post Everyone Needs A Hero appeared first on Iceberg Web Design.

]]>
Heroes are one of the biggest website trends of 2020. They can help you make a powerful first impression.

Not a superhero—a website hero! A hero is the first thing a user encounters on the homepage of a website. It usually takes up most of the screen space and has a minimal amount of text with a call to action. Heroes are one of the biggest website trends of 2020.

There are many benefits to utilizing this space with a hero:

  • The hero will generally be the first image your users will encounter on your site. Because of this, they can make an impactful first impression.
  • Heroes set the stage for what users will associate with your business. Send a meaningful message.
  • A hero graphic allows users to focus in on and connect with the most important message on your homepage, rather than allowing their attention to be distracted by multiple areas of competing content.
  • Action heroes! Hero graphics are great for displaying a call to action.
  • Heroes grab the user’s attention and encourage them to view more of your site.
  •  Hero graphics are a flexible design element. You can use them to achieve the thing you want most from your web marketing. Is there a message you want to promote? Do you want to feature a new product? They can solidify your company’s image in your customer’s minds.

A hero isn’t perfect. Here are some of the flaws you may find:

  • Most hero areas are very large, so they take up a lot of screen space. While this has the above-listed benefits, there are drawbacks to them when users need to find important information quickly. You certainly wouldn’t want a hero on an emergency services website.
  • Heroes on responsive websites lose their impact on mobile devices. That’s a problem, since “Almost three quarters (72.6 percent) of internet users will access the web solely via their smartphones by 2025, equivalent to nearly 3.7 billion people.”[1]
  • Large heroes=longer loading time. Consider that “a one-second delay in page load time has been shown to cause a 7 percent loss in conversion and 11 percent fewer page views.”[2]
  • If your hero takes up the entire screen, it might be unclear to users that there is additional content below.
  • It may not be clear to users that there is more content below the hero area.

Hero Trends for 2020

Trend: Big, beautiful, backgrounds.

A great example of this is the website we built for G’s Café. G’s is an Irish Café in historic, downtown Anoka, Minnesota. The hero reflects that. The best part is that every page has one of these background images that show the mouth-watering dishes served at G’s.

Gs Cafe Website

Trend: Text Only Heroes/Minimalism

Text only and minimalism is a huge trend in 2020. When we built the site for the information technology company,Tailwind, we utilized this concept. The duotone colors and elegant lines express the concept of information and data transfer. As you scroll down, you see the result of that: action.

Tailwind Website

Trend: Hero Video Headers

Right Turn Recruiting  Is a truck driver recruiting agency that’s “dedicated to 100% driver satisfaction.” The website that we created gets that message across from the moment you open the page. Professionalism and respect for the driver are expressed through a video hero. Video heroes capture the user’s attention and draw you into the message at the same time.

Right Turn Recruiting Website

 

Trend: An Emotional Response from an Image

The site we created for the Animal Behavior Clinic of New Jersey is the perfect example of creating an emotional response with an image. If you are searching for help to modify your pet’s behavior this will grab you. Who wouldn’t love to see this in their pets? This image offers that hope.

Animal Behavior Clinic Website

Trend: Balance

A powerful image can balance a text-heavy website. That was our goal with the site we put together for Agility IRL. Agility IRL is a leadership training company. There is a lot that can be said about their service—so we say it. But, we also balance that out with beautiful images that express the goals of leadership training and coaching.

Agilityirl Website

 

If you need a hero when it comes to putting together a powerful website contact us. We are web developers who answer the phone.

[1] Handley, Lucy. “Nearly Three-Quarters of the World Will Use Just Their Smartphones to Access the Internet by 2025.” CNBC, CNBC, 24 Jan. 2019, www.cnbc.com/2019/01/24/smartphones-72percent-of-people-will-use-only-mobile-for-internet-by-2025.html.

[2] “What Is Page Load Time and Why Is It Important?” BigCommerce, 27 Feb. 2020, www.bigcommerce.com/ecommerce-answers/what-page-load-time-and-why-it-important/.

 

The post Everyone Needs A Hero appeared first on Iceberg Web Design.

]]>