Voici un billet pour se débarrasser d’un mythe que l’on croise fréquemment sur la toile. A en croire certains référenceurs, la balise H1 ne devrait être utilisée qu’une seule fois par page.

Le H1, une balise sémantique

Tout d’abord qu’est-ce qu’un H1? Les balises Hn (remplacez le n par un chiffre de 1 à 6) sont utilisées pour structurer les documents Web de manière sémantique. Le H a pour signification « Heading ». Comprenez en français « Titre », « Chapitre » ou encore « Entête ». Le numéro qui suit, lui, sert à donner le niveau du titre. Plus le chiffre est petit plus le titre est important.

Structurer un document de manière sémantique permet de donner du sens à son contenu en indiquant qu’un élément texte prend tel ou tel sens. On peut donc identifier facilement l’importance des éléments les uns par rapport aux autres et lire plus aisément le contenu. Ce système n’est d’ailleurs pas une particularité du Web et est aussi employé par exemple dans l’ensemble des traitements de texte.

Capture d'écran du Blog Nethik avec les styles désactivés

Mais qu’est-ce qui fait que ces balises permettent de mieux lire le contenu? Tout simplement parce qu’elles héritent d’un style particulier qui les met en exergue. En effet, par défaut tous les navigateurs appliquent une mise en forme aux éléments sémantiques, si bien que même sans ajouter de style à votre page Web, votre contenu sera tout à fait lisible et clair. Vous pouvez voir le résultat sur n’importe quel site Web grâce à l’extension Firefox « Web Developer » en désactivant les styles.

L’intérêt des balises sémantiques pour le référencement

Les balises sémantiques sont le seul moyen pour les moteurs de recherche de hiérarchiser le contenu de vos pages. En effet, les moteurs de recherche peuvent être considérés comme des personnes aveugles. Ils n’ont que faire du bandeau 2.0 que vous avez passé des heures à confectionner sous GIMP . Ce qui les intéressent c’est votre contenu. Ces balises vous permettent de donner plus d’importance à certains éléments qu’à d’autres et de les délimiter. Votre mot clé aura donc plus d’importance si il se trouve dans un titre que dans un paragraphe. Tout ça pour une raison très logique :  si il se trouve dans le titre, l’ensemble du contenu qui le suit sera censé être en rapport avec celui-ci.

Les spécifications des titres (Hn)

Les spécifications HTML, depuis au moins la version 4, décrivent les balises sémantiques Hn comme un élément décrivant brièvement le sujet d’une section qu’il introduit. Chose importante, elles n’interdisent pas d’avoir plusieurs H1 dans une page. Il est donc tout à fait valide même en xHTML strict 1.0 de mettre plusieurs H1 dans une page Web.

Les cas d’utilisation de plusieurs H1 sur une page Web

Les H1 peuvent être vus comme des délimiteurs de section. Ils permettent d’aborder plusieurs sujets dans la même page Web et de découper le contenu en plusieurs zones. C’est par exemple le cas sur la page d’accueil de ce Blog où les derniers billets sont listés. Chaque titre de billet utilise une balise H1. De cette manière, il est évident quand on rencontre le H1 suivant que l’on passe dans une autre zone.

Le brouillon des spécifications HTML 5 donne d’ailleurs encore plus de légitimité à cette pratique. En effet, le HTML 5 vise entre autre à ajouter de nouvelles balises sémantiques tels que , , , , , … pour donner encore plus de sens aux pages Web et les découper en zones. Chaque zone aura donc logiquement son propre titre de niveau 1, de niveau 2 etc.

Plusieurs H1 un problème pour le référencement?

Alors que nous avons vu que d’un point de vu technique et logique il était tout à fait envisageable d’utiliser plusieurs H1 sur la même page, un mythe circule sur le net à propos de son impact sur le référencement. Je dis bien un mythe car cette théorie ne repose sur rien de bien constructif et est réfutée même chez Google. Pour preuve voici une vidéo de Matt Cutts, ingénieur chez Google spécialisé sur la question :

Pour reprendre sa phrase de conclusion : « you can have it multiple times » comprenez « vous pouvez en avoir plusieurs »

Un peu de bon sens

Sans avoir à aller chercher la vidéo d’un ingénieur chez Google qui pourrait très bien se tromper, il est important pour ce qui est de la sémantique et du référencement de toujours faire preuve de bon sens. Lorsque vous avez un doute, gardez à l’esprit que les moteurs de recherche ne sont pas si différents de vos autres visiteurs et que ceux-ci se basent sur les normes en vigueurs dans le milieu. Codez en respectant ces normes et produisez du contenu clair de qualité. Voilà une bien meilleure ligne directrice. Laissons les Trolls à ceux qui ont du temps à y perdre.

Ce stage d’une semaine a eu lieu du 12 au 16 juillet au Centre aéré du Mas Bresson à Perpignan (le programme du centre est disponible sur le site de la Mairie) et sera renouvelé au mois d’août.

Au programme

• Découverte d’internet et du monde du web à travers des diapos, des questions/réponses et mini-jeux.
• Zoom sur les métiers du web, les étapes et les outils de la création d’un site web
• Réflexion et préparation du contenu du site internet du Mas Bresson
• Atelier pratique sur la retouche d’images et la création de vidéos numériques.
• Et enfin la création d’un site internet avec Meabilis!

Bilan de l’atelier

Les enfants ont choisi le thème gratuit « Minéral » pour représenter le Centre aéré et ont personnalisé le bandeau avec une photo du Mas Bresson.

Par groupe de deux, ils ont ensuite créé leur page, sur laquelle ils ont inséré les images, prises durant la semaine et retouchées par leurs soins.

Ils ont pu ajouter du texte et même les vidéos tournées la veille. Bref, construire leur site eux-même, supervisés par Julien et les animateurs. Certains ont même ajouté leur propre animation flash!

Le bilan est donc très positif : un véritable échange avec des enfants intéressés et sensibles au web (certains même déjà passionnés), concrétisé par une mise en pratique rapide et gratifiante.

Merci donc aux enfants qui ont participé à l’atelier (Estelle, Adriana, Julien, Rémi, Léa, Clémence, Basile, Hugo, Kellil, Vianney, Nicolas, Vincent, Paul et Mathias), aux animateurs du Mas Bresson et aux organisateurs.

La suite au mois d’août avec un nouveau groupe!

Meabilis permet de créer son site internet facilement mais aussi de l’optimiser pour le référencement, sans connaissances en programmation :

L’optimisation technique du site est géré automatiquement par l’outil (performances générales, redirections, contenus dynamiques accessibles, code propre…) et de nombreux paramètres sont personnalisables simplement (alt d’images, les urls, les métas…).

Pour vous aider dans cette démarche, Meabilis vous propose une catégorie « Conseils pour le référencement de votre site web » sur le Centre d’aide en ligne, comprenant plusieurs guides complétés et mis à jour régulièrement :

• Comment bien choisir les mots clés de son site internet
• Aide à la rédaction de contenu optimisé avec vos mots clés
• Comment rédiger le Title de ses pages web
• Soigner l’optimisation de ses images pour le référencement

Ces recommandations pourront vous être utiles pour appréhender les bases du référencement et les appliquer à votre site Meabilis.

Dans quelques jours se déroulera le festival Jazzapassa, auquel nous avions assisté l’année dernière (et qui avait fait l’objet d’un petit billet sur le blog : Nethik va Jazzer à Passa).

Le festival aura lieu du 25 au 26 Juin 2010 au Monastir del Camp à Passa (66).
Vous trouverez le programme, le plan et toutes les infos nécessaires sur le site web www.jazzapassa.com.

Je vous encourage vivement à découvrir cet événement original, véritable alchimie entre l’énergie créative de l’art contemporain et la culture ancrée du terroir.

Cette année, Nethik s’est impliquée dans la création de l‘identité graphique et des actions de communication du festival en créant son logo, ses affiches, ses flyers ainsi que son site internet!

Le site internet www.jazzapassa.com

La charte graphique a été réalisée sur mesure et intégrée à la plateforme Meabilis. 
Cela a permis à l’équipe de Jazzapassa de remplir le contenu du site eux-même et d’ajouter les fonctionnalités dont ils avaient besoin très facilement, comme par exemple un plan Google pour localiser le lieu de l’évènement, un système de commentaires pour dialoguer avec leurs visiteurs, un formulaire de contact, une galerie d’image ou encore un lecteur de flux Rss pour mettre en avant leurs actus sur la page d’accueil.

Pour rappel, vous pouvez créer un site internet dès maintenant sur le site Meabilis (www.meabilis.fr)!

Création du logo « Grand Passage »

Jazzapassa fait partie d’un grand projet transfrontalier de réunion d’actions artistiques, d’interactions créatives, de culture et de patrimoine, Grand Passage.

Le logo symbolise deux éléments importants de ce projet :

le rapport à l’Histoire, à la culture et au patrimoine, représenté par un livre ouvert
et le lien, la continuité, le passage des connaissances et des frontières représenté par l’anneau de Möbius.

Création graphique des affiches et flyers du festival

Pour compléter les supports de communication, l’identité graphique de Jazzapassa a été déclinée sous différentes formes : cartons d’invitation, affiches, flyers…

L’affiche a été créée à partir d’une trame faite de transparence avec la répétition du logo de « Grand Passage », représentant ainsi le lien entre le festival de Jazz et le projet global.

Le logo est aussi repris en négatif, ne laissant apparaitre que les triangles « vides » sur les coins de l’affiche. C’est un élément important de l’identité visuelle du projet, qui sera repris sur d’autres supports (signalétiques, banderoles…).

On retrouve aussi la courbe de Moebius dans le fond de l’affiche, vibrant au rythme des ondes musicales.

La photo de fond est un portrait de Julien Loureau, réalisé par Gala, artiste photographe dont vous pourrez retrouver l’exposition au Monastir del Camp.

Rendez-vous donc les 25 et 26 Juin à Passa pour de belles journées musicales et sur le site internet pour retrouver toutes les informations sur l’événement.

Site web Solid'Action

Voici un nouvel exemple de site internet professionnel, réalisé par notre agence web pour l’entreprise solidaire Solid’Action : www.solidaction.coop

Il s’agit du site d’une jeune Scop dont l’objectif est d’apporter solutions, accompagnement et formations aux personnes souhaitant s’engager de manière solidaire.

La charte graphique a été créée sur mesure en respectant l’identité graphique de la société, ses goûts et ses besoins et le site repose sur la plateforme Meabilis.

L’équipe de Solid’Action a donc pu intégrer les contenus du site facilement et en toute autonomie grâce au système de gestion de contenu, en aillant un rendu immédiat du résultat final (technologie WYSIWYG).

Le résultat est un site riche en contenus et en images, qui reflète le dynamisme et le professionnalisme de la société!

En savoir plus sur Solid’Action :

Solid’Action est une coopérative de solidarité internationale qui vient de naître et qui a pour objet de mettre en relation des citoyens souhaitant s’impliquer dans la solidarité et la coopération internationale avec des acteurs partenaires locaux en Europe et dans les pays en développement.

Ses services s’adressent donc autant aux particuliers, qu’aux professionnels, associations, collectivités territoriales, universités… Bref, toute personne ou groupe de personnes désirant agir, s’informer ou participer au développement durable.

Son activité s’articule autour de 4 pôles :

• La mise en place de missions de volontariat
• Le promotion de voyages solidaires organisés par les partenaires de la SCOP
• La formation (montage et gestion de projet de développement, solidarité et tourisme solidaire)
• Le conseil et l’accompagnement ( recherche de fonds, montage et gestion de projets solidaires)

Je vous propose de découvrir plus en détail les services proposés par cette Scop pleine d’avenir ainsi que sa charte éthique!

Logo de la fête de la nature

A travers des balades guidées, des festivités ou encore des ateliers thématiques, les naturalistes, bénévoles ou professionnels, vous accueillent et vous emmènent à la rencontre d’espèces aux charmes insolites et d’espaces aux trésors cachés.

Petits et grands trouveront leur bonheur parmi les nombreuses sorties et animations, entièrement gratuites, proposées un peu partout dans les Pyrénées-Orientales (sites naturels du Conseil-Général des PO, de Perpignan, d’Argelès-sur-Mer…).
En plus, 2010, Année Internationale de la Biodiversité (Nations-Unies), fait écho à cet appel de la Nature pour vous dévoiler ses merveilles, ses craintes, ses aspirations, ses services.

Ouvrez la porte, venez, respirez et savourez.

Pour en savoir plus et connaître les sorties près de chez vous : Fête de la Nature

Vous pouvez donc commencer à créer votre site web dès maintenant sur www.meabilis.fr et tester l’outil à volonté, c’est gratuit et sans engagement!

Voici un petit aperçu des fonctionnalités disponibles gratuitement :

En vous inscrivant à Meabilis, vous avez accès à un choix de chartes graphiques gratuites et personnalisables (ajout de votre logo, de vos illustrations et images, choix de la couleur de fond…).

L’outil de gestion de contenu vous permet ensuite de construire les pages de votre site simplement et de les modifier autant de fois que vous le souhaitez (le nombre de pages est aussi illimité).

Le fonctionnement est simple : Vous avez à votre disposition un ensemble d’éléments, appelés « modules » que vous glissez-déposez sur votre page et que vous remplissez avec votre contenu.

Par exemple, un module texte vous servira à mettre en page votre contenu textuel, un module galerie vous permettra de présenter vos photos, un module plan google d’afficher votre localisation sur une carte, etc.

Tous les services liés à la création d’un site web sont centralisés sur le tableau de bord de votre interface d’administration privée (configuration du site, nom de domaine, hébergement, comptes e-mails pour les offres pro…).

Enfin, un soin particulier est apporté au référencement et aux optimisations techniques (code propre, redirections, métas et url personnalisables, géolocalisation…).

Les dernières nouveautés :

Le formulaire de contact

En un clic, vous ajoutez un formulaire sur votre site, permettant ainsi à vos visiteurs de vous contacter facilement, sans ouvrir leur messagerie.

Le système de commentaires

Idéal pour créer un livre d’or, un espace d’avis clients ou tout simplement ouvrir un dialogue avec vos visiteurs. Les messages peuvent être modérés (acceptés ou refusés) et même modifiés.

A venir très prochainement

• L’agenda, une nouvelle fonctionnalité pour présenter ses événements et dates importantes facilement.
• Le blog, un système de création d’articles et de listing de billets pour ajouter un blog à son site internet.
• Une nouvelle version du module galerie (importation multiple, personnalisation de la taille des miniatures…)
• Et aussi, de nouvelles chartes graphiques personnalisables et gratuites!

A bientôt donc! N’hésitez pas à nous donner vos retours d’expérience ou à nous demander conseil. Un support en ligne est à votre disposition pour vous répondre en direct.

Ce site a été réalisé avec Meabilis, notre outil de création de site internet et une charte graphique créée sur mesure en suivant les besoins et envies de l’association.

Il s’agit donc d’un site web évolutif, dont les contenus peuvent être mis à jour très facilement et en toute autonomie.

Il bénéficie aussi de toutes les fonctionnalités de Meabilis (système de commentaires, formulaire de contact, éditeur de texte Wysiwyg, carte google maps, lecteur de flux Rss…) et est optimisé techniquement pour le référencement (géolocalisation, respect des standards du web, construction sémantique, redirections 301, possibilité de personnaliser les métas…).

Découvrir l’association IF :

« Initiation à la forêt » est une association Loi 1901, créée en 1995,  dont l’objectif est d’initier enfants et adultes et de former les enseignants à la connaissance de l’environnement. Elle promeut aussi toute action ayant ce but et crée des documents de Défense des Forêts Contre les Incendies (DFCI). If participe aussi à toutes opérations de développement forestier et environnemental.

Prochain événement organisé par l’association : « Les rencontres de la forêt » le 5 mai 2010 à Céret (66).

Retrouvez d’autres exemples de sites web réalisés avec Meabilis et toutes nos chartes graphiques gratuites sur www.meabilis.fr

Cette édition nous invite à changer nos comportements : « Passez au durable, ça marche »… et c’est facile…parait-il !

Il s’agit de faire prendre conscience à chacun qu’il est un acteur essentiel du développement durable et qu’il peut y participer dans ses comportements quotidiens.

Pour cela, l’agglomération de Perpignan propose un programme « éco-durable » d’activités et de festivités autour de 8 thèmes :

Voici quelques temps forts de cette semaine :

• Comment être un bon éco-citoyen au quotidien ? Vous trouverez toutes sortes de conseils
  dans la Maison du développement durable située sur le parvis du Palais des Congrès. Bâtie comme une vrai maison, vous déambulerez du garage à la salle de bain en découvrant toutes une séries d’éco-astuces de manière ludique et interactive.
• Exposition spéciale mobilité durable : le samedi 3 avril, place de la Victoire,  on pourra imaginer un Perpignan vert grâce aux bus et vélos électriques (ou hybrides) et au bus-tram, une nouveauté qui verra bientôt le jour dans notre belle cité catalane.
• 3ème fête du tri,  une journée spectacle éco-Art : le samedi 3 avril, théâtres (Comedia Del Arte), musique (Big Band Jazz, Musicabrass …), déambulation (les « poules’vérisées ») animeront la place de la République.
  Tout au long de cette journée, vous pourrez déguster des produits bio, découvrir le maquillage bio, ou encore apprendre la percussion sur bidons.
• Tout au long de la semaine, des visites guidées de lieux naturels vous sont aussi proposés (étangs de Canet, littoral des dunes de la Ribère …).

Pour connaitre l’agenda de cette semaine, rendez-vous sur le site de la mairie de Perpignan.

Cette édition nous démontre encore que le développement durable ne se limite pas au tri des déchets ou à une alimentation bio … il  s’agit bien d’une démarche globale, cohérente et solidaire. Cependant, il est si simple de faire rentrer dans notre quotidien ces petits « eco-gestes » qu’il serait dommage de ne pas essayer !

Pour rappel, les Scop ce sont plus de 40 000 salariés en France dans 2000 entreprises. Le statut Scop est expliqué par Cyril dans l’article « Scop, une forme juridique solidaire« .

La nouvelle marque :

Désormais, l’acronyme SCOP (autrefois « Sociétés Coopératives de Production ») signifie Sociétés Coopératives et Participatives.

Une façon de rappeler que ce statut n’est pas réservé à un secteur d’activité en particulier mais qu’il s’applique à tous les domaines et toutes les entreprises : sociétés de services, métiers du commerce, de la communication ou de l’innovation (la preuve!)…

Les membres d’une Scop (à la fois associés et salariés donc, si vous suivez bien) sont maintenant appelés des co-entrepreneurs et les notions de solidarité et de solidité (les 2 S imbriqués en « maillon », les couleurs fortes…) sont désormais les éléments forts de cette nouvelle image!

La signature de la marque : « La démocratie nous réussit » renvoie quant à elle, au fonctionnement démocratique de l’entreprise (où un salarié représente une voix) et à la réussite économique et sociale du modèle Scop.

Une campagne de communication accompagne cette nouvelle identité. L’objectif étant de faire connaître le mouvement Scop au grand public et de développer et mettre en valeur une autre façon d’entreprendre. Le réseau Scop existe depuis maintenant plus de 150 ans et il apparait toutefois comme une solution moderne et d’actualité.

Pour en savoir plus sur cette refonte d’image, les explications et détails sont sur un site internet dédié à la marque du mouvement : www.les-scop.coop.

Je vous invite particulièrement à lire les 10 idées reçues sur les Scop, vous pourriez être surpris!