Free Birthday Banners €¦ · Free Birthday Banners . Free Birthday Banners . Free Birthday Banners
Web Banners
description
Transcript of Web Banners
![Page 1: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/1.jpg)
Fundamentals of Web Design
Web Banners
![Page 2: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/2.jpg)
Also known as a banner adA form of advertising on the World Wide WebIntended to attract traffic to a website by linking to the site of the advertiserConstructed from an image—usually GIF or FlashOften employs animation, sound or video to maximize presence
What is a Web Banner?
![Page 3: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/3.jpg)
Usually designed in a high-aspect ratio -- tall and skinny Sometimes called a Skyscraper AdHas more impact because it stays on the screen longerCosts more to post(usually 600 x 120)
OR wide and short (usually 728 x 90)Costs less to post, but scrolls off the screen quickly
Design
![Page 4: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/4.jpg)
Typical Sizes
![Page 5: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/5.jpg)
The orange ad in the upper right is 250x250 pixels. Ads this size or larger can be found within the text of articles in some cases. They act like magazine ads that break up the text to get more attention.
![Page 6: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/6.jpg)
On this page you can see a narrow strip for Netscape at the top, a standard banner ad, a square AOL ad mid-page, and four smaller ads along the bottom.
![Page 7: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/7.jpg)
On this page there is a round WSJ button up top along with ads for Casio, Ubid and Radio Shack along the side. At the bottom there are tiny ads for four money sites along with small ads for CareerBuilder.com and WSJ.com (even the advertising is sponsored!).
![Page 8: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/8.jpg)
In Fireworks, use the states panel to create multiple images Use the frame delay to allow the viewer to “read” the image
How to Create
![Page 9: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/9.jpg)
State 1
State 2
State 3
Example
![Page 10: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/10.jpg)
End Result
![Page 11: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/11.jpg)
![Page 12: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/12.jpg)
![Page 13: Web Banners](https://reader035.fdocuments.net/reader035/viewer/2022062310/56815f11550346895dcdd325/html5/thumbnails/13.jpg)
Twist and Fade Image Effect
Silver Metallic Text Effect
Beveled Edge
Neon Text