Étiquette : outils

Catégories
Productivité

8 outils vitaux pour auditer, sécuriser et optimiser votre projet web

Alors que je suis en cours de finalisation d’un site pour un client, je voulais en profiter pour partager une série d’outils en ligne et côté client permettant de disséquer vos pages.

Pourquoi se faire du mal quand tout à l’air d’aller bien ? Tout simplement parce que vous êtes assis sur une mine d’information non-exploitées qui vous permettrait d’améliorer la compatibilités cross-navigateurs, le temps de chargement, fermer les failles de sécurité et de savoir si le site est toujours disponible quand vous n’êtes pas là pour regarder.

Plugins Firefox

YSlow

Plugin pour Firefox: YSlow

Vous connaissez certainement le service YSlow de Yahoo!, il s’agit de la version déportée, en plugin pour firefox. Comme dans la version hébergée chez yahoo!, vous obtiendrez un score sur 100 vous suggérant des catégories d’amélioration possibles. Tout n’est pas pertinent (le CDN par exemple n’est pas réaliste pour les sites en début de carrière).
>> https://addons.mozilla.org/firefox/addon/5369

Webdevelopper Toolbar

Plugin Firefox : WebDevelopper Toolbar

C’est à peu près ce à quoi on peut s’attendre. Une bar d’outils qui vient se nicher dans Firefox et qui permet d’appliquer une série de filtres à vos pages, de les éditer à la volée et de valider la qualité du code employé.
>> https://addons.mozilla.org/firefox/addon/60

Plugins Internet Explorer

Et oui il y en a aussi et étant largement méconnus, ca valait bien une mention spéciale.

DebugBar

Plugins pour IE : Debug Toolbar

Cette toolbar pour IE est assez similaire à la Webdevelopper Toolbar disponible pour Firefox. L’image ci-dessus vous donne un apperçu de ce que vous y trouverez.
>> https://www.debugbar.com

Services en ligne

Si Firefox nous permet de charger beaucoup de plugins vraiment utiles et performants, on reste dans le cas ou c’est votre connexion qui va aller faire les tests. Pas génial d’un point de vue méthodologique, d’autant que plusieurs critères peuvent donner des réponses variables en fonction de l’heure de la journée. Grâce aux services en ligne, vous pourrez effectuer des tests transparents et suivre la disponibilité de votre serveur en permanence.

Pingdom

Services en ligne : Pingdom

Excellent service permettant de visualiser ce qui se passe quand un navigateur tente d’accéder à votre site sous la forme d’un diagramme de Gantt. Très efficace et simple à interpréter, ce test se combine très bien avec YSlow; l’un vous donne des directions vers lesquelles creuser et l’autre validera la mise en place de vos changements. C’est grâce à Pingdom que je me suis rendu compte que le temps de réponse de mon héberger pourrait être optimisé… c’est une autre discussion, mais je recommande ce test avant de choisir un héberger.
>> https://tools.pingdom.com

Woozweb

Services en ligne : Woozweb

Encore un excellent service en ligne que j’utilise au quotidien. Woozweb vous donne un historique de la disponibilité de votre site. Leurs serveurs vont « pinger » votre site et mesurer le temps de réponse. Dans le cas ou le site réponde lentement voire pas du tout, vous recevrez un email disant qu’il y a des lenteurs ou un réel problème de disponibilité. Le robot sonde votre url toutes les 15 minutes et les résultats viennent alimenter un graphique quotidien qui est ensuite archivé.
>> https://www.woozweb.com

Applications côté client

Le « tout internet » est clairement une bonne chose… oui mais voilà, tous vos projets web ne sont pas forcement accessibles librement sur le net, ou dans certains cas, particulièrement les grosses applications, le nombre de requêtes ne permet pas d’utiliser un service gratuit. C’est là que les applications côté client prennent tout leur sens.

SoftX HTTP Debugger Pro

Identifiez les paramètres utilisés par les formulaires, les cookies, le code source de la page, debuggez le code Javascript et VB, creusez les alertes d’erreurs sur vos pages… Bref tout ce qu’il faut pour que les webmasters / analystes / développeurs travaillent au debuggage et à l’optimisation de votre projet web.
>> https://www.httpdebugger.com

Fiddler HTTP Debugger

Cet outil permet d’intercepter et de modifier à la volée les données échangées entre votre navigateur et un serveur. En réalité, il fait un peu plus que ca, mais ca ne nous intéressera pas ici. C’est une version un peu sous-dimensionnée de HTTP Debugger Pro mais il à l’avantage d’être gratuit et d’avoir une série de plugins qui peuvent rajouter des fonctionnalités intéressantes.
>> https://www.fiddlertool.com/fiddler

Il existe bien sur des centaines d’autres services (gratuits ou non) offrant des options similaires. Certains s’attaquent spécifiquement à l’optimisation de votre référencement (SEO), d’autres aux failles de sécurité etc… Ce n’est que mon humble liste mais n’hésitez pas à contribuer !

Greg

NB: les rapports générés par ces services sont des candidats idéaux pour alimenter votre « Tableau de bord » dans la série des KPI sur la santé de votre projet.

Catégories
Productivité

Le meilleur de Google Maps

Ces deux dernières semaines j’ai un peu relâché la cadence de publication du site. Je travaille sur 2 projets perso en plus de mon « vrai » travail et mes nuits commencent à se faire courtes. Sans compter la lecture du très bon « Don’t Make Me Think » de Steve Krug. Bref, tout ca pour dire que si je ne publie rien, j’accumule de quoi faire 2 bonnes études de cas qui j’espère vous parleront.

Tout ca pour revenir à google maps. L’un de mes projets vise à refondre un site de réservation en ligne pour des hôtels parisiens 3 et 4 étoiles. L’un des facteurs différenciateurs pour les visiteurs cherchant ce type de prestation peut être au niveau de la localisation de l’hôtel. Lorsque l’on rentre dans le domaine du luxe / haut de gamme, le prix reste un critère important mais le premier plan est occupé par la qualité de la prestation. De belles photos et un texte accrocheur sont définitivement des incontournables, mais à l’heure du 2.0, on va chercher le petit plus d’interactivité qui fait que, sans être intrusif pour ceux qui n’en veulent pas, on va proposer des fonctionnalités complémentaires à ceux qui les recherchent. Un exemple assez évident dans ce cas sera le fameux Google Maps.

Vous auriez une carte ?

J’imagine que tout ceux qui viennent sur ce site on déjà utilisé ce service pour trouver un itinéraire, pour voir leur immeuble vu du ciel ou pour aller voir à quoi ressemble cette plage du bout du monde qu’ils s’apprêtent à payer une fortune pour une semaine… et bien c’est là tout l’intérêt, mettre en avant ce bout d’interactivité qui a peu d’effet collatéraux (temps de chargement, à la limite).

Même sans routes, on peut personnaliser !
(Source: Google Maps, quelquepart aux Maldives)

Une fois convaincu par l’idée d’intégrer une carte dans l’un de vos projets, on va mettre notre valeur ajoutée de marketeux au service de nos utilisateurs en essayant de tirer le meilleur des fonctionnalités de google maps… Et c’est là que les ennuis commencent:

  • Comment trouver les coordonnées d’un point à ajouter dans une carte ?
  • Comment ajouter des marqueurs personnalisés ?
  • Comment modifier les options d’affichage ?
  • Comment intégrer le code dans mon site ?

Pour toutes ces questions et bien plus, Pascal Martin nous fait faire un tour très pédagogique de ce que google maps peut faire pour vous. J’ai évidemment trouvé ses articles une fois que j’avais déjà fini l’intégration dans mon projet mais il est clair que j’aurai gagné de bonnes heures si je les avait trouvé plus tôt. Bref, un lien incontournable à mettre dans vos favoris et à ressortir la prochaine fois que l’idée vous passe par la tête.
Vous pouvez aussi éventuellement jeter un coup d’œil au blog de l’équipe de Google maps qui présente jour après jour les nouvelles fonctionnalités de leur outil.

Vous voulez tout tout de suite ?

Pour ceux qui préfèrent utiliser les solutions toutes faites, il existe aussi des « map makers » qui permettent de faire en quelques clics une carte propre avec quelques fonctionnalités. A ce jour, aucun ne m’a donné le niveau de personnalisation dont j’avais besoin pour mon client. Voilà ceux que j’ai pu tester, par ordre de préférence:

  1. MapMaker
  2. Map Generator
  3. Icon Image Sets

A noter que Google va fermer Google Map Maker qui permettait d’editer les cartes utilisées par le service Google Maps. .

Si vous n’arrivez toujours pas à faire ce que vous recherchez, il existe encore une dernière solution. Imparable: Le tapis de jardin Google Maps !

La solution imparable pour personnaliser Google Maps
(source: Robert Sollis | On peut d'ailleurs vérifier si ça marche ici)

Si vous avez des exemples, des réalisations ou des outils à partager, ça se passe en dessous. Sinon bonnes cartes !
Greg

Catégories
Gestion de la qualité

Le triangle de la qualité vous aide à gerer vos contraintes

Dans différentes phases de la gestion de projets, il est fréquemment question de redéfinir les paramètres pour mieux s’adapter à des contraintes qui évoluent. L’un des points cruciaux ici est qu’il est question de qualité: comment prévoir l’impact de telle ou telle variable sur la qualité des livrables ?

Visualiser les contraintes

L’image typique utilisée pour représenter la gestion des contraintes est le triangle de la qualité. La forme géométrique bien connue sert à montrer que chaque sommet (périmètre, coût et temps) est à égale distance des deux autres (équilatéral pour ceux qui ont quelques souvenirs).

Les sommets du triangle representent les contraintes de votre projet

On voit bien que si l’on change l’un des paramètres, cela a un impact sur l’ensemble du projet. On peut faire rapide et pas cher, mais en conservant le même scope on va altérer la qualité des livrables. Inversement, on peut faire plus long à périmètre égal -c’est rare- mais cela aura un impact sur le coût. Il faut voir ces sommets comme des curseurs, chacun sur leur axe de valeur. A qualité constante, il faut que les 3 curseurs évoluent dans la même direction (éloignement ou rapprochement du centre)…

Le triangle de la qualité vous aide à gerer vos contraintes -

Qualité de la communication de projet

Il va de soit que cette représentation n’est pas ce qui va vous permettre de piloter, chiffres à l’appui, votre projet. Pour autant, le concept a le mérite d’être assez clair pour le mettre à profit dans le cadre de vos communications à destination du comité de pilotage, de vos clients ou des membres de votre équipe. Un classique pour vos collections de slides powerpoint !

Greg

Catégories
Livres Blanc

Livre Blanc: L’impact des campagnes emarketing

Une campagne marketing sert un objectif de reconnaissance de la marque, d’exposition d’un produit ou encore de simple moyen promotionel pour augmenter les ventes. Autant on saura mesurer une hausse de chiffre d’affaire, autant il devient plus délicat de mesurer les retombées d’une campagne « non-transactionelle » où l’on cherche à vendre de l’image, de l’attachement à la marque.

Chaque industrie, chaque site et surtout chaque directeur internet ira de sa propre analyse quant à savoir si une campagne a été performante ou non. Un moyen relativement humble et pertinent reste la comparaison par rapport à l’industrie. Curiosité du calendrier, 4 mois apres le lancement d’une fonctionalité de comparaison chez Google analytics, Xiti nous propose de se poser 2 minutes pour jeter un coup d’oeil aux indices de performance (KPI) qui ont encore un sens puisqu’ils sont comparables de sites en sites.

Campagnes marketing on line : à l’origine de près d’un cinquième du trafic en moyenne pour un site investissant sur ces supports dont deux tiers proviennent des liens sponsorisés, 1ère source de visites des investissements marketing on line.

Quelques lieux communs, mais dans l’ensemble, c’est une bonne lecture : accedez à l’étude complète

Greg

Catégories
Ressources

Outils: Services web gratuits (graphisme, partage et validateurs) sans Google ni Flickr !

Après mon premier post sur les meilleurs logiciels pour faire des captures d’écran, voilà pour une première série d’applications 100% online. On retiendra qu’il y des centaines de services autres que google qui offrent souvent pas mal de fonctionnalités intéressantes. Un peu de contrepoids ne peut pas faire de mal !

Outils de graphisme en ligne

Ça parait le plus compliquer à faire, on se dit que c’est complexe, que photoshop-prend-2Go-sur-mon-disque-dur alors comment en faire une application en ligne… Et bien si. Bon dans le cas de photoshop, c’est pas encore « le vrai » mais on verra où on en sera dans 2 ans !

Standard Web

Des outils en ligne pour améliorer votre contenu en ligne. Ça pourrait vite tourner au sarcasme capitalistique mais il y a du très bon là dedans:

Moteurs de recherche d’images / Banques d’images

Partage en ligne

Savoir écrire

Connaître son sujet, c’est important. Savoir en parler en articulant ses idées, ça aide beaucoup. Le faire en dans un bon français, c’est la moindre des choses.

Et vous, quels outils en ligne utilisez vous ?

Greg