Imported MS Word doc - some images very blurry

[mkaminski]

I have a manual for our software in MS Word 2007 that I imported into Flare in order to create an HTML output file. After the output is created some of the screen shots appear very blurry. These images are not blurry when I browse through the project folder where they are stored. Nor are they blurry within the Flare interface when browsing the individual htm files. It appears that when the output is created something is causing this but I am not sure if or where the option is that would correct the images. Any guidance would be greatly appreciated.

[LTinker68]

I'd check the <img> tag properties in the stylesheet, both for the default medium and the print medium. Make sure there aren't any size properties set (height, width, min-height, min-width).

[mkaminski]

I am checking but want to make sure I am looking in the correct part of the software. See attached screenshot. I open the content manager and there I select ‘resources’ then ‘stylesheets.’ Here is listed a stylesheet with the .css extension. Selecting that gives me the tree structure with ‘img’ listed as one of the styles. The properties to the right include a height and width but each of these is pegged to (not set). Is that the correct location from your suggestion to be checking? If so then if they are pegged to (note set) what else could be causing the issue?

madcap image.PNG

[LTinker68]

Two things to check. First, the screenshot you sent is the correct location, but it's currently set to the "default" medium. If you have the XML Editor set to show the web layout, then you're looking at the default medium. If you switch the XML Editor to the print layout, then you're looking at the "print" medium from the stylesheet. If the picture is blurry in the XML Editor when it's set to print layout, then you also need to check the <img> tag when the Stylesheet Editor is set to the print medium. Basically, the default medium is for every type of output, but if you want to change the style of a tag just for print output, then you set that style under the print medium. For instance, my body tag for online output is set to use a font-family of Verdana, Arial, sans-serif, because those fonts are common on all computers. I have that set in the default medium. But for print, my body tag is set to our corporate font of Humanist 777 BT because we embed the fonts so it doesn't matter if the end user has the font or not. That's set in the print medium.

So check to make sure that the <img> tag in the print medium doesn't have something other than "not set" specified for the width and height. Also, for both default and print mediums, make sure you check the min-width and min-height properties. If you set the stylesheet to "Show: Property Groups", then you'll find those properties under the Unclassified group.

The second thing to check is to open one of the problem topics in the Internal Text Editor or Notepad. This opens the topic to the code view. Look for the <img> tag and see if there are any inline styles set on it. For instance, <img height="500px" width="300px">. If there are inline styles, strip them out -- those values may not be the correct dimensions of that picture, so it appears distorted.

One last thing I should ask... What type of picture files are you using (e.g., JPG, PNG, BMP, etc.)?

[mkaminski]

The file type for the images is PNG. I was able to open one of the problem topics in Notepad and there are inline styles set for these images. I stripped them out and rebuilt the output. Checking the images afterwards they were no longer blurry or cropped. This is good.

My question now is that I have 128 topics currently and would have to edit each one stripping out the style set individually. Is there a way to avoid this? Either by re-importing and starting over or making a change to the way the target is built.

Thanks
Mark

[LTinker68]

You could do a find-and-replace in Flare with it set to look in the source code. Use regular expressions to strip out everything from the <img> opening tag except the src property. See this thread for more info on regular expressions --> http://forums.madcapsoftware.com/viewto ... 13&p=45699