HTMLHelp Forums > Break in Photo (Can't remove it)?

Full Version: Break in Photo (Can't remove it)?

HTMLHelp Forums > Web Authoring > Markup (HTML, XHTML, XML)

StephFWGMC

Jun 2 2009, 07:59 PM

Hi there,

I'm having a small bit of trouble that I've just about worn myself down to insane over here with. I have a spliced image (spliced for quicker loading) that will not show up as one entire image. For the life of me, I cannot find what is wrong with the code. Is there someone out there who can see this problem and help me solve it? I'd greatly appreciate it!

CODE

http://www.fortworthgemandmineralclub.org/2009flyer.html

I am using Firefox (as IE does not work on my system for some unknown reason). I've also tried viewing it in Google Chrome and see the same thing again.
So viewing it in FF version 3.0.10, I am seeing this:
IPB Image

Here is the code I am using for it:

CODE

<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="450" HEIGHT="735">

<TR>
<TD ROWSPAN="1" COLSPAN="1" WIDTH="223" HEIGHT="353">
    <IMG NAME="ama450x7350" SRC="http://www.fortworthgemandmineralclub.org/show/ama-450x735_1x1.jpg" WIDTH="223" HEIGHT="353" BORDER="0"></TD>
<TD ROWSPAN="1" COLSPAN="1" WIDTH="227" HEIGHT="353">
    <IMG NAME="ama450x7351" SRC="http://www.fortworthgemandmineralclub.org/show/ama-450x735_1x2.jpg" WIDTH="227" HEIGHT="353" BORDER="0"></TD>
</TR>

<TR>
<TD ROWSPAN="1" COLSPAN="1" WIDTH="223" HEIGHT="382">
    <IMG NAME="ama450x7352" SRC="http://www.fortworthgemandmineralclub.org/show/ama-450x735_2x1.jpg" WIDTH="223" HEIGHT="382" BORDER="0"></TD>
<TD ROWSPAN="1" COLSPAN="1" WIDTH="227" HEIGHT="382">
    <IMG NAME="ama450x7353" SRC="http://www.fortworthgemandmineralclub.org/show/ama-450x735_2x2.jpg" WIDTH="227" HEIGHT="382" BORDER="0"></TD>
</TR>

</TABLE>

I appreciate all help and time taken out to assist me more than most probably would know. So thanks very much in advance, although I'll probably give thanks again when I meet a resolution. LOL

Darin McGrew

Jun 2 2009, 08:45 PM

Please see the FAQ entry How do I eliminate the space around/between my images?

But if you're really concerned about quicker loading, then use real text, rather than images of text.

StephFWGMC

Jun 2 2009, 11:00 PM

QUOTE(Darin McGrew @ Jun 2 2009, 07:45 PM)

Please see the FAQ entry How do I eliminate the space around/between my images?

But if you're really concerned about quicker loading, then use real text, rather than images of text.

Thank you for your assistance. The reason for the image of text is because I was asked to "archive" the flyer art/poster from this year's show and I cannot really do that with simple text. So this is why I went ahead and sliced the image to show up. Otherwise, it'd have been entirely my intention to just type it out and forgo a silly image. Unfortunately, putting the code all in one line didn't seem to resolve the issue. I did check out the FAQ you referred me to and even read the "Things to Take into Account When Moving to Standards-Compliant HTML and CSS Authoring", and that did not help to resolve the issue. I was hoping that the "Eric Meyer's Images, Tables, and Mysterious Gaps" page would help, but that comes back as a page load error for me. It looks like the link is non-responsive for whatever reason. Do you happen to have any other ideas or suggestions? This is the code, modified as the FAQ suggests - all in one line and as it appears in my coding now.

ETA: I've resolved the issue through another method. I did not realize how out-of-date image slicing and tables were and that CSS didn't really like this kind of code. So instead, I just created a clickable thumbnail that loads quickly and shows the image in a popup window for those that have the patience and internet speed to load the full image. Again, thanks so much for the help. I did learn something from your link that you provided.

Brian Chandler

Jun 2 2009, 11:17 PM

QUOTE(StephFWGMC @ Jun 3 2009, 01:00 PM)

QUOTE(Darin McGrew @ Jun 2 2009, 07:45 PM)

Please see the FAQ entry How do I eliminate the space around/between my images?

But if you're really concerned about quicker loading, then use real text, rather than images of text.

Thank you for your assistance. The reason for the image of text is because I was asked to "archive" the flyer art/poster from this year's show and I cannot really do that with simple text.

Normally displaying text as images is a Bad Idea, but as you say, for archive purposes, Very Sensible. So just provide an image of the poster.

QUOTE

So this is why I went ahead and sliced the image to show up.

Why slice it up? Can you offer any rational justification for not having a simple image? (It seems to be a widely believed piece of folklore that images need "slicing", but there is no reason to.

StephFWGMC

Jun 2 2009, 11:26 PM

QUOTE(Brian Chandler @ Jun 2 2009, 10:17 PM)

Normally displaying text as images is a Bad Idea, but as you say, for archive purposes, Very Sensible. So just provide an image of the poster.

Why slice it up? Can you offer any rational justification for not having a simple image? (It seems to be a widely believed piece of folklore that images need "slicing", but there is no reason to.

I had replied while you were writing this. LOL See above reply.

Thanks again for your response and assistance!

pandy

Jun 3 2009, 05:08 AM

The loading time will in fact be a little longer when the image is sliced, or so I've heard.

QUOTE(Darin McGrew @ Jun 3 2009, 03:45 AM)

Please see the FAQ entry How do I eliminate the space around/between my images?

The correct URL for Meyer's gap article is https://developer.mozilla.org/en/Images,_Ta...Mysterious_Gaps .

Brian Chandler

Jun 3 2009, 06:19 AM

[quote name='pandy' date='Jun 3 2009, 07:08 PM' post='37719']
The loading time will in fact be a little longer when the image is sliced, or so I've heard.

It depends. Simply chopping up a 256-level png or jpeg into smaller pieces gains nothing. But in fact for an image like this it would be possible to chop it up into photos and graphics, and use jpeg and png for the respective parts, which _would_ provide higher quality per byte. But you would need to do careful colour reduction on the graphics parts.

pandy

Jun 3 2009, 10:03 AM

I remember there was program that could use different degrees of compression on different areas of a JPG. No idea how it worked, but it did. Must start my old machine and look for it. I think they made it freeware.

Brian Chandler

Jun 3 2009, 10:07 PM

QUOTE(pandy @ Jun 4 2009, 12:03 AM)

I remember there was program that could use different degrees of compression on different areas of a JPG. No idea how it worked, ...

A jpeg divides the image into 8x8 pixel blocks, then represents each block by a discrete cosine transform, which is sort of like a Fourier transform. The more coefficients you put in, the more accurately you can represent the original image, so all that's needed is to provide more coefficients for the blocks in the area you want to be more detailed.

AFAIK, programs are free to choose how to truncate the coefficients anyway, so normally a large 'flat' area will be represented by a lot less data than the same area of detail -- that's why even on a fixed "quality" setting, the file size of a jpeg of n x m pixels will vary widely depending on how much detail there is.

pandy

Jun 4 2009, 04:59 AM

QUOTE(Brian Chandler @ Jun 4 2009, 05:07 AM)

Makes sense then. Recalled the program was called Xat. It isn't free anymore.

This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.