결과 스니펫 맞춤설정
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
이 페이지에서는 웹사이트의 결과 스니펫을 맞춤설정하는 방법을 설명합니다. 맞춤 스니펫을 렌더링하려면 웹페이지에 구조화된 데이터를 추가해야 합니다.
- 개요
- 프로그래밍 검색 요소로 리치 스니펫 만들기
- 다른 기능 살펴보기
개요
프로그래밍 검색 엔진은 스니펫을 표시하여 사용자가 올바른 페이지를 찾을 수 있도록 도와줍니다. 스니펫은 검색 사용자가 웹페이지에 있는 내용을 파악할 수 있는 작은 콘텐츠 샘플입니다. 스니펫에 관해 자세히 알아보려면 검색결과 분석에 관한 웹마스터 센터 블로그 게시물을 참고하세요. 프로그래밍 검색 엔진 알고리즘에서 만든 표준 스니펫이 마음에 들지 않으면 직접 스니펫을 만들 수 있습니다. 이미지 썸네일, 요약, 날짜, 작성자, 평점, 가격 등의 주요 정보를 스니펫에 바로 표시할 수 있습니다. 검색결과에 관련성이 가장 높은 정보가 포함되면 사이트의 웹페이지가 사용자의 관심을 더 많이 끌 수 있습니다.
다음 그림은 검색결과에서 스니펫을 맞춤설정할 수 있는 다양한 방법을 보여줍니다.
그림 1: 평점, 가격대, 리뷰가 포함된 결과 스니펫
그림 2: 형식, 링크, 이미지, 비교 정보가 포함된 결과 스니펫
그림 3: 문서 유형, 작성자, 페이지 조회, 댓글이 포함된 결과 스니펫
그림 4: 멀티미디어 액세스 및 버튼 ('장바구니에 추가')을 제공하는 리치 형식의 결과 스니펫
맨 위로
프로그래밍 검색 요소로 리치 스니펫 만들기
기본적으로 리치 스니펫을 만들려면 다음 단계를 따라야 합니다.
- 웹페이지에 구조화된 데이터를 제공합니다.
프로그래밍 검색 엔진에서 웹페이지의 색인을 생성할 때 메타데이터를 인식하고 보존합니다.
- 프로그래밍 검색 엔진의 검색결과에서 구조화된 데이터를 가져옵니다.
프로그래밍 검색 엔진 서버는 검색결과를 JSON 형식의 구조화된 데이터와 함께 반환할 수 있습니다.
- 프레젠테이션 레이어를 만들어 구조화된 데이터를 형식이 지정된 HTML로 변환합니다.
프레젠테이션 레이어는 원시 데이터를 사용자에게 표시되는 형식으로 변환하는 코드 집합입니다 (예: 자바스크립트, PHP, JSP, ASP). 프로그래밍 검색 엔진의 경우 다음을 할 수 있습니다.
-
프로그래밍 검색 요소를 사용하여 사용자에게 표시할 JSON 출력을 변환합니다.
- 검색 요소 콜백을 사용하여 JSON 데이터를 최종 사용자에게 표시되는 HTML로 변환하는 자체 커스텀 프레젠테이션 레이어를 작성합니다.
구조화된 데이터 추출은 구조화된 데이터 페이지에 자세히 설명되어 있으며 프로그래밍 검색 요소로 프레젠테이션 레이어를 만드는 방법은
프로그래밍 검색 요소 페이지에 자세히 설명되어 있습니다.
맨 위로
기타 기능 탐색
맞춤 스니펫은 다른 여러 프로그래밍 검색 엔진 기능과 잘 연동됩니다.
달리 명시되지 않는 한 이 페이지의 콘텐츠에는 Creative Commons Attribution 4.0 라이선스에 따라 라이선스가 부여되며, 코드 샘플에는 Apache 2.0 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 Google Developers 사이트 정책을 참조하세요. 자바는 Oracle 및/또는 Oracle 계열사의 등록 상표입니다.
최종 업데이트: 2025-07-25(UTC)
[null,null,["최종 업데이트: 2025-07-25(UTC)"],[[["\u003cp\u003eProgrammable Search Engine allows you to customize result snippets to showcase key information like images, summaries, and ratings, making your site's search results more compelling.\u003c/p\u003e\n"],["\u003cp\u003eTo create custom snippets, you need to add structured data to your webpages, which Programmable Search Engine uses to generate rich snippets.\u003c/p\u003e\n"],["\u003cp\u003eThe Programmable Search Element can be utilized to easily transform the structured data into formatted HTML for display in search results.\u003c/p\u003e\n"],["\u003cp\u003eYou can further enhance your search results by exploring features like Drilling Deeper into Search Results and Providing Structured Data.\u003c/p\u003e\n"]]],[],null,["# Customizing Results Snippets\n\nThis page describes how to customize the result snippets for your own website. To render your customized snippets, you must add structured data to your webpages.\n\n1. [Overview](#overview)\n2. [Creating Rich Snippets with the Programmable Search Element](#creating_snippets)\n3. [Exploring Other Features](#next)\n\nOverview\n--------\n\nProgrammable Search Engine helps users find the right page by showing them a snippet---a small sample of content that gives search users an idea of what's in the webpage. To learn more about snippets, see the Webmaster Central [blog post](http://googlewebmastercentral.blogspot.com/2007/11/anatomy-of-search-result.html) on the anatomy of a search result. If you do not like the standard snippets created by the Programmable Search Engine algorithm, you can create your own snippets. You can showcase key information---such as image thumbnails, summaries, dates, authorship, ratings, and prices---directly in your snippets. Having the most relevant information in your search results makes the webpages in your site more compelling to your users.\n\nThe following figures demonstrate various ways you can customize the snippets in your search results.\n\n**Figure 1:** Result snippet with rating, price range, and review.\n\n**Figure 2:** Result snippet with formatting, links, image, and comparative information.\n\n**Figure 3:** Result snippet that includes document types, authors, page views, and comments.\n\n**Figure 4:** Richly formatted result snippet that provides multimedia access and buttons (\"ADD TO CART\").\n\n[Back to top](#top)\n\nCreating Rich Snippets with the Programmable Search Element\n-----------------------------------------------------------\n\nEssentially, creating rich snippets involves the following steps:\n\n1. Provide [structured data](/custom-search/docs/structured_data) in your webpages.\n\n When Programmable Search Engine is indexing your webpages, it recognizes and preserves\n the metadata.\n2. Fetch that structured data in the search results for your Programmable Search Engine. The Programmable Search Engine server can return the search results, along with the\n structured data in JSON format.\n\n3. Create a presentation layer to transform the structured data into formatted HTML. A presentation layer is a set of code (such as JavaScript, PHP,\n JSP and ASP) that transforms the raw data into a format that is displayed\n to the user. In the case of Programmable Search Engine, you can:\n\n - Use the [Programmable Search Element](/custom-search/docs/element) to transform JSON output for presentation to the user.\n - Write your own custom presentation layer that transforms JSON data to HTML that is presented to the end user using Search Element [Callbacks](/custom-search/docs/element#search-time-callbacks)\n\n\nStructured data extraction is documented in more detail in the\n[Structured Data](/custom-search/docs/structured_data) page, and creating a presentation\nlayer with the Programmable Search Element is documented in more detail at the\n[Programmable Search Element](https://developers.google.com/custom-search/docs/element) page.\n\n[Back to top](#top)\n\nExploring Other Features\n------------------------\n\n\nCustom Snippets works well with several other Programmable Search Engine features:\n\n- If you want to learn more about changing the order of your results, see [Drilling Deeper into Search Results](/custom-search/docs/structured_search).\n- If you want to learn more about what structured data Google supports, see [Providing Structured Data](/custom-search/docs/structured_data).\n- If you want to learn more about the Programmable Search Element, see [Programmable Search Element documentation](https://developers.google.com/custom-search/docs/element)."]]
