Site multilingue Afrique : stratégie FR + EN + Wolof + langues locales (2026)

Un site institutionnel uniquement en français au Sénégal exclut ~40 % des citoyens (taux d'alphabétisation FR ~50-55 %). Au Mali, c'est ~60 %. Au Cameroun, le clivage FR/EN est constitutionnel. La pression vers le multilinguisme s'accélère, et les bonnes pratiques techniques restent peu documentées en contexte africain.

TL;DR

- Architecture : Next.js + next-intl ou react-i18next + structure URL /[locale]/....

- hreflang strict obligatoire pour SEO.

- Workflow traduction : pro humain pour 100 pages clés + IA (Claude, DeepL) pour le reste.

- Wolof/Bambara/Swahili : caractères Unicode, polices spéciales si translittération.

Stratégie de couverture linguistique

Décision n°1 : quelles langues, dans quel ordre ?

Architecture URL

3 patterns possibles :

Pattern 1 — Path-based (recommandé)

`

/fr/services

/en/services

/wo/serwiis // wolof

`

Pattern 2 — Sub-domain

`

fr.gov.sn

en.gov.sn

wo.gov.sn

`

Pattern 3 — Param

`

/services?lang=fr

/services?lang=en

`

Pattern 1 (path-based) est le plus SEO-friendly et le plus simple à maintenir. C'est le standard Next.js avec next-intl.

Implémentation Next.js + next-intl

`ts

// middleware.ts

import createMiddleware from 'next-intl/middleware';

export default createMiddleware({

locales: ['fr', 'en', 'wo'],

defaultLocale: 'fr',

localePrefix: 'always',

localeDetection: true,

});

export const config = {

matcher: ['/((?!api|_next|_vercel|.*\..*).*)']

};

`

`ts

// i18n/request.ts

import { getRequestConfig } from 'next-intl/server';

export default getRequestConfig(async ({ locale }) => ({

messages: (await import(../messages/${locale}.json)).default,

timeZone: 'Africa/Dakar',

now: new Date(),

}));

`

Structure messages :

`

messages/

├── fr.json

├── en.json

└── wo.json

`

Chaque fichier suit la même structure :

`json

// messages/fr.json

{

"home": {

"title": "Ministère de la Santé",

"subtitle": "Au service des citoyens"

}

}

// messages/wo.json

{

"home": {

"title": "Bunti gëstu wér-gi-yaram",

"subtitle": "Liggéeyu xeet wi"

}

}

`

hreflang strict

Sur chaque page, déclarer les versions disponibles :

`tsx

// app/[locale]/layout.tsx

export async function generateMetadata({ params, pathname }) {

const path = pathname.replace(/${params.locale}, '');

return {

alternates: {

canonical: https://gov.sn/${params.locale}${path},

languages: {

'fr': https://gov.sn/fr${path},

'en': https://gov.sn/en${path},

'wo': https://gov.sn/wo${path},

'x-default': https://gov.sn/fr${path},

},

},

};

}

`

Erreur classique : oublier x-default ou utiliser des codes ISO incorrects (wo pour wolof, bm pour bambara, sw pour swahili).

Sitemap multilingue

`tsx

// app/sitemap.ts

export default async function sitemap() {

const pages = await getStaticPages();

const entries = [];

for (const page of pages) {

for (const locale of ['fr', 'en', 'wo']) {

entries.push({

url: https://gov.sn/${locale}${page.path},

lastModified: page.updatedAt,

alternates: {

languages: {

fr: https://gov.sn/fr${page.path},

en: https://gov.sn/en${page.path},

wo: https://gov.sn/wo${page.path},

},

},

});

}

}

return entries;

}

`

Workflow de traduction réaliste

Phase 1 — Traduction pro humaine (pages stratégiques)

• Page d'accueil
• Pages "Qui sommes-nous"
• Pages services principaux (top 50)
• Mentions légales, accessibilité, confidentialité
• Coût ~6-15 EUR par mot pour wolof, ~0,10-0,20 EUR pour FR/EN

Phase 2 — IA + revue (contenus volumineux)

• Actualités, communiqués
• Rapports annuels
• Documents techniques

Outils :

• DeepL : excellent FR ↔ EN, pas de wolof
• Claude / GPT-4 : décent pour wolof avec prompt soigné, à relire impérativement
• Lokalise / Crowdin : plateformes de gestion traduction

Phase 3 — UGC (contenu utilisateur)

• Pas de traduction auto
• Indiquer la langue d'origine
• Outil de traduction à la volée optionnel (Google Translate widget)

Polices et caractères spéciaux

Wolof, bambara, fulfulde utilisent des caractères Unicode étendus :

• ŋ (eng) — wolof, fulfulde
• ɓ, ɗ, ƴ — fulfulde
• é, è, ï — français
• 'ʼ apostrophe — peul

Vérifier que la police principale supporte ces caractères. Atkinson Hyperlegible, Noto Sans, Inter — ✓. Police décorative custom — souvent ✗.

Tests linguistiques

`ts

// tests/i18n.spec.ts

import { test, expect } from '@playwright/test';

const LOCALES = ['fr', 'en', 'wo'];

const PAGES = ['/', '/services', '/contact'];

LOCALES.forEach(locale => {

PAGES.forEach(path => {

test(Locale ${locale} - page ${path}, async ({ page }) => {

await page.goto(/${locale}${path});

// Vérifier

expect(await page.getAttribute('html', 'lang')).toBe(locale);

// Pas de fallback en clair (texte non traduit)

expect(await page.locator('body').textContent()).not.toContain('home.title');

});

});

});

`

SEO multilingue

• Mots-clés par langue : recherche dédiée wolof / EN / FR. Ne pas traduire FR vers wolof mécaniquement — les expressions de recherche diffèrent.
• URLs traduites : /fr/services vs /wo/serwiis (URL en wolof si possible).
• Méta-descriptions natives : pas du Google Translate.
• Schema.org : @type, @context en anglais (norme), mais valeurs en langue cible.
• Search Console : configurer les ciblages géographiques par sous-dossier.

Cas réel — site Présidence d'un pays UEMOA

Avant : FR uniquement, 850K visites/an.

Après ajout EN + langue locale, 6 mois plus tard :

• 1,3M visites/an (+53 %)
• 28 % visites EN (diaspora)
• 12 % visites langue locale
• Plaintes accessibilité linguistique : 0

FAQ

Q : Faut-il forcer l'utilisateur à choisir sa langue ?

R : Non — détection IP/Accept-Language puis pré-sélection avec switch toujours visible. Bandeau de proposition acceptable, pas de redirection forcée.

Q : Peut-on traduire automatiquement avec IA en prod ?

R : Pour le contenu institutionnel critique : non. La nuance se perd, l'erreur peut coûter politiquement. Pour les actualités fraîches : avec relecture humaine systématique.

Q : Les langues à droite à gauche ?

R : Arabe, hébreu nécessitent dir="rtl" et un design adapté. Sites Sénégal en arabe : oui pour la diaspora ou les documents religieux. Implémenter avec CSS logical properties (margin-inline-start au lieu de margin-left).

Conclusion

Le multilinguisme institutionnel africain en 2026 est plus mature qu'on ne le pense — Next.js + next-intl + workflow de traduction hybride humain/IA permettent de couvrir 3-5 langues par institution avec un budget contenu raisonnable. Le vrai défi reste la qualité éditoriale en langues locales — investir dans 1-2 traducteurs internes paye au long terme.