Skip navigation
Maribel Nachal
Maribel Nachal Calculating status...
Currently Being Moderated

Exporting clickdummy as "html + images" creates too many gifs

Jul 7, 2012 2:42 PM

Hi, I created a prototype in Fireworks, exported as "HTML and Images". There are multiple pages and a few slices. My problem now is the images folder. It's huge. There are thousands of gifs. Is this normal? I wanted to provide this prototype via an online link, but you mostly see the images loading from top to bottom when opening any page. It's annoying. Working offline from desktop is fine of course.

 

Do I have to reduce the number of sclices so that there are fewer gifs in the image folder? I would have to cick off some hover states... or is there any other way to reduce the number of images the page is build of?

 

Thanks for any help and advice!

 

Mari

589 Views   5 Replies   Latest reply: Linda Nicholls, Jul 9, 2012 2:05 AM
 
Replies
  • Linda Nicholls
    Currently Being Moderated
    1. Linda Nicholls,
    Jul 7, 2012 3:22 PM   in reply to Maribel Nachal
    Report

    Can you provide a link to the HTML page yu are referring to? Without being able to see it, I'd just be guessing at a solution.

     
    |
    Mark as:
  • Maribel Nachal
    Currently Being Moderated
    2. Maribel Nachal,
    Jul 7, 2012 3:38 PM   in reply to Linda Nicholls
    Report

    Hi Linda, thanks for the promt reply! I already optimized some slices and replaced some with hotspots. But I think it's still quite complex. http://viniblu.de/gm/Home.html

    What do you think? There are 10 pages (variants from home page + sub pages) and about 800 images in an extra folder.

     

    ... I forgot. The effect is most annoying in chrome. I think it's something about the cache. In firefox and ie it's just the first time loading a page where you see the images from top to bottom, after that changing pages is kinda ok.

     

    Again, I'd like to know if it's normal that there are so many images or if it's just me and my first-time-fireworks-problem :-)

     
    |
    Mark as:
  • Linda Nicholls
    Currently Being Moderated
    3. Linda Nicholls,
    Jul 7, 2012 4:03 PM   in reply to Maribel Nachal
    Report

    You've exported the entire thing as images rather than images and text. To create a text slice, you need to change the Type of slice in the Properties panel to HTML. Only the actiual images should be exported as images. The rest should be HTML text. All the extra files you are seeing are spacer gifs, which are added to the page by Fireworks to stabilize the table structure. Ideally, you export just the images from Fireworks and then build your pages in Dreamweaver. You might find this article helpful.

     

    http://www.adobe.com/devnet/fireworks/articles/atv_fw_interaction_desi gn.html

     
    |
    Mark as:
  • Maribel Nachal
    Currently Being Moderated
    4. Maribel Nachal,
    Jul 8, 2012 2:34 AM   in reply to Linda Nicholls
    Report

    OK, thanks, that already helped me. But unfortunately I didn't manage to create these html-text slices. There are just green solid boxes where I can enter html text but I dont know how to transfer my different text areas in combination with images to html + image slices. Do I have to slice up the whole page?

     

    After trying and studying the article you mentioned above I exported as Css and Images and now my page consists of html text and some images, looks nice and is edidable in Dreamweaver. But with this method I loose all the hover functionality. In which direction should I work on?

     

    A export as Css and Images and try to insert the hover and swap-image functionality manually in Dreamweaver or

    B export as Html and Images and try to learn how to add html text slices?

     

    Thanks again!

     

    Mari

     
    |
    Mark as:
  • Linda Nicholls
    Currently Being Moderated
    5. Linda Nicholls,
    Jul 9, 2012 2:05 AM   in reply to Maribel Nachal
    Report

    You can add the hovers manually in Dreamweaver. If you want to add HTML text slices, you need to first draw a slice over the area, then change the slice type to HTML in the properties panel, and finally, click on the Edit button in the properties panel (it will appear when you set the slice type to HTML) to open the HTML editor. Type your text there.

     
    |
    Mark as:
Actions

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points