SVG
SVG의 풀네임은 Scalable Vector Graphics로, 백터 기반의 XML기반의 마크업 언어로 만들어진 그래픽입니다. 백터의 의미는 방향과 크기를 가지는 양입니다. 의미 그대로 SVG는 크기와 방향 간 계산을 통해 그리는 그래픽입니다. 마크업 언어로 그리기 때문에 png, JPEG 형식의 이미지와는 다르게 이미지가 깨지지않습니다만, 그림이 복잡할 수록 코드의 양이 길어지기 때문에 용량이 커집니다. 간단한 이미지들은 svg가 유리합니다. SVGO같은 툴을 사용하면 svg도 압축이 된다고 합니다.
html
2020. 9. 15. 10:53
<img>태그 사용하는 경우 vs background-image로 처리하는 경우
웹페이지에 이미지를 넣을 때 img태그를 넣는 경우가 있고 background-image 스타일을 주는 경우가 있다. 각각의 코딩방식을 쓸 때 차이점이 존재하기 때문이다. img태그로 쓰는 경우는, 1. 컨텐트에서 해당 이미지가 의미를 가지고 있을 때이다. (semantic meaning) 2. 웹페이지를 프린트할 때 이미지가 제대로 출력되게 하기 위해서이다. 3. SEO(검색엔진)에서 웹페이지의 이미지와 그 alt값이 연관성을 가지게 하고 싶을 경우이다. 4. 스크린 크기에 따라 비율적으로 이미지의 크기가 조절되기를 원할 때 보다 쉽게 하기 위해서이다. - 그러나 충분히 background-image 로도 처리할 수 있는 문제이기 때문에(image의 wrapper에 padding을 부여) 의미를 조금 ..
html
2017. 9. 26. 09:41
href와 src의 차이?
href는 링크로 연결(이동)src는 경로를 통해 받아오는 것.
html
2017. 5. 24. 00:05