Développeur web Editions Ypypyp

Éditions Ypypyp – Vente de fiches pratiques pour devenir autonome

Les Éditions Ypypyp nous ont contactés pour leur créer un site Web. Celui-ci pour montrer leur activité et vendre les fiches pour devenir autonome. Les Éditions Ypypyp est un éditeur engagé sur la thématique de l’autonomie. Cette société est créé par Yvan Saint-Jours et Philippe Pellan :

  • Yvan Saint-Jours qui est chef spécialiste de l’écoconstruction,
  • Philippe Pellan paysagiste-jardinier créateur d’écosystèmes naturels

Le site Éditions Ypypyp est un site e-commerce responsive en WordPress réalisé dans l’agence Schuller Graphic.

Réalisation :

Tout d’abord, nous avons commencé par installer le WordPress avec un thème. Puis installer WooCommerce pour la vente en ligne des fiches DIY des Éditions Ypypyp. Puis, nous avons installé des modules tels que :

  • Contact Form 7 pour la création de formulaire avec le module Really Simple CAPTCHA,
  • le module Revolution Slider pour la page d’accueil,
  • WP Super Cache pour la rapidité du site,
  • Advanced Custom Fields pour permettre de créer des champs personnalisables aux fiches produits,
  • Yoast SEO pour le référencement du site.

Puis, nous avons structuré le site avec une page d’accueil qui contient un slider, les dernières parutions et une remonté du blog. Ensuite, nous avons une page de présentation des Éditions Ypypyp, une page concernant les auteurs des fiches DIY, une page Boutique sanctionnée en différentes catégorie pour vendre les fiches pour devenir autonome et une page Contact.

Enfin, ils voulaient permettre aux professionnels, qui vendent leurs fiches, de leur consacrer une partir Pro pour pouvoir télécharger différents documents. Nous avons donc mis en place un accès sécurisé grâce aux modules User Profiles Made Easy et Members pour l’identification des personnes, le module File Away pour le téléchargement de fichier. Les professionnels doivent s’inscrire grâce à un formulaire de contact et une personne des Éditions Ypypyp leur envoie un code d’accès pour entrer dans la partie Pro.

Développeur web Google Responsive Mobile

Responsive Design – Optimisation des sites pour mobiles

Google différencie maintenant les sites adaptés ou non aux mobiles et tablettes, ce que l’on appelle le Responsive Design. Même si nous pouvons voir un site non responsive sur un mobile ou une tablette, la navigation est plus difficile et les internautes sont souvent obligés de zoomer pour voir le texte et les images.

Comme Google peut reconnaître sur quel appareil l’internaute se trouve, Google référencie les sites responsives plus avant qu’un site non responsive si l’internaute se trouve sur un appareil de type mobile ou tablette.

Les différents sites que j’ai mis en responsive sont des sites surtout en E-majine réalisés dans l’agence Schuller Graphic.

Réalisation :

A l’arrivée de Google Mobile le 21 Avril 2015, l’agence Schuller Graphic a envoyé une Newsletter à ses clients pour leur proposer de mettre leur site en responsive dont certains clients ont répondu à cette offre.

Tout d’abord, pour ne pas déranger le bon fonctionnement des sites web, j’ai dupliqué chaque site sur un autre serveur. Ensuite, j’ai choisi de prendre la technologie Foundation pour le responsive car j’avais déjà travaillé avec. Même pour le site Sanchez Industrie, qui est un Prestashop, j’ai préféré prendre Foundation que la grille Bootstrap de Prestashop.

J’ai donc téléchargé la grille Foundation en css et les jQuery associés pour divers fonctions que j’ai envoyées et intégré sur chaque site. Ensuite, j’ai construit mes colonnes sur chaque template de chaque site. En effet, la grille foundation est composée de 12 colonnes. Donc, nous avons de multiples choix pour découper une page suivant si nous avons une leftbar ou non, si nous voulons montrer les produits en 2, 3 ou 4 colonnes, si nous souhaitons couper le footer du site en 2 ou 3 colonnes.

Par conséquent, voici les sites web passés en Responsive Design et validés par Google.



A-protect responsive

Cap emploi responsive

Oildist responsive

Pièce téléphone responsive

Sanchez industrie responsive

Développeur Web Donville Évasion Plongée

Donville Évasion Plongée – Club de plongée à Donville-les-Bains

Le club Donville Évasion Plongée est basé dans le Pays Granvillais. Le club Donville Évasion Plongée est une association sportive. Elle est régie par la loi du 1er juillet 1901 à but non lucratif. L’objectif du club est de faire découvrir la plongée sous-marine suivant les textes de la FFESSM.

Le site Donville Évasion Plongée est un site de présentation du club de plongée en WordPress.

Réalisation :

Tout d’abord, le club de plongée de Donville-les-Bains, étant des amis et ayant commencé avec très peu de trésorerie, je leur ai proposé un site web. J’ai donc utilisé le CMS WordPress et j’ai pris un thème assez simple, non responsive.

Puis, j’ai créé une feuille de CSS le plus simple possible. Celle-ci pour styler le header, le menu, les fonds, les liens et les boutons. Ils m’ont créé le logo et fournit les textes et les photos.

Ensuite, je leur ai demandé ce qu’ils voulaient sur leur site, ce qui m’a permis de créer ce menu et d’inclure des modules tels que : Contact Form 7 pour la création de formulaire, All-in-One Event Calendar pour afficher les sorties en mer, en fosse, les rendez-vous du club, les voyages… MailPoet Newsletters pour l’inscription à leur Newsletter et Meta Slider pour la création de Slider.

Enfin, pour le site Donville Évasion Plongée, j’ai essayé de faire au mieux le référencement en donnant des noms de pages cohérents avec les titres, les urls et le texte. Le nom des images et leur titre sont tous associés à leur page. J’ai créé une adresse gmail qui m’a permis de créer une chaine youTube, d’implémenter un Google Analytics et d’envoyer le sitemap à Google Webmaster Tools et vérifier les incohérences des pages.

L’équipe de la plongée vont souvent sur le site et l’administre. En effet, ils mettent à jour le planning et font des articles de leurs plongées illustrées de photos.

Développeur Web A-Protect

A-Protect – Vente d’équipement de protection individuelle et de vêtements professionnels.

A-Protect est une entreprise spécialisée en vente d’équipement de protection individuelle et de vêtements professionnels. Cette entreprise est basée à Colombelles près de Caen. A-Protect nous a sollicités pour créer un site e-commerce pour la vente de leur produits. Des produits tels que vêtements de protection, vêtements spécifiques par métier ou par marque, divers gants et chaussures…

le site A-Protect est un site e-commerce en E-majine par Médialibs réalisé dans l’agence Schuller Graphic.

Réalisation :

Le site A-Protect est un site e-commerce avec mise en place de plusieurs moyen de paiement, ajout de module tels que mise en avant de produits, un module Newsletter.

Tout d’abord, le header est composé :

  • Logo et Slogan
  • Partie E-commerce : recherche, Mon Compte, panier
  • Numéro de téléphone
  • Menu

Ce menu est composé de différentes catégories avec des sous-catégories. lorsqu’on est sur une catégorie, les sous-catégories apparaissent mais aussi les produits.

De plus sur la page d’accueil, nous avons inséré dans ce pack e-commerce un big slider. Ce slider est relié à une administration (développement spécifique en PHP/MySQL) qui permet d’ajouter, modifier ou supprimer des slides. Le webmaster du site A-Protect peut donc changer l’ordre des slides, lui mettre un titre, un lien et une couleur de fond. nous remontons aussi différentes marques, les produits à la une. Puis, nous avons mis une description ds Valeurs pour le référencement.

Puis pour le footer, nous avons les conditions d’un site e-commerce (Moyen de paiement, livraison, Transport…). Mais aussi, une liste de liens qui vont vers des pages et non la boutique.

Après quelques temps, la société A-Protect nous a demandé de le mettre en responsive. J’ai donc pris Foundation pour le rendre responsive.

Enfin, certains produits sont personnalisable. En effet, nous pouvons broder du texte sur ses produits. Le client a le choix entre Cœur ou Dos, 13 couleurs et 6 polices d’écritures. Lorsque le client choisi la position, cela le limite en caractère et fait augmenter le prix.

Développeur Web Groupe Napoly

Groupe Napoly – Société de transports de matières dangereuses et non dangereuses sur l’ensemble de la France.

La société Groupe Napoly est une entreprise de transports de matières dangereuses et non dangereuses en citerne. Le Groupe Napoly est composé de 3 sociétés : Napoly Transports, Péchavy Transports, Vigouroux transports, d’où la présence de ce groupe sur l’ensemble de la France.

Le Groupe Napoly est un site de présentation du Groupe Napoly en WordPress réalisé dans l’agence Schuller Graphic.

Tout d’abord, j’ai installé WordPress relié à sa base de donnée. Puis, nous avons pris un thème Responsive. En effet, le thème étant responsive, nous avons dû développer certaines parties pour rendre le site Groupe Napoly 100% responsive. Par la suite, j’ai installé différents modules tels que :

Formulaire de Contact,

LayerSlider et révolution Slider,

SEO pour le référencement

et WP Super Cache pour la vitesse.

Puis pour le header, nous avons inséré le logo et le menu et une zone de recherche. Et pour le footer en 3 colonnes, les chiffres clés, un formulaire de contact et les implantations.

Ensuite, nous avons créer 6 pages. La page d’accueil et la page « Qui sommes-nous » sont bien segmentées. La page d’accueil est constitué d’un slider. Puis, de nos engagements et d’une partie constituée de parallax. Mai aussi d’un portfolio et des box avec des icônes.

Nous avons aussi personnalisé la page « Qui sommes-nous ». Elle est segmentée comme la page d’accueil. J’ai donc développé en jQuery le second menu et adapté la partie Timelapse en responsive. Nous avons mis aussi un portfolio, du texte, du parralax. Mais aussi du texte en accordéon et une carte des implantations.

Puis, les pages Engagements, Notre métier et Contact sont plus simple. En effet, elles sont claires et sans trop d’informations. Dans la page Engagements, j’ai inséré un Caroussel. Celui-ci présente les certificats du groupe.

Développeur Web Oildist

Oildist – Vente de Fioul, gasoil, GNR et de bois sur les départements 61, 53, 14, 35.

Oildist est une entreprise de vente de Fioul (FOD ou Qualy-Plus) et de gazole non routier. Oildist vend aussi du bois en granulés ou sur palette. Elle est située à Briouze dans l’Orne en Basse Normandie et livre les départements de l’Orne (61), la Mayenne (53) et l’Ille et Vilaine.

Oildist est un site de e-commerce en E-majine réalisé dans l’agence Schuller Graphic.

Réalisation :

Tout d’abord, nous avons effectué la refonte du site Oildist. Auparavant c’était un site de présentation de la vente de bois et de fioul en Izi-média. Ce site présente donc le bois et le fioul. Mais nous pouvons aussi acheté directement du bois en magasin ou en livraison et du fioul en livraison. En backoffice, nous avons développé une partie servant aux codes postaux de livraison pour le bois et le fioul dans le Calvados, l’Orne, en Mayenne et l’Ille et Vilaine.

Ensuite, nous avons donc mis en place des fiches produits pour le bois et développé suivant si l’internaute prend en magasin ou se fait livrer chez lui. Pour le fioul, nous avons repris le processus de Prix Fioul.

L’internaute choisit son département et entre son code postal de livraison. En cas d’erreur on lui affiche les codes postaux livrables. Puis, il choisit 1 fioul entre les 3 proposés : fioul ordinaire, QPlus, Gazole non routier, et entre la quantité désirée. Avant la validation, nous calculons le prix total et nous envoyons toutes ses caractéristiques sous forme de variantes au panier. L’internaute n’a plus besoin que de payer par les différents moyens de paiements : Chèque, Carte Bancaire en ligne ou en livraison, Virement ou en 3 fois sans frais avec la carte Réglo.

Quelques temps après, Oildist nous a sollicités pour mettre son site en responsive. J’ai donc pris Foundation pour la mise en place.

Développeur Web Sanchez Industrie

Sanchez Industrie – fabricant français de chariots industriels : chariot de manutention, chariot roll, desserte, penderie industrielle, cabri

La société Sanchez Industrie est un fabricant français de chariots industriels. Différents chariots : chariots et rayonnage en fil, supports, tables et dessertes, produits ergonomiques, et bacs et armoires en alu, produits plastiques, chariots rolls… Sanchez Industrie est basé à Livarot en Basse-Normandie. Elle nous a sollicités pour refaire son site Internet pour présenter son catalogue.

Sanchez Industrie est un site e-commerce en Prestashop réalisé dans l’agence Schuller Graphic.

Réalisation :

Ce site est juste un site de présentation des produits et non de la vente en ligne. Tout d’abord, nous avons décidé de garder Prestashop pour répertorier les produits de Sanchez Industrie.

Nous sommes donc parti d’une base Prestashop. Puis, nous avons injecté quelques modules tels que :

  • le Bloc contact qui permet de créer ses formulaires comme on le souhaite,
  • le module Produits phares qui nous sert à remonter en page d’accueil 3 produits choisis juste en mettant le produit dans une catégorie cachée,
  • le Bloc Slider qu’on retrouve en page d’accueil,
  • le bloc Dans la même catégorie qui se trouve dans les fiches produits
  • le module Bloc menu horizontal pour afficher le 1er menu.

Puis, nous avons aussi achetés quelques modules tels que le module Méga menu de DevSoft qui nous sert évidemment pour le menu de produit, le module Produits des catégories sur la page d’accueil par CINS en page d’accueil pour afficher les produits par catégories.

Ensuite, nous avons créé aussi des modules tels que le bloc HTML pour la rightBar, le bloc HTML pour la page d’accueil, le module Newslettter et le bloc HTML pour le footer.

Enfin, après leur avoir fait une formation sur comment entrer le contenu des pages et entrer leurs différents produits, je me suis plus focalisé sur le référencement des produits en leur expliquant quelques méthodes de référencement. Et j’en ai fait le suivi grâce à Google Webmaster Tools et Analytis.

Développeur Web Cap Emploi

Cap Emploi – Site d’offres d’emploi pour personnes handicapées en Normandie

Cap emploi est un site d’annonces pour l’emploi des personnes handicapées. Ces personnes basées en Normandie : Calvados (14), Eure (27), Manche (50), Orne (61), Seine Maritime (76). Le site internet de Cap Emploi est présent depuis des années et présentait des annonces d’emploi. Ce site est destiné aussi bien pour les candidats que pour les employeurs. Les annonces peuvent être recherchées

  • avec une recherche normale,
  • par domaine professionnelle,
  • soit par métier
  • ou par département.

Cap Emploi nous a recontacté pour effectuer une recherche sur une zone autour d’une ville de la région Normandie.

Cap Emploi est un site de e-commerce en E-majine réalisé dans l’agence Schuller Graphic.

J’ai donc commencé à modifier l’aspect de la zone de recherche en séparant le choix Recherche par département ou Recherche par ville en HTML et l’action au clic en jQuery. Puis, j’ai mis un champs texte pour entrer le nom de la ville et un champs de sélection pour le rayon autour de cette ville (10, 20, 30 km). L’internaute entre sa ville et clique sur le bouton Actualiser et grâce à la Google API V3, la carte se positionne sur la ville choisie. Ensuite, un cercle se forme autour de cette ville suivant le choix du rayon de l’internaute. Enfin, il clique sur Rechercher et ses annonces s’affichent suivant ses choix.

Enfin, la recherche se fait grâce au PHP à un appel à la base de données MySQl. En effet, Google API V3 me renvoie la longitude minimum et maximum du cercle, mais aussi la latitude minimum et maximum. Les annonces misent sur le site Cap Emploi sont géo localisées en longitude et latitude, ce qui me permet donc d’effectuer cette recherche dans la base de données des annonces.

Cap emploi
Développeur Web Bertrand Drouère Artisan

Bertrand Drouère – Artisan Electricité – Peinture – Décoration

EURL Bertrand Drouère est une société d’électricité basée à Villejuif. Il propose tous travaux d’électricité, peinture, décoration, sols, plaques de plâtre de vos biens immobiliers neufs ou vos biens en rénovation à Paris (75) et en Île de France : Seine et Marne (77), Yvelines (78), Essonne (91), Hauts de Seine (92), Val de Marne (94).

le site de Bertrand Drouère est un site de présentation en une page développé en HTML et en jQuery.

Bertrand Drouère m’a demandé de lui faire un site de présentation de sa société et de ses compétences. Il avait déjà créé son logo et ses papiers à en-tête dans une agence de communication de Paris. Ses exigences pour le site était un site sobre en noir et blanc. Puis il fallait garder la typo des ses papiers à en-têtes et que le site soit responsive. En effet, je lui ai créé un QR Code. Son agence lui a imprimer pour le mettre sur le camion de la société. Comme cela, les personnes en flashant son QR Code arrive sur son site internet en responsive.

Réalisation :

Tout d’abord, j’ai intégré le site en HTML. Puis, j’ai créé un formulaire qui apparaît en jQuery dont les champs sont vérifiés aussi en jQuery. Ensuite, j’ai installé Nivo-slider et Fancybox pour créer une galerie de ses réalisations. J’ai demandé à Bertrand Drouère ses différents corps de métier que je fais afficher en jQuery avec un toggle et de me donner du contenu pour le référencement de son site internet.

Pour que le site internet soit responsive, j’ai utilisé Foundation en 12 colonnes qui s’adapte très bien pour tous les types d’écran.

Enfin, j’ai concordé le title et la méta description pour qu’ils correspondent au balise H1 et H2 et au contenu du site internet pour un minimum de référencement.

Prev1234