지난해 지중해 전역 6개 언어로 리스팅을 제공해야 하는 요트 중개 플랫폼을 구축했습니다. 칸의 프랑스 구매자, 포르토 체르보의 이탈리아 클라이언트, 아테네의 그리스 차터 구매자, 보드룸의 터키 마리나 운영자, 팔마 데 마요르카의 스페인 중개인, 그리고 그 사이에 흩어져 있는 영어권 거주자들입니다. "번역 버튼만 추가하면 되겠지"에서 시작한 것이 제가 경험한 가장 흥미로운 i18n 과제 중 하나로 변했습니다. 실제로 전환되는 다국어 요트 웹사이트 구축에 대해 배운 모든 것을 공유합니다.

목차

지중해 중개를 위한 다국어 요트 웹사이트 구축

지중해 요트 중개 회사가 다국어 사이트를 필요로 하는 이유

allied Market Research에 따르면 지중해 요트 시장은 2026년까지 123억 달러에 도달할 것으로 예상됩니다. 하지만 대부분의 에이전시가 놓치는 부분이 있습니다: 이 시장은 근본적으로 언어에 의해 분할되어 있습니다. 모나코에 리스팅된 45미터 베넷티는 독일어로 검색하는 독일 산업가, 아랍어를 사용하는 사우디 구매자, 영어로 검색하는 영국 은퇴자 모두에게 발견 가능해야 합니다.

영어 콘텐츠만 제공하는 중개 회사가 6자리 수수료를 잃는 것을 봤습니다. 앙티브의 한 중개인은 경쟁사가 프랑스어로 리스팅이 프랑스 구글 검색 결과에 나타나기만 해도 프랑스 말하는 클라이언트를 확보하고 있다고 말했습니다. 이것은 기술 문제가 아닙니다. 기술 솔루션이 있는 비즈니스 문제입니다.

숫자가 이를 뒷받침합니다:

시장 분야 필요한 언어 구매자 인구통계
프렌치 리비에라 FR, EN, RU, AR 유럽 고순자산 개인, 중동 구매자
이탈리아 해안 IT, EN, DE, FR 북유럽 차터 클라이언트
그리스 제도 EL, EN, DE, FR 차터 중심, 계절 관광
터키 리비에라 TR, EN, DE, RU 예산 친화적 차터 시장
발레아레스 제도 ES, EN, DE, FR 혼합 중개 및 차터
크로아티아 해안 HR, EN, DE, IT 신흥 시장, 급속 성장

이 중 1~2개 언어만 제공하고 있다면, 테이블에 돈을 남기고 있는 것입니다. 정말 그렇습니다.

올바른 기술 스택 선택

요트 중개 사이트의 경우, 두 가지 매우 다른 콘텐츠 유형을 처리할 수 있는 스택이 필요합니다: 정적 마케팅 콘텐츠(정보 페이지, 서비스 설명, 팀 소개) 및 동적 리스팅 데이터(요트 사양, 가격, 가용성, 사진).

이 두 가지를 Next.js와 Astro 모두에서 구축했으며, 요구 사항에 따라 둘 다 잘 작동합니다. 저장된 검색, 비교 도구, 실시간 가용성이 있는 문의 양식 등 심층 상호작용이 필요하면 Next.js가 더 적합합니다. 사이트가 주로 쇼케이스이고 동적 동작이 적으면 Astro의 아일랜드 아키텍처가 상자 밖으로 엄청난 성능을 제공합니다.

이 특정 사용 사례에 대한 스택 비교는 다음과 같습니다:

기능 Next.js (App Router) Astro Remix
i18n 라우팅 내장 미들웨어 수동 또는 플러그인 수동
정적 생성 우수 우수 제한적
동적 리스팅 기본 SSR/ISR 요청 시 엔드포인트 기본 SSR
CMS 통합 우수 우수 좋음
엣지 렌더링 Vercel Edge, Cloudflare Cloudflare, Netlify Cloudflare
번역 라이브러리 next-intl, next-i18next astro-i18n, paraglide remix-i18next
빌드 시간 (500 리스팅 × 6 언어) ISR 포함 ~4분 전체 정적 ~8분 N/A (SSR)

헤드리스 CMS 레이어의 경우, 리스팅 데이터를 마케팅 콘텐츠와 분리하는 것을 강력히 권장합니다. 리스팅 데이터에는 전용 요트 관리 시스템(Yatco API, NauticEd 또는 커스텀 Supabase 백엔드 같은)을 사용하고, 기타 모든 것은 Sanity 또는 Contentful 같은 헤드리스 CMS를 사용하세요.

헤드리스가 여기서 중요한 이유

요트 데이터는 이상합니다. 청중에 따라 미터 또는 피트 단위의 사양, 유로 또는 달러 가격, 지속적으로 업데이트되는 엔진 시간, 그리고 일일 기준으로 변경되는 가용성 달력이 있습니다. 이 모든 것을 기존 CMS 내에서 관리하려고 하는 것은 악몽입니다. 헤드리스 접근 방식을 사용하면 전문 API에서 리스팅 데이터를 당겨오고 CMS에서 마케팅 콘텐츠를 가져온 다음, 빌드 시간 또는 요청 시간에 이들을 결합할 수 있습니다.

다국어 요트 리스팅을 위한 URL 전략

대부분의 프로젝트가 초기에 잘못되는 부분입니다. 다국어 사이트의 URL 구조는 나중에 뒤돌릴 수 없는 가장 어려운 결정 중 하나입니다. 세 가지 접근 방식이 있습니다:

서브디렉토리 패턴 (권장)

https://yachtbroker.com/en/yachts/benetti-45m-2022
https://yachtbroker.com/fr/yachts/benetti-45m-2022
https://yachtbroker.com/de/yachten/benetti-45m-2022

이것이 90%의 요트 중개 회사에 권장하는 것입니다. 단일 도메인, 공유 도메인 권한, Next.js 미들웨어 또는 Astro의 내장 i18n 라우팅으로 쉬운 구현.

서브도메인 패턴

https://en.yachtbroker.com/yachts/benetti-45m-2022
https://fr.yachtbroker.com/yachts/benetti-45m-2022

더 큰 중개 회사는 조직상의 이유로 이를 선호합니다. 각 서브도메인을 독립적으로 배포할 수 있습니다. 하지만 통합 도메인 권한이 손실되고, 관리할 인프라가 더 많습니다.

ccTLD 패턴

https://yachtbroker.fr/yachts/benetti-45m-2022
https://yachtbroker.de/yachten/benetti-45m-2022

각 국가에 별도의 법인이 있는 경우에만 의미가 있습니다. 비용이 많이 들고, 복잡하며, Burgess 또는 Fraser 수준의 운영이 아니면 거의 가치가 없습니다.

슬러그 번역

사람들을 당황하게 하는 세부 정보입니다: URL 슬러그를 번역해야 할까요? 요트 이름의 경우, 아니오 — 일관되게 유지하세요. "Benetti Oasis 40M"은 모든 언어에서 그렇게 불립니다. 하지만 카테고리 경로는? 네, 그것들을 번역하세요.

// next.config.js - Next.js i18n 라우팅
const nextConfig = {
  i18n: {
    locales: ['en', 'fr', 'de', 'it', 'es', 'el'],
    defaultLocale: 'en',
    localeDetection: true,
  },
};

next-intl이 있는 Next.js App Router에서 번역된 경로의 경우:

// src/navigation.ts
import { createLocalizedPathnameNavigation } from 'next-intl/navigation';

export const localePrefix = 'always';

export const pathnames = {
  '/yachts': {
    en: '/yachts',
    fr: '/yachts',
    de: '/yachten',
    it: '/yacht',
    es: '/yates',
    el: '/skafi',
  },
  '/yachts/[slug]': {
    en: '/yachts/[slug]',
    fr: '/yachts/[slug]',
    de: '/yachten/[slug]',
    it: '/yacht/[slug]',
    es: '/yates/[slug]',
    el: '/skafi/[slug]',
  },
};

export const { Link, redirect, usePathname, useRouter } =
  createLocalizedPathnameNavigation({ locales, localePrefix, pathnames });

지중해 중개를 위한 다국어 요트 웹사이트 구축 - 아키텍처

요트 리스팅 데이터 번역

이것이 핵심 과제입니다. 요트 리스팅에는 각각 다른 번역 접근 방식이 필요한 세 가지 유형의 콘텐츠가 있습니다:

1. 구조화된 데이터 (번역하지 말고, 지역화)

길이, 빔, 드래프트, 엔진 출력 같은 사양 — 이것들은 번역이 필요하지 않습니다. 지역화가 필요합니다. 유럽인에게는 미터를 보여주고, 미국인에게는 피트를 보여주세요. 일부 시장에는 킬로와트, 다른 시장에는 마력을 보여주세요.

// utils/localize-specs.ts
const UNIT_PREFERENCES: Record<string, UnitSystem> = {
  en: 'imperial',
  'en-GB': 'metric', // 영국 시장은 요트에 미터를 사용합니다
  fr: 'metric',
  de: 'metric',
  it: 'metric',
  es: 'metric',
  el: 'metric',
};

export function localizeLength(meters: number, locale: string): string {
  const system = UNIT_PREFERENCES[locale] || 'metric';
  if (system === 'imperial') {
    const feet = meters * 3.28084;
    return `${feet.toFixed(0)} ft`;
  }
  return `${meters.toFixed(1)} m`;
}

2. 열거형 필드 (번역 키 사용)

선체 유형, 연료 유형, 요트 카테고리 — 이것들은 자유 텍스트 번역이 아니라 번역 키를 사용해야 하는 고정 옵션입니다.

// messages/en.json
{
  "yacht": {
    "hullType": {
      "monohull": "Monohull",
      "catamaran": "Catamaran",
      "trimaran": "Trimaran"
    },
    "fuelType": {
      "diesel": "Diesel",
      "electric": "Electric",
      "hybrid": "Hybrid"
    }
  }
}
// messages/fr.json
{
  "yacht": {
    "hullType": {
      "monohull": "Monocoque",
      "catamaran": "Catamaran",
      "trimaran": "Trimaran"
    },
    "fuelType": {
      "diesel": "Diesel",
      "electric": "Électrique",
      "hybrid": "Hybride"
    }
  }
}

3. 자유 텍스트 설명 (어려운 부분)

요트 설명은 마케팅 카피입니다. 중개인이 작성합니다. 일반적으로 영어 또는 프랑스어로 — 그리고 업계 전문 용어, 감정적 언어, 그리고 특정 주장으로 가득 합니다. 500만 유로 리스팅에서만으로는 기계 번역이 충분하지 않습니다.

제가 권장하는 접근 방식은 다음과 같습니다:

  1. 원본 언어 설명을 CMS/데이터베이스에 저장하세요
  2. 첫 번째 패스로 AI 번역을 사용하세요 — GPT-4o 또는 Claude는 2025년에 요트 용어를 놀랍도록 잘 처리합니다
  3. 가격 임계값 이상의 리스팅에 플래그를 지정하세요(예: €1M+) 인간 검토용
  4. 번역된 설명을 캐시하세요 모든 요청에서 재번역 비용을 지불하지 않도록
// services/translate-listing.ts
import { openai } from '@ai-sdk/openai';
import { generateText } from 'ai';

export async function translateDescription(
  text: string,
  sourceLang: string,
  targetLang: string
): Promise<string> {
  const cached = await getFromCache(text, targetLang);
  if (cached) return cached;

  const { text: translated } = await generateText({
    model: openai('gpt-4o'),
    system: `You are a professional yacht broker translator. 
      Translate yacht listing descriptions from ${sourceLang} to ${targetLang}. 
      Preserve technical terminology. Maintain the luxury marketing tone. 
      Keep brand names, model names, and proper nouns unchanged.`,
    prompt: text,
  });

  await saveToCache(text, targetLang, translated);
  return translated;
}

이 접근 방식의 비용은 최소한입니다. GPT-4o로 500단어 요트 설명을 번역하는 데 약 $0.01-0.02가 소요됩니다. 500개 리스팅 × 6개 언어로도, 초기 번역 패스에는 $30-60을 보고 있습니다. 프리미엄 리스팅의 인간 검토는 비용을 추가하지만, 단일 요트 판매가 $50K-200K 수수료를 생성할 때 절대적으로 가치가 있습니다.

i18n 구현 패턴

Next.js App Router 및 next-intl을 사용한 실제 구현 패턴을 설명하겠습니다. 대부분의 헤드리스 CMS 프로젝트가 사용하는 스택이기 때문입니다.

프로젝트 구조

src/
├── app/
│   └── [locale]/
│       ├── layout.tsx
│       ├── page.tsx
│       └── yachts/
│           ├── page.tsx
│           └── [slug]/
│               └── page.tsx
├── messages/
│   ├── en.json
│   ├── fr.json
│   ├── de.json
│   ├── it.json
│   ├── es.json
│   └── el.json
├── middleware.ts
└── i18n.ts

로캘 감지를 위한 미들웨어

// middleware.ts
import createMiddleware from 'next-intl/middleware';
import { locales, localePrefix, pathnames } from './navigation';

export default createMiddleware({
  locales,
  localePrefix,
  pathnames,
  defaultLocale: 'en',
  localeDetection: true,
});

export const config = {
  matcher: ['/((?!api|_next|_vercel|.*\\..*).*)'],
};

번역과 함께 요트 리스팅 페이지

// app/[locale]/yachts/[slug]/page.tsx
import { useTranslations } from 'next-intl';
import { getYachtBySlug } from '@/lib/yachts';
import { localizeLength, localizePrice } from '@/utils/localize';

export async function generateMetadata({ params: { locale, slug } }) {
  const yacht = await getYachtBySlug(slug);
  const t = await getTranslations({ locale, namespace: 'yacht' });
  
  return {
    title: `${yacht.name} — ${localizeLength(yacht.lengthMeters, locale)} ${t('forSale')}`,
    alternates: {
      languages: {
        'en': `/en/yachts/${slug}`,
        'fr': `/fr/yachts/${slug}`,
        'de': `/de/yachten/${slug}`,
        'it': `/it/yacht/${slug}`,
        'es': `/es/yates/${slug}`,
        'el': `/el/skafi/${slug}`,
      },
    },
  };
}

export default async function YachtPage({ params: { locale, slug } }) {
  const yacht = await getYachtBySlug(slug);
  const t = useTranslations('yacht');
  const description = await getTranslatedDescription(yacht.id, locale);

  return (
    <article>
      <h1>{yacht.name}</h1>
      <dl>
        <dt>{t('specs.length')}</dt>
        <dd>{localizeLength(yacht.lengthMeters, locale)}</dd>
        <dt>{t('specs.year')}</dt>
        <dd>{yacht.year}</dd>
        <dt>{t('specs.price')}</dt>
        <dd>{localizePrice(yacht.priceEur, locale)}</dd>
        <dt>{t('specs.hullType')}</dt>
        <dd>{t(`hullType.${yacht.hullType}`)}</dd>
      </dl>
      <div dangerouslySetInnerHTML={{ __html: description }} />
    </article>
  );
}

통화 및 단위 지역화 처리

지중해 요트 가격은 거의 항상 유로로 표시되지만, 다양한 시장의 구매자는 자신의 현지 통화로 참고 가격을 보기를 원합니다. 제가 이를 처리하는 방법은 다음과 같습니다:

// utils/localize-price.ts
const CURRENCY_BY_LOCALE: Record<string, string> = {
  en: 'EUR',      // 국제 영어는 지중해 시장에서 기본적으로 EUR입니다
  'en-US': 'USD',
  fr: 'EUR',
  de: 'EUR',
  it: 'EUR',
  es: 'EUR',
  el: 'EUR',
  tr: 'EUR',      // 터키 시장은 여전히 EUR로 가격을 책정합니다
  ar: 'USD',      // 중동 구매자는 USD를 선호합니다
  ru: 'EUR',
};

export function localizePrice(
  priceEur: number,
  locale: string,
  exchangeRates?: Record<string, number>
): string {
  const currency = CURRENCY_BY_LOCALE[locale] || 'EUR';
  let amount = priceEur;

  if (currency !== 'EUR' && exchangeRates) {
    amount = priceEur * (exchangeRates[currency] || 1);
  }

  return new Intl.NumberFormat(locale, {
    style: 'currency',
    currency,
    maximumFractionDigits: 0,
  }).format(amount);
}

중요한 주의: 변환된 가격을 표시할 때 항상 "EUR로 표시된 가격" 또는 동등한 면책 조항을 표시하세요. 요트 판매 계약은 특정 통화로 표시되며, 상황을 설명하지 않고 변환된 가격을 표시하면 법적 문제가 발생할 수 있습니다.

다국어 요트 웹사이트 SEO

이것이 실제 이익이 발생하는 곳입니다. 적절한 다국어 SEO는 뮌헨의 누군가가 "Azimut 68 kaufen"을 검색할 때 Azimut 68 리스팅이 표시되고 파리의 누군가가 "Azimut 68 à vendre"를 검색할 때도 표시된다는 의미입니다.

hreflang 태그

이것은 타협할 수 없습니다. 모든 페이지에는 모든 언어 버전을 가리키는 hreflang 태그가 필요합니다:

<link rel="alternate" hreflang="en" href="https://broker.com/en/yachts/azimut-68-2023" />
<link rel="alternate" hreflang="fr" href="https://broker.com/fr/yachts/azimut-68-2023" />
<link rel="alternate" hreflang="de" href="https://broker.com/de/yachten/azimut-68-2023" />
<link rel="alternate" hreflang="x-default" href="https://broker.com/en/yachts/azimut-68-2023" />

언어별 구조화된 데이터

각 언어 버전에 대해 지역화된 설명과 함께 Product 스키마를 사용하세요. Google은 명시적으로 언어별 구조화된 데이터를 지원하며, 다양한 Google 도메인에 걸쳐 풍부한 결과에 리스팅을 표시하는 데 도움이 됩니다.

사이트맵 전략

언어별로 별도의 사이트맵을 생성하고 사이트맵 인덱스에서 이를 참조하세요:

<!-- sitemap-index.xml -->
<sitemapindex>
  <sitemap><loc>https://broker.com/sitemap-en.xml</loc></sitemap>
  <sitemap><loc>https://broker.com/sitemap-fr.xml</loc></sitemap>
  <sitemap><loc>https://broker.com/sitemap-de.xml</loc></sitemap>
</sitemapindex>

성능 고려사항

30개 이상의 고해상도 사진, 번역된 콘텐츠, 지역화된 사양이 있는 요트 리스팅 페이지는 빠르게 무거워질 수 있습니다. 중요한 것은 다음과 같습니다:

  • ISR (증분 정적 재생성): 리스팅 페이지를 매 60분마다 재생성하세요. 요트 리스팅은 초 단위로 변경되지 않지만, 가격과 가용성은 매일 변할 수 있습니다.
  • 번역 캐싱: 같은 설명을 절대 두 번 번역하지 마세요. Redis 또는 간단한 데이터베이스 테이블을 사용하여 번역을 캐시하세요.
  • 이미지 최적화: 이것이 종종 가장 큰 승리입니다. 단일 요트 갤러리에는 2GB의 소스 이미지가 포함될 수 있습니다. Next.js Image 또는 자동 형식 협상 (WebP/AVIF)을 사용하는 CDN을 사용하세요.
  • 로캘별 번들 분할: 영어 사용자를 위해 프랑스어 번역을 로드하지 마세요. next-intlparaglide는 모두 자동으로 처리합니다.

최근 프로젝트에서 이러한 최적화로 인해 모든 로캘에서 Largest Contentful Paint가 4.2초에서 1.1초로 단축되었습니다. 이것은 바운스율이 잃어버린 수수료와 직접 상관관계가 있을 때 중요합니다.

실제 아키텍처 예시

지중해 중개 사이트에서 사용한 아키텍처는 다음과 같습니다:

┌─────────────┐     ┌──────────────┐     ┌─────────────┐
│   Sanity     │     │  Yacht API   │     │  Redis      │
│  (Marketing  │     │  (Listings,  │     │  (Translation│
│   content)   │     │   specs)     │     │   cache)    │
└──────┬───────┘     └──────┬───────┘     └──────┬──────┘
       │                    │                    │
       └────────────┬───────┘────────────────────┘
                    │
            ┌───────▼───────┐
            │   Next.js     │
            │   App Router  │
            │   + next-intl │
            └───────┬───────┘
                    │
            ┌───────▼───────┐
            │   Vercel      │
            │   Edge Network│
            └───────────────┘

Sanity는 마케팅 페이지, 팀 소개, 블로그 게시물을 처리합니다. 모두 기본 다국어 지원이 있습니다. 요트 API (제3자 서비스 또는 커스텀 Supabase 백엔드)는 리스팅 데이터를 제공합니다. Redis는 AI 생성 번역을 캐시합니다. Next.js는 로캘 인식 라우팅으로 모든 것을 함께 연결합니다.

이런 종류의 아키텍처가 필요한 것처럼 들린다면, 프로젝트에 대해 이야기하고 싶습니다. 지중해 중개 회사를 위해 여러 개를 구축했으며 패턴이 잘 정렬되어 있습니다.

FAQ

지중해 요트 웹사이트는 몇 개의 언어를 지원해야 합니까?

최소한 영어와 주요 시장의 현지 언어가 필요합니다. 진지한 중개 회사의 경우, 영어, 프랑스어, 독일어, 이탈리아어를 기본 사항으로 권장합니다. 지중해 요트 구매자의 약 80%를 다룹니다. €5M 이상의 초호화 분야를 목표로 한다면 러시아어와 아랍어를 추가하세요.

요트 리스팅에 기계 번역을 사용해야 할까요 아니면 전문 번역가를 고용해야 할까요?

둘 다. 모든 리스팅에 AI 번역(GPT-4o 또는 Claude)을 첫 번째 패스로 사용한 다음, 가격 임계값 이상의 리스팅에 대해 인간 번역가에게 검토하도록 하세요. 500단어 설명의 경우 AI 번역 비용이 $0.02 미만이고 90%까지 도달합니다. 프리미엄 리스팅의 인간 검토 비용은 설명당 $20-50이지만 고가치 판매에 정확성을 보장합니다.

다국어 요트 웹사이트에 가장 좋은 CMS는 무엇입니까?

Sanity와 Contentful은 모두 기본 상자에서 다국어 콘텐츠를 잘 처리합니다. Sanity의 문서 수준 지역화는 더 큰 유연성을 제공하지만, Contentful의 필드 수준 지역화는 설정이 더 간단합니다. 요트 리스팅 데이터 자체의 경우, 모든 것을 일반 목적 CMS에 억지로 넣으려고 하는 대신 별도의 전문 시스템을 권장합니다. 헤드리스 CMS 개발 페이지에서 자세히 알아보세요.

서로 다른 단위 시스템에서 요트 측정을 어떻게 처리합니까?

모든 측정을 데이터베이스에 메트릭(미터, 킬로와트)으로 저장하세요. 사용자의 로캘을 기반으로 디스플레이 계층에서만 제국으로 변환하세요. 유럽 요트 업계는 보편적으로 메트릭을 사용하지만 미국 구매자는 피트와 마력을 기대합니다. 일관된 형식을 위해 Intl.NumberFormat API를 사용하세요.

hreflang 태그가 요트 SEO에 정말 중요할까요?

절대적으로. hreflang 태그가 없으면 Google이 프랑스 리스팅을 독일 검색자에게 표시하거나 더 나쁘게는 번역된 페이지를 중복 콘텐츠로 처리할 수 있습니다. 이전에 잘못된 적이 있는 중개 사이트에서 hreflang을 올바르게 구현한 후 유기 트래픽이 40-60% 증가했습니다.

다국어 요트 중개 웹사이트를 구축하는 데 비용은 얼마입니까?

4-6개 언어, CMS 통합, 요트 리스팅 관리를 포함한 제대로 구축된 다국어 요트 사이트는 일반적으로 $30,000-80,000이 소요됩니다. 복잡성에 따라 달라집니다. 가장 큰 비용 요인은 언어 수, 커스텀 검색/필터 기능, 기존 요트 관리 시스템과의 통합입니다. 더 구체적인 견적은 가격 페이지를 방문하세요.

나중에 요트 웹사이트에 언어를 추가할 수 있습니까?

처음부터 올바르게 구축된 경우 그렇습니다. 적절한 i18n 아키텍처로, 새 언어를 추가하는 것은 새 번역 파일을 생성하고, 정적 UI 문자열을 번역하고, 번역 파이프라인을 통해 리스팅 설명을 실행하는 것을 의미합니다. 라우팅과 인프라는 이미 처리되어야 합니다. 현재 사이트가 처음부터 i18n을 염두에 두고 구축되지 않았다면, 개조가 더 어렵습니다. 하지만 여전히 가능합니다.

아랍어 같은 오른쪽에서 왼쪽으로 쓰는 언어는 요트 웹사이트에 대해 어떻게 해야 합니까?

아랍어는 특히 €10M+ 분야에서 지중해 요트 판매에 점점 더 중요해지고 있습니다. CSS는 RTL 레이아웃을 지원해야 합니다. 논리적 속성을 사용하세요 (margin-left 대신 margin-inline-start). 철저하게 테스트하세요. Next.js는 로캘별로 전환되는 HTML 요소의 dir 특성을 사용하여 RTL을 지원합니다. 개발 시간이 추가되지만 중동 구매자는 상당하고 성장하는 시장 분야를 나타냅니다.