| 00:00:08 |
00:00:12 |
Fireworks CS6 has tremendously
improved CSS support. |
| 00:00:12 |
00:00:16 |
Previous versions of Fireworks
have allowed for the export of |
| 00:00:16 |
00:00:21 |
HTML and some CSS, but in CS6,
they've really gone a long way |
| 00:00:21 |
00:00:25 |
towards optimizing the work taking
advantage of all the potential |
| 00:00:25 |
00:00:30 |
in CSS3 or Cascading Style Sheets
Level 3 support. It now supports |
| 00:00:31 |
00:00:35 |
CSS extraction, meaning if you have
created a graphic that can |
| 00:00:35 |
00:00:40 |
be rendered on screen using CSS3
rather than actually creating |
| 00:00:40 |
00:00:44 |
the graphic, the CSS properties
window allows you to |
| 00:00:46 |
00:00:50 |
grab all of this code and render
this rounded corner box graphic |
| 00:00:50 |
00:00:53 |
on screen without actually having
to download a graphic, which |
| 00:00:53 |
00:00:55 |
is a huge savings in terms of bandwidth
and especially if you |
| 00:00:55 |
00:00:59 |
are dealing with mobile devices
or multiple platforms. It also |
| 00:00:59 |
00:01:02 |
includes support now for Internet
Explorer 10, which is really |
| 00:01:02 |
00:01:06 |
a big deal. That's a huge leap in
Microsoft's technologies and |
| 00:01:06 |
00:01:09 |
it is probably the version of Internet
Explorer that most Web |
| 00:01:09 |
00:01:11 |
developers are really looking forward
to because it should support |
| 00:01:11 |
00:01:16 |
a lot of standards across the board.
Fireworks CS6 also now allows |
| 00:01:16 |
00:01:20 |
support for CSS Sprites, which it's
a technique wherein you create |
| 00:01:20 |
00:01:24 |
a graphic with three versions of,
say, a button, like the one |
| 00:01:24 |
00:01:26 |
we're looking at here, and instead
of exporting these as three |
| 00:01:26 |
00:01:29 |
individual graphics and controlling
them on your Web page using |
| 00:01:29 |
00:01:33 |
Java Script or some other code, it
allows you to create one graphic, |
| 00:01:33 |
00:01:38 |
which reduces server load and download
time, and then you use |
| 00:01:38 |
00:01:41 |
CSS to display one version of this
graphic at a time, one section |
| 00:01:41 |
00:01:46 |
of this graphic, one button through
a sort of CSS window or a |
| 00:01:46 |
00:01:50 |
div on screen. And Fireworks CS6
now supports the extraction |
| 00:01:51 |
00:01:55 |
of Sprites through the Export menu.
|
| 00:01:56 |
00:01:58 |
From the Export menu, you choose
CSS Sprites and it gives you |
| 00:01:58 |
00:02:03 |
the option to control CSS selectors,
classes, or IDs, any other |
| 00:02:03 |
00:02:06 |
code that you need to do as well
as override the optimization |
| 00:02:06 |
00:02:07 |
on the Sprites. |
| 00:02:08 |
00:02:13 |
The other big CSS feature in Fireworks
CS6 is the ability to |
| 00:02:13 |
00:02:18 |
export and modify themes for jQuery
mobile, which is a mobile |
| 00:02:18 |
00:02:20 |
development framework that allows
you to create mobile optimized |
| 00:02:20 |
00:02:23 |
websites that work across platforms
so you don't have to |
| 00:02:23 |
00:02:28 |
write codes specifically for iPhones
or Windows Phone 7 or Android |
| 00:02:28 |
00:02:32 |
platforms. By using the jQuery mobile
framework, you create one |
| 00:02:32 |
00:02:38 |
mobile website and you can display
it across or deliver it across |
| 00:02:38 |
00:02:41 |
all those different phone platforms.
And to do that, we go into |
| 00:02:42 |
00:02:45 |
jQuery mobile theme. You can create
a new theme. You export the |
| 00:02:45 |
00:02:50 |
theme. You can preview in a browser.
The support for CSS3 and |
| 00:02:50 |
00:02:53 |
CSS across the board in Fireworks
is hugely, hugely improved |
| 00:02:53 |
00:02:55 |
and it's a tremendous new feature. |
