Caouinche

n.f : tête.

étym : bourguignon

syn : binette, bourrichon, caboche, ciboulot, caillou, trogne, tronche…

Online

Une fois en ligne

Le site est fini, c’est le grand jour, tout est prêt pour le mettre en ligne.
Si ce n’est pas déjà fait, il faudra dans un premier temps choisir un prestataire pour l’hébergement et le nom de domaine et mettre les fichiers en lignes.

Viendra ensuite un travail d’optimisation qui sera réalisable en ligne ou avec des outils qui eux sont en ligne.

fabrice-villard-Jrl_UQcZqOc-unsplash
OVH

NDD et host

nommer et héberger

Le choix du nom de domaine d’une entreprise est important.

Le nom de l’entreprise déterminera logiquement le nom de domaine.
Il faudra ensuite choisir l’extension.

Un nom de domaine trop long sera difficilement retenable. Il est même possible que des internautes fassent des fautes d’orthographe en voulant l’écrire.

Un nom de domaine trop fantaisiste s’il n’est pas raccord avec le nom de la société ne donnera pas une image sérieuse.

Une extension en désaccord avec une thématique ou un pays d’exercice n’inspirera pas la confiance

Pour permettre à tous de bien cerner une thématique ou un métier, il n’est pas rare de voir associer au niveau des noms de domaine le métier en plus du nom de la structure :
Vous êtes architecte et votre entreprise s’appelle Polysphère
Comme nom de domaine, vous avez un grand nombre de choix. Les plus logiques s’orientent vers polysphere.com ou polysphere-architecture.com (ou .fr)

Vous êtes carreleur et votre entreprise s’appelle Taloche.
taloche.fr peut convenir, mais en y associant un terme permettant à tous de comprendre votre profession vous gagnerez en impact. taloche-carreleur.fr semble donc à privilégier.

Vous pouvez très bien ne pas associer de termes en plus du nom de la structure, ou penser directement ce terme dans le nom de la société. L’entreprise Bloc Design travaille dans… le design.

Attention à ne pas reposer le nom de domaine sur un EMD (Exact Match Domain) : Nom de domaine comportant uniquement des mots clefs.

Dans le cas de Polysphère qui exerce à Nantes ce serait architecture-nantes.fr ou en étant au moins en adéquation avec le nom de l’entreprise polysphere-architecture-nantes.fr

Si le nom de la société a été créé à l’aide de mots clefs, ici ce qui pourrait paraitre comme un EMD ne l’est pas et est justifié. Troc Cadeaux par exemple pour du troc ou de la revente de cadeaux.



fabrice-villard-Jrl_UQcZqOc-unsplash
ex2

Validateur W3C

Respect HTML et CSS

fabrice-villard-Jrl_UQcZqOc-unsplash
Validateur HTML
https://validator.w3.org

Comme nous l’avons vu, le web (ses pratiques) est régi par différentes règles.
Le World Wilde Web Consortium (W3C) met à disposition des testeurs de code afin de voir s’ils sont valides ou non.

Ce n’est pas parce qu’un site a quelques erreurs qu’il sera pénalisé. Néanmoins le but est de rectifier le tout afin de s’assurer qu’il y ait le moins d’erreurs possible.

Exemples d’erreurs en HTML
– Balises HTML non ou mal fermées
– Double utilisation d’un id dans une page HTML
– Souci d’écriture d’une URL
– Utilisation de balises obsolètes
– Non-remplissage d’alt pour les images

Exemples d’erreurs en css
– Utilisation de préfix dans le css
– Double utilisation d’une propriété
– Erreur de valeurs suite à présentation d’une propriété
– Propriété obsolète

fabrice-villard-Jrl_UQcZqOc-unsplash
Validateur CSS
https://jigsaw.w3.org/css-validator

Minification

un code light

La minification consiste a minifier, à compresser son code dans le but d’avoir un rendu plus rapide au chargement et donc à l’affiche.

Des outils existent pour compresser le code. Qu’il s’agisse de html, php, css ou js.

En minifiant le code, tous les commentaires, sauts de lignes et espaces sont supprimés. Il est donc préférable de dupliquer son dossier de site. Avant de le passer au minificateur.

Lorsque l’on télécharge des plugins il n’est pas rare de voir notamment pour les js des fichiers en min.js le min étant la version minifier, compresser du même fichier.

Si l’on a compressé son code sans en faire une copie non minifier il est toujours possible de le de minifier. Par contre tous les commentaires et toute la présentation initiale seront perdus.

fabrice-villard-Jrl_UQcZqOc-unsplash
php-minify

htaccess

Optimisation fichier serveur

    
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 7200 seconds"
ExpiresByType image/jpg "access plus 2592000 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType image/gif "access plus 2592000 seconds"
AddType image/x-icon .ico
ExpiresByType image/ico "access plus 2592000 seconds"
ExpiresByType image/icon "access plus 2592000 seconds"
ExpiresByType image/x-icon "access plus 2592000 seconds"
ExpiresByType text/css "access plus 2592000 seconds"
ExpiresByType text/javascript "access plus 2592000 seconds"
ExpiresByType text/html "access plus 7200 seconds"
ExpiresByType application/xhtml+xml "access plus 7200 seconds"
ExpiresByType application/javascript A259200
ExpiresByType application/x-javascript "access plus 2592000 seconds"
ExpiresByType application/x-shockwave-flash "access plus 2592000 seconds"
</IfModule>

options -indexes
    
  

Le fichier htaccess est un fichier serveur qui peut être à la racine et dans le dossier du site.
Grâce à lui on pourra :
– gérer la redirection du HTTP vers le HTTPS
– gérer le cache des éléments du site (html, css, js, img)
– donner des permissions sur la lecture d’un dossier
– rediriger d’anciennes URL vers de nouvelles URL
– déterminer la page d’erreur (404)
– créer des redirections permanentes (301)
– créer des redirections temporaires (302)

Dénomination du fichier : .htaccess

    
<IfModule mod_deflate.ct>
<FilesMatch "\.(html|php|txt|xml|js|css)$"t>
SetOutputFilter DEFLATE
</FilesMatcht>
</IfModulet>

RewriteEngine on

RewriteCond %{HTTPS} off [OR]
RewriteCond %{HTTP_HOST} !^www\.
RewriteRule ^ https://www.ndd.fr%{REQUEST_URI} [NE,L,R]

RedirectPermanent /ancienne-url.html https://www.ndd.fr/nouvelle-url.html
    
  

Robots txt

Autorisation ou blocage de fichiers/dossiers

Fichiers texte dans lesquels vous pouvez stipuler des autorisations concernant les robots d’indexation.

En général l’on souhaite que tout soit indexé

le fichier robots.txt se présente ainsi :

    
User-agent: *
Disallow:
    
  

Ici rien n'est bloqué

Si je souhaite bloquer un dossier en particulier

    
User-agent: * 
Disallow: /realisation-site-web/
    
  

L’ensemble du dossier realisation-site-web ne sera pas parcouru par les robots d’indexation
Attention donc à l’écriture de ce fichier.

Dénomination du fichier : robots.txt

Sitemap

Plan de site

    
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd"> 
<!--  created with Free Online Sitemap Generator www.xml-sitemaps.com  --> 
<url> 
<loc> https://www.caouinche.fr/</loc> 
<lastmod>2022-07-12T07:04:25+00:00</lastmod> 
<priority>1.00</priority> 
</url> 
<url> 
<loc> https://www.caouinche.fr/tour-horizon/01-histoire-du-web/index.html</loc> 
<lastmod>2022-07-12T07:04:25+00:00</lastmod> 
<priority>0.80</priority> 
</url> 
<url> 
<loc>https://www.caouinche.fr/tour-horizon/02-contexte-actuel/index.html</loc>
<lastmod>2022-07-12T07:04:25+00:00</lastmod>
<priority>0.80</priority>
</url>
<url>
<loc>https://www.caouinche.fr/tour-horizon/03-avenir-du-web/index.html</loc>
<lastmod>2022-07-12T07:04:25+00:00</lastmod>
<priority>0.80</priority>
</url>
…
</urlset>

  

Un site map est un plan de site, c’est un fichier en XML qui permet de déclarer l’ensemble des pages et URL d’un site web.

En l’envoyant aux moteurs de recherches, on est certains que toutes les pages sont prises en compte.
Il permet aussi de connaitre d’éventuels soucis au niveau des liens, car, pour se créer le robot qui conçoit le sitemap crawl le site et détecte les liens cassés.

Dénomination du fichier : sitemap.xml

Favicon

identifier visuellement un site

La création d’un favicon n’est pas une optimisation directe, mais plus un apport positif pour le site.
Le favicon est une petite icône qui apparait à côté de l’URL dans la liste des résultats des navigateurs et à côté de l’URL. Cette icône permet de reconnaitre visuellement le site si elle est créée en se basant sur le logotype de ce dernier ou s’il utilise la couleur du site.

Il existe des générateurs de favicons qui permettent de gagner du temps en évitant de créer une icône par OS/périphérique.

fabrice-villard-Jrl_UQcZqOc-unsplash
Real Favicon Generator
    
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="apple-mobile-web-app-title" content="Nom de mon site">
<meta name="application-name" content="Nom de mon site">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
    
  

ML / CGU / CGV / RGPD / Cookies

la loi et l'ordre

Si c'est gratuit vous êtes le produit
source
fabrice-villard-Jrl_UQcZqOc-unsplash
Générateur de mentions légales conforme RGPD
La Webeuse
fabrice-villard-Jrl_UQcZqOc-unsplash
Générateur de cookies
Axeptio

Autres générateurs Tarte au citron et Osano

ML pour Mentions Légales
CGV pour Conditions Générales de Vente
CGU pour Conditions Générales d’Utilisations
Politique de confidentialité pour politique de confidentialité
RGPD pour Règlement Général sur la Protection des Données
Cookies pour Cookies

Avoir un site c’est bien, mais avoir un site qui respecte la loi, nous protège et protège l’utilisateur c’est mieux.

Sur un site web, il est obligatoire de pouvoir identifier le propriétaire, le gestionnaire, l’hébergeur et le créateur. Le responsable de la publication qui est général le propriétaire du site doit être identifiable et joignable, que ce soit par mil, courrier ou téléphone. Ces éléments figurent en général dans la page Mentions légales.

Si vous créez un site d’annonces par exemple vous devrez avoir une page mentions légales, car page obligatoire sur tout site web, mais aussi, dans le but d’informer l’utilisateur une page CGU. Les CGU devraient être rédigées par un avocat, afin qu’elles soient le plus possible en relation avec le contenu du site. C’est une prestation payante soit, mais une prestation qui apporte une plus-value en cas de souci avec un tiers.

Si vous possédez un site de vente en ligne, il faudra en plus des mentions légales une page avec les CGV. Ici aussi si elles sont écrites par un avocat, ce dernier fera en sorte que tout soit réalisé pour l’activité et la thématique. Ces CGV seront utiles pour l’utilisateur comme pour le propriétaire du site en cas de souci.

La politique de confidentialité est un texte expliquant le cadre d’une relation commerciale issu de la transmission de données personnelles et doit être conforme RGPD.

La RGPD pour la responsabilité, la confiance et la transparence du site envers les utilisateurs. La RGPD oblige les entreprises à communiquer sur la collecte et l’usage des données et les oblige, en cas de demande de l’utilisateur à supprimer toute information les concernant. La personne doit donner son accord pour et lors de la collecte, de l’utilisation et de la communication de ses données.

La gestion des cookies elle est obligatoire depuis quelques années. L’utilisateur doit pouvoir choisir quel type de cookies il accepte, à savoir tous les cookies ou justes les cookies essentiels. Un cookie n’est pas forcement quelque chose de mauvais ou de lié au marketing, certains vont servir à garder en mémoire les informations de connexion, d’autre à connaitre votre parcours sur le site déterminant la page d’entrée et de sortie.

fabrice-villard-Jrl_UQcZqOc-unsplash
Générateur de politique de confidentialité conforme RGPD
TLMR Avocats
fabrice-villard-Jrl_UQcZqOc-unsplash
Explication politique de confidentialité et RGPD
legalplace