Git | Github

[Github]깃헙 readme에 GIF 올릴 때! +용량줄이기

hans-j 2023. 2. 19. 01:59

HTML/CSS으로만 구성한 만큼...동적인 작업이 없었기때문에 

 

미디어쿼리로 반응형으로 만든거랑 더보기 기능 만든거;; 이게 그렇게 리드미에 자랑이 하고싶었나보다...진짜

 

5MB이하만 허용된다길래

 

이미지 용량줄이기  짬밥으로

 

이번에도 별 거 없겠지 싶었는데 별 거 였다..참내

 

내가 생각했던 작업 순서

 

1. (윈도우 10기준) 윈도우키 + G 키로 캡처 프로그램 활성화하기

2. 캡 처

3. 녹화된 동영상 필요 없는 부분 짜르고 crop하기

4. 정돈된 영상 GIF변환

5. 깃허브 리드미에 올리기

 

결과

깃허브 : 용량이 크다. 돌아가라

 

아..

 

이걸 어떻게 줄여;;하던차에!! 

찾았다. 방법.

 

 

해결한 작업순서

1. (윈도우 10기준) 윈도우키 + G 키로 캡처 프로그램 활성화하기

2. 캡 처

3. 녹화된 동영상 필요 없는 부분 짜르고 crop하기

4. 정돈된 영상 resize하고 용량 압축 (어차피 큰 GIF는 필요없어서 가장 작은 480P로 했다)

5. 용량 작은 mp4파일을 GIF로 변환

6 깃허브 리드미에 올리기

 

 

이때 사용한 사이트들!

 

https://express.adobe.com/ko-KR/tools/crop-video

 

Adobe Express

 

express.adobe.com

여기에서  mp4 포맷의 영상파일 필요없는 부분 자르고 crop

 


https://www.veed.io/video-compressor?locale=ko-KR&source=%2Ftools%2Fvideo-compressor%2Fgif-compressor 

 

VEED - Create, Edit & Share Videos Online for free

 

www.veed.io

여기서 정돈된 영상 크기, 용량 다 줄이기!! 압축 얍!


 

https://ezgif.com/video-to-gif

 

Online video to GIF converter

Upload your video, select the part you want to convert and instanlty create a GIF in good quality for free and without watermarks.

ezgif.com

 


아 참 GIF 사이즈 바꿀 때!! 마크업언어로 작성해도

이미지는 HTML으로 적용 가능!

 

https://stackoverflow.com/questions/54032443/resizing-gif-in-markdown-github

 

Resizing gif in markdown (github)

I am trying to resize my gif that is to be displayed in Github. The gif is in a folder in the repository. I have tried a lot of the solutions but they do not work. Changing image size in Markdown...

stackoverflow.com

이 방법으로 GIF를 반으로 줄여서 올렸다. (용량말고 크기! 사이즈!)

 

 

 

 

 

이미지 올리는 방법은 아래 주소를 참조했당

https://aiday.tistory.com/83

 

[Github] 깃허브 README.md에 이미지 올리기 (feat.Issue)

README.md readme.md 파일은 깃허브에서 프로젝트에 대한 소개와 설명을 제공하기 위한 파일입니다. 깃허브 프로젝트의 루트 디렉터리에 위치하며, 프로젝트에 대한 간략한 설명, 사용법, 설치 절차,

aiday.tistory.com