While trying to make a sketch for a setup-page for the Arduino Ethernet Shield, I found out how to reduce the SRAM memory the most. Putting HTML into the sketch code eats Flash memory and If you're doing it the wrong way, your SRAM will be full very quick. In my last post I explained (more or less) how to reduce that memory use. Now I found out you can use only 1 buffer, trough which you can "flow" all of your HTML data. This means if your clever, you 'll use only a very small amount of SRAM. But still, you'll have to remember that your Flash memory is limited too.

The best thing to put an embedded image into your sketch is by making it an GIF image with reduced colours (16 or 32 colours). Remember if your picture is about 30K you won't get into your sketch. Be smart :-). Now if it's like 8Kb, you can now divide your image into smaller images, each image being 1024 byte. Now because we are using array's those 8 images will be
arrays of about 128 byte (well a bit more because you'll need <img src=\"data:image/gif;base64, and \" at the end.

1 image (of the 8 others forming 1 big image) will look like this in sketch code:

prog_char imagea0[] PROGMEM = "<img src=\"data:image/gif;base64,R0lGODdhFAB1AIQgACYbGS0gFh4vQS8yOj8zMSA7XUU2LFQzLTM9UiNDVxZHZ";
prog_char imagea1[] PROGMEM = "hZTclZKSF9JPElQWX5FNihbbTpWaplPPGFsdH9oV3NqZ1Jxg3yMlJWIfq+RcJyqsbWqnsnLx9zLtPvpxf3++iwAAAAAFAB";
prog_char imagea2[] PROGMEM = "1AAAF/uAnjmRpnmiqrmxrcrA7dpgli90E3V9n7TefgickWoZBy8K4TDZlvqcryqw6jUDoJTvdYone3iZDLpszm3Glgmu43";
prog_char imagea3[] PROGMEM = "/C4W+ShuA/wg15/P9DtcoENBn+CgoV3gwaLgX94cAZ8co5xkpMfHg2PfZZwlG+RnW+IlZuemIB5m6akb5J7o6iGrrGZpqW";
prog_char imagea4[] PROGMEM = "bdJqzewYNrYK5srNxn8Rzw8SAwILLyce/qKapjdLQyB2AFNvc3dvIHzDi4+Id5hUOPB8TCWDtPBfvN/HqFxH18jL08FwuG";
prog_char imagea5[] PROGMEM = "v0twsyT4uICwYAAWQjUl3DFQn8NVfyrFzGFQXUTeWCoiALDBHUbLoBkoxEDSJMln9VhQHkDA8mWL2W4VBnThUeQ93hoyOd";
prog_char imagea6[] PROGMEM = "iQ84bPlt0SJMGHQsOGLoxILBigxwGAVZgOGCAgNVBUVVgqGqVAFapXBctyppiq1WxBsh2PEAAbVqpbMUOYqo1rlxCWsVaZ";
prog_char imagea7[] PROGMEM = "bC0Kde9VsGe1et38Fi/VRMvKtw1cdMGZxs3Zdu2Kt/JeglcVuEU7YHNnFeu3IAhnU6eLTT8lKFaHYePrtXJnj0iBAA7\"";
PROGMEM const char *string_table2[] = {imagea0, imagea1, imagea2, imagea3, imagea4, imagea5, imagea6, imagea7};

In the above example the longest chain is 94 characters. We Add 1 and now we have our buffer = 95. Mind you, some part of the 8 images might be bigger. The biggest chain + 1 = your buffer.

I have made a project on this: an integrated webpage with image With the GIF image you can see in this blogpost. The image itself is about 7884 bytes, but the buffer is only 240 bytes. The sketch itself is 18956 bytes (of the 30K total). Total SRAM used will be less then 450 bytes (of the 2048)