오늘은 티스토리 블로그에 사진 3장을 효과적으로 넣는 다양한 방법에 대해 알아보겠습니다. 블로그 포스팅에서 이미지는 글의 가독성을 높이고 독자들의 시선을 사로잡는 중요한 요소입니다. 특히 여러 장의 사진을 효과적으로 배치하면 콘텐츠의 품질을 한층 더 높일 수 있죠.
1. 티스토리 기본 기능으로 사진 넣기
티스토리는 사용자 친화적인 인터페이스로 사진 삽입이 매우 간편합니다. 기본적인 방법은 다음과 같습니다:
1.1 첨부 기능 사용하기
- 글쓰기 화면 상단의 첨부 버튼을 클릭합니다.
- 드롭다운 메뉴에서 사진을 선택합니다.
- 원하는 사진을 선택하고 열기를 클릭합니다.
1.2 티스토리 블로그 여러 장의 사진 한 번에 선택하기
- 연속된 사진 선택: 첫 번째 사진을 클릭한 후 마지막 사진을
Shift
키를 누른 상태에서 클릭하면 연속된 여러 장의 사진을 선택할 수 있습니다. - 개별 사진 선택: 첫 번째 사진을 클릭한 후 다른 사진은
Ctrl
키를 누른 상태에서 클릭하면 원하는 사진만 선택할 수 있습니다.
2. 다양한 티스토리 블로그 사진 배치 방법
2.1 사진 나란히 배치하기
- 첫 번째 사진을 삽입한 후, 두 번째 사진을 클릭하여 드래그합니다.
- 첫 번째 사진 옆에 빨간색 세로 라인이 나타날 때 마우스 버튼을 놓습니다.
- 세 번째 사진도 같은 방법으로 두 번째 사진 옆에 배치합니다.
완성된 모습은 아래와 같이 세 장의 사진이 나란히 배치됩니다:
2.2 사진 크기 조절
사진을 나란히 배치하면 자동으로 크기가 조절되지만, 개별적으로 크기를 조절하고 싶다면:
- 사진을 클릭하여 선택합니다.
- 사진 하단에 나타나는 편집 버튼을 클릭합니다.
- 크기 조절 옵션에서 원하는 크기로 설정합니다.
3. HTML을 활용한 사진 삽입
HTML 코드를 사용하면 더 세밀하게 사진을 제어할 수 있습니다.
3.1 HTML 모드로 전환하기
- 글쓰기 화면 상단의 기본 모드를 클릭합니다.
- HTML을 선택하여 HTML 모드로 전환합니다.
3.2 이미지 태그 사용하기
<div style="display: flex; justify-content: space-between;">
<img src="이미지URL1" width="32%" />
<img src="이미지URL2" width="32%" />
<img src="이미지URL3" width="32%" />
</div>
이 코드는 세 장의 사진을 동일한 간격으로 나란히 배치합니다. width="32%"
는 사진의 너비를 설정하며, 약간의 간격을 두기 위해 100%보다 작게 설정했습니다.
3.3 이미지 URL 얻기
이미지 URL을 얻는 방법:
- 이미 티스토리에 업로드된 사진이라면, 기본 모드에서 사진을 삽입한 후 HTML 모드로 전환하여
src
속성 값을 확인합니다. - 웹에 있는 사진이라면, 해당 사진에 우클릭하여 '이미지 주소 복사'를 선택합니다.
4. 티스토리 블로그 이미지 최적화 방법
블로그 성능과 SEO를 위해 이미지를 최적화하는 것이 중요합니다.
4.1 파일명 최적화
사진 파일명에 검색 키워드를 포함시키고, 공백 대신 하이픈(-)을 사용합니다.
- 잘못된 예:
DSC_0001.jpg
,사진 1.jpg
- 좋은 예:
티스토리-블로그-사진-넣기.jpg
4.2 티스토리 블로그 사진 캡션과 알트 태그 추가
- 사진을 삽입한 후 선택하면 하단에 "이미지를 설명해 보세요"라는 텍스트 입력란이 나타납니다.
- 여기에 적절한 설명(캡션)을 입력합니다.
- 알트 태그는 사진 편집 옵션에서 추가할 수 있습니다.
4.3 티스토리 블로그 이미지 크기와 용량 최적화
웹페이지 로딩 속도를 위해 이미지 용량을 최적화하세요:
- 블로그에 맞는 적절한 크기로 리사이징합니다.
- JPG 포맷은 사진에, PNG는 투명 배경이 필요한 이미지에 사용합니다.
- 온라인 이미지 최적화 도구를 활용하여 품질은 유지하면서 용량을 줄입니다.
5. 자주 묻는 질문
Q: 모바일에서도 사진을 나란히 배치할 수 있나요?
A: 네, 동일한 방법으로 배치할 수 있습니다. 다만 모바일 화면은 좁기 때문에 반응형으로 표시되어 PC와 다르게 보일 수 있습니다. HTML 코드를 사용할 경우 모바일 화면에 맞게 조정하는 미디어 쿼리를 추가하는 것이 좋습니다.
Q: 사진을 넣었는데 검색엔진에서 잘 노출되지 않아요.
A: 파일명, 캡션, 알트 태그를 모두 키워드를 포함하여 최적화하고, 공백 대신 하이픈(-)을 사용하세요. 이렇게 하면 검색엔진이 이미지를 더 잘 인식합니다.
Q: Ctrl+C, Ctrl+V로 사진을 넣으면 안 되나요?
A: 단순히 복사-붙여넣기만 하면 이미지 최적화가 되지 않아 검색엔진 노출에 불리합니다. 가능하면 파일로 저장한 후 첨부 기능을 통해 삽입하는 것이 좋습니다.
마무리
티스토리 블로그 사진 나란히 넣기 방법에 대해 알아보았습니다. 기본 기능을 활용한 방법부터 HTML을 활용한 고급 방법, 그리고 이미지 최적화 팁까지 다양한 방법을 소개했습니다. 이 방법들을 활용하여 더욱 매력적인 블로그 콘텐츠를 만들어보세요!
항상 기억하세요: 좋은 블로그는 내용도 중요하지만, 시각적 요소도 독자들의 관심을 끄는 중요한 요소입니다. 사진을 효과적으로 배치하고 최적화하여 블로그의 가치를 높여보세요.