Web Analytics Made Easy -
StatCounter Can I embed graphics into HTML? - CodingForum

Announcement

Collapse
No announcement yet.

Can I embed graphics into HTML?

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Can I embed graphics into HTML?

    Is it possible to have the actual graphic in the HTML code itself?

    So data would look like a jumble of random chars - but to the browser will be an image.

    How do I do this?

    Thanks.

  • #2
    These are called data URIs with base64 encoded strings.
    Stop solving problems you don’t yet have!

    Comment


    • #3
      Originally posted by OM2 View Post
      Is it possible to have the actual graphic in the HTML code itself?
      This is one of those "yes you can" where you have to ask "but should I?"

      As @VIPStephen mentioned, you can do it through "base64" encoding, but that can introduce a number of issues.

      First off, it's called "base64" not because it's 64 bit, but because it's actually a 6 bit format (64 possible values). This means by definition the image file you are including will grow 33% in size MINIMUM... because of course what you need is some fat bloated image being larger in size. You'll get some mouth-breathers who claim it's a 64 bit "native format" that computers "process really well" -- those who do so are talking out their arse and know **** about ****! About the only place it would approach being a native format is on a 1970's mainframe...

      Second, because it's a 6 bit recode of 8 bit values, it takes some processor time and extra memory to decode -- doubling up the memory footprint and processing time as now the image has to be decoded TWICE. First from Base64 to 8 bit binary, then again from whatever image format is in use to a normal bitmap. More memory and more CPU is bad in the age of handheld battery powered devices being online.

      Third, while it CAN save you a handshake and the need to host the image separate from the file, it removes the chance to CACHE the image separately should someone revisit the same page, or should you use the same image across multiple pages or multiple times on a page.

      Finally, to update/change the image you have to edit the markup -- that just sucks.

      It's NOT something I would recommend doing unless you were dealing with something being served as a standalone local file like as documentation inside a archive... or a HTML e-mail... and even in the case of the latter most mail clients will choke on it, so really...

      Don't do it. I don't know your exact usage scenario, but it's HIGHLY unlikely this is something worth doing as the result is more likely to do harm than good.

      But yes, you CAN do it.
      Last edited by deathshadow; Sep 30, 2016, 12:31 AM.
      Walk the dark path, sleep with angels, call the past for help.
      https://cutcodedown.com
      https://medium.com/@deathshadow

      Comment


      • #4
        Originally posted by deathshadow View Post
        a HTML e-mail... and even in the case of the latter most mail clients will choke on it
        not if the image code is in its own multipart/related section of the email where it belongs with that referenced in the src attribute.
        Stephen
        Learn Modern JavaScript - http://javascriptexample.net/
        Helping others to solve their computer problem at http://www.felgall.com/

        Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

        Comment


        • #5
          Originally posted by felgall View Post
          not if the image code is in its own multipart/related section of the email where it belongs with that referenced in the src attribute.
          G-Mail and Thunderbird yes... Live, Y!, and Opera... less so... Anything less like Squirrel or Roundcube? Foggedabaddit...

          Though to be fair not like i'd EVER see an e-mail that has that in the first place unless I'm cleaning out my spam box, since I use the mere presence of HTML as a trigger for SpamAssassin; since no legitimate e-mail I would ever get from a legitimate contact has ANY legitimate reason to have HTML in it. Guaranteed, it's HTML, it's spam.
          Walk the dark path, sleep with angels, call the past for help.
          https://cutcodedown.com
          https://medium.com/@deathshadow

          Comment


          • #6
            Originally posted by deathshadow View Post
            G-Mail and Thunderbird yes... Live, Y!, and Opera... less so... Anything less like Squirrel or Roundcube? Foggedabaddit...
            Any that don't are not complying with the email standards as that is how the standard says that images should be embedded into emails.

            I haven't seen many people do that though - almost no one bothers including images in their emails at all - mostly I just see placeholders with a broken image indicator where the sender tried to link to the image from somewhere else (100% guaranteed spam so 100% blocked in my emails - strangely quite a few of the emails containing the spam images are not themselves spam).

            My main newsletter has both text and HTML versions (in the same email) with the HTML version having a small image at the top (that is properly embedded in the email).
            Stephen
            Learn Modern JavaScript - http://javascriptexample.net/
            Helping others to solve their computer problem at http://www.felgall.com/

            Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

            Comment


            • #7
              Originally posted by felgall View Post
              Any that don't are not complying with the email standards as that is how the standard says that images should be embedded into emails.
              Remember, most mail clients still choke on anything newer than HTML 3.2, much less CSS.

              Originally posted by felgall View Post
              My main newsletter has both text and HTML versions (in the same email) with the HTML version having a small image at the top (that is properly embedded in the email).
              Which would make it past my spam filter, though only the text/plain (assuming multipart) would be displayed. The rest blocked as a matter of principle.
              Walk the dark path, sleep with angels, call the past for help.
              https://cutcodedown.com
              https://medium.com/@deathshadow

              Comment


              • #8
                Originally posted by deathshadow View Post
                Which would make it past my spam filter, though only the text/plain (assuming multipart) would be displayed. The rest blocked as a matter of principle.
                It is done correctly as multipart so only those silly enough to allow the HTML3.2 version get it and everyone else gets the plain text version.
                Stephen
                Learn Modern JavaScript - http://javascriptexample.net/
                Helping others to solve their computer problem at http://www.felgall.com/

                Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

                Comment

                Working...
                X