Skip to main content
jim_dawg_atl
jim_dawg_atl
Participant
January 9, 2018
Answered

Making gifs for ads in photoshop

  • January 9, 2018
  • 2 replies
  • 783 views

Is there a way to decrease the initial load size for a gif in Photoshop?

The limit is 40kb for Initial load size, but the polite load size is 2.2mb

    This topic has been closed for replies.
    Correct answer Nancy OShea

    I don't know if this is what the OP wants but here is a quick hypothetical situation and solution.

    Let's say we have a 4 MB animated GIF we want to use on the website.   But the filesize is too big for mobile users on limited data plans.   To be kind, we want to load and serve mobile users a 20 KB static JPG instead of the animated GIF. 

    Add the Picture element.

    <picture>: The Picture element - HTML | MDN

    <picture>
          <source media="(min-width: 940px)" srcset="animated.gif" type="image/gif">
          <img src="static.jpg" alt="mobile alternate image">
    </picture>

    2 replies

    davescm
    Community Expert
    davescmCommunity Expert
    Community Expert
    January 9, 2018

    Whilst you can optimise the overall size of a gif in Photoshop and with tools outside of Photoshop,  I believe that controlling initial load and polite load are things you would set up in the web site software.

    I will tag Nancy OShea​ who has expertise in web site development and may be better able to answer your question.

    Dave

      Nancy OShea
      Community Expert
      Nancy OSheaCommunity ExpertCorrect answer
      Community Expert
      January 9, 2018

      I don't know if this is what the OP wants but here is a quick hypothetical situation and solution.

      Let's say we have a 4 MB animated GIF we want to use on the website.   But the filesize is too big for mobile users on limited data plans.   To be kind, we want to load and serve mobile users a 20 KB static JPG instead of the animated GIF. 

      Add the Picture element.

      <picture>: The Picture element - HTML | MDN

      <picture>
              <source media="(min-width: 940px)" srcset="animated.gif" type="image/gif">
              <img src="static.jpg" alt="mobile alternate image">
      </picture>

      Nancy O'Shea— Product User & Community Expert
        jim_dawg_atl
        jim_dawg_atlAuthor
        Participant
        January 10, 2018

        Wow! First time posting! thank you all so much! Very very helpful!

        Kristian Gabriel
        Kristian Gabriel
        Participating Frequently
        January 9, 2018

        There are several ways to do this that aren't always straightforward. Here is the short list:

        • Make size of the GIF smaller
        • Use Save For Web (Legacy) and tweak settings, color, and color algorithm (Perceptual, Selective, Adaptive,etc) to reduce size
        • Make length of your animation shorter (reduce the number of frames)
        • Use 3rd Party solutions that come in the form of plugins or online applications ( EZ GIF , GIF optimizer | GIFGIFs )
          Terms & ConditionsAccessibility statement
          Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices