Web Banner Ad Design

Hello!
I'm in the process of designing some web banner ads and although Photoshop and Flash are the first obvious choices for designing them, I'm not sure what is the best choice. I've created simple animated GIFs with Photoshop but the client might be looking for something a little more complex as far as animation.The requirements for these ads are below and don't know if this limits what I can and can't do and/or application to use or not use.
728x90px ad, no larger than 80kb, .jpg or .gif format
300x100px ad, no larger than 80kb, .jpg or .gif format
I would love some feedback as to best practices. Thank you in advance.
~Erick

Flash is a dead web technology because the world's most popular web devices (iPhone, iPad, iTouch, Android...) do not support Flash. Also, Flash animations are typically much larger than 80KB.
The current trend in web design is to use jQuery or a combination of web technologies (CSS3, HTML5 and JavaScript) for interactive & animated web content. See Adobe Edge Animate below. But your output file size will definitely exceed 80KB.
http://html.adobe.com/edge/animate/
Given your 80KB limitation, I think the best you can do is static jpgs or smaller animated gifs in Photoshop.
Good luck with your project!
Nancy O.

Similar Messages

How do I slice an image for a web banner and upload it to my website?

Hi there! I am trying to slice an image into a web banner to upload it as the headed to my website layout. I have previously done this before, but a few months ago my computer crashed and I lost everything. I have a new computer now (Macbook Pro running 10.9.3) and downloaded a free trial of CS6. I vaguely remember what I am doing but am apparently way out of practice.
I have tried at least a dozen different times to slice the banner and add the links, but for one, it keeps showing up with gaps in the image when I try and preview it on my computer. I cannot figure out why. Secondly, when I try to save it for the web as HTML and images, it is not working. It keeps saying something about needing to replace targets, etc. I am honestly lost and when I had originally made my website two years ago I don't remember it being nearly this difficult. I have some moderate HTML/CSS web design skills but I'm not sure if I am having a brainfart or what.
Secondly, I cannot get the files to upload properly to my web server. I use FatCow as my host if this makes any difference. I've been watching tutorials on Youtube and trying to refresh my memory but I am so lost.
Thanks!

Can you save images via Tools > Page Info > Media ?
The usual way to save an image is via the right-click context menu > Save Image as.<br />
If you have a Mac without a right mouse button then see:
* http://kb.mozillazine.org/ui.click_hold_context_menus

Web Banner Image Fade

I'm an experienced Java Architect with no experience of JavaFX. I'm trying to develop a proof of concept Flash-style web banner to see if it is feasible to replace existing Flash elements on my client's site with JavaFX elements, thus removing the need for a costly proprietary RIA toolkit.
Now the banner in question takes a physical URL from an XML document, loads a set number (also configured in a simple XML document) of images horizontally across the banner. It fades each image out independently and once invisible, it replaces that image with another random image from the URL and fades back in (ensuring it doesn't already exist in the other visible images). Whilst doing this, a quote is displayed across the images in a colour set by the XML file, and this quote fades in and out as well, changing to another quote from a set list, and fading back in once the new quote is found.
Now I'm sure I can figure out some of the more typical functionality that I come across with Java, C++, etc. on a daily basis, such as interacting with an XML document, and loading images from URLs (perhaps), but the actual timing, fading, working loading new images and quotes at the right time, etc. is all new as I tend to develop business systems and not applications with visual effects. So help is needed on how to best go about doing this. I've begun with a very basic attempt at a Stage and tips on going forward would be appreciated.
Also, as a side note, in JavaFX how would I extend the Stage and Scenes, and any other object, essentially, and then load them as variables...? remember I'm an OO-oriented Java and C++ programmer, so I understand inheritance, but cannot seem to find the right syntax in JavaFX after an hour working on this basic Flash-eliminating challenge.
My code is below:
package ribbon;
import javafx.animation.Interpolator;
import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.scene.paint.Color;
import javafx.scene.Scene;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;
//capture the dynamic width and height of the scene
var width: Number = bind scene.width;
var height: Number = bind scene.height;
var quote: Text = Text {
    font: Font {
        size: 16
    x: 10,
    y: 30,
    fill: Color.RED
    opacity: bind angle
    content: "Interesting quote goes here..."
var scene: Scene = Scene {
    fill: Color.BLACK
    content: [
        Rectangle {
            x: 0,
            y: bind height - 30
            width: bind width,
            height: 25
            arcHeight: 5
            arcWidth: 5
            fill: Color.BLACK
            opacity: 0.5
        quote,
var angleStart = 1.0;
var angle = angleStart;
var fade = Timeline {
    keyFrames: [
        KeyFrame {
            time: 0s
            values: angle => angleStart tween Interpolator.LINEAR
        KeyFrame {
            time: 3s
            values: angle => 0.2 tween Interpolator.LINEAR
    autoReverse: true
    repeatCount: 1000
var stage = Stage {
    title: "Photo Ribbon"
    width: 680
    height: 100
    scene: scene
fade.play();
stage;Thanks in advance.

If the banner image is not displaying, it is either not in an acceptable web file format (optimized for web as jpg, gif or png). Or it is corrupted. Or the path to the image file on server is broken.
It's impossible to say more without a link to your problem page.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/

MUSE CC WON'T DISPLAY BEBAS NEUE WEB FONT IN DESIGN MODE

For some reason I can't seem to view the Bebas Neue web font in design mode any more, yet when I switch to preview or even go ahead and publish my site it works just fine.
It wasn't bothering me too much at first but it really confuses things after a while as I have to guess the sizes and spacing because the font that appears instead of Bebas Neue is Times New Roman (or similar).
All the other web fonts are working just fine. I've tried to reset the web fonts and apply them again but had no luck, and I even closed and restarted Muse CC several times but again, nothing!

Please refer to the following thread for a solution - http://forums.adobe.com/message/6259161.
Thanks,
Vinayak

Web Banner with Video: How to start a flash animation ONLY after .flv is finished loading.

Hi,
I am making a 10 sec. web banner and am required to use a video that is on an external server. I had no problem getting the video file converted, uploaded to the external server and it is now playing back perfectly after exporting the .swf file.
The problem I am having is that my animations (mostly text items, which are placed very carefully throughout the .flv movie) aren't matching up with the movie's movements (due to the .flv starting later due to streaming – I am assuming).
How would I go about syncing these two things, so that the animations always line up exactly with the video's movements? Something like a preloader would be totally fine. I've also read about 'Cue Points' but they seem to be a little unnecessary for what should be a simple 10 sec. banner.
Also the .flv itself is exactly 10 sec. long, but the banner is 13 sec. long so that the last screen (with the most important information) is shown statically for 3 sec. Should I be doing anything to compensate for this other than simply adding the 3 sec. in the timeline in flash, and letting the .flv restart when the entire .swf starts looping?

use cuepoints in the video to sync your swf movieclips/timelines with your video.

Problem with the icon "Display query on the web" in Query Designer

Hi Friends,
         I was told by my PM to give them all FI Modules standard business contenet reports, so for that reason i have installed all FI business content & loaded the data in the Dev Server, now i just want to show the reports, but i want excute these reports in Internet Explorer using the Icon "Display Query on the WEB" in query designer, when i click on that it isn't getting displayed in the browser.
         the URL coming like this, "http://itcchqbd:8100/sap/bw/BEx?sap-language=EN&bsplanguage=EN&CMD=LDOC&INFOCUBE=0FIAA_C11&QUERY=0FIAA_C11_Q0001&VARIABLE_SCREEN=X&DUMMY=1"
getting the message in the page, the page can't be displayed,
          How to solve this problem & how do i have to show the standard business content reports to all FI Superiors ?
awaiting for ur answers
Regards,
Balaji

Balaji,
first check if you have enabled web reporting on your BW server ( there is a how to paper for the same )
another way to check out the same is to find out if there are existing web templates being published which would make the server web ready.
As for FI content - activate the FI relevant areas in Business content and then activate the respective datasources and then load the data.. or go trough the best practices for BW-FI ( service.sap.com/bestpractices) wnd then activate the best practices for the same.
Hope it helps.
Arun
Assign points if useful

Orchestrator 2012 SP1 Update Rollup 2 - Runbooks missing in web console and designer after moving to new folders

I've run across an interesting problem. After applying SP1 update rollup 2, I decided to re-organize my runbooks by placing them in a new folder naming structure.
I created the new folder structure under the runbook server in the runbook designer. I then right clicked and moved the runbooks to their new location. Everything was fine until windows updates were applied (Windows 2012) and the server was restarted.
After the restart, the runbooks are missing from both the designer and the web console.
I saw posts about truncating the Authorization Cache. I did that (see below) but that has not resolved my issue.
TRUNCATE TABLE [Microsoft.SystemCenter.Orchestrator.Internal].AuthorizationCache
EXEC [Microsoft.SystemCenter.Orchestrator.Maintenance].EnqueueRecurrentTask 'ClearAuthorizationCache'
EXEC [Microsoft.SystemCenter.Orchestrator.Maintenance].EnqueueRecurrentTask 'Statistics'
Not all the runbooks are missing. Some are visible. However, if I view the runbooks via SQL by querying Orchestrator.dbo.Policies, I see all of the runbooks. They just all don't show up in the designer.
SELECT * FROM [Orchestrator].[dbo].[POLICIES] Order by Name
The ones that are missing are always the same when the web console or designer is run (designer ran with and without elevated permissions).
Has anyone else seen this behavior? How do I get the runbooks to show back up in the correct folders? Or, how can I get them to show up anywhere so I can move them to the appropriate location?
Thank you
Ted

Hi Ted,
sometimes seen similar.
It's not supported to manipulate the Orchestrator DB with SQL, but I know only to fix it with SQL statements.
All information below without warranty!
There's a column named Deleted in table Policies. Look with your select statement above if the Runbooks have the deleted flag. If yes, update it to 0.
But, I guess not. I think the previous containing folder has the deleted flag (table folders) and the Runbooks have still this folder as ParentID.
SELECT POLICIES.Name AS RunbookName, FOLDERS.Name AS FolderName, FOLDERS.Deleted AS FolderDeleted
FROM POLICIES INNER JOIN
FOLDERS ON POLICIES.ParentID = FOLDERS.UniqueID
WHERE POLICIES.Name = 'Name of one Runbook'
If so, change the deleted flag from the containing Folder:
UPDATE FOLDERS
SET Deleted = 0
FROM POLICIES INNER JOIN
FOLDERS ON POLICIES.ParentID = FOLDERS.UniqueID
WHERE (POLICIES.Name = 'Name of one Runbook')
after that Restart Management Service and Refresh view in Runbook Designer
Good luck!
Stefan
www.sc-orchestrator.eu ,
Blog sc-orchestrator.eu

Web Banner Crop Help

Hi there,
I have been asked to take some photos for a company's web banner. The dimensions are 1024 x 300 px.
I have taken the image and used PS to crop it into the right size, but after saving the image, it displays the size as 900 x 264 px. Does anyone know why this is happening and how to get around this?
Thanks in advance!

Thanks for your reply.
I really don't understand. I open the jpeg in photoshop. Go to crop and under size & resolution put in 1024 x 300 px. Once happy with the crop, I save the document as a Jpeg. I don't decrease the quality - it stays on maximum. But sure enough when I check the properties of the newly saved image, it displays as900 x 264 px.

How do I compress a huge flash file for a web banner?

Hi there,
I am having trouble figuring out how to compress a huge flash file for a small web banner. I have 3 jpeg sequences (lowquality) that are used as background animations and the swf file is now over 900kb. I need a file under 200 or even 100.
thank you for your attention,
Ayka

The only way to reduce the size of the file is to reduce the sizes of the content it has. If you go into your Flash Publish Settings and choose the option to generate a a size report then it will publish a report that will let you know how the weight of the file is distributed and you can focus on eliminating that weight from there.

Web banner looks different in Safari

I replaced a Web banner on a site I do work for and it looks different in Safari then in FireFox and IE.
The banner blends in to the background in the other browsers but the color appears "off" in Safarai.
Is there anything I can do to fix this? I have never had this problem before.
Here is the site: http://www.ehealthinnovation.org (the banner is at the top).
Thanks.
Brian
Mac OS X (10.4.5)

I'm no expert on this by any means (so anyone out there please correct me if wrong) but I think it's to do with the color profile attached (or lack of) to the jpg used in the banner.
This post by -g has some more information that might be useful.
If all else fails, try changing the image to be a gif instead.

General info about web banner ads

Hi, I regularly work in Photoshop, Illustrator, InDesign & After Effects but now need to learn how to produce animated online ads for Web Banners etc. As far as I understand Flash is the good choice of programme for this. I have been told that iPads don't play web banner .swf files and require a different format for their banners, can anyone advise on what this is and can these be produced in Flash? Apologies for the extremely open question, I just need a steer in the right direction. Thanks, Andy

Most basic animations (which are most banners) can be performed solely with some JavaScript, and more advanced banners can utilize HTML5's canvas for effects. These will be visible on mobile as well as any decently modern desktop browser (last ~4 years) and this can be created to some extent with Flash Pro CS6.
What type of animation are you looking for? Please be as descriptive as possible on what you'd like to see happen. Then a solid suggestion on how to approach it can be made.

Simple web banner with links

I give. I've tried and tried to google, check forums, etc. and cannot find the exact answer to what I believe should be simple (if you know what you are doing).
I need a simple rotating web banner with three photos. Each photo represents a different event and needs a different link to a different brochure.
I have Dreamweaver CS3, Photoshop CS and Imageready CS.
Please help if you have a moment to spare. I would greatly appreciate it!

NivoSlider is one option that can do what you want.
http://nivo.dev7studios.com/features/
http://nivo.dev7studios.com/support/jquery-plugin-usage/
To link the images, just wrap the images inside <a> tags, as per the usage page.

Running web forms6 with designer Vs IE5

Hi every one
i am running forms 6 with oracle 8.0.5 and OAS 4.0.7 on windows
NT 4.0 with SP3.
when i try to run froms6 on the web through the designer for
testing purpose some of the forms run with out a problem and some
of them with errors specially when trying to exit from the forms
give exception error.
while when i run the same forms through the IE5 there is no error
and they run fine.
what could be cause can some one explain is it the some JDK mis
match or what.
mobeen
null

If you are trying to deploy forms on 3-tier, you will need two things.
1. you will have to configure your formsweb.cfg for running your applications.
2. if you want to deploy forms using Internet Explorer you will have to modify your base html file accordingly. If you are using Netscape Navigator, you will need Oracle jinitiator.
you can also mail me at :
[email protected]

How do you create a realy good web banner with changing pictures? I'm struggling to resolve this as I'm only a car detailer struggling with all this designing stuff.

I am using a CSS template from xsite p@ro and I can access my html script easily enough to make any edits: http://www.briansautodetailing.com.au/ I need to know what software I should purchase to create a changing header image. I would like to have larger pictures and have them change..Just a bit nicer to look at I guess.
Thanks for any responses in advance
Brian

Hello Brian,
in addition to osgood_'s hint, here some links to nice sliders:
http://sandbox.scriptiny.com/javascript-slideshow/
http://jquery.malsup.com/cycle/
http://wowslider.com/best-jquery-slider-crystal-linear-demo.html
http://www.jcoverflip.com/demo
http://www.jacksasylum.eu/ContentFlow/
http://addyosmani.com/blog/jqueryuicoverflow/
Have fun when choosing!
Hans-Günter

How to creating a web banner in Flash CS3?

Hi all,
I'm very new to Flash CS3. Can anyone give me a step-by-step
instructions on how to make a banner for a web-site? Or a link were
i can find step-by-step instructions?
I have googled it but found no real help. I have tryed
"Youtube" hoping to even fine any one (most likely a child) with
directions on how to do this. Funny thing is that it seems most 8
year olds are better at Flash CS3 than I am & i'm 45.
Anyway, if you can help please make it simple or for the
simple minded. :)
Thanks to all!!
BJ

I understand your pain...I just posted a similar request
earlier today for help but finally figured it out on my own. I've
done lots of searching online and used Adobe's Flash Classroom in a
Book and also took an online ed2go class and I still don't have a
good handle on Flash. Nothing seems to give clear step by step
directions on animating images for web banners. You just have to do
a lot of trial and error. These websites may help if you don't have
time for the classes:
http://www.smartwebby.com/Flash/default.asp
http://animation.about.com/lr/flash_animation/150331/1/
mek113

Web Banner Ad Design

Similar Messages

Maybe you are looking for