Resources, Advice & Tips for Covid-19
Read More

Animated Backgrounds of Hearts

Animated Backgrounds of Hearts

There are a few things you can do with animated backgrounds of hearts. They can be a part of a theme for Valentine's day, or an element to create a feeling of romance to a personal video. Be careful though - like any animation, it can easily turn into a distraction.

Where to Get Animated Backgrounds of Hearts?

The easiest place to get animated heart graphics is to find a source of free, low-bandwidth GIF animations. While easy to find, these Graphic Image Format files are very tiny in size for a reason: they aren't very high-resolution, and usually do not have a very smooth motion to the animation. Part of the way they keep the file size low is by having only a few separate frames to produce the illusion of motion.

However, if you make one of these GIFs the BACKGROUND IMG of your web page (something defined in the HEAD section of the document, easy enough to figure out with a basic understanding of HTML) you will have an animated background of hearts on your web page.

Take a close look at the animation. Odds are that it is so busy and active that it takes away almost any ability for the viewer to see other things on your page. MySpace is full of pages where people think this is a good idea, and it makes web designers cringe when they see it. It's better to use a bit more subtlety when using animated hearts to add flavor to your page.

The Subtlety of Flash

Flash is another animation tool that can be used to create an animated background of hearts on your website that will be less obtrusive than a GIF. While it's a little more complicated to use - you can't just plug it in as a background image. However, in the full range of Flash programming, making an animated heart move is a fairly basic task.

Better yet, Flash offers you much more control over things like rate of motion (making it less distracting) and opacity control (making it easier to see other content on the page). Better yet, you can use one "instance" of a heart image multiple times with no increase in file size - for example, having a large, semi-transparent drifting heart slowly moving behind your content, but having a flurry of dark crimson hearts fluttering about as a "transition" between pages. For that matter, you can be creative with your background - for example, for about a dollar you can get an animated heart effect to follow your user's mouse around from Buy Stock Flash.

Other Ways to Use Animated Backgrounds of Hearts

You can also put animated backgrounds into chat windows on some instant messenger platforms such as Yahoo. These are usually integral parts of the programs, and require nothing more from you other than selecting that background in the applications preferences. Apple's iChat application will even let you have an animated video of hearts flowing in your background while you video chat with someone.

However, to do that you would have to get a video animation of hearts - while Flash can be exported as a QuickTime video file, getting it to look right in a video chat or personal video will probably be more complicated than it needs to be. There are many sources of stock video animations on the web - even traditionally "static" image vendors like iStockPhoto have started offering stock video files that are professionally produced and easily dropped into any video project.

Making Sure It Works

The problem you will always face with animated backgrounds of any kind, hearts or not, is the persistence of motion. The human eye is conditioned to respond to motion, which means that there will be a constant struggle for your viewer to read your content (which is usually static text) and watching the pretty moving hearts. Make sure to take a very serious look at your site, and ask others for their opinion about the effect. If it takes away from your full message, you may want to simply go with a static image and let your content do the work.

Animated Backgrounds of Hearts