There is many image macros that consist of the same picture but with different text. Seems like a waste of space.
Is there any image filetype that allows for an easily modifiable text layer?
SVG seems to be the closest candidate with wide browser support. But embedding bitmapped images is costly in SVG
Ideally, it should be a file type that allows for only sending the text, if the user already has the image cached.
Heck something like
[Upper: I AM A CAT...; Lower: BUG; ImageTemplate: imageTemplate.template.png ]
could be good. Where the '.png' somehow has a marker where the upper and lower text should be, and the default font.
Only problem would be broken links... so SVG is still a better candidate because of its embeddable image capability.
Hence the need for a dedicated filetype just for image macro containers that allows for modifiable text, but keeps the image separate for selective transmission to cache.
Plus it would make remixing easier.-- mofosyne, Mar 18 2014 In terms of HTML "style" properties, you can specify a "z-index" field, which basically does overlays. The lower z-index number is underneath the higher z- index number, and the numbers start at 0 and can go as high as you need.
A little more work than only that is needed, though. First, specify the HTML container-object you want to use, such as with a "div" tag. In the style properties for that tag, you want to specify "position:relative;". This ensures that the thing inside the "div" block gets moved around as you add stuff before it in the overall HTML document.
Then for each item inside the "div" block, its style properties should be set to "position:absolute;" along with details like "top:0px; left:0px; z- index:0;" (a lot of things can be included in the group of style properites). The "top" and "left" values are positions in terms of pixels, and in this paragraph would be "absolute" with respect to where-ever the "div" container is located. That is, no matter where the "div" is located on the overall HTML page, the upper-left location of that "div" block has coordinates "top:0px;left:0px;" So, different things inside the "div" can be precisely positioned, and when they overlap, the z-index property lets you decide exactly how they will overlap.
If the whole "div" block is moved around, none of the items within the block are affected, relative to each other --all move together as the "div" is moved around.-- Vernon, Mar 18 2014 .chz-- FlyingToaster, Mar 18 2014 Yes, it would save TONS of bandwidth.
All the meme sites need to just set the image & text to be separate HTML elements, & then all browsers (& middle-men in the network) will cache the image part.-- sophocles, Mar 19 2014 all your ideas are fantastic, especially using existing tech like HTML.
Only concern is how do you 'share it'? E.g. say you want to download it, for reposting at a random imageboard?-- mofosyne, Mar 21 2014 random, halfbakery