Please note that the instructions on this page are old. While this method of chopping an image and placing it in a table still works, it is not necessarily considered to be desirable. Using tables for placement of things on a page is code heavy. It is much better to use CSS. - March, 2007
This is how a large image can be cut up to reduce uploading time (although there is a legitimate debate out there in the ether as to whether it really does). Many images can be reduced in bytesize without really compromising the quality. Please hit the top dog to see a demonstration.
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
Change the table to border="0" to remove the lines:
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
tp_l.jpg 39 x 283 pixels 1.97kb | 4thJuly.jpg 295 x 290 pixels 12.9kb | tp_r.jpg 330 x 290 pixels 13.1kb |
lw_lft.jpg 39 x 283 pixels 2.47kb | lw_m.jpg 295 x 290 pixels 19.8kb | low_r.jpg 330 x 290 pixels 19kb |
totalling 69.24
Here is a page showing the unchopped image (664 x 573 pixels - 54.2kb)
Please note that it is essential that there are no spaces or line breaks in the coding of your table. If you do put in spaces or linebreaks into the coding, some browsers will put spaces between the image portions, causing the image to still look chopped up. You have to make a choice. Would you rather that your coding were easy for you to read or that your viewers will see your page as you intended it. If you are unfamiliar with table construction, Sizzling Jalfrezi has an easy to follow table tutorial.
The following coding using line breaks and spaces in the coding will cause weird spaces in some browsers:--------------------------------------------------------------------- <table border="0" cellpadding="0" cellspacing="0"> <tr> <td> <img src="imagepart.jpg" alt="left" width="xx" height="yy" border="0" /> </td> <td> <img src="imagepart.jpg" alt="right" width="xx" height="yy" border="0" /> </td> </tr> </table>
---------------------------------------------------------------------
Using tables for placement of things on a page is code heavy. It is much better to use CSS (not to mention that tables should be used as tables...). W3Schools CSS Tutorial and Quirksmode (CSS and Javascript) are invaluable sources of information for learning about CSS.
© llizard 2001, 2003, 2007
CWC reference pages . ASCII-art . illustrations and gif animations . llinks to ridiculously useless sites . home page