웹 페이지에서 '최고의'이미지를 추출하는 기술

Question

내 웹 사이트의 Facebook의 "공유"기능과 비슷한 것을 구축하려고합니다.

URL을 수락하고 메타 키워드를 위해 긁어 내고 제목/설명을 적절하게 얻을 수있는 시점에 도달했지만 사용자가 공유하고 싶은 '가능성'사진을 결정하는 가장 좋은 방법에 대해 약간 고정되어 있습니다. .

나는 현재 SimplexMlelement를 사용하여 페이지를 통과 가능한 DOM으로 바꾸고 모든 태그를 찾아 절대 URL로 전환합니다. 그 후, 나는 어떻게 적절한 축소판을 찾을 수 있는지 잘 모르겠습니다.

모두 다운로드하고 파일 크기로 이동합니까? 나는 일종의 휴리스틱을 사용합니까?

다른 사람이 권장 사항, 제안 또는 팁이 있습니까?

Answer 1

나는 긁힌 블로그 게시물에서 이미지를 얻기 위해 얼마 전에 비슷한 것을 썼습니다. 이미지를 선택하는 기준은 페이지에서 모든 이미지 목록을 얻은 다음 '우선 순위 포인트'를 할당하는 줄을 따라 무언가였습니다.

• Adblocker의 목록에서 가져온 블랙리스트에서 호스팅 된 이미지 무시
• 간접 이미지 무시, 예를 들어 스타일 시트 또는 iframe에서 링크
• 50 픽셀의 폭 또는 높은 이미지를 무시하십시오
• 두 번 이상 반복되는 이미지를 무시하십시오
• 호스트의 화이트리스트에서 호스팅 된 이미지에 우선 순위를 지정합니다 (예 : Photobucket, imageshack.us)
• 페이지에서 가장 큰 3 개의 이미지에 우선 순위를 지정합니다.
• 동일한 호스트의 이미지에 우선 순위를 지정합니다
• 정의 된 ALT 태그가있는 이미지에 우선 순위를 지정합니다.
• P 태그에 나타나는 이미지에 우선권을 지정합니다.

그런 다음 가장 우선 순위가 가장 높은 포인트를 선택하십시오. 그것은 확실히 어리 석거나 지나치게 과학적이지 않았지만 훨씬 더 자주 유용한 것을 얻었습니다.

Answer 2

직접적인 경험이 없으므로 구체적인 모범 사례가 있는지 확신 할 수 없지만 일반적으로 웹 사이트 구현에서 발견 된 다양성 때문에 몇 가지 요인을 보는 휴리스틱 접근 방식이 의미가 있다고 생각합니다.

이미지 속성과 이미지가 어디에 배치되는지의 컨텍스트라는 두 가지 항목 세트를 살펴 봅니다.

이미지 속성 :

• 너비와 높이는 최소 임계 값을 충족합니다
• 종횡비는 합리적입니다 (타일이 극도의 종횡비를 가질 수있는 배경 이미지, 이는 이미지가 적합하지 않을 수 있음을 잘 보여줍니다)
• 이미지에 둘 이상의 색상이 존재합니다 (감지하기 어렵지만 다양한 배경 이미지를 피할 수 있음)

이미지 컨텍스트 :

• 이미지는 페이지에서 반복되지 않습니다 (이는 반복 할 수있는 아이콘 및 기타 디자인 요소를 사용하지 않습니다)
• 페이지에서 H1, H2 등 태그 후에 발생합니다. 이것은 페이지 중간에서 나오는 이미지에 대한 요점에 도달하여 다시 디자인 요소를 피합니다.
• ALT 태그가 있습니다 (이것은 일관되게 사용되지 않지만 유용한 정보를 많이 제공하지는 않습니다).

이전 항목에 가중치를 할당 한 다음 각 이미지가 규칙을 얼마나 잘 만족시키는 지에 따라 찾은 이미지를 순위합니다.

또한 일부 페이지는 CSS (또는 플래시 등)를 사용하여 이미지를 표시 할 수 있습니다. 이들은 이미지의 범위 외부 (당신이 정의한 알고리즘에 따라); 아마도 큰 문제가 아니라 고려해야 할 것입니다.