Re: Problem displaying web pages

Terry,

My bad. I was looking at Pub 2007 when I gave you those directions, and
Compress pictures is built-in. I forgot that you were using Pub 2003 and
need to add the feature:

Reference: Compress graphics file sizes to create smaller Publisher Web
pages (2003):
http://office.microsoft.com/en-us/publisher/HA011266301033.aspx

You add it to the picture toolbar after installing the SP. And the compress
picture dialog does not give you as many options as it does in Pub 2007. The
option to resample pictures is not on the dialog, but it will resample
anyway. Perhaps before you do it, Publish to the web and direct all your
files to your desktop or somewhere else you can easily find them. Go into
the index_files folder and find the pictures we are talking about. Before
you compress the image, you should find two copies of the picture, and two
different sizes. Now compress the picture and republish to your desktop and
look at the image files again. This time you should find only one copy of
the picture, and the dimensions and the file size should be smaller.

And finally if you don't like the quality of the picture you get through the
compress pictures function, try resampling and optimizing the picture in
Irfanview or some other image editors before you insert it, as suggested.

DavidF

"terryp" <terryp@xxxxxxxxxxxxxxxxxxxxxxxxx> wrote in message
news:92F97A25-0E79-411A-830E-7CA7B1C62011@xxxxxxxxxxxxxxxx
David,
I selected the logo and then went to "Format" "picture" "picture tab" but
there is no compress button. I tried right clicking the image and got to
the
same place but still no compress button.
--
terryp


"DavidF" wrote:

Terry,

OK, let's set aside the issue of your laptop for the moment...especially
since I am currently out of good ideas :-)

However, in studying the code of the page you currently have posted at
http://www.aluminiumguttersupplies.com.au I see that your code is still
rendering two different versions of both your company logo and the
Colortuff
logo. Here is the company logo image rendered in IE7 for me:
http://www.aluminiumguttersupplies.com.au/index_files/image591.jpg
Notice that it is a jpg file 1798 X 616 image at 96 pixels per inch.
Where
as in FF a different image is rendered:
http://www.aluminiumguttersupplies.com.au/index_files/image5911.gif
It is a gif file 384 X 132 @ 72 ppi, and is of much lower quality than
the
jpg.

A similar situation for the Colorstuff logo. Here is the image that is
rendered in IE7:
http://www.aluminiumguttersupplies.com.au/index_files/image541.jpg
Notice it is a jpg file 1257 X 520 @ 300 pixels per inch, and the version
seen in FF is:
http://www.aluminiumguttersupplies.com.au/index_files/image5411.gif
It is a gif 132 X 44 @ 72 ppi

This suggests to me that though you thought you compressed those
pictures,
you did not. Publisher would not be making a low quality gif copy of the
original jpg if you had. So, select each logo and go to Format > Picture
>
Picture tab and at the bottom see the Compress button. Click it and in
the
Compress Pictures dialog make sure that Resample pictures is checked, and
the target output is web. And though you can Apply to all pictures, I
think
that because of the default setting that does not automatically resample
any
graphic smaller than 100 kb, it will not do the color stuff logo
automatically. I think you might have to compress or more specifically
resample each.

Now Publish to the Web and see if that makes any difference as to how it
looks on your local computer? And, so I can monitor your progress, do
upload
the new web files to your host so I can see if the change helps in how it
looks for me on FF.

That is all I have time for this morning, so if you can compress those
two
logos again, and upload the new files and let me know if it made any
difference on how they look on your laptop, we will take it from there.
By
the way, I assume that you are keeping original copies of all these
images
as we mess with them?

DavidF

"terryp" <terryp@xxxxxxxxxxxxxxxxxxxxxxxxx> wrote in message
news:51F512EE-D1B0-4C1B-8AFA-CE7A82EB337F@xxxxxxxxxxxxxxxx
David,

I went into multimedia and "Always use cleartype for HTML" was already
checked.

I changed the screen resolution down but this made no difference.

The grainyness only occurs when I view this site through ie7 and FF.
When
viewing this site in publisher the images are good quality.

I saved the images as 96dpi gif images and confirmed that they are
displaying at 100%. Interestingly, as soon as I did this the images
appeared
grainy in publisher as well as the two browsers. Is there a clue here?

Terry
--
terryp


"DavidF" wrote:

Terryp,

Hey...making progress...good work!

The issue of the images being grainy can be explained, but the text is
a
different story...especially as it is not grouped and being converted
to
an
image and is just happening on your laptop. So let me make a stab at
that
first. Sometimes when you do not have an LCD screen set at its
'native'
resolution, you can end up with fuzzy images and text. I am wondering
if
your text would look better if you changed the resolution on your
laptop
back to where it was set when you got it. And even if you didn't reset
the
resolution at some point of time, try dropping the resolution one or
two
notches from where it is set. If it is at 1280, then drop it to 1152
or
whatever is the next size smaller for your laptop. Remember you can
access
those controls via the display properties.

Here is another stab that you might try first. Open IE7 > Tools >
Internet
Options > Advanced Tab. Scroll down to the Multimedia section and make
sure
that 'Always use Clear Type for HTML' is selected. This can help make
text
more crisp.

Now as to the images being grainy, I am guessing that what you see is
the
difference in appearance of how those logos look on IE vs. how they
look
on
FF for me. They are grainy, lower resolution pictures than what I see
on
IE7. To explain, first of all, the compress graphics feature does not
change
any graphic that is less than 100 kb, which I am certain includes your
logos. Secondly because of the way the coding engine works and the
built-in
VML, Publisher almost always produces a low resolution copy of clipart
that
renders in FF poorly. Part of the reason is that many times a person
inserts
a logo or piece of clipart that is at 72 dpi, but Publisher makes a 96
dpi
copy of that image for FF when you produce your web files, which
results
in
a grainy, low res image. Regardless of the reason why it does this
there
is
a fix...usually.

Open your publication, right click your logo > Save as a Picture and
look
for the resolution option above the file name. Choose the Web (96 dpi)
option. Then try saving as a GIF, a PNG and maybe even a JPG. The GIF
file
will be the smallest file size and will load the fastest. Insert these
new
images into your page instead of the original logo image. Then be sure
to
select that image > Format > Size tab and confirm that the scale is at
100%.
Now when you produce your web files, Publisher will use that image
instead
of making a bad copy of it. Test to see which file format gives you
the
best
results. I would test in FF on one of your other computers to confirm
what
will be seen by other people, but of course I hope that it also gives
you
a
better quality image on your laptop too.

You can also optimize these logos and other images in a third party
image
editor if you prefer. Though it is a bit more work to optimize the
images
before you insert them, I do it, because I prefer the results to what
I
get
when doing the Save as an image approach from Publisher, and from the
compress images approach on larger jpg images. I can also control the
compression and quality more directly that way and get the smallest
file
size that still looks good, but also loads the fastest on my pages.
There
are a number of free image editors out there. I use Adobe Photoshop
Elements
but also http://www.irfanview.com/ which is a very good freebie. Just
remember to use 96 dpi and not 72 dpi and I find about 30% compression
seems
to be a pretty good compromise between quality and file size...but you
can
experiment.

And even if the first stabs at fixing the problems with your laptop
work,
I
would suggest that you go to the trouble of fixing these logos and
your
product images for the general public who views your site in FF. You
have
put a lot of work into your websites, and you may as well invest a bit
more
work and get it as good as you can....and your logo is probably your
most
important brand image...you want it as good as your company is ;-)

Hope that helps.

DavidF

"terryp" <terryp@xxxxxxxxxxxxxxxxxxxxxxxxx> wrote in message
news:B3BC2B67-EC73-46BB-B502-7A1F7F2C1FC9@xxxxxxxxxxxxxxxx
Thanks again David,

I have removed all design elements from the master page.

I ungrouped the nav bar on the home page, deleted the grid overlay
and
created hot spots for each nav button. All pages are now loading
fully
in
both ie7 and FF. The nav bar now works in FF too. Well done and
thanks.

The images however are still grainy and I have noticed that it is
not
just
the images but also the text that is grainy too. As i mentioned
before,
this
only appears to be on my laptop.

The images are not grouped with other design elements.

I have resized jpg images but have also run the "compress graphics
feature".

The images listed below are the images that are very grainy, however
as
I
mentioned earlier the text is displaying poorly too, and I suspect
the
other
images may be grainy but it's not as noticable.
1. Aluminium Gutter Supplies logo
2. Colortuff logo
3. All the product images in the product list.

Looking forward to your suggestions.

Terry
--
terryp


"DavidF" wrote:

terryp,

Thank you. That helped eliminate some potential issues, and
provided
some
additional insights.

Master Page - Yes, you should remove all design elements from the
Master
Page. In general you should not use the Master Page feature in a
Publisher
web and save that for print publications. It is unfortunate as it
would
be
great to use in exactly the way you are, but it just causes too
many
problems in a Publisher web. But to be clear, I am talking about
going
to
View > Master Page and doing this for each page of the publication.
Move
everything off the Master Page and to the main pages of your
publication.

As per how you fixed the navbar in
http://www.aluminiumguttersupplies.com.au/ , that was a creative
approach
but is probably the reason your navbar is not working in FF. By
design
Publisher 2003 allows one to group two or more design objects
together
so
that it is easy to move those design elements around in a group and
maintain
the relative space and layout between them. It also makes it
possible
to
right click that group and save as a picture. Unfortunately this
also
can
result in those objects being converted to one combined image that
is
usually a low resolution gif when you Publish to the Web and
convert
to
html. It also tends to kill any hyperlinks that may be in a text
box,
or
otherwise. This is probably why your navbar does not function on
your
home
page when viewed in FF. This also means that you may not be able to
use
the
autoshapes and overlay the navbar as you are.

I would first try ungrouping the autoshapes grid as you put it,
from
the
navbar and from each other. Publish to the web and see if your
navbar
functions correctly in FF. You do not need to upload the files to
test.
Just
direct your web files to somewhere on your computer where you can
find
them
when you Publish to the Web. Then find the index.htm file, right
click,
and
choose to Open With FireFox. (alternatively you can open FF go to
File
>
Open File and browse to where the index.htm file is on your
computer,
or
to
test the other .htm files contained in the index_files folder). If
the
navbar links don't work, then you might try selecting them and
going
to
Arrange > Order > Bring to Front. Produce new html files and test
again.
If
the navbar links still don't work, then you will need to remove the
autoshapes. You might be able to use a simple text box the size of
each
navbar with no text or fill in them, but with the hyperlink
inserted
by
way
of a hotspot, which is found all the way on the left side of
Publisher,
is a
small icon that looks like a small ball or button with a dotted
square
around it. After moving the text box over the navbar link, and
sizing
it
exactly the same size, or perhaps a bit smaller, bring it to the
front
of
the navbar, do not group it to the navbar, and test again. If this
approach
also kills the link in the navbar, I am out of suggestions, and you
may
have
to live with the fact that the user will have to point at the text
in
the
navbar to use the link. This far less a problem than having a
dysfunctional
navbar when you view your site in FF.


.