--- url: 'https://dxpr.com/ko/hc/documentation/learn-dxpr-builder/tutorials/blog-layout' title: '검색 엔진이 페이지를 찾게 하기 | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T08:58:02+00:00' updated: '2026-10-24T09:09:48+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: |- 각 페이지에 명확한 제목 개요, 설명된 이미지, 빠른 로딩, 좋은 메타데이터를 갖추어 검색 엔진이 이해하고 순위를 매기게 합니다. DXPR Builder는 페이지를 본문 필드의 HTML로 저장하므로 Drupal SEO 모듈이 그대로 함께 작동합니다. 이 페이지에서는 빌더에서 설정하는 항목과 해당 모듈로 설정하는 항목을 다룹니다. 제목 개요 만들기 레이아웃 요소(섹션, 로우, 컬럼)는 일반 div 요소입니다. 검색 엔진은 빌더 페이지의 구조를 제목에서 읽습니다. tags: - 'Follow a tutorial' image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' published: true og: site_name: DXPR updated_time: '2026-10-24T09:09:48+0000' 'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.' schema: '@context': 'https://schema.org' '@graph': - mainEntity: { } - '@type': TechArticle headline: '검색 엔진이 페이지를 찾게 하기' description: |- 각 페이지에 명확한 제목 개요, 설명된 이미지, 빠른 로딩, 좋은 메타데이터를 갖추어 검색 엔진이 이해하고 순위를 매기게 합니다. DXPR Builder는 페이지를 본문 필드의 HTML로 저장하므로 Drupal SEO 모듈이 그대로 함께 작동합니다. 이 페이지에서는 빌더에서 설정하는 항목과 해당 모듈로 설정하는 항목을 다룹니다. 제목 개요 만들기 레이아웃 요소(섹션, 로우, 컬럼)는 일반 div 요소입니다. 검색 엔진은 빌더 페이지의 구조를 제목에서 읽습니다. image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-24T08:58:02+0000' dateModified: '2026-10-24T09:09:48+0000' author: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' mainEntityOfPage: 'https://dxpr.com/ko/hc/documentation/learn-dxpr-builder/tutorials/blog-layout' articleSection: '튜토리얼 따라 하기' - '@type': WebPage '@id': 'https://dxpr.com/ko/hc/documentation/learn-dxpr-builder/tutorials/blog-layout' description: |- 각 페이지에 명확한 제목 개요, 설명된 이미지, 빠른 로딩, 좋은 메타데이터를 갖추어 검색 엔진이 이해하고 순위를 매기게 합니다. DXPR Builder는 페이지를 본문 필드의 HTML로 저장하므로 Drupal SEO 모듈이 그대로 함께 작동합니다. 이 페이지에서는 빌더에서 설정하는 항목과 해당 모듈로 설정하는 항목을 다룹니다. 제목 개요 만들기 레이아웃 요소(섹션, 로우, 컬럼)는 일반 div 요소입니다. 검색 엔진은 빌더 페이지의 구조를 제목에서 읽습니다. breadcrumb: '@type': BreadcrumbList itemListElement: - '@type': ListItem position: 1 name: 홈 item: 'https://dxpr.com/ko' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR inLanguage: ko --- [도움말 센터](/ko/node/75)/[문서](/ko/hc/documentation) /[DXPR Builder 배우기](/ko/hc/documentation/learn-dxpr-builder) /[페이지 만들기](/ko/hc/documentation/learn-dxpr-builder/build) /[튜토리얼 따라 하기](/ko/hc/documentation/learn-dxpr-builder/tutorials/overview) # 검색 엔진이 페이지를 찾게 하기. DXPR Builder 배우기페이지 만들기튜토리얼 따라 하기 ## 이 가이드의 내용 관련 가이드 - [A/B 테스트 설정하기](/ko/hc/documentation/learn-dxpr-builder/tutorials/add-forms) - [페이지에 Drupal 뷰 표시하기](/ko/hc/documentation/learn-dxpr-builder/integrations/drupal-views) - [페이지에 Drupal 블록 추가](/ko/hc/documentation/learn-dxpr-builder/integrations/drupal-blocks) - [보안](/ko/hc/documentation/learn-dxpr-builder/tutorials/about-page) 각 페이지에 명확한 제목 개요, 설명된 이미지, 빠른 로딩, 좋은 메타데이터를 갖추어 검색 엔진이 이해하고 순위를 매기게 합니다. DXPR Builder는 페이지를 본문 필드의 HTML로 저장하므로 Drupal SEO 모듈이 그대로 함께 작동합니다. 이 페이지에서는 빌더에서 설정하는 항목과 해당 모듈로 설정하는 항목을 다룹니다. ## 제목 개요 만들기 레이아웃 요소(섹션, 로우, 컬럼)는 일반 `div`요소입니다. 검색 엔진은 빌더 페이지의 구조를 제목에서 읽습니다. | Level | Use | |---|---| | Heading 1 | 페이지 제목, 페이지당 하나. 대부분의 테마가 출력합니다. | | Heading 2 | 주요 섹션입니다. | | Heading 3 | Heading 2 안의 하위 섹션입니다. | | Heading 4 to 6 | 더 깊은 하위 섹션입니다. | 1. Text 요소를 클릭합니다. 2. 도구 모음의 제목 목록에서 수준을 고릅니다. 3. 수준을 순서대로 유지합니다. Heading 2에서 Heading 4로 건너뛰지 않습니다. DXPR CMS에서는 한 페이지의 테마 제목을 숨길 수 있습니다. 편집 양식에서 **DXPR Theme Settings**를 열고 **DXPR Hide Regions**아래에서 **Page Title**을 체크한 뒤 **Save**를 클릭합니다. 그러면 빌더 Heading 1이 페이지의 유일한 Heading 1이 됩니다. Jumbotron의 **Title**은 항상 Heading 1이므로 테마 페이지 제목 옆에 두 번째가 추가됩니다. Card의 **Title**은 항상 Heading 5입니다. ## 모든 이미지에 설명 달기 1. 이미지를 가리키고 **More** > **Settings**를 클릭합니다. 2. 다음 패널을 열고 짧은 설명을 입력합니다. **SEO** 패널을 열고 **Alt attribute**에 짧은 설명을 입력합니다. 되도록 125자 미만으로 씁니다. 3. 대화상자에서 **Save**를 클릭한 뒤 컨테이너 표시줄에서 **Save**를 클릭합니다. 비어 있는 **Alt attribute**는 `alt`를 전혀 쓰지 않습니다. 정보를 추가하지 않는 사진에는 대신 섹션 **Background image**를 사용합니다. ## Drupal 모듈로 메타데이터 추가하기 다음 모듈은 노드에 적용되므로 별도 설정 없이 빌더 페이지를 포함합니다. - **Metatag**: 페이지 제목, 설명, Open Graph 태그입니다. - **Pathauto**: 읽기 쉬운 URL 경로입니다. - **Simple XML Sitemap** 또는 **XML Sitemap**: 사이트맵의 빌더 페이지입니다. - **Schema.org Metatag**: 구조화된 데이터입니다. ## 페이지 빠르게 유지하기 검색 엔진은 페이지 속도를 순위에 반영합니다. - Image 요소에서 이미지 크기로 **Optimize for fast loading**을 고릅니다. 이미지를 너비 1024픽셀로 조절하고 WebP로 저장합니다. - 빌더 페이지의 모든 이미지는 페이지와 함께 로드됩니다. Image 요소는 지연 로딩을 하지 않습니다. 큰 이미지는 페이지에 필요한 것만 둡니다. - 각 Video 요소에 **Image**를 지정합니다. 방문자가 클릭해야 플레이어가 로드됩니다. - Drupal 페이지 캐시를 켜 둡니다. 자세한 내용은 다음을 참조합니다. [Performance](/ko/hc/documentation/learn-dxpr-builder/advanced/performance)에서 각 페이지가 로드하는 항목을 확인합니다. ## 유용한 링크 쓰기 - 설명적인 링크 텍스트를 사용합니다("Read our pricing guide", "Click here" 아님). - 방문자에게 출발 페이지가 필요할 때만 외부 링크를 새 탭에서 엽니다. - 내부 링크에는 `/about` 같은 상대 URL을 사용하여 스테이징과 프로덕션에서도 링크가 계속 작동하게 합니다. - 깨진 링크를 정기적으로 확인합니다. ## 표시 내용 브라우저 Lighthouse 패널의 SEO 및 Performance 보고서 같은 페이지 감사를 실행하면 Heading 1 하나, 대체 텍스트 없는 이미지 없음, 메타 설명이 나옵니다. 페이지 소스에는 제목이 `h2`와 `h3` 순서대로 표시됩니다. ## 감사가 깨끗하지 않은 경우 - **감사에서 alt 텍스트가 없는 이미지를 보고합니다.** Image 요소의 **Alt attribute**가 비어 있습니다. **SEO** 아래에 입력합니다. - **감사에서 메타 설명이 없음을 보고합니다.** Drupal 코어는 추가하지 않습니다. Metatag을 설치하고 콘텐츠 유형이나 페이지에 설명을 설정합니다. - **감사에서 큰 이미지를 보고합니다.** 이미지가 **Original image (No resizing)**를 사용합니다. 각 Image 요소에서 **Optimize for fast loading**을 고릅니다. ## 다음 단계 [Accessibility for inclusive content](/ko/hc/documentation/learn-dxpr-builder/advanced/accessibility)에서 DXPR Builder 탐색을 계속합니다.