jeudi 13 juin 2013

Google Web Designer

Google Web Designer : un outil gratuit de création graphique HTML5

Un outil de développement HTML5 pour la création graphique est en préparation chez Google. Il pourrait faire figure d'alternative à la suite Edge d'Adobe.
Google planche sur un environnement de développement HTML5 à destination des créatifs. Baptisé Google Web Designer, il pourrait être disponible gratuitement, et ce d'ici la fin de l'année.
L'outil sera notamment conçu pour créer des sites et applications web... mais sera aussi adapté à la réalisation de formats publicitaires. Ce qui n'est pas une surprise de la part de Google. L'information a d'ailleurs été publiée sur le blog de la régie DoubleClick, acquise par Google en 2007, qui prévoit d'intégrer Google Web Designer à sa suite DoubleClick Studio.
Google Web Designer pourrait-il venir concurrencer des solutions comme Adobe Edge et autres Squarespace ? Il faudra d'abord attendre la sortie du produit pour l'affirmer. Mais si Google parvient à hisser son outil à un certain niveau de qualité, sa gratuité pourrait bel et bien apporter un argument de poids face aux produits existants.

dimanche 9 juin 2013

Le règne du mobile engendre la fin du design


Ergonomie et graphisme n'ont plus le vent en poupe. Les nouveaux formats mobile imposent des règles de navigation plus strictes et avec une bande passante souvent trop faible, difficile d'avoir un site web très enrichi !

L'explosion du surf mobile entraine les créateurs de sites Internet à optimiser  leur site vers de nouveaux formats plus légers et compatibles au web d'aujourd'hui.Une technologie comme Flash va donc s'éteindre en emmenant avec les anciennes mises en pages et  autres graphismes obsolètes aujourd'hui.Certains ont franchis le pas en proposant des solutions alternatives pour voir un site autant sur mobile que sur tablette ou écran normal.
Avec le responsive design, les pages sont plus légères et se chargent mieux mais le graphisme perd alors toute sa légitimité. 
Pour certaines agences, cela s’avère hélas bien souvent assez difficile de proposer ce type de format car les sites mis en places n'ont pas forcément anticipé ce type de format et des affichages aléatoires apparaissent sur tablettes par exemple. Pour ceux qui franchissent le pas du mobile, il peut être judicieux de voir si il faut impérativement rendre son site compatible sur mobile ou simplement concentrer l'information essentielle sur une mini-page qui sera parcourue en moins de 15 secondes.

Beaucoup de progrès sont donc à faire dans ce domaine encore naissant depuis deux ans afin que l'internet mobile de demain soit d'autant plus riche et accessible pour le plus grand nombre d'entre nous.  Il suffira alors de passer dans la rue afin d’être la cible d'un annonceur qui nous proposera une remise exceptionnelle qui s'affichera avec un graphisme approprié sur notre téléphone pendant une durée de temps limité et un prix variable selon que s'approche ou on s'éloigne de la cible.

Les noms de domaine génériques sont libres d'utilisation

Les noms de domaine génériques sont libres d'utilisation

En droit des marques, le choix d'un signe à protéger est guidé par l'exigence de distinctivité, posée par le Code de la propriété intellectuelle : une marque n'est valable que si le terme ou l'expression qui la compose est apte à distinguer les produits et services qui en sont revêtus des produits et services des concurrents.

A rebours, le choix d'un nom de domaine sera généralement porté sur le signe le plus générique possible, dans un objectif de référencement sur internet. Afin d'attirer les internautes, le déposant va tenter d'exploiter un nom de domaine qui se rapproche le plus possible des termes d'une requête sur un moteur de recherche.
Ceci rend d'autant plus difficile le choix d'un signe de ralliement de la clientèle : si l'on parvient à réserver un nom de domaine générique, il existe un risque que la marque correspondante soit nulle. Et même dans ce cas, le nom de domaine ne sera pas protégeable, comme vient de le rappeler la Cour d'appel de Bastia dans un arrêt du 20 mars 2013. 

Cette affaire concernait le nom de domaine "mariagesencorse.com",exploité par des professionnels de l'organisation de mariages… en Corse. Un litige opposait les titulaires de ce nom de domaine à un tiers qui avait, pour sa part, déposé le nom de domaine "mariageencorse.com". Les deux signes différaient donc par la seule présence d'un "s" au mot "mariage"

Les titulaires du premier nom de domaine avaient engagé une action fondée sur un grief de concurrence déloyale, en invoquant un risque de confusion entre les noms de domaine. En première instance, le Tribunal de commerce d'Ajaccio avait considéré que, par le dépôt du nom de domaine "mariageencorse.com", les défendeurs avaient "usurpé" le nom de domaine "mariagesencorse.com" et commis des actes de concurrence déloyale et de parasitisme. 

En appel, la Cour de Bastia a opté pour une solution radicalement opposée. Selon les juges, "en vertu du principe de la libre concurrence, seul le titulaire d’un nom de domaine distinctif peut en rechercher la protection sur le fondement de l’article 1382 du code civil au titre de la concurrence déloyale, l’enregistrement d’un nom de domaine auprès d’une autorité de nommage ne lui conférant aucun droit privatif ni le bénéfice d’aucun statut juridique propre."

La Cour a donc retenu un raisonnement tiré du droit des marques pour considérer qu'un nom de domaine générique ne pouvait pas faire l'objet d'une protection au titre de la concurrence déloyale. En l'espèce, l'expression "mariageencorse"est trop générique pour bénéficier d'une quelconque protection.

La solution n'est pas nouvelle : plusieurs décisions se sont déjà prononcées en ce sens. Par exemple, la Cour d'appel de Paris a jugé le 5 mai 2010 que le terme "coursier", exploité au sein d'un nom de domaine dans le cadre d'un site proposant des services de coursier, ne pouvait pas faire l'objet d'une protection contre le dépôt du même nom de domaine dans une autre extension.

De même, les termes et expressions "hotel", "argus", "illico", hoteldecharme", "solistesfrancais", "boistropicaux" et "chambre-et-literie" ont été jugés trop descriptifs de l'activité désignée pour permettre à leur titulaire de s'opposer à leur usage en tant que noms de domaine au sein d'autres extensions.
Dans l'affaire corse, la Cour d'appel de Bastia est allée assez loin dans son raisonnement, en retenant que "les intimés ne peuvent valablement se prévaloir de la protection du nom de leur domaine, s’agissant d’un nom de domaine générique et descriptif de l’activité de la société", même en présence d'un risque de confusion entre les noms de domaine. Le risque de confusion est pourtant l'un des critères de l'action en concurrence déloyale.
En d'autres termes, les noms de domaine génériques appartiennent à tous et peuvent être utilisés par tous. Cette solution est, dans une certaine mesure, logique : elle rejoint la dernière jurisprudence en matière de mots-clés sur Internet. L'idée retenue désormais majoritairement par les juges est la suivante : sur internet, la course au référencement est libre.

S'il est dorénavant possible de réserver des signes distinctifs appartenant à des tiers en tant que mots-clés, pourquoi devrait-on protéger les noms de domaine non distinctifs ?
En somme, seul celui qui fera preuve de créativité et optera pour un signe suffisamment apte à le distinguer de ses concurrents mérite une protection, tant sur le plan de la contrefaçon que de la concurrence déloyale. Il faudrait donc apparemment choisir entre visibilité sur internet et protection par la propriété intellectuelle. Heureusement, les deux ne sont pas inconciliables… 

samedi 25 mai 2013

Penguin 2.0


Google Penguin 2.0 : un impact diversement ressenti en France

Si certains sites ont pu être sévèrement sanctionnés, d'autres pratiquant ostensiblement le Black Hat SEO ont pu bénéficier de la dernière mise à jour du filtre antispam. Réactions et analyses, à chaud, de plusieurs référenceurs.
Ces dernières semaines, Google avait répété que le prochain déploiement de son filtre antispam Penguin allait avoir plus d'impact que les précédents. De quoi faire peur aux SEO et webmasters qui gardaient en mémoire le séisme assez violent causé par le premier déploiement de Penguin, en avril 2012. Ce jeudi 23 mai, le moteur a déployé cette nouvelle version majeure du filtre, pour l'occasion baptisée Penguin 2.0, même s'il s'agit en fait du 4e déploiement.
Premières impressions, à chaud : "C'est moins violent que le premier Penguin de l'an dernier", estime Cédric Messoumian, qui gère Ranks.fr, un outil justement spécialisé dans le suivi des positions des sites Web sur les pages de résultats.
Ce n'est pas le seul à partager cette impression. Sur la cinquantaine de sites Web qu'elle a pu analyser à J+1, la SEO Marie Pourreyron, explique que, contrairement au premier déploiement de Penguin en 2012, presque aucun ne semble avoir été sérieusement impacté par ce nouveau filtre. "Or, dans ces moments-là, à défaut de les voir monter, ne pas voir ses sites descendre en flèche devient finalement une bonne nouvelle !", commente-t-elle.
Les récentes suroptimisations des liens et ancres dans le viseur ?
Pourtant, suite à l'arrivée de ce Penguin 2.0 ce jeudi 23 mai, le "serpomètre" de Ranks.fr, qui mesure la turbulence des pages de résultats de Google, a enregistré un impact rarement atteint, de force 8, sur 10. Certains sites ont donc pu ressentir une secousse violente. Le référenceur Sylvain Richard, de l'agence AxeNet, a ainsi pu observer des pages chuter dans les résultats générés par certaines requêtes concurrentielles : "Des pages internes ont pu dégringoler de dizaines de positions alors que des pages d'accueil n'ont pas chuté de plus que quelques positions", a-t-il pu remarquer.
google penguin (2)
Google a déployé son filtre Penguin pour la première fois le 24 avril 2012.© Google + julien tromeur - fotolia
Comment ce spécialiste explique-t-il ce phénomène ? "C'est encore un peu tôt pour tirer des conclusions définitives, mais j'ai l'impression que des ancres trop optimisées, obtenues lors d'un travail de netlinking effectué ces six ou douze derniers mois, ont pu déclencher la pénalité de Google Penguin cette fois-ci." Que veut-il dire par "trop optimisé" précisément ? Des sites qui ont bénéficié ces derniers mois d'une trentaine de backlinks par mois, soit à peine un par jour, se sont fait pénaliser. Quant au profil de netlinking, ce spécialiste estime que les backlinks pointant vers certains des sites sanctionnés avaient à peine plus de 15% de leurs ancres optimisées.
"D'ailleurs, dans les pénalités que j'ai pu observer, ce sont bien les pages internes, fortement sanctionnées, qui avaient fait l'objet d'un travail assez récent d'optimisation des ancres, alors que la page d'accueil avait été moins travaillée, et affichait un profil de netlinking indéniablement plus naturel", analyse ce spécialiste. Ce dernier précise que certains de ses confrères, également fortement impactés, lui ont fait part d'expériences et observations similaires.
Comment Penguin a pu changer le SEO et le netlinking
"Ce Penguin 2.0 a pu être dévastateur pour certains. Mais si le séisme a pu être ressenti avec un peu moins de violence cette fois-ci, c'est peut-être parce que les SEO et webmasters ont été moins surpris que lors du premier déploiement du filtre", analyse le référenceur Aurélien Delefosse.
"Google Penguin a fait évoluer les pratiques SEO"
Arrivé il est vrai sans prévenir en avril 2012, le premier déploiement de Google Penguinvoulait s'en prendre au Black Hat SEO et plus particulièrement aux sites vers lesquels pointaient des liens toxiques ou artificiels. "L'arrivée de ce filtre a aussi pu faire évoluer les pratiques en matière de netlinking. Dans les semaines qui ont suivi, certainsréférenceurs se sont mis à beaucoup hésiter avant de faire des liens. Peut-être que ce changement de mentalité a aussi pu leur permettre d'éviter d'être sanctionnés par ce dernier Penguin", poursuit Aurélien Delefosse.
Le Black Hat SEO récompensé ?
C'est étrange, mais après le déploiement, plusieurs professionnels du référencement rapportent avoir vu des sites clairement exposés à une sanction de Google Penguin ressurgir assez haut dans les résultats.  
C'est arrivé à Marie Pourreyron, qui admet avoir réalisé pour un site personnel quelques expérimentations de Black Hat SEO et générer de nombreux liens de manière ostensiblement artificielle – donc a fortiori l'exemple type de sites visés par Penguin. Cela n'a d'ailleurs pas raté. "Ce site était très bien positionné sur plusieurs requêtes rémunératrices, mais, l'année dernière, Penguin l'a fait plonger dans les abîmes des résultats de Google. Je l'ai totalement abandonné, mais il est revenu hier en deuxième page sur deux mots clés", s'étonne-telle. Sylvain Richard a aussi vécu exactement la même expérience, avec un site sévèrement, mais pertinemment pénalisé par Penguin l'année dernière, puis abandonné. Ce Penguin 2.0 l'a aussi fait réapparaître dans la deuxième page. Le moteur de Google a donc encore du travail s'il souhaite éliminer le spam de ces pages de résultats.

samedi 18 mai 2013

Suite 2 responsive



RESPONSIVE WEB DESIGN : LES CLÉS POUR BIEN COMMENCERAutre exemple de responsive design

Regardons un autre exemple, 2011.dconstruct.org. Quand la zone de visualisation est large (disons supérieure à 1 350 pixels), l'allure du site est la même que celle de la capture d'écran ci-après.
zone de visualisation supérieure à 1 350 pixels.
Zone de visualisation supérieure à 1 350 pixels.© Pearson
Regardez en particulier la grille avec les neuf images. Avez-vous remarqué ce qui se passe quand vous réduisez de plus en plus la largeur de la zone de visualisation (à environ moins de 960 pixels) ? La grille de trois rangées d'images sur trois devient trois rangées de deux images et une rangée de trois, en bas, comme on le voit sur la capture d'écran suivante.
zone de  visualisation à environ moins de 960 pixels.
Zone de  visualisation à environ moins de 960 pixels.© Pearson
En diminuant encore davantage la largeur de la zone de visualisation, à environ moins de 720 pixels, un autre "point de rupture" intervient sur le design : les liens de l'en-tête se transforment en icônes, plus faciles à manipuler dans le cas d'une navigation tactile.
zone de visualisation, à environ moins de 720 pixels.
Zone de visualisation, à environ moins de 720 pixels.© Pearson


















Réduisons encore la zone de visualisation à une largeur inférieure à 480 pixels : la grille des images est à nouveau modifiée, on peut voir une rangée de deux images, puis trois et enfin quatre. Ces images continuent à se redimensionner tandis que la zone de visualisation est rétrécie à environ 300 pixels. La capture d'écran ci-après illustre cet exemple dans un iPhone.
zone de visualisation à environ 300 pixels
Zone de visualisation à environ 300 pixels© Pearson

Sources d'inspiration en ligne
Voici une destination fort utile pour donner de l'inspiration : http://mediaqueri.es. Les sites représentés ici n'ont pas tous adopté une méthodologie responsivecomplète consistant à privilégier l'affichage des contenus pour les petites zones de visualisation, puis à améliorer progressivement le design pour les zones de visualisation plus larges. 
Quoi qu'il en soit, cette étape permet d'entrevoir les possibilités de ce qu'un design réactif peut offrir. Il existe d'excellents exemples pour trouver des idées. Visualiser ces sites en redimensionnant la zone de visualisation illustre bien l'intérêt d'un design réactif, mais ne montre en rien les points forts de HTML5. Ses avantages se passent "en coulisse", nous allons donc y porter notre attention et voir en quoi HTML5 est formidable.

Suite responsive



RESPONSIVE WEB DESIGN : LES CLÉS POUR BIEN COMMENCERComment apprécier le meilleur du responsive web design

Nous sommes à présent armés pour apprécier le meilleur du responsive web design. Lancez votre navigateur préféré, dégainez votre outil pour les tailles d'écran et visitez thinkvitamin.com.
Si vous ouvrez la page dans une zone de visualisation plus large que 1060 pixels, vous obtiendrez ce qui est montré sur la capture d'écran suivante.   
page d'accueil de thinkvitamin.com.
Page d'accueil de thinkvitamin.com.© Pearson
Si vous consultez le site avec une zone de visualisation plus large que 930 pixels mais inférieure à 1060 pixels, vous verrez ce que montre la capture d'écran suivante.
la même page dans une zone de visualisation plus large que 930 pixels, mais
La même page dans une zone de visualisation plus large que 930 pixels, mais inférieure à 1060 pixels.© Pearson
Avez-vous remarqué le changement intervenu sur la navigation principale à côté du logo ? Les icônes sur la droite du contenu principal se trouvent l'une au-dessus de l'autre. Tout est parfaitement utilisable et, mieux, rien ne disparaît de l'écran. Regardez à présent dans une zone de visualisation inférieure à 880 pixels, comme ceci.
zone de visualisation inférieure à 880 pixels
Zone de visualisation inférieure à 880 pixels© Pearson

L'en-tête est le même, mais notez que la barre latérale de droite est encore plus étroite : les icônes sont placées deux par deux pendant que les blocs de texte se sont ajustés et que le texte s'est replacé en conséquence dans le bloc.
Si, toutefois, vous réduisez la zone de visualisation à une largeur inférieure à 600 pixels, vous constaterez un changement majeur comme l'illustre la capture d'écran suivante.
zone de visualisation à une largeur inférieure à 600 pixels.
Zone de visualisation à une largeur inférieure à 600 pixels.© Pearson
Alors ? La barre latérale a réagi à la nouvelle zone de visualisation, laissant au contenu, la partie la plus importante, toute la largeur de la fenêtre du navigateur. Notez également que les liens de l'en-tête sont placés horizontalement et non plus à côté du logo et que le logo lui-même s'est redimensionné. Ce sont tous ces changements fondés sur les dimensions de la zone de visualisation qui contribuent à fournir une meilleure expérience utilisateur.

RESPONSIVE WEB DESIGN : LES CLÉS POUR BIEN COMMENCER


RESPONSIVE WEB DESIGN : LES CLÉS POUR BIEN COMMENCERSe procurer les outils pour tester les zones de visualisation

Exemples de responsive web design
Il faudrait configurer plusieurs machines afin de tester vos sites réactifs et ceux des autres pour tous les appareils et tous les écrans. Bien que rien ne remplace la réalité, la plupart des tests peuvent s'effectuer en redimensionnant simplement la fenêtre du navigateur. Pour aller plus loin, il existe un grand nombre de plugins tiers, d'extensions de navigateurs qui affichent la taille de la fenêtre ou de la zone de visualisation en pixels, ou bien passent automatiquement la fenêtre ou la zone de visualisation courante à une taille d'écran par défaut (1024 x 768 pixels, par exemple). Ceci permet de tester plus facilement ce qui se passe lorsque la taille de la zone de visualisation change.
selon le navigateurs, plusieurs outils existent pour tester le responsive
Selon le navigateurs, plusieurs outils existent pour tester le responsive design.© hakaner - Fotolia
Attaché aux pixels ? Oubliez-les !
Ne vous attachez pas trop aux pixels en tant qu'unités de mesure, nous allons bien souvent les abandonner et passer à des unités de mesure relatives (par exemple les "em" et les pourcentages) lorsque nous nous attaquerons vraiment au design réactif. Ils fournissent, toutefois, un point de référence pratique pour examiner des designs réactifs et les voir se modifier.

Se procurer les outils pour tester les zones de visualisation
Les utilisateurs d'Internet Explorer doivent détenir la barre d'outils développeur de Microsoft Internet Explorer. Elle se télécharge ici
Avec Safari, mon outil préféré est Resize, sachant que ResizeMe est semblable et gratuit. 
Si vous utilisez Firefox, il existe Firesizer, et les utilisateurs de Chrome peuvent se procurer Windows Resizer.
Vous n'êtes pas amateur d'extensions ? Voici une autre solution : j'ai écrit une page HTML toute simple permettant d'afficher la hauteur et la largeur de la zone de visualisation de la fenêtre d'un navigateur. En utilisant une petite partie de jQuery, une bibliothèque JavaScript, cette page récupère la taille de la zone de visualisation en hauteur et en largeur, puis l'affiche. Vous pouvez garder cette page ouverte dans un autre onglet du navigateur, redimensionner la fenêtre, puis revenir au site en question pour voir ce qui se passe. Vous la trouverez à cette URL.

RESPONSIVE WEB DESIGN : LES CLÉS POUR BIEN COMMENCERZone de visualisation ou taille d'écrans ?

Il est important de comprendre que zone de visualisation et taille d'écran ne sont pas la même chose. La zone de visualisation correspond à la zone de contenu qui se trouve dans la fenêtre du navigateur, sans les barres d'outils, les onglets, etc. Plus simplement, elle correspond à la zone dans laquelle un site web s'affiche. La taille d'écran se réfère à la zone physique de l'appareil. 
Attention, certains outils de redimensionnement affichent la taille, y compris les éléments d'interface du navigateur, comme la barre d'adresse, les onglets et les champs de recherche, et d'autres ne le font pas. Sur la capture d'écran suivante, la taille de la zone de visualisation s'affiche en haut à droite (1156 x 921 px) pendant que le plugin Firesizer affiche la taille de la fenêtre en bas à droite (1171 x 1023).

page d'accueil du new york times.