탐구하는 취르미

웹퍼블리셔로서 웹사이트나 앱의 사용자 경험을 향상하기 위해 디자이너와 협력하여 다양한 디자인 요소를 구현합니다. 이미지는 이러한 디자인 요소 중 하나로, 올바른 형식과 해상도로 이미지를 추출하는 것은 웹사이트나 앱의 성능과 사용자 경험에 직접적으로 영향을 미칩니다. 이번 포스팅 글에서는 이미지 추출의 기준과 피그마를 활용한 이미지 추출 방법에 대해 알아보겠습니다. 이미지 추출의 기준? PNG - 이미지를 여러 번 저장하거나 압축해도 품질이 손상되지 않습니다. - 예를 들어 로고(Logo)나 아이콘(Icon)같이 투명한 배경이 필요한 경우 사용됩니다. JPG - 압축률을 조정하여 파일 크기를 줄일 수 있습니다. 따라서 이미지 파일 크기를 최소화해야 할 때 유용합니다. - 사진이나 복합적인 이미지를 저..

SVG는 웹 디자인과 개발에서 매우 유용한 포맷으로, 화면 해상도와 크기 조절에 유연하고 고품질의 이미지를 제공합니다. 그러나 때로는 SVG가 다양한 환경에서 제대로 랜더링 되지 않을 수 있습니다. 특히 iOS Safari와 같은 플랫폼에서는 SVG 렌더링 문제가 발생할 가능성이 높습니다. 이 문제를 해결한 방법에 대해서 공유드리겠습니다. SVG 렌더링 문제를 해결하기 위해 추가적으로 체크해 볼 수 있는 몇 가지 방법 이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다. SVG의 width, height, viewBox 들의 값 확인해보기 이들 값이 일치하지 않으면 SVG가 원하는 대로 화면에 표시되지 않을 수 있습니다. XML 네임스페이스 (XMLNS) 선언 확인해 ..