+- Webnetics UK Ltd. - Forums (https://www.webneticsuk.com/forum)
+-- Forum: News & Announcements (https://www.webneticsuk.com/forum/forumdisplay.php?fid=2)
+--- Forum: VWDesigns Blog (https://www.webneticsuk.com/forum/forumdisplay.php?fid=12)
+---- Forum: Designing (https://www.webneticsuk.com/forum/forumdisplay.php?fid=19)
+---- Thread: Banners, design tips (/showthread.php?tid=119)
Banners, design tips - webnetics - 06-09-08
When we think of the endless hours of life lost on shaving off a vital few K in pursuit of optimisation nirvana, it's easy to become philosophical. So we Web designers and developers are natural problem solvers and these restrictions need not limit creativity — in fact they can enhance it.
Preparation: Make sure a creative schedule is supplied, containing vital information such as banner dimensions, placements and the all-important file sizes. Without this information we could be designing a banner that doesn't meet the client's requirements and end up wasting valuable time and money.
Communication: Some of our clients have high expectations for the banner; video and sound are common requests. It's up to us to explain that their expectations may be unrealistic. It's all about guiding the client in the right direction for the job ahead and setting boundaries for what can be achieved within the spec.
Design: There are no hard and fast rules when it comes to designing a 30K banner. We can design a simplistic banner with no images, no gradients and no animations and still produce top quality work. It's all about knowing the limits and using things sparingly.
Plan the movie: Planning out our movie will give you a better idea of all the different elements required to complete the job. Knowing your key library symbols will save you from repeating or perhaps uploading more symbols than required. We also keep symbols in the library to a minimum and try to reuse as many as possible.
Fonts: Even the number of different fonts and font styles you use can have an effect on file size, so use them wisely. When embedding fonts, we try and use characters that we need rather than the whole font family.
Images: When using images, keep them to what's absolutely necessary to complete the job. Having one or two good-quality images is better than having four poor ones. Optimising our images in a separate application before importing them to Flash is valuable: if we can take a few K off by reducing the colours, and so on, then every little bit helps. Flash does give you the option to optimise your images further; do this by right-clicking the image, going to Properties, and here you'll see the
Compression option. When importing the image into your library, we try to make them the exact maximum physical size we require. It wastes valuable K when you bring in an image that's bigger than what's needed. Sometimes we can get a better result by converting our bitmap image into a vector; however this isn't always the case depending on the image detail, so it's one to try and test.
Components: In general, the fewer the components you have, the smaller the file size. Therefore, we only keep essentials in the library. I mentioned before how it helps to know how many movie clips, and so on, you have and how to reuse them. When you reuse a symbol, it doesn't increase the file size because you're just reusing the same item over and over.
Frames: Reducing the number of frames in our movie will also help. Using ActionScript to replace vast numbers of frames is a great way to do this.
A perfect example is using ActionScript to hold your banner at a certain point for a period of time rather than inserting more frames to be played out.
Testing: An absolute must when building a banner to a small file size is testing. When previewing your banner, select BandwidthProfiler. This will show information such as the frame rate, dimensions and also the current file size. If your banner is sneaking above that vital 30K, we start chipping away; it'll be worth it in the end.
The best advice I can offer is to experiment: use gradients, alphas and images, but use them in moderation. Today we're always being told that too much of anything is a bad thing and this advice should equally be applied to the 30K banner.