IT.컴퓨터 80 검색엔진 최적화 이미지외 요소의 선별적 로딩 속도향상.3 검색엔진 최적화 로딩 속도검색엔진 최적화에서 로딩속도를 높이는 방법중 동영상과. 움직이는 이미지를 제외한 일반적인 이미지를 사용시 주의할점과 이미지의 배치에 대한 이야기를 했었습니다. 검색엔진 최적화 글중 이번에는 이미지를 사용시 생각해야할 부분과 파일 형태 그리고 미리로드와 지연로드에 관한 내용입니다.검색엔진 최적화 작업중 로딩 속도는 중요한 요소입니다. 그중 상당부분을 검색 엔진최적화의 속도에 영향을 주는것이 이미지 요소입니다. 이미지들을 생각없이 사용하다 보면 검색엔진 최적화 속도에 상당한 악영향을 미치기때문에 이미지 하나를 사용하더라도 다양한 관점에서 판단하고 결정해야 할거 같습니다.이미지는 다양한 파일형태로 존재합니다. 이러한 이미지 파일의 형태가 틀린것은 이미지마다 각각의 목적에 따라 압축방.. Published Date: 2024. 6. 26. 검색엔진 최적화 이미지 요소가 속도에 미치는 영향. 2 검색엔진 최적화중 속도와 가장 민감한 부분은 동영상, 애니메이션 그림 그리고 주로 많이 사용하는 이미지가 검색엔진 최적화 속도에 영향을 줍니다. 그러나 검색엔진 최적화를 위해서 글로만 내용을 채우는건 상식적이 못한 방법일것입니다. 검색엔진의 최적화도 중요하지만 글 본연의 의미까지 상실해 가며 검색엔진 최적화를 위해 정보를 전달하는 방법중 가장 효과가 있는 동영상. 애메이션, 이미지를 사용하지 않는 것은 잘못된 방법이기 때문입니다. 사람들은 긴 장문의 글을 읽는 것보다 이미지를 보거나 동영상을 보면서 좀더 편리하게 정보를 얻고자 하는 본능이 있습니다. 그본능은 너무도 자연스러운것입니다. 정보의 전달 수단이 그 만큼 편리해지고 우리 생활에 그러한 편리함이 자연스럽게 받아들이고 있는 시대이기 때문입니다.그래서.. Published Date: 2024. 6. 26. 티스토리 블로그 최적화 LCP의 의미와 최적화 방법 .1 티스토리 블로그 최적화 LCP LCP(Largest Contentful Paint)란? LCP의 개념과 중요성티스토리 블로그 최적화를 위한 LCP LCP 개선 방법과 전략결론 LCP 최적화의 중요성과 효과 티스토리 블로그 최적화 정보에 관련된 글을 올리고 있습니다. 티스토리 최적화를 위해 지금까지는 CLS에 대한 의미와 수정방법에 관해 이야기 했다면 이제부터는 LCP에 관련된 글을 올려드리겠습니다. 티스토리 블로그 최적화를 위해서 우선 LCP가 무엇인지 부터 간단하게 설명된 내용을 아래에서 참고하세요.최대 콘텐츠 렌더링 시간 (LCP)은 Lighthouse 보고서의 성능 섹션에서 추적되는 측정항목 중 하나입니다. 각 측정항목은 페이지 로드 속도의 몇 가지 측면을 보여줍니다. LCP는 사용자가 페이지 접속.. Published Date: 2024. 6. 25. 문서작성시 불필요한 태그 자동 삭제 변경 방법 자동 태그 삭제 변경자동 태그 삭제 변경 스크립트는 블로그 글 작성 시 글 사이에 삽입된 불필요한 태그를 자동으로 정리하여 코드를 깔끔하게 만들어줍니다. 이는 불필요한 태그가 문제가 될 수도 있다는 전제에서 작성했으며, CSS 스타일도 변경된 코드에 적용하여 기존과 동일한 효과를 유지할 수 있습니다. 블로그 글 작성히 글 사이에 들어가는 태그를 깔끔하게 정리해주는 간단한 스크립트입니다. 이 태그들이 글에 전혀 문제가 되지 않을수도 있으며 영향을 줄수도 있습니다. 그러나 한가지 분명한것은 없는것이 있는것 보다 긍정적이지 않을가 생각합니다. 가능하면 문제의 소지가 발생할수 있는 불필요한 태그는 있는것 보다는 없는게 더 긍정적이라고 개인적으로 생각합니다. 매번 글을 작성하면서 이런 불필요한 태그를 정리하기 힘.. Published Date: 2024. 6. 21. 블로그 HTML 자동 최적화 프로그램 티스토리 블로그 최적화티스토리 블로그 HTML 코드를 자동으로 수정 추가해주는 간단한 프로그램입니다. 사용하는 스킨의 종류를 확인하시고 호환 여부를 확인하세요. HTML 수정 작업은 문제가 발생할수 있기 때문에 반드시 데이터를 백업하시고 진행하실 것을 권해 드립니다. 아래 프로그램은 크게 코드를 수정하지는 않습니다.그래서 특별하게 문제를 발생시키지는 않지만 복사 과정에서 실수로 코드의 일부를 누락시키거나 오타등 작은 실수도 전체 블로그에 문제를 일으킬수 있기 때문에 충분히 숙지 하고 진행하셔야 합니다. 블로그 데이터 백업은 관리자 페이지에서 진행하시면 되고 CSS, HTML도 별도로 백업을 권해 드립니다.아래 프로그램은 HEAD 부분의 meta viewport를 변경합니다. 그외는 다른 코드는 설정이나 .. Published Date: 2024. 6. 19. 티스토리 블로그 전체스킨 검색 최적화 평가 점수 티스토리 블로그에 대한 전체적인 스킨에 대한 최적화 점검을 실시 했습니다. 이평가 기준은 단순 평가이며 절대적인 의미를 부여하지는 않습니다. 본 평가는 티스토리 블로그 처음 설치 상태에서 전혀 어떤 코드 작성이나 광고가 전혀 없는 상태에서 테스트 했으며 테스트를 위해 초기 글 하나만 올렸습니다. 메인 화면을 기준으로 테스트 했습니다. 메인 화면 구성도 초기 디폴트 상태로 진행했습니다. 이 테스트의 목적은 티스토리 블로그 스킨의 점수를 평가하기 위한 것이 아니고 티스토리 블로그를 운영하면서 운영자들의 글과 광고가 검색 최적화에 상당한 영향을 줄수 있다는 것을 검증하기 위한 테스트입니다. 이 테스트를 진행하면서 기존에 작업했던 최적화 수정 작업이 호환이 여부 대한 검증 작업도 같이 병행해서 테스트했습니다. .. Published Date: 2024. 6. 18. 특정 글을 찾아 앞뒤에 추가문자 입력하는 편집기 특정 문구에 특정문자를 앞뒤에 추가해 주는 간단한 텍스트 편집기 입니다. 대량의 글을 수정할때 특정 패턴의 문자들의 집합에 앞뒤 특정문자나 코드를 입력해서 수정하는 작업시 간단하게 추가하고자 하는 문자나 코드를 삽입해서 사용할수 있습니다. 입력할 텍스트 추출 시작 문자 추출 마지막 문자 ')"> 추가 입력 텍스트 추출 복사 지우기 추출된 텍스트 " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 Published Date: 2024. 6. 18. 그룹치환자 설명과 종류 블로그 스킨 수정 방법.3 그룹치환자 설명그룹치환자는 스킨에서 설정한 데이터 값을 불러와서 설정한 코드의 값을 랜더링해주는 치환변환자 입니다.아래는 티스토리 블로그에서 많이 사용하고 있는 그룹 치환자입니다. 설명은 대략적인 것이고 직접 사용해서 테스트하고 확인 작업을 진행후 적용해서 사용해야 합니다. 아래 그룹치환자는 전체 코드에서 발취한 것이라 일부 오류가 존재 할수 있으며 참고만 하세요. 아래 태그에 대해 모두 아실 필요도 없으며 알고 있어도 별로 사용하지 않습니다. 그러나 이렇게 생긴것이 어떤 역할을 할거야 하는 정도만 짐작하셔도 블로그 스킨 수정하는데 실수를 줄일수 있습니다. ✔ 예시 그룹치환자 포인트 색상이 설정된 경우 이 태그 내의 내용을 렌더링함. 프.. Published Date: 2024. 6. 18. 치환자 설명과 종류 블로그 스킨 수정 방법 .2 치환자 기본 설명코딩 작업시 간단한 페이지는 HTML코드와 CSS코드를 사용해서 한 페이지로 코드를 제작을 하면 되는데 페이지의 기능이 많아지게 되면 많은 코드가 한 HTML에 코딩을 해야 합니다.치환자를 활용하지 않으면 이런 경우는 코드를 제작하기도 힘들지고 나중에 수정 작업을 하려면 코드가 너무 많아서 수정하기 힘들어집니다. 그래서 치환자를 이용해 코드를 재사용하고 메인 HTML 코드를 단순화 해서 관리하기 쉽게하는 방법으로 외부에서 치환자 코드를 작성하고 불러와서 사용하게 됩니다. 치환자를 활용해서 코드를 나누어 작업하게 되면 나중에 수정도 하기 쉽고 다른 코드에 사용할수 있기도 합니다. 그때 사용하는 것이 주로 치환자 입니다.아래는 티스토리 블로그에서 사용하는 치환자입니다. 간단한 방법으로 치환자.. Published Date: 2024. 6. 17. 이전 1 2 3 4 ··· 9 다음
