4 Replies Latest reply on Oct 15, 2009 12:55 AM by Samplecraze

    My site design looks great in Fireworks at 100% res but looks disjointed in the browser

    Samplecraze

      Hi,

       

      It's very strange and I cannot locate the problem.

       

      Using Fireworks 8 everything looks solid and well aligned as I used grids and guides.

      The colours are strong and the lines all look absolutely straight.

      But when I try to view it in a browser (FF) it looks disjointed.

       

      Could someone please have a look and tell me what I am doing wrong?

       

      Thank you

       

      Eddie

        • 1. Re: My site design looks great in Fireworks at 100% res but looks disjointed in the browser
          pixlor Level 4

          You've attached a .png document. Hmmn...there are no slices defined in the Web layer.

           

          Are you viewing your graphic in Firefox or are you generating HTML (or HTML and CSS) from Fireworks? If HTML, then you need to post your code somewhere so that people can look at it. (Because, you see, it seems that you may be complaining about the generated code.) If it's the code you have a problem with, please describe the steps you take to generate it.

          • 2. Re: My site design looks great in Fireworks at 100% res but looks disjointed in the browser
            Samplecraze Level 1

            Hi Pixlor,

             

            Thanks for responding.

             

            I have no slices yet as I am only designing the site in terms of visuals and not optimized yet for Dreamweaver etc.

             

            No html at this juncture, just the images that you see.

            I am viewing the graphic in Firefox and Fireworks at 100% normal.

             

            Last night I took another look and realised that the text lie in boxes larger than the text itself (I was stretching text etc) and once I removed and started again it looked better.

            I also removed all the rounded rectangle graphics and started again with a standard rectangle and that helped.

            However, I have areas that look slightly smeared like the red area box in the middle of the page that I have left for rotating endorsement banners etc.

            The top right is smeared but for the life of me I cannot understand why.

             

            I have uploaded the new amended png in case you would like to look at it again.

            All I do is hit F12 and view in browser and go from there.

            I still do not understand how it can show no problems in Fireworks but it does in Firefox?

             

            Thanks again

             

            Eddie

            • 3. Re: My site design looks great in Fireworks at 100% res but looks disjointed in the browser
              pixlor Level 4

              Okay. Well, previewing a Fireworks design .png file in a browser is pointless. If you want to check the graphics, you'll want to export them (not save) to a flattened bitmap of some kind (.jpg, .gif, or flattened .png). Browsers are not intended to render vector data and that's probably why you see discrepancies. When you export, Fireworks will produce graphics that look like what you see on your screen (to the limitations of the export parameters, anyway).

               

              As you develop your HTML and CSS, you will want to preview that in browsers, to catch coding errors and cross-browser inconsistencies. A Fireworks .png isn't a final Web product, though, so there's no point seeing how it looks in a browser.

              1 person found this helpful
              • 4. Re: My site design looks great in Fireworks at 100% res but looks disjointed in the browser
                Samplecraze Level 1

                Thanks

                 

                Very helpful.

                 

                Man, this site design business is a nightmare.

                If someone fancies having a go designing my new sites feel free to contact me.

                 

                Thanks again

                 

                Eddie