5 Replies Latest reply: May 23, 2012 10:32 PM by groove25 RSS

    Fireworks & Photoshop CS6 font rendering

    Bunyip Community Member

      Hi everyone,

       

      Just a quick question. Has Adobe now unified the font rendering engine for both Fireworks and Photoshop? I've always found that when working with PSD or Fireworks PNG files between the two apps, that fonts get rendered or kerned differently, which is a little frustrating.

       

      I would hope that after 8 years, Fireworks would have no trouble working with PSD files and fonts. I was a bit disappointed to see that things hadn't changed in CS5.5.

       

      One may ask why I don't just use Photoshop all the time. Well, I would, but for doing quick edits of files, Fireworks fits the bill perfectly for working with web graphics. Photoshop is a little more involved for this sort of thing, and sometimes I have to work with PSD files in Fireworks, to export my slices.

       

      Thanks in advance for the comments :-)

       

      Steve

        • 1. Re: Fireworks & Photoshop CS6 font rendering
          BSS Community Member

          No. Nothing new with the font rendering and kerning.

           

          See below. I've included the Custom Anti-aliasing I use to get as close as I can. But sadly, nothing we can do about the kerning.

           

          PSvsFWText.png

          • 2. Re: Fireworks & Photoshop CS6 font rendering
            groove25 Community Member

            I love the graphic! Awesome. But that's gotta be the worst pickup line ever.

             

            I'm impressed with how closely you matched the Photoshop versions using FW's Custom Anti-Alias. I've occasionally used text rendered in a web browser—and taken a screenshot of it—when I thought it looked better than Photoshop or Fireworks.

             

            A few thoughts:

            • Photoshop CS2 applies kerning by default (it's called "Metrics"). To match that in Fireworks, you'd want to turn Auto Kern on. (This would be the flip side to the approach taken in TrapperKeeper's graphic, where all kerning has been turned off.)
            • Photoshop used to link up with Image Ready, which was Adobe's answer to Macromedia Fireworks. I imagine it was easier to retain text rendering with that setup, and I'm surprised that Adobe didn't build in some sort of method for preserving text rendering in that type of workflow, when they decided to discontinue Image Ready.
            • When using Fireworks to create slices of a PSD file with text, a good workflow might be to make a copy of the file in Photoshop, flatten the text, and then use that version to slice up in Fireworks.

             

            Following is a pretty amazing article about text rendering on monitors that includes some insights into Photoshop's Anti-Alias settings:

             

            http://www.smashingmagazine.com/2009/11/02/the-ails-of-typographic-anti-aliasing/

            • 3. Re: Fireworks & Photoshop CS6 font rendering
              groove25 Community Member

              @Steve: Although written for FW CS4, this is an interesting article about the Adobe Text Engine, which suggests that typesetting should be very consistent between Photoshop, Illustrator, and Fireworks:

               

              http://www.adobe.com/devnet/fireworks/articles/adobe_text_engine.html

               

              I'm curious what workflow you're using, and whether it varies from the approaches discussed in this article. I haven't tried importing or converting between the two applications, but I did try a quick study of native text rendering within the two applications (in CS5.5). Unfortunately, I don't have Futura Std Book, so I used Myriad Pro instead. I found the closest match between Photoshop with no kerning ("0") and Fireworks set to "Auto kern". But this may vary from one font to the next, and it's not necessarily the same as copying and pasting text from one application to the other.

               

              @TrapperKeeper: The more I looked at your graphic, the more I noticed the differences. The Photoshop versions seem to be characterized by the following:

               

              • more space between double l's (and "li")
              • slightly larger word spacing
              • wider letterform on uppercase D with more elegant curve rendering

               

              The spacing almost makes me wonder if there's some kind of optical kerning being applied in FW CS6. But then again, it could just be a difference in the way the two applications interpret that particular font.

              • 4. Re: Fireworks & Photoshop CS6 font rendering
                BSS Community Member

                I was being kind to FW with choosing 0 kerning in both. It really just helped to illustrate the "rawest" settings to compare.

                 

                In real-world use, I choose PS Optical kerning. Auto-kerning in FW never looks this good.

                 

                The "complaints" I mention in my posts may seem a little petty, but the text rendering in FW is subpar to PS and the artists at my workplace export twice when creating software gui assets. 1. Most of the assets in Fireworks and 2. All the text in PS.

                • 5. Re: Fireworks & Photoshop CS6 font rendering
                  groove25 Community Member

                  @TrapperKeeper: That's interesting. I still like your use of Custom Anti-Aliasing to mimic Photoshop and actually converted your settings into Styles for my own reference. I recently upgraded to CS5 (from CS2) and was disappointed to see that System Anti-Alias had been jettisoned.

                   

                  @Steve: After re-reading the Adobe Text Engine article and trying some copying-and-pasting between Photoshop and Fireworks, I'm sorry to conclude that the article's tone is overly rosy and optimistic. FW CS4's revised text engine may have increased cross-application consistency to some extent, but the differences in typesetting between Photoshop and Fireworks are definitely there. The article still has a few good tips in it, though. I did notice, while opening up a PSD in Fireworks, that the option "Maintain Photoshop Layer Appearance" will preserve Photoshop's text rendering—but only by converting the text layers to bitmaps.

                   

                  Maintain Photoshop Layer Appearance.png