Construire son site

T Tu n’as plus d’excuse pour avoir un site qui fait fuir tes visiteurs.

WordPress offre une infinité de possibilités pour améliorer l’expérience de tes visiteurs.

• Gutenberg, l’éditeur de WordPress, offre des options de mise en page évoluées.
• 4 extensions ajoutent des fonctionnalités supplémentaires pour la mise en forme des articles et pour personnaliser l’environnement de lecture.
• Je te donne quelques lignes d’HTML et de CSS pour répondre à des besoins spécifiques.

Que tu sois débutant ou plus confirmé, à la fin de ce guide, tu auras toutes les cartes en main pour créer des publications agréables à lire.

Tu vas voir que Gutenberg va bien au-delà de la mise en forme du texte.

Q Quand tu découvres WordPress pour la première fois, l’interface d’administration est impressionnante.

Tu disposes de nombreux menus et ne sais pas bien par où commencer.

Je te propose de faire un tour rapide des principales options qui s’offrent à toi et d’effectuer quelques réglages indispensables sur WordPress pour favoriser ton SEO.

Je te donne également une solution pour gérer l’adresse e-mail de ton site avec Gmail.

P Pourquoi prendre le risque qu’un pirate prenne le contrôle de ton site pour arnaquer tes visiteurs ou te faire du chantage ?

Heureusement sur WordPress, des extensions de sécurité s’occupent de tout pour toi.

Ces 4 plugins gratuits sécurisent ton site :

• Empêche les intrusions
• Renforce la sécurité avec des protections
• Supprime les virus et les malwares
• Sauvegarde pour effectuer une récupération
• Préviens les attaques

Cela ne prend que quelques minutes pour les paramétrer à l’aide de ce tutoriel détaillé.

Tu retrouveras également 5 bonnes pratiques pour protéger ton site WordPress.

A Avec 5 millions d’utilisateurs, Elementor s’est imposé comme le constructeur de pages de WordPress.

Une des raisons de son succès réside dans sa version gratuite généreuse qui offre de nombreuses possibilités.

Tu vas créer ta page exactement comme tu le souhaites. L’éditeur de WordPress s’améliore tous les jours mais il manque encore de finesse dans l’organisation d’une page complexe (accueil, vente…).

Je te montre des astuces et des techniques pour donner un effet Wahou à tes créations.

J’aborderai dans cet article uniquement les fonctionnalités de la version gratuite.

Tu retrouveras trois vidéos qui complètent le tutoriel avec des exemples de réalisations.

T Tu as l’obligation légale de communiquer sur les cookies.

Tu n’es pas pour autant dans l’obligation de sortir l’artillerie lourde systématiquement avec l’obtention du consentement.

Je te présente deux extensions WordPress pour la gestion des cookies adaptées en fonction de ta situation.

Tu vas voir ce n’est pas la mer à boire.

J’ai trouvé un site qui facilite l’identification des cookies actifs. Tu retrouveras également des exemples de textes pour ne pas y passer des heures.

Tu souhaites créer ton site sous WordPress ou opérer des changements majeurs ?

Pour ne pas travailler directement sur la version en ligne de ton site, tu vas installer une version virtuelle et locale de WordPress qui te laissera le champ libre pour expérimenter.

DesktopServer est un logiciel gratuit et puissant pour créer ton site WordPress en local.

Duplicator va réaliser une copie fidèle pour tester les changements avant de les réaliser sur ton site.

Tu n’as pas forcement besoin d’installer une version locale complexe de ton site pour expérimenter. Tu vas découvrir comment disposer d’un WordPress de test en 5 minutes.

T Ton site s’affiche lentement. Je te montre concrètement comment j’ai réduit mon temps de chargement.

Google se base désormais sur la version mobile pour évaluer un site. Celle-ci est beaucoup plus exigeante techniquement.

Tu vas accélérer ton site, économiser de précieuses secondes et rendre le sourire à tes visiteurs et à Google.

Si tu es allergique à la technique, je te présente 5 extensions faciles à utiliser qui vont travailler à ta place.

Utilisé par plus de 5 millions de sites, Contact Form 7 est l’extension gratuite de WordPress idéale pour créer ton formulaire de contact.

Je t’accompagne pas à pas dans ce tutoriel. Chaque étape est illustrée.

Tu intègres facilement ton formulaire où tu le souhaites :

• ta page de contact
• ta page d’accueil
• ton pied de page…

Cela ne prends que quelques minutes pour un formulaire simple. Tu n’auras qu’à réaliser un copier-coller.

Honnêtement, la version standard est moche et encombrante. Je te dévoile comment disposer d’une version esthétique avec des astuces de personnalisation.

Je suis passé de ce formulaire qui faisait le travail

à celui-ci que je te propose d’intégrer sur ton site.

Nous verrons également comment le protéger du spam qui sinon représente une vraie plaie.

Si tu es client Mailchimp, je te montre comment connecter facilement ton formulaire.

S Si tu personnalises ton thème au-delà des fonctionnalités de l’éditeur, tu installes un thème enfant.

L’autre option est de ne jamais mettre à jour ton thème et d’ouvrir tes portes en grand aux pirates.

Cela ne prend que quelques minutes et t’évitera de perdre des heures de travail à la prochaine mise à jour.

Je te présente également des alternatives pour personnaliser ton thème en toute sérénité.

T Twenty Seventeen n’est plus le thème par défaut de WordPress. Il conserve cependant toute sa popularité : plus d’un million de sites l’utilisent aujourd’hui.

Ce thème entièrement gratuit est idéal pour les débutants qui souhaitent un site pour promouvoir leur activité.

C’est le seul des thèmes développés par les équipes de WordPress qui soit orienté entreprise contrairement aux autres plus axés sur le blogging.

Nous allons voir ensemble comment le personnaliser dans ce tutoriel pas à pas.

Tu vas commencer par modifier l’aspect de ton site avec l’éditeur du thème puis tu pourras approfondir avec trois extensions voire quelques CSS pour les plus audacieux.

J’ai sélectionné 18 améliorations qui apportent de la crédibilité et de l’autorité à ton site.

Ce sont souvent des points de détail négligés qui, cumulés, laissent une impression d’amateurisme.

Je suis persuadé que de nombreuses propositions vont te sembler évidentes mais que tu trouveras des idées à piocher.

J’ai invité un spécialiste de WordPress, Pascal Cescato du site Tout sur WordPress, à enrichir l’article de ses précieux conseils. Ses interventions seront matérialisées par un encadré de couleur en pointillés.

T Tu vas créer une version allégée de ton site spécifique pour les mobiles.

Ton site va se charger en un clin d’œil pour le plus grand bonheur de tes lecteurs.

• Les avantages
  • Une vitesse de chargement inégalée
    (plus de 2 fois plus rapide)
  • Un taux de rebond plus faible
• Les inconvénients
  • La disparition de l’habillage du site
  • La perte des pop-ups et boutons de partage des images
  • Peu adapté pour les sites d’e-commerce
  • Le HTPPS est nécessaire
  • Seuls certains réseaux publicitaires sont compatibles

Note : Cette extension conserve toujours son attrait mais elle est incompatible avec Rank Math. Je l’ai désinstallé pour l’instant.

L Les mockups sous photoshop apporteraient une touche pro à ton site ou tes réseaux sociaux.

Cependant, quand tu as découvert le tarif de 36 € par mois pour utiliser Photoshop, tu as trouvé (à juste titre) que cela revenait très cher le visuel.

Les visuels réalisés sont impressionnants.

Je suis toujours admiratif de la qualité du travail effectué par les graphistes pour te simplifier la vie.

Il en existe pour de nombreuses utilisations : ordinateurs, livres, objets, affiches…

Avec Photopea, tu vas modifier gratuitement les mockups photoshop en toute légalité.

Je te communique également des visuels testés et des sites qui fournissent des mockups gratuits de qualité.

Limite : Photopea gère parfaitement les fichiers Photoshop comme tu vas le constater avec cependant une contrainte sur la taille du fichier.

Je te recommande de n’utiliser que les fichiers de moins de 80 mo. Au delà, tu risques de te retrouver avec un navigateur figé.

T Tu prépares ton site et tu n’as aucune envie que tes visiteurs te surprennent en plein travaux avec le tas de gravats au milieu du salon ?

Tu vas créer ta page de lancement qui annoncera l’arrivée prochaine de ton site.

Personnaliser ton site et préparer une belle page d’accueil prend du temps. Tu t’assures que tout est parfait avant de lancer ton site.

L’extension Minimal Coming Soon & Maintenance Mode possède un nom trompeur. Elle est complète et possède, en version gratuite, de nombreuses possibilités de personnalisation.

De plus, tu peux collecter des e-mails et t’assurer des lecteurs dès la publication de ton premier article.

Les avantages de l’extension :

• Une page personnalisée aux couleurs de ta marque
• La collecte d’e-mail avec la version gratuite (ce qui est rarissime)
• Une interface simple à utiliser

Les inconvénients

• Seul MailChimp est proposé pour collecter des e-mails
• L’interface est en anglais ce qui impose de traduire les messages

T Tout site commence par la page d’accueil.

Elle requière toute ton attention car c’est la page qui, en général, récolte le plus de vues.

Par où commencer ?

Je te présente les éléments incontournables accompagnés de nombreux exemples pour t’aider à trouver l’inspiration.

L Les images constituent le facteur de séduction incontournable de ton site. Il ne faut surtout pas les négliger.

Tu vas découvrir comment créer de belles images pour ton site même si tu es un parfait débutant.

L Les mockups sont des visuels photoréalistes de mise en scène de produits ou de sites.

Tu vas les utiliser pour illustrer ton site, tes articles et tes publications sur les réseaux sociaux.

Voici trois exemples de ce que tu vas réaliser en 3 minutes :

Je trouve le résultat attractif et toi ?

Les outils en ligne que je te présente sont entièrement gratuits ou possèdent de nombreux modèles offerts. De plus, ce sont des services en ligne qui ne nécessitent aucune installation de logiciel.

J’ai réalisé pour toi une sélection des générateurs les plus performants et te présente les modèles les plus souvent utilisés ou ceux qui sortent du lot.

Les tutoriels détaillent toutes les étapes pour produire tes visuels.

S SiteOrigin CSS est une extension gratuite pour personnaliser ton site en effectuant facilement des modifications sur les CSS.

T Trouver la bonne adresse pour son site n’est pas toujours simple.

Nous allons voir comment sélectionner celle qui conviendra le mieux à ta marque.

T Tu veux lancer ton site mais tu ne possèdes aucune connaissance technique ?

Je te guide de A à Z dans l’hébergement de ton site et la réservation de ton nom de domaine chez O2Switch mon hébergeur. J’en suis très satisfait.

Il cumule l’avantage d’être abordable (72 € par an) et d’être en France avec un service client réactif et attentif.

L’hébergeur stocke ton site sur un serveur et permet son accès à l’ensemble de tes visiteurs.