Quelles sont les étapes pour créer un site arabe et français ?
Un site arabe et français se construit en six étapes : choisir une structure d'URL par langue, déclarer les versions à Google avec hreflang, adapter la mise en page de la version arabe à la lecture de droite à gauche, faire traduire et relire les textes, traduire aussi menus et formulaires, puis choisir la langue d'arrivée.
- Réserver une adresse par langue :
/fr/et/ar/sur le même domaine. - Relier chaque page à sa traduction avec les balises hreflang.
- Prévoir la version arabe en
dir="rtl", avec une police qui contient les caractères arabes. - Faire traduire les textes par une personne, puis les faire relire.
- Traduire les menus, boutons, formulaires, messages d'erreur et e-mails de confirmation.
- Choisir la langue qui s'affiche à la racine du site et le sélecteur de langue.
Ces étapes s'ajoutent à celles de tout projet de site, de l'objectif à la mise en ligne, que nous détaillons dans comment créer un site web pour son entreprise au Maroc.
Faut-il une URL différente pour chaque langue ?
Oui. Google classe des pages, et chaque langue doit avoir les siennes, avec une adresse fixe : votre-site.ma/fr/services et votre-site.ma/ar/services, par exemple. Un site qui change de langue sur la même URL, par un bouton ou par détection du navigateur, n'a qu'une version indexée : l'autre langue reste invisible dans les résultats.
| Structure | Exemple | Pour qui |
|---|---|---|
| Répertoires | votre-site.ma/fr/ et votre-site.ma/ar/ | La plupart des PME : un seul site, une seule autorité, une maintenance simple |
| Sous-domaines | fr.votre-site.ma et ar.votre-site.ma | Deux équipes ou deux outils séparés par langue |
| Domaines distincts | votre-site.ma et votre-site.fr | Deux pays aux offres différentes |
| Paramètre ou bouton sans URL propre | votre-site.ma/?lang=ar | À éviter pour le référencement |
Les répertoires restent le choix le plus simple : les liens que reçoit le site profitent aux deux langues, et un seul certificat HTTPS, un seul sitemap et une seule Search Console suffisent.
Comment indiquer les langues à Google avec hreflang ?
La balise hreflang, placée dans l'en-tête de chaque page, liste toutes les versions linguistiques de cette page, y compris elle-même. Google s'en sert pour afficher la version française à un internaute qui cherche en français et la version arabe à celui qui cherche en arabe. Les balises doivent être réciproques : chaque version cite toutes les autres.
Pour une page de services, l'en-tête des deux versions contient les mêmes trois lignes :
<link rel="alternate" hreflang="fr" href="https://votre-site.ma/fr/services"><link rel="alternate" hreflang="ar" href="https://votre-site.ma/ar/services"><link rel="alternate" hreflang="x-default" href="https://votre-site.ma/fr/services">
La ligne x-default désigne la version à montrer quand aucune langue ne correspond. Trois autres points à vérifier : la balise <html lang="ar"> sur les pages arabes, un canonical qui pointe vers la page elle-même (jamais vers sa traduction), et les deux versions présentes dans le sitemap.
Comment afficher l'arabe de droite à gauche ?
Ajoutez l'attribut dir="rtl" sur la balise html des pages arabes : le navigateur aligne alors le texte à droite et inverse l'ordre des éléments. La mise en page doit suivre, avec un menu, des flèches et des colonnes en miroir, et une police dessinée pour l'arabe, lisible aux petites tailles sur téléphone.
- Le CSS en propriétés logiques :
margin-inline-startplutôt quemargin-left. Une seule feuille de style sert alors aux deux sens de lecture. - Les icônes de direction (flèches, « suivant », carrousels) s'inversent ; les logos et les photos, non.
- La police : choisissez une famille qui existe en latin et en arabe, ou deux polices qui s'accordent (Noto Sans Arabic, IBM Plex Sans Arabic, Cairo). Prévoyez une taille et un interligne un peu plus grands pour l'arabe.
- Les textes mêlés : numéros de téléphone, adresses e-mail, noms de marque en caractères latins. Testez leur affichage dans les phrases arabes et dans les champs de formulaire.
Traduction automatique ou traduction humaine ?
Faites traduire par une personne qui écrit l'arabe pour vos clients, puis faites relire par une seconde personne. Un outil de traduction automatique peut servir de premier jet, mais il se trompe sur le vocabulaire métier, le ton et les tournures. Un texte mal traduit fait fuir les lecteurs arabophones et se classe mal.
Décidez aussi du registre : arabe standard pour un cabinet ou une institution, formulations plus proches de l'usage courant pour une marque grand public. Et faites une recherche de mots-clés dans chaque langue : vos clients ne tapent pas en arabe la traduction mot à mot de leurs recherches en français. Le title, la meta description et les URL de chaque page arabe reprennent ces recherches.
Faut-il traduire les menus et les formulaires ?
Oui, tout ce que le visiteur lit ou remplit. Une page arabe avec un menu en français, un formulaire en français ou un message d'erreur en anglais casse la confiance au moment où le visiteur s'apprête à vous contacter. La liste à traduire :
- Le menu, le pied de page et le fil d'Ariane.
- Les boutons et les libellés des formulaires, les messages d'erreur et de confirmation.
- Les e-mails automatiques : accusé de réception, confirmation de rendez-vous ou de commande.
- Les pages légales : mentions légales, politique de confidentialité, conditions de vente.
- Les textes alternatifs des images et les titres des images de partage.
Pour le sélecteur de langue, écrivez chaque langue dans sa propre écriture (Français, العربية) et faites-le pointer vers la traduction de la page en cours plutôt que vers l'accueil. Évitez les drapeaux : l'arabe et le français se parlent dans plusieurs pays.
Quelle langue mettre par défaut ?
Mettez par défaut la langue de la majorité de vos clients, celle dans laquelle ils vous écrivent et vous appellent. Pour beaucoup d'entreprises marocaines qui vendent aux professionnels, c'est le français ; pour une marque grand public ou une administration, l'arabe peut passer en premier. La racine du site renvoie vers cette langue.
Ne redirigez pas automatiquement selon la langue du navigateur ou le pays du visiteur : Googlebot explore sans indiquer de langue préférée, le plus souvent depuis les États-Unis, et risque de ne voir qu'une version. Proposez plutôt un bandeau discret (« Cette page existe en arabe ») et laissez le visiteur choisir. Son choix peut ensuite être mémorisé.
Quand l'anglais compte-t-il plus que l'arabe ?
Pour un hôtel, un riad, une agence de voyages ou une entreprise qui exporte, la seconde langue utile est souvent l'anglais : c'est la langue des visiteurs étrangers qui réservent avant d'arriver. Regardez d'où viennent vos demandes et dans quelle langue elles arrivent avant de choisir. Un site peut aussi avoir trois langues : la méthode reste la même, une URL et une balise hreflang par langue.
The Icon, une agence belge de marketing digital, a choisi le français et l'anglais. Nous avons mené la refonte premium de son site, en version bilingue français-anglais. Voir nos réalisations ou découvrir notre offre de création de site web.
Autres questions sur les sites bilingues
Un site bilingue est-il moins bien référencé ?
Non, s'il respecte une URL par langue et des balises hreflang réciproques. Chaque langue a alors ses propres pages, qui se classent chacune sur les recherches de sa langue. Les problèmes viennent des sites où les deux langues partagent la même adresse, ou des traductions automatiques non relues.
Est-il possible d'ajouter l'arabe à un site existant ?
Oui, sur WordPress, Shopify comme sur un site sur mesure. Il faut alors créer les répertoires de langue, adapter les gabarits à la lecture de droite à gauche et ajouter les hreflang. Si vos pages françaises passent sous /fr/ au passage, redirigez chaque ancienne adresse en 301 vers la nouvelle pour garder vos positions.
Une seconde langue double-t-elle le travail ?
Le design et la construction se font une fois. Le travail ajouté tient surtout à la traduction, à la relecture et aux réglages de la version de droite à gauche. Une seconde langue avance d'autant mieux que les textes traduits sont prêts au démarrage. Pour situer votre projet, utilisez l'estimateur de projet.