중간 크기의 이미지를 비동기 적으로로드하기 위해 중간 크기의 보석에 작업 중이며 중간 크기와 동일한 효과가 있습니다.비동기 이미지로드 및 검색 엔진 최적화
모든 것이 완벽하게 작동하지만 SEO에 대해서는 어떤 일이 발생하는지 전혀 알지 못합니다. 이미지 태그는 다음과 같습니다 : <img src="BIG_IMAGE.jpg" data-compress="SMALL_IMAGE.jpg">
. 다음은 스크립트가 무엇을하고 있는지입니다 :
- )와 BIG_IMAGE BIG_IMAGE가로드 된
- 로드의 BIG_IMAGE는 SMALL_IMAGE 교체
당신은 그것이 서재응이라고 생각합니까? 아마도 div에 설정하고 SMALL_IMAGE를 배경 또는 캔버스를 사용하여로드하는 것이 더 좋을까요? 여기에 스크립트
:var AsyncImage = {
init: function() {
this.els = document.querySelectorAll("[data-compress]")
this.engine()
},
engine: function() {
for (var i = 0; i < this.els.length; i++) {
var el = this.els[i]
var d = el.src
this.small(el)
this.load(el, d)
}
},
load: function (el, d) {
var img = new Image()
img.src = d
img.onload = function() {
el.src = img.src
el.classList.add('async-large-loaded')
el.classList.remove('async-small-loaded')
}
},
small: function (el) {
el.src = el.dataset.compress
el.classList.add('async-small-loaded')
delete el.dataset.compress
}
}
AsyncImage.init()
SEO 조언을 요청하기 때문에이 질문을 주제와 관련이없는 것으로 보겠습니다. [webmasters.se]에 주제가있을 수 있습니다. – unor
예, 주로 코드와 관련이 있습니다. 하지만 그렇게 생각하면 몇 분 후에 닫을 것입니다. 충고에 감사하다 ! –
코드 자체에 대한 질문 (또는 문제)은 주제에 달려 있지만 현재 질문하는대로이 질문에 대답하려면 SEO 전문 지식 (SEO 친화적인지 묻고 검색 엔진에서 더 나은 정보를 묻는 질문)이 필요합니다. 오프 주제. - 그게 내 생각이지만 내 투표는 1/5에 불과하므로 다른 사람들의 동의 여부를 알기 위해 열어 둘 수도 있습니다. – unor