라벨이 html인 게시물 표시

블로그스팟 팁 모음

이미지
  블로그스팟 게시물갯수 조절팁 기본 메인화면에 타이틀 외에 내용이 노출되게 않게 하는 방법 브레이크 타임을 맨상단에 삽입 기본 메인화면에 내용을 요약해서 보여지게 노출하는 방법 (2~3줄만 노출) 브레이크타임을 화면에 보여지는 글자수 내에 삽입 추가로 계속 업데이트 될 예정 ● ● ●

웹 성능 최적화를 위한 Image Lazy Loading 기법

이미지
Image Lazy Loading은 페이지 안에 있는 실제 이미지들이 실제로 화면에 보여질 필요가 있을 때 로딩을 할 수 있도록 하는 테크닉입니다. 웹 페이지 내에서 바로 로딩을 하지 않고 로딩 시점을 뒤로 미루는 것이라 볼 수 있습니다. 이 방식은 웹 성능과 디바이스 내 리소스 활용도 증가, 그리고 연관된 비용을 줄이는데 도움을 줄 수 있습니다. 영어 단어 중 'lazy'는 '가능한 길게 일을 미루는 행위' 란 의미에 기반합니다. <img src="…" loading="lazy" alt="…" width="200" height="200"> <img src="…" loading="lazy" alt="…" style="height:200px; width:200px;"> loading="lazy"

HTML구조가 의미를 우선시해야 하는 이유

이미지
HTML구조화해서 마크업 하기. 웹접근성 텍스트 박스를 먼저 마크업 하면 스크린리더가 중요한 정보를 더 빨리 전달할 수 있음  SEO최적화 검색엔진(SEO 크롤러)은 텍스트 콘텐츠를 우선적으로 크롤링 함  이미지나 그래픽 콘텐츠는 SEO우선순위가 낮음 CSS로 작업시 유지보수성 높음

iframe 대안 태그와 사용 방법

이미지
HTML에서 외부 리소스 포함하기 1. object 태그 HTML의 object 태그를 사용하여 웹 페이지에 외부 리소스를 포함할 수 있습니다. 이 태그는 iframe의 대안으로 사용될 수 있으며, 다양한 멀티미디어 요소를 포함할 수 있습니다. 실제 예제: <object data=" https://사이트이름.com/ " width="800" height="800" type="text/html"> </object> 2. embed 태그 embed 태그는 object 태그와 유사하며, 웹 페이지에 다양한 외부 리소스를 포함하는 데 사용됩니다. 이 태그는 자동 닫힘 태그입니다. 실제 예제: <embed type="text/html" src=" https://사이트이름.com/ " width="800" height="500"> 주의 object와 embed 태그는 사용할 수 있지만, 일반적으로 iframe 태그를 사용하는 것이 더 권장됩니다.