Just Say No To Flash!

Make Your Site Say No To Flash

It's easy! Just follow these two steps:

1. Download the Image(s)

You can copy and save one of the following images, or download the Photoshop source and make your own. The banner comes in two flavors: "Just Say No To Flash!" and "This Is A Flash-Free Website."

"Just Say No To Flash!" Banners:

"This Is A Flash-Free Website" Banners:


PSD file (78 KB)

2. Add the CSS

Here are two CSS styles for positioning the Just Say No To Flash banner on your web page. One positions the banner at the top-right, and the other at the bottom-right. To use the styles, just copy and paste the following code into the <HEAD> portion of your HTML.

Select the banner message you want:

In the CSS code below, be sure to change the image name to match the banner message of your HTML. The code shows use of the "Just Say No To Flash" campaign message. If you decide to use the "Flash-Free Website" message, substitue the image name with one of the following:

  • Upper-right: flashfreeTR.png
  • Lower-right: flashfreeBR.png

To place the banner at the top-right corner of your page:

  1. <style>
  2. a#noFlash {
  3. position: fixed;
  4. z-index: 500;
  5. right: 0;
  6. top: 0;
  7. display: block;
  8. height: 160px;
  9. width: 160px;
  10. background: url(images/noFlashTR.png) top right no-repeat;
  11. text-indent: -999em;
  12. text-decoration: none;
  13. }
  14. </style>

To place the banner at the bottom-right corner of your page:

  1. <style>
  2. a#noFlash {
  3. position: fixed;
  4. z-index: 500;
  5. right: 0;
  6. bottom: 0;
  7. display: block;
  8. height: 160px;
  9. width: 160px;
  10. background: url(images/noFlashBR.png) bottom right no-repeat;
  11. text-indent: -999em;
  12. text-decoration: none;
  13. }
  14. </style>

3. Add the HTML

To complete the banner, you need to add a link inside the <BODY> element of your HTML. For easy maintenance, I'd put it just after the opening <BODY> tag or just before the closing </BODY> tag.

Use A Link Title That Reflects Your Message

In the HTML code below, be sure to change the contents of the <title> and <alt> elements to reflect the banner message you've chosen. The code shows an appropriate title for the "Just Say No To Flash" banner. If you decide to use the "Flash-Free Website" message, substitute the title below with something like the following (of course, you can modify the title to suit your taste):

This is a Flash-Free Website... We use open file standards only... Not proprietary formats like Adobe Flash
  1. <a id="noFlash" href="http://www.musingsfrommars.org/notoflash/" title="Show How You Feel About Adobe Flash... Just Say No!" alt="Show How You Feel About Adobe Flash... Just Say No!">Just Say No To Flash!</a>

Please always link your image to http://www.musingsfrommars.org/notoflash/ so everyone can find the information associated with the image.

Creative Commons License This work is licensed under a Creative Commons Attribution-ShareAlike 2.5 License and was brought to you by Leland Scott, Musings from Mars.

Just Say No To Flash!