16 Replies Latest reply on Jun 5, 2007 6:50 AM by Newsgroup_User

    CS3 Master Pages image export

    shawn1000
      In FW CS3, is there a way to export all pages (with html and images) so that each page's html references the same master page images rather than recreating its own duplicate image? For example, if I have a home page, about, and contact page. I would like the buttons for home, about, and contact to all reference the same home.gif, about.gif, and contact.gif images rather than each page having its own exact duplicate gif image.

      I have searched the help and the forum, and I don't see anything about this.. am I missing some key concept here?

      Thanks,
      Shawn
        • 1. Re: CS3 Master Pages image export
          Level 7
          For testing purposes, I just did an export of a design that has a master
          page and three subpages. The buttons are sliced on the master page ONLY.
          All I got was one set of buttons.

          I have a couple questions for you. Are you exporting html and images for
          a live mock up, or are you hoping to use the html created by FW as your
          true pages?

          In your PNG file, do you have slices on every page for the buttons, or
          just on the master page?

          Here's why I am asking:


          If you are hoping to use these FW html pages as complete and finished
          web pages on your site, a word of warning; FW html can be chock full of
          locked tables to hold the design together. The minute you try to alter
          the table structure (by adding true text to a cell inside that design,
          for example), it will very likely break the table.

          If you have the buttons sliced on every page and have perhaps named them
          differently, you will get multiple buttons, I would think. If it's just
          for a mock up, it's not a big deal because it's temporary, but it will
          be a problem when you build the true pages. For the real site, just
          export the slices (no html) and build the pages in Dreamweaver where you
          have much more control over the pages than you ever will in Fireworks.

          HTH

          --
          Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
          Extending Knowledge, Daily
          http://www.communityMX.com/
          CommunityMX - Free Resources:
          http://www.communitymx.com/free.cfm
          ---
          .:Adobe Community Expert for Fireworks:.
          news://forums.macromedia.com/macromedia.fireworks
          news://forums.macromedia.com/macromedia.dreamweaver

          shawn1000 wrote:
          > In FW CS3, is there a way to export all pages (with html and images) so that
          > each page's html references the same master page images rather than recreating
          > its own duplicate image? For example, if I have a home page, about, and contact
          > page. I would like the buttons for home, about, and contact to all reference
          > the same home.gif, about.gif, and contact.gif images rather than each page
          > having its own exact duplicate gif image.
          >
          > I have searched the help and the forum, and I don't see anything about this..
          > am I missing some key concept here?
          >
          > Thanks,
          > Shawn
          >
          • 2. Re: CS3 Master Pages image export
            shawn1000 Level 1
            I was making a stupid mistake.. I was duplicating pages, which also duplicated the slices. I just deleted the slices and now it works as I had hoped. Thanks for the help, and the advice about locked tables.

            Shawn
            • 3. Re: CS3 Master Pages image export
              Level 7
              shawn1000 wrote:
              > I was making a stupid mistake.. I was duplicating pages, which also duplicated
              > the slices. I just deleted the slices and now it works as I had hoped. Thanks
              > for the help, and the advice about locked tables.
              >
              > Shawn
              >

              You're quite welcome, Shawn

              --
              Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
              Extending Knowledge, Daily
              http://www.communityMX.com/
              CommunityMX - Free Resources:
              http://www.communitymx.com/free.cfm
              ---
              .:Adobe Community Expert for Fireworks:.
              news://forums.macromedia.com/macromedia.fireworks
              news://forums.macromedia.com/macromedia.dreamweaver
              • 4. Re: CS3 Master Pages image export
                Trevor-twenty5eight
                Hi Shawn and Jim, I hope you see my reply. I'm in a fix... I'm having the same problem with the duplicate images and can't work out what's going wrong. I notice that Shawn said he made a mistake by duplicating pages ???

                I've got a master page with about 10 linked pages and then when I export from Fireworks CS3 I get duplicates. If anyone could please shed some light on why this is happening, it'd be great.

                Really appreciate any help on this one.

                Many thanks

                Mike
                • 5. Re: CS3 Master Pages image export
                  Trevor-twenty5eight Level 1
                  Hi Shawn and Jim, I hope you see my reply. I'm in a fix... I'm having the same problem with the duplicate images and can't work out what's going wrong. I notice that Shawn said he made a mistake by duplicating pages ???

                  I've got a master page with about 10 linked pages and then when I export from Fireworks CS3 I get duplicates. If anyone could please shed some light on why this is happening, it'd be great.

                  Really appreciate any help on this one.

                  Many thanks

                  Mike
                  • 6. Re: CS3 Master Pages image export
                    shawn1000 Level 1
                    I had slices on the master page, but since I had created my other pages from that master page, I also had duplicate slices on each of these pages. I just deleted the duplicate slices from the non-master pages and it worked great. Hope that helps!
                    • 7. Re: CS3 Master Pages image export
                      Level 7
                      Mike Twenty5eight wrote:
                      > Hi Shawn and Jim, I hope you see my reply. I'm in a fix... I'm having the same
                      > problem with the duplicate images and can't work out what's going wrong. I
                      > notice that Shawn said he made a mistake by duplicating pages ???
                      >
                      > I've got a master page with about 10 linked pages and then when I export from
                      > Fireworks CS3 I get duplicates. If anyone could please shed some light on why
                      > this is happening, it'd be great.
                      >
                      > Really appreciate any help on this one.
                      >
                      > Many thanks
                      >
                      > Mike
                      >

                      Hi Mike:

                      Can you upload the file and post a link to it?

                      --
                      Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
                      Extending Knowledge, Daily
                      http://www.communityMX.com/
                      CommunityMX - Free Resources:
                      http://www.communitymx.com/free.cfm
                      ---
                      .:Adobe Community Expert for Fireworks:.
                      news://forums.macromedia.com/macromedia.fireworks
                      news://forums.macromedia.com/macromedia.dreamweaver
                      • 8. Re: CS3 Master Pages image export
                        Trevor-twenty5eight Level 1
                        Hi Jim

                        Thanks for offering your support with this one. I really appreciate it. I'm relatively new to website design and I'm doing my best to embrace Fireworks and Dreamweaver to do the job. I'm trying to teach myself CSS at the moment but am still exporting HTML and tables from Fireworks, which currently does the trick.

                        You'll notice when you check the site that I've posted that the images reload themselves on every page. This is my nightmare right now. I've got one png file with one master page and then 11 linked pages. I'm wanting all the elements on the master page such as the nav bar and logo etc to export only once but instead my images folder that is exported from Fireworks is massive with copies of every slice for every single page.

                        My client would like the site uploaded in the tomorrow so I haven't made it live yet. I've still got to add all the text in DW so just included it all as a sliced image. You'll see what I mean. I've just put it on the back of another one of my sites that has a similar issue... but that's another story for another time... www.storemedia.com.au/devcorp/home.htm

                        Thanks in advance for taking a look.

                        Mike
                        • 9. Re: CS3 Master Pages image export
                          Level 7
                          Mike Twenty5eight wrote:
                          > Hi Jim
                          >
                          > Thanks for offering your support with this one. I really appreciate it. I'm
                          > relatively new to website design and I'm doing my best to embrace Fireworks and
                          > Dreamweaver to do the job. I'm trying to teach myself CSS at the moment but am
                          > still exporting HTML and tables from Fireworks, which currently does the trick.
                          >
                          > You'll notice when you check the site that I've posted that the images reload
                          > themselves on every page. This is my nightmare right now. I've got one png file
                          > with one master page and then 11 linked pages. I'm wanting all the elements on
                          > the master page such as the nav bar and logo etc to export only once but
                          > instead my images folder that is exported from Fireworks is massive with copies
                          > of every slice for every single page.
                          >
                          > My client would like the site uploaded in the tomorrow so I haven't made it
                          > live yet. I've still got to add all the text in DW so just included it all as a
                          > sliced image. You'll see what I mean. I've just put it on the back of another
                          > one of my sites that has a similar issue... but that's another story for
                          > another time... www.storemedia.com.au/devcorp/home.htm
                          >
                          > Thanks in advance for taking a look.
                          >
                          > Mike
                          >

                          Wow that is a pretty complex table. Even on my high speed connection, it
                          took a couple seconds to render.

                          My first recommendation is to NOT use the FW generated html as your
                          final web page. Just export the files you need and build the actual web
                          page in Dreamweaver. Problem with using the FW page is that it is a
                          locked table, so as soon as you add real text to those text cells, you
                          run a significant risk of the table "breaking" if the conent exceeds the
                          dimensions of the cell.

                          Is there a link to the png file? That will help me more than seeing the
                          FW web page.

                          In the mean time, IF you have web slices on each page, you will get
                          multiple versions of your buttons (and any other duplicate slices) Make
                          sure your buttons are only sliced on the master page.

                          --
                          Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
                          Extending Knowledge, Daily
                          http://www.communityMX.com/
                          CommunityMX - Free Resources:
                          http://www.communitymx.com/free.cfm
                          ---
                          .:Adobe Community Expert for Fireworks:.
                          news://forums.macromedia.com/macromedia.fireworks
                          news://forums.macromedia.com/macromedia.dreamweaver
                          • 10. Re: CS3 Master Pages image export
                            Trevor-twenty5eight Level 1
                            Hi again Jim

                            Thanks for taking the time out to get back to me. I think I'm doing it all wrong... I just thought it would be best to use Fireworks because I find tables fall apart in DW very easily. Perhaps because I'm not doing it right.

                            Would building the site in CSS be a better way to build the site? I haven't had much experience with CSS and I'd really like to know more about the correct workflow between Fireworks, Dreamweaver and CSS coding. I know how i want the site to look, i just don't know the best way to build it.

                            I've FTP'd my PNG file to a server. It's the entire file with all the pages. The link to it is http://www.storemedia.com.au/devcorp_website_master_page_4.png

                            I've been reading a few of your articles online. I really appreciate someone with far more experience than someone like myself taking the time out to help and give direction.

                            Many thanks

                            btw, if you know of any great tutorials that explain better workflow between FW and DW and then taking it to CSS, please point me in the right direction.
                            • 11. Re: CS3 Master Pages image export
                              Level 7
                              Mike Twenty5eight wrote:
                              > Hi again Jim
                              >
                              > Thanks for taking the time out to get back to me. I think I'm doing it all
                              > wrong... I just thought it would be best to use Fireworks because I find tables
                              > fall apart in DW very easily. Perhaps because I'm not doing it right.
                              >
                              > Would building the site in CSS be a better way to build the site? I haven't
                              > had much experience with CSS and I'd really like to know more about the correct
                              > workflow between Fireworks, Dreamweaver and CSS coding. I know how i want the
                              > site to look, i just don't know the best way to build it.
                              >
                              > I've FTP'd my PNG file to a server. It's the entire file with all the pages.
                              > The link to it is http://www.storemedia.com.au/devcorp_website_master_page_4.png
                              >
                              > I've been reading a few of your articles online. I really appreciate someone
                              > with far more experience than someone like myself taking the time out to help
                              > and give direction.
                              >
                              > Many thanks
                              >
                              > btw, if you know of any great tutorials that explain better workflow between
                              > FW and DW and then taking it to CSS, please point me in the right direction.
                              >
                              Maybe this online article will also.......

                              http://tinyurl.com/y9jsn4

                              SKB
                              • 12. Re: CS3 Master Pages image export
                                Level 7
                                Mike Twenty5eight wrote:
                                > Hi again Jim
                                >
                                > Thanks for taking the time out to get back to me. I think I'm doing it all
                                > wrong... I just thought it would be best to use Fireworks because I find tables
                                > fall apart in DW very easily. Perhaps because I'm not doing it right.
                                >
                                > Would building the site in CSS be a better way to build the site? I haven't
                                > had much experience with CSS and I'd really like to know more about the correct
                                > workflow between Fireworks, Dreamweaver and CSS coding. I know how i want the
                                > site to look, i just don't know the best way to build it.
                                >
                                > I've FTP'd my PNG file to a server. It's the entire file with all the pages.
                                > The link to it is http://www.storemedia.com.au/devcorp_website_master_page_4.png
                                >
                                > I've been reading a few of your articles online. I really appreciate someone
                                > with far more experience than someone like myself taking the time out to help
                                > and give direction.
                                >
                                > Many thanks
                                >
                                > btw, if you know of any great tutorials that explain better workflow between
                                > FW and DW and then taking it to CSS, please point me in the right direction.
                                >
                                Hey Mike:

                                Sorry, been afk for a while. The link that SKB posted will be quite
                                helpful, I think.

                                Fireworks is a great tool for creating your design. It's a great
                                visualizer and can be really help you test ideas with the client before
                                digging deep into the coding phase. Not the best tool for making live
                                pages, though. I've downloaded your PNG file and one thing I notice is
                                you're having a bit of "slice-itis." Always keep in mind that as far as
                                FW is concerned, each slice represents a table cell, so step one is to
                                keep your slicing simple if your plan is to go with a table based
                                layout. For that matter, it's a good idea to keep things simple even if
                                the plan is to go to CSS layout.

                                The logo is a good example. Rather than slice the logo name and then
                                create slices on each side, just do one single, bigger slice. That slice
                                could be the entire rectangle area made up of the logo area (1 slice
                                instead of 5) or it could just as easily be a single slice for the
                                entire banner. It won't be that much of a hit on bandwidth, and you've
                                really simplified your layout structure!

                                Zooming in on your navbar, it appears that you have overlapping slices
                                on the buttons. This creates problems because FW will create multiple
                                slices in order to deal with those overlaps - even if it's only a single
                                pixel. When you're creating manual slices, always zoom into to around
                                200% or more to make sure your slices do not overlap.

                                It also looks like you're using FW pop-up menus. These puppies seem like
                                a godsend when you're first trying to create a pop up menu system, but
                                they become a nightmare from a maintenance and management perspective
                                and frankly, they're just not that great. Look for threads here about op
                                up menus and then look for the posts from Murray Summers. He hates
                                'em, tells you why and gives links to better resources. Check out
                                Project VII for much better solutions.

                                As for other articles - there is a ton of great material on Adobe's
                                site. and a while back I did an article on CMX that covers all (or most)
                                of the Fireworks articles we've written. It's a free one and it's called
                                Create Your Own Custom CMX Fireworks Course:
                                http://www.communitymx.com/abstract.cfm?cid=ECAAF

                                Sheri German - who inspired me to write that article - created one on
                                Creating a custom CSS course.
                                http://www.communitymx.com/abstract.cfm?cid=C71D9

                                Both articles are summaries of the content supplied by CMX, written with
                                the goal of categorizing the content into specific areas. You may find
                                them helpful if you are looking for content on CMX.

                                I hope this helps. Keep slugging away! :-)


                                --
                                Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
                                Extending Knowledge, Daily
                                http://www.communityMX.com/
                                CommunityMX - Free Resources:
                                http://www.communitymx.com/free.cfm
                                ---
                                .:Adobe Community Expert for Fireworks:.
                                news://forums.macromedia.com/macromedia.fireworks
                                news://forums.macromedia.com/macromedia.dreamweaver
                                • 13. Re: CS3 Master Pages image export
                                  Trevor-twenty5eight Level 1
                                  Hi Jim

                                  Once again, thanks for getting back to me. I've simplified my slices as much as possible at the moment. I've started teaching myself CSS via Lynda.com and I think I'll turn this site into a CSS based site as I learn more about CSS.

                                  The articles you directed me to have provided some great reading and I'm referencing those articles as well as doing video tutorials. There is so much to learn... and keep learning all the time... but it's all part of the challenge and I do find it extremely rewarding. I just wish I knew it all now.

                                  Thanks again.

                                  Mike
                                  • 14. Re: CS3 Master Pages image export
                                    Trevor-twenty5eight Level 1
                                    SBK, thanks for pointing out that article on Fireworks comps to CSS.
                                    • 15. Re: CS3 Master Pages image export
                                      Level 7
                                      Mike Twenty5eight wrote:
                                      > Hi Jim
                                      >
                                      > Once again, thanks for getting back to me. I've simplified my slices as much
                                      > as possible at the moment. I've started teaching myself CSS via Lynda.com and I
                                      > think I'll turn this site into a CSS based site as I learn more about CSS.
                                      >
                                      > The articles you directed me to have provided some great reading and I'm
                                      > referencing those articles as well as doing video tutorials. There is so much
                                      > to learn... and keep learning all the time... but it's all part of the
                                      > challenge and I do find it extremely rewarding. I just wish I knew it all now.
                                      >
                                      > Thanks again.
                                      >
                                      > Mike
                                      >
                                      Glad I was able to help, Mike. Good luck on your journey. :-)

                                      --
                                      Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
                                      Extending Knowledge, Daily
                                      http://www.communityMX.com/
                                      CommunityMX - Free Resources:
                                      http://www.communitymx.com/free.cfm
                                      ---
                                      .:Adobe Community Expert for Fireworks:.
                                      news://forums.macromedia.com/macromedia.fireworks
                                      news://forums.macromedia.com/macromedia.dreamweaver
                                      • 16. Re: CS3 Master Pages image export
                                        Level 7
                                        Mike Twenty5eight wrote:
                                        > SBK, thanks for pointing out that article on Fireworks comps to CSS.

                                        You're welcome.

                                        SKB