OVH est numéro un de l’hébergement en Europe, et propose ses solutions d’infrastructure réseau pour les entreprises, mais également :

• Solutions de standards téléphoniques IP
• Accès internet ADSL et SDSL
• Location de serveurs
• Solutions de Cloud et virtualisation
• Noms de domaine, messagerie, hébergements et bases de données…

Netvolution est en mesure de proposer les offres OVH et d’apporter un service de conseil, d’installation et de personnalisation sur place.

Il y est question des approches durables dans l’utilisation des nouvelles technologies. Synthèse et explications simplifiées, elles donnent un aperçu des solutions apportées par les nouvelles architectures, la virtualisation et le cloud notamment, les applications web et l’intérêt qu’elles apportent pour les économies d’énergie.

Les nouvelles technologies et l’impact environnemental – Partie 1

Les nouvelles technologies et l’impact environnemental – Partie 2

Diffuser l’information

La diffusion d’informations à destination des clients s’effectue de deux principales façons :

• passive avec la publication sur un blog ou un site internet (on attend que le visiteur vienne lire l’information, il le fait de lui-même, sa disponibilité est totale car il adopte une position volontariste par rapport à l’information qu’il recherche).
• active avec l’envoi de message vers le destinataire. C’est le principe des mailings, de l’envoi de prospectus, de publicités en général, de l’envoi de SMS, et bien évidemment, des mails.

L’envoi de mails étant simple à réaliser, on peut rapidement se retrouver confronté à un mail considéré comme spam, c’est-à-dire non sollicité. Et contrairement aux publicités non adressées (prospectus dans les boîtes aux lettres), l’utilisateur sur internet accepte moins volontiers d’être envahi par des mails publicitaires.

De ce fait, une législation est née, inspirée des pratiques usitées et respectées sur internet. Le mail à caractère publicitaire ou commercial, à destination du particulier, doit faire l’objet d’un accord préalable explicite de la part du destinataire.

Collecter les mails

Pour collecter des mails et constituer une base de données, il faut obtenir le consentement des intéressés.

Ce consentement se traduit généralement par un enregistrement volontaire ou une case à cocher « j’accepte de recevoir vos offres » sur un formulaire.

L’utilisateur inscrit doit pouvoir se désinscrire aussi facilement.

Créer et envoyer le mailing

En envoyant une newsletter, on doit donc respecter ces points, mais également :

• créer facilement un contenu, une structure
• coder proprement le message pour qu’il soit lisible sur la plupart des logiciels des destinataires
• rédiger le message afin qu’il ne soit pas considéré comme spam par les moteurs de détection automatique
• rédiger le sujet et le message afin qu’il soit lu par le destinataire
• inclure un lien de désinscription (si possible automatique)
• permettre au destinataire de lire son message en lui offrant un lien vers une version HTML du message
• envoyer un message assez léger, sans pièce jointe ou images trop lourdes pour ne pas encombrer la boîte du destinataire
• ne pas divulguer les adresses des autres destinataires
• ne pas se heurter à la politique de lutte contre les spams de votre propre prestataire d’accès internet

De plus, en tant qu’émetteur de ce message, vous allez sans doute vouloir mesurer son impact. Il vous faut donc des statistiques d’ouverture du message, de nombre de clics, de retour, voire de conversion en achats.

Notre approche

Toutes ces contraintes nous ont poussé à chercher et adopter une solution externalisée pour proposer à nos clients les services de gestion de newsletters et d’emailings.

Netvolution propose désormais des services de gestion des inscriptions, de création de contenu, d’expédition, de consultation de statistiques, de tests antispam et de lecture sur différents clients mail, tout en conservant l’esprit web essentiel : la simplicité.

L’annonce a été faite lors de la présentation de la prochaine version 3.2. A noter au passage un autre élément important : le passage à MySQL 5.0 minimum.

WordPress est un logiciel Open Source, système de gestion de contenu parmi les plus utilisés dans le monde pour gérer des blogs ou des sites de complexité variable. Netvolution propose des services de développement et intégration de sites à base de WordPress.

Plus clair

Un design épuré, des polices claires, un contraste étudié, des images choisies, nous avons privilégié la lisibilité et la simplicité pour que notre site soit à l’image de nos services.

Plus moderne

Utilisant les techniques récentes de conception et design web, nous avons repris une structure visuelle classique, éprouvée, avec textes et images plus larges. Un site plus moderne…

Plus rapide

Grâce à l’optimisation des serveurs d’hébergement, et à l’allégement des pages, nous gagnons en vitesse de chargement.

En espérant qu’il puisse nous permette d’atteindre nos objectifs, nous vous invitons à visiter ce site, et à nous contacter si vous le désirez.

Nous venons de finaliser une migration importante de serveurs. Les sites, applications web et emails des ingénieurs des Écoles Centrales de Lille et Marseille ont été remplacés.

Plus de puissance

Les nouveaux serveurs étant plus puissants, ils permettent d’accueillir des applications plus gourmandes, plus sophistiquées. Elles permettent également aux utilisateurs d’accéder très rapidement aux services demandés, l’affichage des pages web et le traitement des mails est instantané.

Plus de place

La mise en place d’un serveur de fichiers de grande capacité permet d’offrir un quota de plusieurs gigaoctets par utilisateur. Nous avons enfin un système modernisé, permettant aux usagers de gérer entièrement par IMAP leurs messages.

Des milliers d’emails hébergés

La totalité des comptes mails créés pour les ingénieurs et élèves des deux écoles ont été migrés sur des serveurs utilisant des logiciels libres, serveurs de mails, filtres antispam et antivirus, webmail sont des logiciels Open Source.

Des applications web de toutes sortes

Entre site web, application de gestion de l’annuaire, paiement sécurisé, plusieurs applications de natures différentes, toutes web, ont été hébergés sur des instances virtuelles. Nous planifions également la mise en service d’un système de portail collaboratif, nos plateformes sont prêtes à recevoir de nouveaux services, sur de nouvelles machines virtuelles, dimensionnées selon les besoins des applications.

Moins de machines

Nous réduisons le nombre de serveurs physiques en utilisant les principes de virtualisation, ce qui permet de diminuer les coûts d’exploitation, de surveillance, d’hébergement, et bien sûr, de limiter l’impact environnemental.

Dans cet article, nous exposerons quelques conseils et les bonnes pratiques qui vous aideront à bien travailler avec des développeurs web, et qui assureront que le résultat final sera parfaitement conforme à votre design, au pixel près.
Nous considérons que vous utilisez Photoshop, mais ces principes s’appliquent à tout autre outil utilisé pour la création graphique.

Cet article est librement traduit de cette version originale chez Sixrevisions, il en reprend également les illustrations.

1. Préparer un plan clair

La conception d’un site sans plan, ou cahier des charges, est gage d’échec, c’est d’autant plus vrai tant dans le design de sites web que dans la programmation. Planifier le projet est essentiel pour sa réussite, mais plus encore pour assurer la bonne compréhension entre le développeur et vous.

Une bonne technique pour éviter des écueils de communication est de faire en sorte que le développeur prenne connaissance et discute de vos schémas de principe et de mise en page, avant même que vous n’amorciez la création graphique proprement dite.

Il est donc recommandé de poser des questions telles que “est-ce que ça entre dans notre budget ?”, ou “est-ce que ceci ou cela pourrait être un problème ?”

2. Concevoir une bonne maquette du site web

Avant même de lancer Photoshop et commencer le design, il est bon de connaître quelques pratiques graphiques.

Système de grille

Si nous voulons nous assurer que notre site sera compatible avec plusieurs résolutions d’écrans, l’utilisation d’un système de grille de 960 pixels est une bonne façon d’éviter les surprises lorsque, une fois le site terminé, nous le visualisons sur d’autres postes. L’utilisation d’un système de grille apporte également une structure pour vous et votre développeur, permettant d’assurer que le contenu reste parfaitement aligné. L’utilisation d’un gabarit sur grille est le meilleur moyen, et le plus simple, d’obtenir des designs de sites internet précis et nets. Ces systèmes de structures en grille apportent également un guide dans votre processus de conception graphique, car de nombreux soucis liés à l’alignement, à la largeur de colonnes ou à la disposition des éléments ne se posent plus.

Mises en page qui suivent la croissance et les changements du site

Il est essentiel d’être conscient que, une fois le site en ligne, il commencera sa vie autonome. Que ce soit parce que le client voudra ajouter du contenu ou parce que le site sera prêt à passer à une nouvelle phase de développement, il est important de réfléchir à la manière dont il pourra croître et évoluer.

Comment sera affecté votre mise en page si cinq nouveaux paragraphes sont ajoutés ? Est-ce que votre menu de navigation permet facilement l’ajout de nouvelles rubriques ? Il y a des questions à ce poser, et auxquelles il faut répondre lorsque vous commencez à travailler avec le développeur.

Organisation de la maquette

On pourrait dire beaucoup de choses à propos d’un document Photoshop bien organisé. Le fait de préparer votre document de façon claire et précise permettra à votre développeur de repérer et d’isoler facilement les éléments de votre charte graphique. Ceci peut être fait en regroupant et en nommant les calques par élément du gabarit. Par exemple, vous pouvez diviser votre maquette en éléments tels que l’entête (“header”), le bloc de contenu principal (“main content”), pied de page ‘(“footer”) et colonne latérale (“sidebar”). Vous pouvez également regrouper vos éléments graphiques de manière logique.

Un fichier Photoshop bien rangé et modulaire signifie que vous devez prendre conscience qu’il faut séparer les éléments le plus possible dans des calques ; il n’y a rien de pire pour le développeur que d’essayer d’isoler un morceau du design et de se rendre compte qu’il est mélangé avec d’autres éléments.

Cela peut paraître évident, mais vous seriez surpris du temps gagné en développement par le simple fait de rester organisé de la sorte.

A ce sujet, il est également essentiel de vous assurer que vous êtes en mesure de fournir au développeur tous les éléments, images et liens dont il aura besoin pour prendre en compte votre besoin. Ces éléments incluent par exemple les différents états de votre système de navigation (état normal, état survolé), les boutons de l’interface tels que les boutons d’action, etc. (exemple de tutoriel pour apprendre à créer des boutons d’action).

Si vous avez d’autres informations que vous souhaitez transmettre ou qui vous semblent essentielles pour la compréhension de votre charte graphique, vous pouvez utiliser une application comme Skitch. Skitch vous permet d’annoter vos graphismes avec des remarques qui pourront d’aider la communication, notamment sur des points qu’il est difficile de traduire en mots. (Voir une liste d’autres outils de collaboration web que vous pouvez utiliser).

3. Apprendre les fonctionnalités des interfaces utilisateur

Lorsque vous travaillez sur des éléments qui auront un comportement ou une action spécifique, prenez le temps de chercher des exemples et de la documentation à transmettre à votre développeur afin qu’il ait une idée claire de ce dont vous parlez.

Les développeurs ne lisant pas dans les pensées, ils pourraient ne pas comprendre vos souhaits si vous présentez le graphisme dans un état statique sans annotation. Recherchez sur le web, vous trouverez de nombreux documents, démonstrations et tutoriaux sur à peu près tout type d’action et comportement (de toute façon, vous pouvez le faire simplement pour votre propre culture). Pour inspiration, visitez cette importante liste de techniques et tutoriaux d’interfaces.

4. Apporter un retour constructif

Lorsque votre développeur a terminé l’implémentation de votre charte graphique, il est probable qu’il y ait des changements, de votre part ou de la part du client. Il est rare que tout le monde soit satisfait au premier jet, vous avez désormais la mission de présenter les demandes de modifications de façon claire. Il vous faudra être le plus précis possible afin d’éviter les confusions.

Conclusion

Prendre le temps et faire l’effort de rester organiser est toujours payant à la fin.  Si vous êtes un graphiste débutant en web design, ne manquez jamais une occasion d’apprendre quelques chose de nouveau. Posez les questions qu’il faut au développeur, apprenez de vos erreurs, afin que votre prochain projet soit livré dans les temps et que votre charte graphique soit parfaitement respectée.

Questions à propos de la société

1. Avez-vous déjà un site ? Quelle est son adresse ?

2. Décrivez les produits/services que vous vendez.

3. Quels sont vos principaux concurrents ? Comment vous différenciez-vous ?

4. Quels sont les 3 principaux défauts que vous reprochez à votre site actuel ?

5. Que préférez-vous dans votre site actuel ?

6. Qu’est ce qui vous inspire dans les sites des concurrents ?

7. Tranche d’âge de votre clientèle cible ?

Questions en rapport avec le projet

8. Compétences techniques de votre clientèle cible. Notez de 0 à 10 (0 = sans compétences techniques, 10 = fortes compétences)

9. Vos visiteurs ont-ils des besoins spécifiques ? (Version mobile du site, plusieurs langues, écriture plus large pour mieux lire, etc.)

10. Imaginez votre site dans 5 ans. Complétez la phrase : mon site est une réussite parce que…

11. Citez les 3 éléments qui vous paraissent les plus importants dans le design de votre site.

12. Citez les 3 éléments qui vous paraissent les moins importants dans le design de votre site.

13. Avez-vous des préférences de couleurs, ou une charte de couleurs imposée par la marque ? Quelle(s) couleur(s) voudriez-vous (ne voudriez-vous pas) utiliser dans la charte ?

14. Quels sont les sites existants qui vous inspirent ? Fournissez des liens si possible.

15. Délai, date de mise en service du site ?

16. Avez-vous un budget auquel vous souhaiteriez vous tenir ?

Questions supplémentaires

17. Avez-vous besoin de mettre vous-même à jour votre site ? (CMS)

18. Souhaitez-vous un site de vente en ligne ? Allez-vous vendre des produits, effectuer des paiements en ligne ?

19. Avez-vous besoin qu’on vous fournisse du contenu ? Si vous utilisez le contenu de votre site actuel, aura-t-il besoin d’être modifié ou mis à jour ?

20. Votre logo ou vos illustration sont-elles prévues pour le web ?

21. Avez-vous toutes les images que vous souhaitez publier sur le site ou souhaitez-vous que le graphiste fournisse les images ?

22. Qui va mettre à jour le site par la suite ?

23. Souhaitez-vous des conseils supplémentaires pour le référencement ? (référencement naturel, payant, analyse de statistiques, etc.)

24. Avez-vous déjà un nom de domaine et un hébergement pour votre site ? Si oui, possédez-vous les paramètres pour y accéder (FTP, identifiants nom de domaine) ?

25. Avez-vous d’autres besoins spécifiques ? Identification, calendriers, forums, blog, services d’abonnements (RSS, email ou newsletter) ?

Luxe et gigantisme : les 30′

Dell et Apple sont parmi les premiers à avoir proposé un modèle 30′ d’une résolution de 2560 x 1600 pixels. Evidemment, les prix dépassent les 1500, voire 2000€ pour ce genre de matériel. HP et Samsung viennent de les rejoindre et proposent à leur tour un modèle dans cette catégorie.

Les avantages sont essentiellement dans la taille de l’écran : près de 70cm de large ! Sa résolution permet un travail de tout confort, notamment en graphisme et PAO, mais également en photo, video, développement et utilisations bureautiques intensives (telles que l’utilisation de fichiers Excel importants).

Le prix n’est pas le seul inconvénient. Outre l’encombrement, il est nécessaire de posséder un ordinateur permettant d’afficher une telle résolution ; c’est principalement la carte graphique qui sera l’élément déterminant.

Travail haute performance sur les 24′

De nombreux fabriquants offrent des modèles 23 ou 24′ permettant l’affichage en résolution 1920 x 1200. Moins titanesques, ils sont par ailleurs moins onéreux. Leur taille (largeur) avoisine les 55cm. Leur prix oscille entre 700€HT et 2000€HT, avec de nombreux modèles très performants aux alentours de 850€HT. Cette fois, la carte graphique est également un élément primordial mais la puissance requise est nettement plus raisonnable et la plupart des cartes récentes PCIe sont aptes à supporter ces écrans.

Le travail sur ce telles surfaces est extrêmement agréable, on dispose d’espace pour arranger ses fenêtres, ouvrir plusieurs documents côte à côte, et afficher en haute résolution des photos pour retouche. Ces écrans ne sont pas réservés à des travaux très spécifiques, car même si les graphistes et développeurs en seront ravis, en bureautique également, ils permettent un confort accru et une meilleure organisation visuelle à l’écran, source indéniable de gain de productivité.

L’ « entrée de gamme » des grands écrans : les 22′

La résolution est un facteur déterminant pour tout écran LCD. Il est important de noter qu’il existe des écrans 20′ et 22′ avec la même résolution (1680 x 1050), alors que les 23 et 24′ passent à 1920 x 1200. C’est la résolution qui reste le critère principal permettant de placer un écran dans une catégorie. Les 22′ offrent donc une résolution moindre, ce qui les place également dans une gamme de prix plus raisonnable : entre 300 et 500€HT.

Par rapport aux écrans les plus répandus, les 17′, le gain en affichage se retrouve sur les côtés : en effet, ces écrans sont au format 16:10 (contre 4:3 pour les 17′). Un 22′ permet par exemple d’afficher un document de 2 pages A4 côte à côte.

Intérêts d’un grand écran

L’ordinateur étant devenu le premier outil de travail de nombreuses professions, il faut se souvenir que l’écran demeure l’élément d’interface principal entre la machine et l’homme. Un bon écran se conservera plusieurs années, et verra passer de nombreuses unités centrales. La productivité est un facteur qu’un écran de grande taille augmentera. J’étais sceptique lorsque je lisais les articles ou études faisant référence à un gain de productivité, mais après avoir essayé un 24′, je peux confirmer : on travaille plus vite ! Comme en plus, les couleurs sont meilleures, le confort des yeux est accru, l’encombrement, le design et la consommation électrique sont avantageux (par rapport au CRT), il est temps de passer au grand format !

Tout cet article s’appuie sur l’utilisation de Windows XP comme serveur de boot et de fichiers. Tout serait évidemment plus facile avec un serveur sous Linux à disposition, mais nous partons du postulat que nous souhaitons installer un serveur alors que nous disposons uniquement d’un portable sous Windows XP Pro…

Préparer le serveur

Le serveur sur lequel on veut installer Fedora Core 6 doit être prêt à booter sur le réseau, en PXE. C’est une option proposée par de nombreux serveurs, notamment ceux de la marque HP. Un simple PC n’offrira peut-être pas cette fonctionnalité, elle est pourtant indispensable pour notre plan. Dans ce cas, revenir à l’installation en gravant le DVD me semble la meilleure solution !

Télécharger Fedora

Si vous disposez d’une connexion haut débit, vous pouvez éviter de télécharger la distribution, mais j’ai préféré télécharger l’image ISO du DVD Fedora Core 6 afin d’avoir sous la main et en local l’ensemble des paquets d’installation.

Ces images sont disponibles sont de nombreux miroirs : http://fedora.redhat.com/Download/mirrors.html

Monter l’image en lecteur virtuel

J’ai copié l’image ISO sur le portable et j’ai utilisé un logiciel de montage virtuel de CD-Roms pour ne pas avoir à graver l’image sur un support physique. C’est d’ailleurs plus rapide. Pour ma part, j’ai déjà eu l’occasion de tester Alcohol 120%, mais je pense qu’il est plus avantageux d’utiliser ici soit Daemon Tools, soit plus simplement encore, l’utilitaire de gestion de CD virtuels de Microsoft. Alcohol 51% existe en version gratuite, mais il force l’installation de logiciels de publicité, de spyware ou je ne sais quelle autre saleté : je le déconseille donc fortement malgré ses fonctionnalités et son interface sympas.

Lancer un serveur HTTP

Sur le portable, les fichiers RPM de la distribution sont donc disponibles dans un répertoire type « Z:Fedorarpms ». Pour les rendre accessibles sur le réseau, on peut utiliser un serveur FTP, mais je préfère la simplicité d’un serveur HTTP. Il existe là encore plusieurs choix possibles : Apache, IIS, ou HFS. Apache est libre, mais lourd pour ce que l’on veut faire ici. IIS n’est pas inclus dans Windows XP familiale, il est nécessaire de l’installer et de le paramétrer car il n’est généralement pas installé par défaut dans Windows XP Pro. Le plus simple des outils reste sans conteste HFS, également logiciel libre, tournant sous XP et d’une simplicité déconcertante, parfaitement adapté à ce que nous voulons faire.

L’adresse IP de mon PC portable est 192.168.1.8. Je lance HFS, j’ajoute le lecteur Z: à HFS (clic droit sur la lettre du lecteur dans « Poste de Travail » et « Add to HFS ». Le chemin proposé conserve le « Z: » ce qui donne une adresse du type « http://192.168.1.8/Z%3A/ » mais ça fonctionne tout de même et chercher à simplifier ce chemin prendrait du temps. Je vérifie que je peux consulter mes fichiers en allant sur 192.168.1.8/Z%3A/Fedora/RPMS/ . Ne pas oublier d’ouvrir le firewall de Windows XP (ouvrir le port 80 par exemple). A ce stade, on constate qu’HFS est lent à créer la liste des fichiers… En effet, préparer un index pour 2932 fichiers depuis un DVD monté virtuellement lui prend chez moi 50 secondes (variable selon la puissance du PC).

Lancer un serveur TFTP

Le logiciel Tftpd32 est un petit utilitaire gratuit permettant la création d’un serveur TFTP, ce qui va permettre à notre serveur vierge de booter sur le réseau en PXE.

Tout d’abord, paramétrer le serveur DHCP, en précisant que le « boot file » est « pxelinux.0″

Créer un répertoire « boot » dans lequel on place les fichiers nécessaires au boot PXE.

• pxelinux.0
• initrd.img
• vmlinuz

pxelinux.0 est un fichier fourni avec Syslinux disponible sur kernel.org. Télécharger la dernière version, décompresser l’archive et copier le fichier « pxelinux.0″ dans le répertoire « boot ».

initrd.img et vmlinux sont 2 fichiers disponibles sur le DVD de Fedora, dans le répertoire « images/pxeboot ». Les copier dans le répertoire « boot ».

Allumer le serveur vierge et attendre le boot sur réseau.

Il ne reste qu’à suivre les instructions et donner au script d’installation le chemin réseau HTTP permettant de venir chercher les paquets.

Une telle installation se révèle beaucoup plus rapide qu’une installation par DVD, elle permet également d’installer à la chaîne plusieurs serveurs.