Week 10
This has been a great week of class. The concentration has finally left the design aspect of
creating webpages and floated over to functionality. A majority of the tutorials, lectures and
reading have been centered around exporting or formatting our deisigns and all the elements
associated with those design, jpgs and gifs. Fireworks and Photoshop have amazing features
called slices. This allows us to create invisible blocks around text and images, and associating
them specifically with CSS and xhtml code. We the design elements and the slices into code
that then can be read by Dreamweaver or an internet browser. This doesn’t mean we won’t have
any coding left to do but it has simplified the process, and cuts out a few steps. Below are the
videos we’ve watched that clearly explain every step to creating slices and how it integrates with
other programs.
Getting Started: 06 Exporting CSS and Images
http://tv.adobe.com/watch/digital-design/getting-started-06-exporting-css-and-images/
Creating CSS/xHtml Layouts:
http://tv.adobe.com/watch/digital-design/creating-cssxhtml-layouts/
Export CSS and HTML from FW CS4 Part 1:
http://tv.adobe.com/watch/adc-presents/export-css-and-html-from-fireworks-cs4-part-1
Export CSS and Html from FW CS4 Part 2:
http://tv.adobe.com/watch/adc-presents/export-css-and-html-from-fireworks-cs4-part-2
Export CSS and Html from FW CS4 Part 3:
http://tv.adobe.com/watch/adc-presents/export-css-and-html-from-fireworks-cs4-part-3
Quickly Transform Photoshop Layouts:
http://tv.adobe.com/watch/everyday-timesavers-web/quickly-transform-photoshop-layouts/
Getting Started: 06 Dreamweaver intergration:
http://tv.adobe.com/watch/digital-design/getting-started-06-dreamweaver-integration/
We’ve also read a few articles explaining why slices are great and can benefit any web
designer.
Articles
The Benefits of Slicing Image:
http://www.communitymx.com/content/article.cfm?cid=A28C67FE21B6726E&print=true
Exporting CSS and Images in FW CS4:
http://www.adobe.com/devnet/fireworks/articles/export_css_images.html
Lorem Ipsum Generator:
http://www.lipsum.com/
Leave a comment