여러 이미지를 올리고 순서·재생 속도·반복을 정하면 움직이는 GIF로 만들어줘요. 업로드 없이 브라우저에서 바로 인코딩돼요.
GIF는 색을 256개로 줄여 저장하는 형식이에요. 사진처럼 색이 많은 이미지는 띠처럼 뭉치는 자국이 생길 수 있고, 프레임 수와 크기가 늘어나면 용량이 빠르게 커져요. 화면 녹화처럼 색이 단순한 이미지에 가장 잘 맞아요.
GIF 는 1987년 형식이에요. 어디서나 열린다는 게 가장 큰 강점이라 지금도 살아남았어요 — 메신저·게시판·이메일 어디에 넣어도 자동 재생되고 별도 플레이어가 필요 없어요.
한계는 색이 256개뿐이라는 거예요. 사진이나 그라데이션을 넣으면 색이 뭉치거나 얼룩덜룩해져요(디더링).
그래서 GIF 는 색이 적고 짧은 동작에 맞아요 — 화면 녹화, 도표 애니메이션, 단순한 반응 짤. 실사 영상은 형식 자체가 안 맞습니다.
GIF 는 프레임마다 이미지를 통째로 담는 구조에 가까워요. 동영상 코덱처럼 «앞 프레임과 달라진 부분만» 저장하는 압축이 약해요.
그래서 같은 길이 영상이 MP4 보다 5~10배 큽니다. 10초짜리 GIF 가 5MB 를 넘는 건 흔해요.
줄이는 방법은 세 가지예요: 크기(해상도)를 줄이기 · 프레임 수를 줄이기(초당 10~15장이면 충분히 부드러워요) · 길이를 짧게 자르기.
셋 중 해상도가 효과가 가장 커요. 가로 480px 이면 대부분의 용도에 충분해요.
초당 프레임(FPS) 이 높을수록 부드럽지만 용량이 비례해서 커져요.
10~15fps 가 GIF 의 실용적인 균형점이에요. 24fps 이상은 사람 눈에 큰 차이가 없는데 용량만 두 배가 돼요.
프레임 지연(각 장이 머무는 시간)으로 속도를 조절해요. 100ms 면 10fps, 50ms 면 20fps 예요.
⚠️ 브라우저에 따라 10ms 미만 지연은 무시하고 100ms 로 처리해요. 아주 빠른 GIF 가 의도보다 느리게 도는 이유예요.
GIF 의 투명은 켜짐/꺼짐 두 단계뿐이에요. PNG 처럼 반투명(부드러운 가장자리)을 표현할 수 없어요.
그래서 둥근 모서리나 그림자가 있는 이미지를 투명 GIF 로 만들면 가장자리가 톱니처럼 거칠어져요.
투명이 중요하면 GIF 대신 APNG 나 WebP 를 쓰는 게 맞지만, 지원 범위가 GIF 만큼 넓지는 않아요.
웹페이지에 넣는다면 MP4·WebM 영상이 훨씬 낫습니다. 용량이 1/10 이고 화질도 좋아요. `<video autoplay muted loop playsinline>` 이면 GIF 처럼 자동 재생돼요.
WebP 애니메이션은 GIF 와 쓰임이 같으면서 용량이 절반 이하예요. 브라우저 지원도 이제 충분해요.
그럼에도 GIF 를 쓰는 이유는 붙여넣기 하나로 어디서나 동작하기 때문이에요. 메신저나 이메일에 넣을 거라면 여전히 GIF 가 확실합니다.
이미지를 GIF 로 엮는 과정이 전부 브라우저에서 처리돼요. 사진이 서버로 올라가지 않아요.
프레임이 많거나 해상도가 크면 메모리를 많이 써요. 탭이 느려지면 해상도나 프레임 수를 줄여 보세요.
GIF 는 기본이 무한 반복이에요. 반복 횟수를 지정할 수도 있지만 대부분의 도구가 무한으로 만들어요.
정지·되감기 버튼이 없어요. 사용자가 재생을 제어할 수 없다는 게 GIF 의 근본적인 한계예요. 긴 GIF 가 불편한 이유이기도 하죠.
⚠️ 접근성 문제도 있어요. 빠르게 깜빡이는 GIF 는 광과민성 발작을 유발할 수 있고, 자동 반복은 주의력 장애가 있는 사용자에게 방해가 돼요. 웹 접근성 지침은 5초 이상 자동 재생되는 콘텐츠에 정지 수단을 요구해요. 긴 애니메이션이라면 영상으로 만들어 재생 컨트롤을 주는 게 맞습니다.
첫 프레임이 썸네일이 돼요. 메신저나 게시판에서 재생 전에 보이는 그림이라, 내용을 대표하는 장면으로 시작하세요.
시작과 끝을 비슷하게 만들면 무한 반복이 자연스러워요. 뚝 끊기는 느낌이 사라져요.
중요한 정보는 여러 프레임에 걸쳐 유지하세요. 한 프레임만 스치면 못 읽어요.
글자를 넣는다면 크게. 작은 글씨는 256색 제한과 압축 때문에 뭉개져요.
아니요. GIF 인코딩은 브라우저 안에서만 처리돼 사진이 밖으로 전송되지 않아요.
정해진 제한은 없지만 장수가 많거나 해상도가 크면 인코딩이 느려지고 파일이 커질 수 있어요.
프레임 간격(딜레이)을 줄이면 빨라지고 늘리면 느려져요. 미리보기로 확인하며 조절하세요.