SEO에 관한 검색 페이지의 clientside와 serverside (ajax) 렌더링의 차이점

Question

검색 도구 인 페이지에서 작업하고 있는데, 기본적으로 입력 필드로 구성되어 있으며 항목 목록을 표시합니다 입력에 따라 사용자에게 알려줍니다. 이 상황에서 페이지가 클라이언트 또는 서버 측 렌더링 (AJAX 사용)을 사용하는 경우 SEO에 대한 차이가 있다면 그 이유는 무엇입니까?

이 시나리오에서 클라이언트 측 렌더링을 사용하면 불리한 점이 있다면 걱정됩니다.

클라이언트 측 렌더링은 서버 측에 비해 SEO에 대한 단점이 있다는 것을 알고 있습니다. 처음에는 HTML이 완료되었을 때입니다. 그러나 어쨌든 결과를 비동기 적으로로드해야하는 동적 인 경우에는 여전히 단점이 있습니까? 현재 콘텐츠를 URL에 매핑 할 수 있는지 여부에 따라 다릅니다.

Answer 1

당신은 UI/UX에별로 관심이없는 것 같아서 SEO에 대해 더 알고 싶으므로 클라이언트 측과 함께 할 것을 제안합니다. 사용자 입력 후 동적으로로드되는 항목 은 웹 크롤러에게을 표시하지 않습니다.

그러나 두 번째 방법은 특정 URL (site.com/search?q=something)을 방문하면 서버 측에서 완전히 렌더링 된 페이지를 얻을 수 있지만 다른 검색은 계속 수행 할 수 있습니다. 클라이언트 측에서 발생합니다. 관련 검색어를 모두 인덱싱하는 데 약간의 어려움이 있지만 어쩌면 마지막 x 검색을 추적하여 위에서 언급 한 것과 같은 전체 서버 측 렌더링 검색 페이지에 대한 링크와 함께 페이지 어딘가에 표시 할 수 있습니다. 이러한 동적 호출은 페이지의 내용을 변경하는 것뿐만 아니라 브라우저 주소 표시 줄의 URL 해시도 변경할 수 있습니다 (here 참조).

크롤러가 마지막 검색 목록에서 링크를 색인 할 수 있기 때문에 멋진 사용자 인터페이스/경험을 사용자에게 제공하면서도 매우 훌륭한 SEO 작업을 수행 할 수 있습니다.

그래서, 바로 당신의 질문에 답 : 서버 측 페이지 렌더링 대 클라이언트 측 - 거대한 SEO 차이를 내용

Answer 2

AJAX 로딩 SEO에 영향을주지 않습니다.

JavaScript를 통해 DOM을 업데이트해도 검색 봇에서 색인이 생성되는 부분에 눈에 띄는 변화가 발생하지 않습니다. 거의 모든 합법적 인 검색 엔진은 웹 페이지의 비 동적 버전을 보관합니다.

SEO를 사용하려면 해당 콘텐츠의 비 동적 버전에 대한 내장 링크를 유지해야합니다. 예 (jQuery를 사용)에 대한

: 링크를 AJAX를 사용하지만, 여전히 검색 엔진의 웹 크롤러 링크가 볼 수 있도록합니다

<div class="next-page"><a class="ajax-me" href="/page-2.html">Page 2</a></div> 

$(document).ready(function(){ 
    $(".ajax-me").click(function(e){ 
     e.preventDefaults(); 
     $('#ajax-target').load($(this).attr("href")); 
    }); 
}); 

.

서버는 헤더 요청에 따라 전체 웹 페이지 또는 AJAX 응답으로 응답해야합니다.