1 person found this helpful
Can you post a link to your PNG file? Are you getting any messages from Fireworks when you attempt the export? While the export can be helpful at times, you may find it easier to properly build the layout in Dreamweaver. Chances are excellent that you will have to tweak the CSS/HTML that Fireworks creates anyway. Keep in mind that he whole idea behind CSS is flexibility, too. Generating a table-based layout from FW is wrong for many reasons, as it creates graphics of everything - including text, and the table -or tables - created by Fireworks are very rigid and can break quite easily if you try to edit the page. FIne for protoyping, not good at all for final web sites.
Thanks for the reply. I dont really have away to post a link to my .png. I have apache installed on my windows machine to test my sites with. I'm a second year student at IADT working towards a degree in web design.
I have used and followed your tutorials, Great Stuff!! I have seen alot of tuts about using FW for prototyping but not much about using it for your a final site. You mentioned doing the CSS layout in DW first, I'm not a wizard at css yet, but know enough to really mess things up
I like to hard code.So would I basicly make a layout in DW with my basic demensions using DIV,S and ID,S. Like wrapper, header, nav_bar, content, footer, etc... etc...
Then design your site in FW or PS with he same outer demensions or width ? and then slice out your header, nav-bar content buttons etc... etc... Or just export as images and then drop them into DW without slicing ? I can redo the css that FW generates but that is a hassle and it slices all thease little pieces called r11_c12_jpg etc.. I name the important slices, the ones that I will be using, but it is still a mess and hard to navigate the code.
I know this is to many ? for a forum maybe if you could point me to a tutorial that addresses thease issues, if there is one that you know of.
1 person found this helpful
OK, this is my teacher side speaking. If you're working toward your degree in web design, the last thing you should be doing is using Fireworks to generate your web pages. There's a reason you don't see many tutorials about using FW to build the pages of your final site. Actually, probably more than 1 reason.
- Know CSS and HTML first. The software is there to make life easier, but it is not a way around learning the basics.
- Design in Fireworks.
- Slice and optimize in Fireworks (being sure to name your slices)
- Export the necessary slices (not all the ones that FW automatically creates).
- Build out the design in Dreamweaver.
And as for creating a link to your png file, you can do that right here. Just upload the file, assuming it's not a huge file size.
If you want to learn more about CSS export from Fireworks, check out David Hogue's articles on the Adobe Developers center for Fireworks: http://www.adobe.com/devnet/fireworks/
We really haven't gotten that far in school yet only had one programing class so far.I new more about coding before going to school at least HTML. I can layout a CSS stylesheet pretty well, have had classes using PS,ID,IL,FL and typography etc...
Heres my .png For your amusement
new_site_layout.png 368.2 K
I followed that link you posted,Ive watched that before,very good. But I did some more digging while I was there on the Adobe Developers Connection and found this great vidio and downloads by Chris Converse. Just what I have been looking for custom templates for DW that includes the PSD so you can see how he sliced it. I haven't watched the whole thing yet, but he walks you through setting them up and the slicing of the psd. Setting up your custom templates. He goes alot deeper to into using alot of dynamic elements like spry and spry widgets.
I found this nice tutorial, a while back:
The author produces her graphics in Photoshop, but I used Fireworks when I followed it. It's very clearly written and displays a good workflow and hits the major (common) design elements.