So'Happy Studio de communication graphique et digitale, création de site internet, application web et mobile

Graphisme et infographie, illustration et logo
L’optimisation de votre site Web et SEO

L’optimisation de votre site Web et SEO

Pourquoi la vitesse de la page influe-t-elle sur votre référencement ?

La vitesse de la page dépend de nombreux facteurs, de votre serveur Web à la conception technique et doit être optimisée.

La vitesse de chargement est primordiale pour l’expérience utilisateur de vos internautes, et surtout un facteur clé pour l’optimisation de votre référencement sur Google et consorts.

En outre, un site Web rapide convertit également mieux.

Un facteur clé pour optimiser votre positionnement sur Google.

Depuis 2010 Google fait de nombreux efforts pour pousser les développeurs à optimiser la vitesse de chargement de leurs sites Web. Permettant ainsi que désengorger les serveurs et surtout de fournir la meilleure expérience utilisateur possible.

Un site optimisé donne de meilleurs résultats dans le positionnement SEO.

Rassurez-vous un site lent, ne sera pas déclassé. Mais peut-être pas pour très longtemps…

Il est donc urgent d’optimiser vos sites Web, c’est pour cela que So’Happy optimise ses sites Web depuis quelques années.

Votre site est rapide ou lent ? Un test est nécessaire.

D’abord un état des lieux de votre site est nécessaire. Pour cela Google propose son outil Google Page Speed Insights, mais pour obtenir des résultats couvrants d’autres navigateurs, nous vous conseillons GT METRIX.

Testez la vitesse de chargement de votre site.

Comme nous l’avons dit plus haut, une vitesse de page efficace repose sur différentes optimisations. D’autre part, un mauvais temps de chargement résulte de plusieurs facteurs :

  • Un serveur Web bon marché :  les performances de votre hébergement dépendent du prix que vous êtes prêt à donner. À long terme, un hébergement web bon marché pourrait conduire à de faibles performances de pages. Vous devez choisir votre serveur web adapté en fonction de la taille de votre entreprise et de votre site web.
  • Thème complexe : le thème WordPress que vous choisissez a un impact sur la performance de votre site et sur votre temps de chargement. En fait, certains thèmes sont assez lourds et réduiront la vitesse de votre page s’ils contiennent trop de fichiers à charger.
  • Images lourdes :  Certaines images trop lourdes peuvent sérieusement réduire la vitesse de votre page. Il est préférable de compresser vos visuels sous PNG/JPEG/GIF pour maintenir leur qualité tout en diminuant leur poids.
  • Code complexe, non minifié : votre code HTML / CSS / JS impacte votre temps de chargement. Nettoyez votre code pour mieux fonctionner.

Voici quelques conseils indispensables pour optimiser votre site web motorisé; notamment sur WordPress.

WordPress est une plate-forme incroyable, mais elle peut aussi être assez lente si elle n’est pas optimisée correctement. Nous allons vous montrer comment accélérer WordPress en partageant nos stratégies et recommandations de performances Web.

1- Utiliser un thème performant et adapté à votre site

Derrière chaque site WordPress, il y a un thème graphique. Chaque thème est codé différemment et à cause de cela, il y en a qui sont plus ou moins optimisés. Les thèmes WordPress par défaut tels que Twenty Fifteen sont assez rapides car il sont très légers et conçus par les développeurs de WP. Malheureusement, ce n’est pas le cas de tous les thèmes.

Soyez prudent lorsque vous achetez des thèmes tels que ThemeForest et Creative Market. Bien qu’il y ait beaucoup de choix de thèmes ( à faible coût ), la plupart des thèmes sont développés – et des fois mal développés – pour couvrir le maximum de possibilités. Souvent beaucoup de plugins chargés inutilement.

Chez So’Happy, les thèmes sont entièrement développés et optimisés à vos besoins.

2- Utiliser la mise en cache côté Serveur et côté Navigateur.

La mise en cache est un autre facteur important lorsqu’il s’agit d’accélérer WordPress. La mise en cache stocke vos pages et messages sous forme de fichiers statiques, qui sont ensuite diffusés à vos visiteurs, réduisant ainsi la charge de traitement sur votre serveur.

Vous pouvez utiliser la mise en cache en utilisant des plugins de mise en cache WordPress, en implémentant la mise en cache du navigateur et la mise en cache côté serveur.

3- Mettre en place un CDN sur votre hébergement

Peu importe la taille de site WordPress ou le trafic généré par votre site, tout le monde peut bénéficier de l’implémentation d’un CDN. Un CDN prend essentiellement tous vos fichiers (CSS, Javascript, Images) et les livre sur un serveur plus proche du visiteur, ce qui diminue le temps de téléchargement.

4- Optimisez la base de données WordPress

WordPress a tendance à ralentir si vous ne gardez pas votre base de données optimisée. Il existe des moyens de garder votre base de données propre en désactivant et/ou en limitant les révisions postérieures, en supprimant les anciennes révisions.

5- Optimisez les images en les redimensionnant à leurs tailles définitives et en les compressant

En moyenne 56% du poids de la page d’un site Web est constitué d’images . Donc optimiser vos images et les compresser devrait certainement être haut sur votre liste de priorités. So’Happy passe par une première phase d’optimisation. Sous Photoshop chaque image est redimmensionnée à leur dimension affichée sur le site et compressée au bon format d’image. Inutile d’utiliser du PNG pour une image photographique.

Dans une deuxième phase le dossier UPLOAD de WordPress est compressé via un script de compression d’images.

6- Compression GZIP au niveau de votre serveur Web

Gzip est une autre forme de compression qui compresse les pages Web, CSS et javascript au niveau du serveur avant de les envoyer au navigateur.

Vous pouvez vérifier si votre site WordPress est déjà compressé en utilisant Check GZIP Compression .

7- Réduire le nombre de plugins WordPress

La lenteur de votre site vient souvent du nombre trop elevé de plugins chargés par WordPress. Déterminez ceux qui ralentissent votre site. Ensuite, après avoir analysé l’impact sur les temps de chargement, demandez-vous si le plugin est vraiment nécessaire ou peut-être que vous pourriez accomplir la même chose d’une manière différente, en le développant aux « petits oignons ».

8- Réduire et concaténer CSS et Javascript

Quand il s’agit de la vitesse dans WordPress minification et concaténation peuvent jouer un grand rôle.

Minification

La réduction des ressources signifie la suppression des caractères inutiles de votre code HTML, JavaScript et CSS qui ne sont pas requis pour le chargement, tels que:

  • Caractères de l’espace blanc
  • Caractères de nouvelle ligne
  • Commentaires
  • Délimiteurs de bloc

Cela accélère les temps de chargement car il réduit la quantité de code à demander au serveur.

Concaténer

La concaténation est le processus de combinaison de vos fichiers CSS et Javascript dans un seul fichier dans le seul but de réduire vos requêtes HTTP. Dans certains cas, cela peut augmenter le temps de téléchargement de votre fichier, mais cela l’emporte généralement sur des demandes supplémentaires. A vérifier avant de concaténer tous vos scripts.

9- Désactiver le Hotlinking

Hotlinking fait référence à quelqu’un qui récupère l’une de vos images ( de votre site) et l’affiche sur leur propre site web. Lorsque quelqu’un visite le site du HotLinker, il doit charger l’image de votre serveur, en prenant votre bande passante. Vous pouvez désactiver le hotlinking en ajoutant un bout de code à votre .htaccess

10- Choisissez un serveur Web fiable et performant

Et bien sûr, choisir un hébergeur fiable et rapide peut être l’une des décisions les plus importantes que vous ferez en essayant de comprendre comment accélérer WordPress.

Nous vous recommandons de ne pas utiliser l’hébergement mutualisé bon marché car ils ont tendance à surcharger leurs serveurs et vous finirez par partager des ressources entre des centaines de personnes.

Le vieil adage, «Vous obtenez ce que vous payez», s’applique définitivement ici. Nous vous suggérons d’utiliser un serveur VPS ou un serveur Web WordPress géré en fonction de votre niveau d’expertise et de votre temps.

 

Vous souhaitez améliorer la vitesse de chargement de site et booster votre SEO,
contactez-nous, nous vous proposons une analyse gratuite.

 

 

Les étapes de création d’un logotype, chez So’Happy

Les étapes de création d’un logotype, chez So’Happy

Et pourquoi ça prend du temps et pourquoi « votre voisin qui maîtrise Photoshop » ne peut pas le faire…

Notre expérience en matière de création de logos repose sur une méthode rigoureuse et éprouvée qui nous permet de répondre exactement à  vos attentes. Comme dans toutes nos réalisations, nous sommes entièrement à l’écoute de nos clients, nous échangeons avec eux tout au long du processus de création et nous leur prodiguons de nombreux conseils basés sur notre expérience et la diversité de nos réalisations.

Les grandes étapes de la création de votre logotype

 

1 – Le brief et l’écoute client

  • Etudier le positionnement, la cible et les valeurs de l’entreprise
  • Identification du nom, du slogan ou de la baseline
  • Comprendre vos objectifs en image de marque et communication
  • Lister vos besoins, exigences et contraintes liées à la création de votre logo
  • Etudier et analyser votre concurrence

 

2 -L’inspiration visuelle et premières recherches

  • Un travail de recherches visuelles (benchmarking), permet de définir et d’orienter le design et le style du logotype
  • Présentation de vos préférences graphiques, les couleurs à privilégier, les styles de logos que vous aimez et pourquoi …
  • Nous commençons de suite avec crayon et un papier, la bonne vieille méthode pour éviter la « page blanche » sur Illustrator
  • Recherches typographiques et travail sur les premières formes (sous Illustrator Adobe Creative Cloud).

 

creation logotype

 

3 – Vectorisation et réalisation numérique des maquettes graphiques

Nous réaliserons plusieurs maquettes sous Adobe Illustrator respectant scrupuleusement le brief initial, tout en respectant les règles de construction d’un logotype professionnel et avec le souci de vous créer une image significativement différente de celle de vos concurrents.

creation logotype

 

4 – Présentation des maquettes sélectionnées par l’agence

  • Nous présentons au client plusieurs propositions (entre 4 et 6 propositions)
  • Le client sélectionne une version ou plusieurs pistes, que nous allons finaliser

creation logotype

 

5 -Finalisation et livraison

Parmi les différentes maquettes qui vous seront proposées, vous choisirez celle qui répond le mieux à vos attentes, et qui sera ensuite affinée pour aboutir à  la version finale de votre logo. Différents choix de couleurs et de typographies seront testés, et pour chacun d’eux votre avis sera sollicité, en gardant à l’esprit que votre graphiste puisera dans son expérience pour vous éviter des choix s’écartant trop du brief initial.

  • Amélioration des pistes sélectionnés et présentation au client
  • Préparation des livrables. Une fois la dernière maquette réalisée, nous pouvons passer à l’étape de la finalisation de votre logo. Il sera livré sous les formats prévus pour les supports web et les supports imprimés. (PDF, EPS, JPG, PNG).

Creation du logotype

 

6 – Préparation d’un guide d’utilisation et charte graphique

Ce guide est un document de référence appelé charte graphique, il contient  les règles fondamentales d’utilisation des signes graphiques constituant l’identité visuelle d’une entreprise, d’ne marque, d’une organisation ou d’un projet. Elle contient en général les éléments suivants :

  • Les règles d’insertion de chaque élément (logo, titre, baseline,…) et pour chaque support : les marges et le positionnement dans le document.
  • Les règles éditoriales (ton et style) aidant tout réacteur à rendre ses documents homogènes.
  • Les règles d’adaptation et de déclinaison pour les supports comme tels que la télécopie, en proposant par exemple une version simplifiée du logo (noir et blanc).

 

7 – Le client est satisfait !

Insérer un bouton Facebook « J’aime » et partage sur votre site WordPress, sans code !

Dans cette nouvel article de « trucs et astuces » je vous propose d’insérer facilement et sans code, un bouton permettant de partager et de liker votre page sur le mur du visiteur.

Connectez-vous à votre administration, et insérons une nouvelle extension. Dans le menu « extensions » ajouter une nouvelle extension. Recherchez « facebook Like PressGraph » dans le champs de saisie du moteur de recherche.

Installez et activez l’extension « facebook Like PressGraph« . A voir copie d’écran ci-dessous.

Insérez un bouton Facebook j'aime et de partage

Un nouveau menu « PressGraph » est affiché.

A présent, rendez-vous sur la page « PressGraph ».

Insérez un bouton Facebook j'aime et de partage

AppId, vous devez créer un identifiant pour cette application sur le site :  https://developers.facebook.com/apps/

C’est rapide et gratuit. Remplissez le champ avec votre ID et votre Admin ID. Voir inscription sur Facebook.

Choisissez la position sur vos pages et l’alignement. Show In permet de définir sur quels types de pages vous souhaitez voir apparaitre ce bouton.

Et les options suivantes, pour obtenir le bouton « J’aime » et Partager.

Insérez un bouton Facebook j'aime et de partage

Cliquez sur « Update Settings » et votre bouton Facebook doit maintenant apparaitre dans le contenus de votre site WordPress.

Insérer une vidéo Youtube sur WordPress

Insérer une vidéo Youtube sur WordPress

Deux méthodes simples pour insérer une vidéo dans un article ou une page WordPress.

Méthode 1 : méthode proposée par Youtube

Connectez-vous sur le site Youtube : https://www.youtube.com/?hl=fr&gl=FR

Recherchez une vidéo, dans mon exemple « Unik Tarbes »

Insérer une vidéo de Youtube sur WordPress

Cliquez sur le bouton « Partager » situé en bas de la vidéo

Choisissez l’option « Intégrer » et copiez/collez le script proposé (<iframe>…..</iframe>)

youtube-2

Connectez-vous à votre administration WordPress : http://www.url-de-votre-site.com/wp-admin

Modifiez votre page dans laquelle vous souhaitez intégrer cette vidéo

Copiez/collez le script dans votre éditeur en mode « Texte »

Insérer une vidéo de Youtube sur WordPress

Bravo votre vidéo est intégrée sur votre page. En fait elle est uniquement liée depuis le site Youtube.

Deuxième méthode, l’utilisation d’une extension WordPress

Dans votre administration WordPress, dans le menu Extensions, faites « Ajouter une extension » et recherchez avec le mot clé « Youtube »

Insérer une vidéo de Youtube sur WordPress

Installez et activez l’extension Youtube, la première dans la copie d’écran ci-dessous.

Editez votre page ou article, un nouveau bouton « Youtube » est apparu au dessus de votre éditeur de contenus. Cliquez dessus.

Insérer une vidéo de Youtube sur WordPress

Choisissez l’option « Embed a single video »

Insérer une vidéo de Youtube sur WordPress

Puis saisissez le nom de votre vidéo, dans l’exemple « Unik Tarbes« , une liste de vidéo apparait. Choisissez une vidéo de la liste et cliquez sur le bouton « Insert into Editor ».

Insérez un bouton Facebook j'aime et de partage

Bravo le code Youtube est inséré, votre vidéo est intégrée. N’oubliez pas de « Mettre à jour » votre article ou page.

 

 

Partagez