마이크로 데이터를 사용하여 FontAwesome으로 5 성급 제품 등급을 어떻게 마크 업합니까?

Question

Google에 따르면 5 성급 등급을 마크 업하여 검색 결과로 가져올 수있는 몇 가지 방법이 있습니다. 이러한

http://support.google.com/webmasters/bin/answer.py?hl=en&answer=172705

것도 그러한 FontAwesome 같은 아이콘 폰트를 사용하기위한 수용하지 않는다.

별표 평점은 대화식 일 필요가 없습니다.

<div class="rating"> 
    <meta itemprop="rating" content="4.5" /> 
    <i class="icon-star"></i> 
    <i class="icon-star"></i> 
    <i class="icon-star"></i> 
    <i class="icon-star"></i> 
    <i class="icon-star-half"></i> 
    <span class="visually-hidden" >4.5 stars</span> 
</div> 

스팬은 디스플레이에서 숨겨져하지만 여전히 화면 판독기에 액세스 :

현재 우리가 가지고있는 코드입니다.

<meta> 태그가 필요하거나 유효합니까? 구글이 제안 : 표시 할 별을 일으키는 원인이되는 HTML 블록 내부 <meta itemprop="rating" content="4.5" />을 포함하여

을, 당신은 리치 스 니펫 파서가 평가를 찾을 에 콘텐츠 속성의 값을 사용한다는 것을 나타냅니다.

다음과 같은 예를 가지고 : 나는 그것을 알고있는 것처럼

<span class="rating-foreground" style="width:90%"> 
    <meta itemprop="rating" content="4.5" /> 
</span> 

Answer 1

을 에는 itemprop = "등급은"은 당신의 사업부에 그 이동할 수 있도록 모든 요소에 추가 할 수 있습니다.

<div class="rating" itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"> 
    <i class="icon-star"></i> 
    <i class="icon-star"></i> 
    <i class="icon-star"></i> 
    <i class="icon-star"></i> 
    <i class="icon-star-half"></i> 
    <span class="visually-hidden"><span itemprop="ratingValue">4.5</span>/5</span> 
</div> 

<meta> 태그를 제거하지만 추가하고 총 평가 값을 분리 : schema.org에서 총 평가 항목 속성을 사용

Answer 2

, 우리가 지금까지 가지고있는 최선의 선택은 다음과 같다. 당신은 itemprop에 포함되어야합니다

Answer 3

가 검색 결과에 구글 디스플레이 등급 별에 "투표를"=

예 :

<span class="visually-hidden"> 
<span itemprop="ratingValue">4.5</span>/5 
<span itemprop="votes">10</span> 
</span>