티스토리 캡처 이미지 업로드 시 흐릿하게 나오는 현상 해결

후기 글 작성할 때는 거의 스마트폰으로 찍은 이미지라서 잘 몰랐는데 이번에 윈도우에서 캡처를 하면서 글을 작성하려고 하니 캡처 이미지을 업로드하고 발행하면 흐릿하게 해상도가 떨어져서 가독성이 떨어지더군요. 이 문제 때문에 몇 일을 고생해서 해결 방법을 알아내고 다시 포스팅에 집중하게 되었습니다. 일단 캡처 이미지가 어떻게 나오는지 살펴보겠습니다.

캡처 이미지 업로드 후 흐릿하게 나오는 현상

왼쪽이 티스토리에 업로드 한 캡처 이미지이고 오른쪽이 원본 캡처 이미지 입니다. 글씨를 못 읽을 정도는 아니지만 원본보다 선명도가 떨어져 흐릿하게 보이니 여간 신경쓰이는게 아니였습니다. 그래서 인터넷 검색하면서 해결 방법을 찾아보니 업로드 방법을 사진말고 파일이나 파일보관함에서 파일첨부를 하면 이미지가 선명하게 나온다고 해서 해봤는데 여전히 흐릿하게 나오더군요. 

스킨 제작자분께 이메일 문의 후 문제점 발견

검색으로는 방법을 못찾아서 스킨 제작자분께 이미지가 흐릿하게 나오는 문제점을 이메일 문의를 주고 받다가 이미지에 관련해서 뭔가 설정하신 게 있나요? 이 답변을 본 순간 이미지에 자동으로 테두리를 넣어주는 CSS 코드를 설정한게 떠오르더군요. 저는 테두리가 이미지 크기에는 영향이 없을 줄 알았는데 알고보니 테두리 두께를 두껍게 할수록 이미지가 줄어 들더군요. 

해결 방법

.imageblock { border: 4px solid #000000; }

블로그 관리 - 스킨 편집 - html 편집 - CSS 가서 코드를 주석 처리 했습니다. /* .imageblock { border: 4px solid #000000; } */ 이런식으로 앞 뒤에 넣어 주시면 됩니다. 앞으로 포스팅 할 이미지 테두리는 프로그램을 이용해서 직접 넣어 주어야 겠습니다.

> 티스토리 본문 이미지 테두리 그림자 적용 해제하기