10 Replies Latest reply on Apr 14, 2010 8:54 AM by motonutty

    Mac vs PC for Design?

    PAB1953 Level 1

      I use a Windows PC and Dreamweaver for web design and it's served me pretty well over the years. But I've run into a problem. Several pages I've designed recently for a client have displayed differently on their Macs than on my PC.

       

      I won't get into specifics right now, but is it possible to have page design render almost identically on Macs and PCs?

       

      Now they want me to change graphics on a page that look good when viewed on a PC but not-so-good on a Mac.

       

      I use CSS for page layout and styling, so you'd think things would be pretty close. Maybe there are some fixes I need to employ.

       

      Do I tell them that I'm designing first for the 86% of the world that uses PCs?

        • 1. Re: Mac vs PC for Design?
          pziecina Level 6

          Hi

           

          The only thing you can do is check in various browsers, one such option for checking on mac and pc browsers is browser labs, see - http://labs.adobe.com/technologies/browserlab/.

           

          If the difference is in the lightness/darkness of the images, then this is because the gamma setting is different on the 'old' macs to the one used on pc's (old mac gamma = 1.8, widows gamma 2.2) however the gamma on the macs using snow leopard as an operating system is now the same as the pc unless reset to 1.8 by the user.

           

          As 90% of users on the web use pc's I would point out to your client that this should be the target audience, unless they are a site aimed at the mac user in which case they must decide.

           

          PZ

          www.pziecina.com

          1 person found this helpful
          • 2. Re: Mac vs PC for Design?
            370H55V Level 4

            I build and test my pages in Firefox, Opera, Safari, Netscape (obsolete I know), on both Mac and Win,  and finally IE on the PC.

             

            Other than the quirks in IE which have to have additional code in the CSS and HTML to render properly, I've never run into a problem with things looking different between formats. Firefox, Safari, and Opera build their browsers to operate essentially identically in Windows or OS X, so anything you build for one should look identical in the other.

             

            There may be some slight color differences due the the differences in Gamma and color optimization settings between the two, but graphics, layout, DIVs, and such shouldn't even have a noticeable difference.

            1 person found this helpful
            • 3. Re: Mac vs PC for Design?
              PAB1953 Level 1

              One problem I encountered was that a graphic floated to the right of three stacks of bulleted text filled the space nicely on my PC but had a big hole of white space below it when viewed on the a Mac. They thought I'd completely mis-designed the page and said I should find a tall oblong graphic to replace the smaller, squatter graphic around which the text wrapped nicely on the PC.

              • 4. Re: Mac vs PC for Design?
                pziecina Level 6

                Hi

                 

                Can you provide a link to the page?

                 

                This sounds more like you have not specified the css width correctly, or they may be viewing the page in IE6.

                 

                PZ

                • 5. Re: Mac vs PC for Design?
                  osgood_ Level 8

                  PAB1953 wrote:

                   

                  One problem I encountered was that a graphic floated to the right of three stacks of bulleted text filled the space nicely on my PC but had a big hole of white space below it when viewed on the a Mac. They thought I'd completely mis-designed the page and said I should find a tall oblong graphic to replace the smaller, squatter graphic around which the text wrapped nicely on the PC.

                  It's hardly likely to be an issue with the graphics as you suggested in your initial post and more likely to do with some underlying css coding issues, which from the description you have proivided above, sounds about right.

                  • 6. Re: Mac vs PC for Design?
                    Brad Lawryk Adobe Community Professional & MVP

                    Without seeing the page, I would think that PZ is correct. Its likely a CSS problem or if its a color issue it may be you didn't use web-safe colors in the design.

                     

                    The good news is that with CS5 if you choose to go that way these problems especially the CSS stuff should be easily fixed or even prevented with the integration of Browserlab and the new CSS tools.

                     

                    Brad Lawryk
                    Adobe Community Professional: Dreamweaver
                    Northern British Columbia Adobe Usergroup: Manager

                    • 7. Re: Mac vs PC for Design?
                      PAB1953 Level 1

                      Fraid I can't put up the page as all content is under wraps until site-launch. But here's the related HTML and CSS:

                       

                      <img src="[...]" width="300" height="192" class="fltrt" />

                       

                      .fltrt {float: right; margin-left: 8px;}

                      • 8. Re: Mac vs PC for Design?
                        Brad Lawryk Adobe Community Professional & MVP

                        Can you post a screenshot with the actual content blurred out?

                         

                        Brad Lawryk
                        Adobe Community Professional: Dreamweaver
                        Northern British Columbia Adobe Usergroup: Manager

                        • 9. Re: Mac vs PC for Design?
                          pziecina Level 6

                          Hi

                           

                          Sorry, such a small snippet of code does not help much as it is probably a problem with how the element interacts with the rest of your design via the css.

                           

                          Check your 'box-model' settings are correct and that the image margins/paddings are correct in relation to the other elements. Also we would need to know the browser that is having the problem as with IE6, (and IE5.5 mac) had the double margin bug on floated elements which may also cause the problem.

                           

                          PZ

                          • 10. Re: Mac vs PC for Design?
                            motonutty

                            It sounds like the CSS may cause the problem - I usually only run into issues with IE, but not with cross-platform viewing. If you use the Dreamweaver feature to check for browser-capabilities/potential issues, it may help you track down if there's a problem with the code. Good luck!!