Like any other fonts, custom fonts can
be applied via the Text section of the
When dealing with fonts, you have to keep in mind that not all browsers
support all font options in the same way. For example, text shadows are not
supported in Internet Explorer 8 or 9.
The fi les for this example can be
downloaded from http://edgebuch.
Project Name: Creation_Fonts
3.9 Flexible Layouts
Ever since the proliferation of web-enabled smartphones and tablets, web and
app designers are now confronted with the necessity of creating layouts that fi t
a variety of diff erent screen sizes and resolutions. Those designers still creating
layouts for a specifi c resolution, such as 800 x 600 pixels or 1024 x 768 pixels, run
the risk of angering or simply not reaching a signifi cant portion of their target
audience. To that end, diff erent concepts have been developed to address these
problems and off er solutions. The current buzz is about responsive or adaptive
design, which means that a given website or app should be able to automatical-
ly adapt to the display capabilities of diff erent devices (desktop, netbook, tablet,
smartphone or Smart TV) without requiring the user to intervene. Some large
companies such as Google are already devoting a lot of attention to mobile
devices and designing their user interfaces under the principle Mobile First.
A thorough responsive design ensures that devices only load the kind of data
that they actually require, e.g., images in the right resolution and fonts they can
interpret. This is done through media queries. Unfortunately, the fi rst version of
Edge Animate does not yet off er this infrastructure, which is why Adobe uses
fl exible layouts rather than responsiveness. This capability will certainly be add-
ed in subsequent versions.
Let's look again at how to create fl exible layout compositions with Edge An-
imate that can then be optimally displayed on small and large devices without
any problems. In sample project 3.10.1, we will look at an actual case study.