이미지 및 미디어 애셋
개요
이미지는 방문자가 브랜드, 제품, 작업 및 공간을 빠르게 이해하도록 도울 수 있습니다. 그러나 이미지는 웹사이트를 비전문적으로 보이게 만드는 가장 쉬운 방법이기도 합니다. 너무 크면 업로드에 실패하고, 너무 작으면 흐릿해지며, 설명이 없으면 검색 엔진과 보조 도구가 이미지를 이해하지 못합니다.
Kanorio의 표준 웹사이트 이미지는 모듈을 편집할 때 업로드하여 사용됩니다. 현재 중앙에서 저장하고 선택할 수 있는 별도의 "미디어 라이브러리"는 없습니다. 즉, 먼저 이미지가 들어갈 모듈을 결정한 다음 해당 필드에서 애셋을 업로드하거나 선택합니다.
이미지 업로드 위치
이미지 필드는 모듈에 따라 표시됩니다. 예를 들어, 페이지 히어로 이미지, 이미지 및 텍스트 레이아웃, 이미지 갤러리, 제품 표시, 헤더 로고, 파비콘 아이콘 및 페이지 공유 이미지는 각각 자체 이미지 선택기를 갖습니다.
1. 편집할 모듈 열기
편집기 미리 보기에서 모듈을 클릭하거나 "레이아웃" 목록에서 선택합니다. 이미지 필드를 찾으면 클릭하여 업로드하거나, 이미지를 선택하거나, 이미지를 교체합니다. 아직 적절한 콘텐츠 블록이 없다면 "섹션"에서 추가할 수 있습니다.
2. 이미지 소스 선택
이미지 선택기는 일반적으로 "업로드", "이미지 URL", "스톡 사진"의 세 가지 소스를 제공합니다. 컴퓨터에서 파일을 선택하거나, 공개적으로 액세스 가능한 이미지 URL을 붙여넣거나, Pexels 또는 Pixabay 스톡 사진 라이브러리에서 이미지를 선택할 수 있습니다. 선택 후 로드가 완료될 때까지 기다린 다음 미리 보기가 올바른지 확인합니다.
자르기 도구가 보이면 표시 영역을 조정한 다음 자르기를 완료합니다. 자르기가 완료되기 전에 설정 패널을 떠나는 것을 서두르지 마십시오. 외부 이미지 URL을 사용할 때는 해당 이미지를 사용할 권리가 있고 소스 웹사이트가 공개 로드를 허용하는지 확인하십시오. 소스에서 이미지를 제거하거나 URL을 변경하거나 액세스를 제한하면 웹사이트에 더 이상 표시되지 않을 수 있습니다.
3. 이미지 설명 채우기
ALT 텍스트를 지원하는 필드의 경우 이미지 옆에 설명을 제공합니다. ALT 텍스트는 일반 방문자를 위한 긴 복사본이 아니라 이미지 콘텐츠에 대한 간결하고 구체적인 설명입니다.
지원되는 형식 및 크기
표준 웹사이트 이미지는 JPG, JPEG, PNG 및 WebP 형식으로 업로드할 수 있습니다. 최대 파일 크기는 파일당 10MB입니다. 이 크기를 초과하는 파일, 빈 파일 또는 읽을 수 없는 파일은 거부됩니다.
| 형식 | 적합한 시나리오 |
|---|---|
| JPG / JPEG | 사진, 장소 촬영, 인물 사진 및 풍부한 색상 그라데이션이 있는 이미지. |
| PNG | 투명한 배경이 필요한 로고, 아이콘 또는 디자인 초안. |
| WebP | 일반적으로 파일 크기가 작아지는 웹 친화적인 형식. |
| HEIC / HEIF | 일반적인 iPhone 형식. 선택 후 업로드 전에 브라우저에서 호환되는 이미지로 변환됩니다. |
HEIC 또는 HEIF는 서버에 직접 저장되는 형식이 아닙니다. Kanorio는 먼저 브라우저에서 변환한 다음 업로드된 호환 이미지로 처리합니다. 변환에 실패하면 기기에서 JPG로 내보낸 후 다시 시도하십시오.
시스템은 또한 짧은 기간 내의 대량 업로드를 제한합니다. 현재 표준 이미지 업로드에 대한 보호 제한은 분당 20회입니다. 일시적으로 제한된 경우 1분 정도 기다렸다가 다시 시도하십시오. 반복해서 클릭하지 마십시오.
이미지 ALT 텍스트란 무엇인가요?
ALT 텍스트(이미지에 대한 대체 텍스트)는 이미지를 설명하는 텍스트 조각입니다. 이미지를 로드할 수 없을 때 대체 설명을 제공합니다. 화면 판독기를 사용하는 방문자도 이를 통해 이미지를 이해할 수 있습니다. Google과 같은 검색 엔진은 이미지 콘텐츠를 이해하는 데 이를 사용합니다.
좋은 ALT 텍스트는 키워드를 채우는 대신 "무엇이 보이고 중요한지"를 설명합니다.
| 잘못된 관행 | 더 나은 관행 |
|---|---|
| 커피, 타이베이 커피, 커피숍 | 타이베이 커피 스튜디오의 카운터에 있는 핸드드립 커피와 라이트 로스트 원두 |
| 이미지 | 어두운 갈색 수제 토트백을 전시하는 가죽 제품 스튜디오 |
| 최고의 서비스 | 회의 테이블 옆에서 두 명의 창업자에게 브랜드 전략을 설명하는 컨설턴트 |
장식용 이미지는 자세한 ALT 텍스트가 필요하지 않을 수 있습니다. 그러나 제품, 작업, 사람, 장소, 프로세스 및 중요한 인포그래픽은 명확하게 설명해야 합니다.
자동 이미지 ALT 텍스트 완성
편집기의 "설정" → "고급"에서 자동 이미지 ALT 텍스트 완성을 활성화할 수 있습니다. 웹사이트를 게시하거나 업데이트할 때 시스템은 수동으로 입력한 텍스트를 덮어쓰지 않고 ALT 텍스트가 누락된 호환 이미지에 설명을 추가하려고 시도합니다. 이는 기본적인 지원을 제공하지만, 중요한 이미지의 경우 시스템이 방문자가 가장 이해하기를 원하는 특정 세부 정보를 알 수 없으므로 수동으로 검토하고 수정하는 것이 좋습니다.
무료 스톡 사진
이미지 선택기는 Pexels와 Pixabay를 두 가지 무료 스톡 사진 소스로 제공합니다. 아직 자신의 이미지가 준비되지 않았다면 키워드로 검색한 다음 적합한 사진을 선택하여 모듈에 추가할 수 있습니다.
Pexels 및 Pixabay 사용 라이선스
Pexels 라이선스 및 Pixabay 콘텐츠 라이선스의 현재 약관에 따라 두 라이브러리의 콘텐츠는 개인 및 상업용 웹사이트에서 무료로 사용할 수 있으며, 필요에 따라 사이트에 맞게 자르거나 수정할 수 있습니다. 추가 비용을 지불하거나 공개 웹사이트에서 사진 작가 또는 스톡 사진 소스를 크레딧할 필요가 없습니다.
Kanorio는 이미지 소스 및 사진 작가 정보를 선택 인터페이스에 표시하여 애셋의 제작자에 대해 편리하게 알아볼 수 있도록 합니다. 크레딧을 원하시면 여전히 환영받는 관행입니다.
이러한 라이선스는 "모든 목적을 위한 무제한 사용"을 의미하는 것은 아닙니다. 상당한 수정 없이 스톡 사진을 개별 애셋으로 판매하거나 재배포하지 마십시오. 또한 이미지 자체를 상표, 브랜드 로고 또는 기타 식별 표시로 사용하지 마십시오.
스톡 사진을 사용할 때는 콘텐츠를 실제로 나타내는 이미지를 선택하십시오. 레스토랑, 상점, 제품, 팀 또는 프로젝트에 실제 사진이 있는 경우, 일반적으로 일반 스톡 이미지보다 더 많은 신뢰를 구축하는 이러한 실제 자료를 우선적으로 사용하십시오.
스톡 사진에는 여전히 인식 가능한 사람, 상표, 브랜드, 건물 또는 예술 작품이 포함될 수 있습니다. 이미지가 핵심 브랜드 비주얼, 광고, 주요 제품 이미지 또는 기타 민감한 맥락에 사용될 경우, 모델, 상표 소유자, 개인, 부동산 소유자 또는 기타 제3자로부터 동의가 여전히 필요한지 먼저 확인하십시오. Kanorio도 스톡 사진 약관도 특정 용도에 대한 라이선스에 대한 자체 판단을 대체할 수 없습니다.
이미지 품질 및 웹사이트 성능
Kanorio는 Cloudflare Images를 사용하여 표준 웹사이트 이미지를 저장하고 제공하여 공개 웹사이트가 사용 맥락에 따라 더 적합한 이미지 버전을 얻을 수 있도록 합니다. 시스템이 원래 흐릿한 사진을 선명하고 전문적인 사진으로 변환할 수 없으므로 소스에서 선명하고 잘 구성된 이미지를 선택해야 합니다.
업로드하기 전에 다음 원칙을 고려하십시오.
- 배너 또는 커버에는 가로 이미지, 인물 사진 또는 작업물에는 세로 이미지 선택
- 모바일 기기에서 잘릴 수 있으므로 이미지 가장자리 근처에 중요한 텍스트 배치 금지
- 작업 세트에 유사한 종횡비와 조명을 사용하면 더 일관된 모양을 만들 수 있습니다.
- 파일 크기를 줄이기 위해 픽셀화될 때까지 압축하지 마십시오. 또한 실제로 필요한 것보다 훨씬 큰 파일을 업로드하지 마십시오.
공유 이미지 및 표준 이미지
Facebook, LinkedIn 또는 X와 같은 플랫폼에서 페이지가 공유되면 소셜 공유 미리 보기가 나타납니다. 이 이미지를 OG 이미지(소셜 공유 미리 보기 이미지)라고 하며 표준 모듈 이미지가 아닙니다.
"페이지"의 SEO 설정에서 각 페이지의 공유 이미지를 관리합니다. 공유 이미지를 수동으로 업로드하지 않고 자동 공유 이미지 기능이 활성화된 경우 시스템은 페이지 제목과 브랜드 설정을 기반으로 미리 보기 이미지를 생성합니다. SEO에 대한 자세한 내용은 "전체 SEO 설정"을 읽으십시오.
동영상 및 기타 미디어
이 기사는 주로 표준 웹사이트 이미지에 대해 설명합니다. YouTube, TikTok, Spotify, Apple Music, 팟캐스트, 양식 또는 예약 도구를 웹사이트에 표시하려면 동영상 파일을 이미지로 업로드하는 대신 해당 통합 모듈을 사용하십시오.
팁
- 업로드하기 전에 파일 이름에 목적을 추가하십시오(예:
coffee-studio-bar.jpg). 이렇게 하면 나중에 로컬 파일을 정리하기가 더 쉬워집니다. - 게시하기 전에 중요한 이미지에 ALT 텍스트를 작성하십시오. SEO 검사까지 모든 것을 한 번에 채우는 것을 기다리지 마십시오.
- 이미지를 교체한 후 모바일에서 미리 보기를 확인하여 자르기, 특히 커버 및 전체 화면 큰 이미지의 경우 확인하십시오.
- 스톡 사진은 시작점일 뿐입니다. 실제 사례 연구가 준비되면 자체 사진으로 교체하는 것을 우선하십시오.
자주 묻는 질문
단일 이미지의 최대 파일 크기는 10MB입니다. 먼저 사진 편집 도구를 사용하여 크기를 줄이거나 웹에 더 적합한 JPG, PNG 또는 WebP로 내보낸 다음 다시 업로드하십시오. 동일한 과대 평가된 파일을 반복해서 업로드하지 마십시오.
원본 이미지 해상도가 낮거나, 이미지가 원본 크기보다 확대되었거나, 자른 후 남은 영역이 작은 것일 수 있습니다. 더 선명한 원본 이미지를 사용하고 미리 보기에서 자르기 영역을 확인하십시오.
예. 선택기의 "이미지 URL" 탭을 사용하여 공개적으로 액세스 가능한 이미지 URL을 붙여넣을 수 있습니다. 시스템은 외부 이미지와 관련된 위험에 대해 경고합니다. 사용할 권리가 있는 소스만 사용하십시오. 로그인이 필요한 URL, 임시 URL 또는 외부 로드를 허용하지 않는 URL은 붙여넣지 마십시오. 이미지가 웹사이트에 중요하다면 소스 웹사이트가 주소를 변경하거나 이미지를 제거하거나 액세스를 제한하는 경우 문제를 피하기 위해 자체 파일을 업로드하는 것이 좋습니다.
파일이 10MB를 초과하지 않는지, 형식이 올바른지, 인터넷 연결이 안정적인지, 짧은 시간 안에 많은 파일을 업로드하지 않는지 순서대로 확인하십시오. 그래도 실패하면 JPG 또는 WebP로 다시 시도하고 오류 메시지가 있으면 고객 지원의 도움을 받기 위해 기록하십시오.
중요한 콘텐츠 이미지에는 ALT 텍스트가 필요합니다. 순전히 장식적인 이미지는 긴 설명이 필요하지 않을 수 있지만, 제품, 작업, 서비스 프로세스 또는 중요한 텍스트가 포함된 이미지가 설명 없이 남겨지지 않도록 하십시오.
예. 두 스톡 사진 사이트의 현재 라이선스 조건에 따라 상업용 웹사이트에서 콘텐츠를 무료로 사용할 수 있으며, 일반적으로 출처를 직접 크레딧할 필요는 없습니다. 그러나 사람, 상표, 브랜드 또는 건물과 같이 인식 가능한 요소에는 추가적인 권리 제한이 있을 수 있습니다. 중요한 상업적 사용 전에 직접 확인하십시오.
Kanorio는 브라우저에서 HEIC 또는 HEIF 이미지를 변환하려고 시도합니다. 기기나 이미지가 변환되지 않으면 먼저 휴대폰이나 컴퓨터에서 JPG로 내보낸 다음 다시 업로드하십시오.