Internet

Ma sélection d’extensions WordPress

Ma sélection d’extensions WordPress

WordPress est un formidable CMS.

Au delà du blogging, de nombreuses extensions permettent d’étendre les fonctionnalités de base. Tout est possible en terme de fonctionnalités.

Voici ma sélection personnelle d’extensions WordPress utiles. Ces plugins sont testés et approuvés par moi même, garantis de bon affichage sur tous les types d’écrans.

À noter : de nombreux plugins ne sont pas traduits. Retrousse tes manches et utilise le logiciel Poedit.

À noter 2 : comme on dit chez les alcooliques, ayez soif de modération. Moins de plugins = meilleure performance.

Dernière mise à jour Juin 2018.

 


La base

Contact Form 7
Créer et gérer des formulaires, gratuit
https://fr.wordpress.org/plugins/contact-form-7/

Disable Comments
Désactiver les commentaires, gratuit
https://fr.wordpress.org/plugins/disable-comments/

Easy Updates Manager
Mettre à jour WordPress, le thème et les extensions automatiquement, gratuit
https://fr.wordpress.org/plugins/stops-core-theme-and-plugin-updates/

Page Builder par SiteOrigin
Mise en page avancée des contenus, gratuit
https://fr.wordpress.org/plugins/siteorigin-panels/

LoginPress
Personnalisation de la page de login administrateur, gratuit
https://fr.wordpress.org/plugins/loginpress/

Cookie Notice
Afficher le message d’avertissement relatif aux cookies, gratuit
https://fr.wordpress.org/plugins/cookie-notice/

WP Super Cache
Créer un cache pour accélérer le site
https://fr.wordpress.org/plugins/wp-super-cache/

Comet cache
Une autre plugin de cache gratuit
https://wordpress.org/plugins/comet-cache/

WP optimise
Optimiser la base de données
https://wordpress.org/plugins/wp-optimize/

Organize serie
Organiser vos articles en séries pour faire des dossiers thématiques
http://wordpress.org/extend/plugins/organize-series/

Unite gallery
9 types de galeries d’images
https://wordpress.org/plugins/unite-gallery-lite/

Flow paper
Affiche les pdf sous forme de livres interactifs, avec le fameux effet de pages qui tournent
https://wordpress.org/plugins/flowpaper-lite-pdf-flipbook/

Feed Them Social
Intégrer un contenu social (exemple Derniers messages de fanpage Facebook), gratuit
https://fr.wordpress.org/plugins/feed-them-social/

Nmedia mailchimp
Intégrer Mailchimp au mieux, gratuit
http://wordpress.org/extend/plugins/nmedia-mailchimp-widget/

 


Multilingue

WPML
Gérer le multilingue, payant
https://wpml.org/fr/

Polylang
Gérer le multilingue, mais moins bien, gratuit
https://fr.wordpress.org/plugins/polylang/

 


Référencement et Analytics

Yoast SEO
Optimiser le référencement, faire un sitemap XML, gratuit
https://fr.wordpress.org/plugins/wordpress-seo/

Google Analytics Dashboard for WP
Intégrer le code Google Analytics, afficher un résumer dans le tableau de bord d’administration. Gratuit
https://fr.wordpress.org/plugins/google-analytics-dashboard-for-wp/

 


Sécurité

All In One WP Security & Firewall
Complet, gratuit et efficace
https://wordpress.org/plugins/all-in-one-wp-security-and-firewall/

Wordfence Security
Anti-brute force, anti-malware, firewall. Bonne version gratuite
https://fr.wordpress.org/plugins/wordfence/

Block Bad Queries
Firewall, gratuit
https://fr.wordpress.org/plugins/block-bad-queries/

Secupress
Suite complète de sécurité, excellente en version payante
https://fr.wordpress.org/plugins/secupress/

 


Quelques extensions qui changent tout

WooCommerce
Boutique en ligne, gratuit
https://fr.wordpress.org/plugins/woocommerce/

CoursePress
Module de elearning type mook, gratuit pour une formation, payant pour multiformations et meilleures possibilité de paiement
https://fr.wordpress.org/plugins/coursepress/

BuddyPress
Module communautaire, avec login et page de profil utilisateur en front office, message entre les membres, mur,  etc… Gratuit
https://fr.wordpress.org/plugins/buddypress/
À compléter avec BuddyPress Activity Plus pour améliorer le look des fils d’actualité, BuddyPress Activity ShortCode pour afficher les fils d’activités sur n’importe quelle page, Rendez Vous, pour avoir l’équivalent des événements de Facebook et User Menus pour personnaliser les intitulés de menu.

Booking Calendar WP Plugin
Gérer les réservations d’une ou de plusieurs salles, avec définition possible de créneaux horaires, d’un prix d’accès, d’un nombre de places maximum… Gratuit
https://fr.wordpress.org/plugins/booking-calendar/

WP Job Manager
https://fr.wordpress.org/plugins/wp-job-manager/
Permet la création d’une rubrique d’offres d’emploi. Gratuit

Draw attention
Pour faires des zones cliquables sur une image
https://wordpress.org/plugins/draw-attention/

 


Hébergement

WP Serveur
Un excellent hébergeur français spécialisé WordPress avec une bonne infrastructure : création de clônes, rollback facile, sécurité améliorée, service client au top. À noter que l’hébergeur fournit gratuitement le thème DIVI à ses clients, avec un page-builder hors du commun.
https://www.wpserveur.net/

 

Publié par Fred dans Internet, Référence, 0 commentaire

Les jeux en .io

J’avoue pas bien comprendre la folie des noms de domaine en .io, extension ultra populaire dans le high-tech depuis 2013, malgré les explications. Originalement c’est l’extension du  Territoire britannique de l’océan Indien.

Depuis 2015, elle est synonyme de jeux multi-joueurs. Parfois simplistes, souvent très prenants.

Tous ces jeux se concentrent sur l’utilisateur, sa progression dans un univers compétitif et inévitablement sa mort. Le minimalisme du gameplay ne déconcentre pas le joueur de l’enjeu de sa survie.

Sélection de browser-games multijoueurs

Slither.io

Un des premiers, et mon préféré. Le jeu du serpent dans toute sa simplicité. Il a beaucoup plu sur le net aussi, avec notamment ce guide tactique sur Medium et les Streams de Martin Shkreli en train d’y jouer (il dit que « ce jeu est une parfaite allégorie du fonctionnement des marchés ». Les petits étant agiles et rapides, les gros lents mais puissants, et quand quelqu’un meurt les autres joueurs se disputent les miettes).

Deeeep.io

Un peu la même chose mais avec des poissons.

Paper-io.com

Jeu de conquête de territoire

Blastarena.io

Par les gens de Skyarena, un Bomberman-like en 3D.

Krew.io

Jeu de pingouins pirates en 3D.

Blockergame.com

Un RPG trèèèès minimaliste, avec des autres joueurs mais aussi des monstres et des quêtes. Rigolo même si son nom n’est pas en .io.

Gameofbombs.com

Un bomberman massivement multijoueur assez fou.

Drawthis.io

L’intru de la liste, c’est un jeu de dessin, ici on ne mange pas les autres.

Publié par Fred dans Gaming, Internet, 1 commentaire
The Random User

The Random User

Une souris mac vintage qui navigue sur le net au hasard, sans contrôle. Un utilisateur très spécial qui sort des personas, peut sensible aux call to action, à la qualité du contenu… Une expérimentation sur l’identité sur internet à l’époque de Google Analytics.

Un projet de l’agence Monobo.

Publié par Fred dans .gif, Internet, Wtf, 0 commentaire

3 outils gratuits par Stéphane Lyver

Stéphane Lyver est un développeur français au grand cœur. Il a mis en ligne 3 outils bien pratiques pour le web-design.

Compressor.io

compressor

Compressor.io est un outil en ligne d’optimisation des images. Le gain de poids à qualité égale varie entre 30% et 60%.
Seul défaut : on ne peut passer qu’une image à la fois ce qui réduit son intérêt par rapport à d’autres sites similaires.

https://compressor.io/

DBFreebies.co

dbfreebies

DBFreebies collecte automatiquement tous les fichiers gratuits de Behance et Dribbble. Une petite mine d’or.

http://dbfreebies.co/

Q-Q-code.fr

qrcode

Q-r-code.fr est un générateur de QR Code personnalisable en français. Simple et efficace.

http://q-r-code.fr/

Publié par Fred dans Graphisme, Internet, 0 commentaire

Nom de domaine, explication simple

C’est un raccourci vers un serveur web

Un nom de domaine est un « masque » sur une adresse IP. Le but d’un nom de domaine est de retenir et communiquer facilement l’adresse d’un ensemble de serveurs (site web, courrier électronique, FTP…).

Par exemple, wikipedia.org est plus simple à mémoriser que 91.198.174.192.

Un domaine est un ensemble d’ordinateurs reliés à Internet et possédant une caractéristique commune.
Le domaine .fr est l’ensemble des ordinateurs en relation avec la France ;
le domaine paris.fr est l’ensemble des ordinateurs hébergeant des activités pour la ville de Paris.

Wikipedia

Un peu de technique

Nom de domaine - le trajet assymétrique client serveur serveur clientLorsque l’internaute demande une URL, une adresse à son navigateur (ou autre agent utilisateur) ou qu’il clique sur un lien, le navigateur envoie, via le modem, une requête.
Pour trouver le serveur à qui la requête est adressée, il interroge une machine ayant la liste des noms de domaines et l’adresse IP qui leur correspond. Comme le nom de domaine est indiqué dans l’adresse, il retrouve l’IP qui lui permet de se diriger vers le serveur concerné.
Il interroge le serveur. Celui-ci lui répond et lui envoie une copie de la page demandée. La page est rapatriée sur le poste client et le navigateur peut l’afficher.

Anatomie d’une adresse

Nom de domaine - Vocabulaire

Une adresse Internet se décompose en plusieurs éléments :

  • Le protocole ou préfixe est le moyen technique utilisé pour se connecter à l’adresse. Les protocoles les plus fréquents sont http, https et ftp
  • L’extension définit le type de site. Il peut symboliser un type d’activité (.com, .org, .asso, .gov, .mil, .edu…) ou une zone géographique (.fr, .be, .uk, .us…)
  • Le domaine est le nom propre du site
  • Les sous-domaines et dossiers sont des divisions pratiques du domaine

Les extensions

Les plus classiques sont .com, .net et .org. Chaque pays dispose aussi d’une extension propre.

Nom de domaine - les extensions par pays

Les extensions par pays

Récemment de nombreuses nouvelles extensions de nom de domaine sont apparues. Plus précises dans la description de l’activité du site, plus explicites pour le référencement, mais aussi souvent plus chères.
Quelques exemples : .paris, .art, .bio, .email, .bzh, .club, .consulting, .hotel, .restaurant, .actor, .immo, .music, .xxx…

Des entreprises peuvent débloquer une extension personnalisée.
Exemples : .AMAZON, .AOL, .APPLE, .AUDI, .AXA, .HERMES, .LECLERC, .LIDL, .MCDONALDS, .MICROSOFT, .SFR, .SNCF, .TOTAL, .TOYOTA, .YOUTUBE
Coup du dépot de dossier à l’Icann : 185 000 $

Réserver un nom de domaine

Un nom de domaine ne s’achète pas, il se loue à l’année.

En 1998 est créé L’ICANN, organisme non-lucratif basé chargé d’administrer les adresses IP, les noms de domaine de premier niveau et de coordonner les intervenants techniques.

Pour réserver un nom de domaine, on passe généralement par un opérateur agréé par l’ICANN , appelé « registar ».
Le Registar est chargé de la bonne tenue de la base de donnée des noms de domaines qui sont réservés par ses soins. De ces mises à jours dépend le fonctionnement des serveurs DNS.

Quelques registars français :

La location d’un nom de domaine coûte autour de 12 euros HT / an.

Un nom de domaine sert aussi de référence administrative.
Lors de l’enregistrement, il faut donner des références de contact (postales, téléphone, email). Ceci doit permettre de contacter le responsable du site.

On peut obtenir les informations relatives à un nom de domaine via une requête WHOIS (registar, adresse IP, dates
d’activité, contacts…).

Quand il arrive à expiration, le nom de domaine redevient libre à la location.
Généralement les registars préviennent leurs clients avant expiration pour qu’ils ne risquent pas de perdre leur nom de domaine par inadvertance.

Nom de domaine - braquageEn effet il est fréquent que des noms de domaine existants soient rachetés par des spéculateurs à la limite de la malhonnêteté dans le but de monnayer une revente à leur locataire initial.
On parle de « second marché » des noms de domaine.

La location d’un nom de domaine est indépendante de l’hébergement.
Ainsi un site peut avoir plusieurs noms de domaines.
Avoir plusieurs noms de domaine pour un site peut répondre à plusieurs objectifs :

  • Maximiser l’arrivée des internautes sur un site
    Exemple : liberation.fr liberation.com libe.fr libe.com
  • Protéger sa marque ou son idée
    Exemple : louisvuitton.com vuitton.com vuitton.org
  • Optimiser la visibilité par un référencement multiple
    Exemple : Cmonassurance.com Mutuelle.fr

Le choix du nom de domaine principal est stratégique.

Idéalement il faut qu’il soit à la fois simple, court, descriptif et en adéquation avec les termes saisis sur le sujet concerné dans les moteurs de recherches.

Nom de domaine - caracteres autorisés pour la réservation d'un .fr

Conseils généraux

  • Choisir de préférence l’extension .com si elle est libre.
  • L’extension .fr est aussi très forte sur le territoire national.
  • Éviter les ambiguïté : caractères spéciaux, accords grammaticaux difficiles, lettres consécutives… sont à éviter.
  • Ne pas concurrencer directement un domaine existant en prenant une autre extension.
  • Les noms de domaines peuvent donner lieu à des conflits juridiques, chaque partie revendiquant le droit d’auteur, la propriété intellectuelle ou industrielle du nom litigieux.
  • Vérifier le passif d’un nom de domaine pour s’assurer qu’il n’a pas mauvaise réputation sur http://www.archive.org
  • Ne pas réserver de noms de domaine multiple sans projet commercial ou industriel sérieux.
Nom de domaine - double-sens malheureux penisland.net

Attention aussi aux double-sens !

Éviter les principales arnaques au nom de domaine

  • Suite à la consultation d’un registar sur la disponibilité du nom de domaine, il est fréquent si la réservation n’est pas immédiate que le nom de domaine soit squatté par un « parking de nom de domaine ». Le squatteur espère que vous le contactiez pour vous le revendre cher. Il pense que vous n’aurez pas le choix et vous sentiez obligés de payer (nom brainstormé attrayant, identité visuelle déjà conçue…).
  • À l’approche de l’expiration de votre nom de domaine, une société inconnue vous contacte et vous propose de prolonger votre réservation à un prix plus cher que la normale.
    Vérifiez bien que le courrier émane bien de votre registar.
    Nom de domaine - arnaque
  • I cann haz domain name? LolcatAutre arnaque fréquente : la tentation de la gratuité.
    Vous pouvez trouver dans les noms de domaine dits « gratuits » lors de recherches sur des moteurs de recherche.
    Certains Registar proposent légitimement des offres hébergement + nom de domaine en « offrant » le nom de domaine.
    D’autres sites proposent sans hébergement noms de domaine gratuits. C’est à éviter absolument pour deux raisons : les noms proposés ont souvent des extensions n’inspirant pas confiance aux utilisateurs, deplus les prestataires en question peuvent cesser leur activité sans préavis ou en monnayant cher le maintient du service.

Liens

Quelques registars français
http://www.gandi.net/
http://www.ovh.com/fr/domaines/
http://www.amen.fr/domains

La revente de nom de domaine sur le second marché
http://fr.wikipedia.org/wiki/Second_march%C3%A9_des_noms_de_domaine

Les domaines génériques
http://www.journaldunet.com/ebusiness/le-net/nom-domaine-generique-fr/

Des affaires liées à un nom de domaine
http://www.01net.com/editorial/240067/un-arrangement-financier-clot-laffaire-sex-com/
http://www.journaldunet.com/ebusiness/expert/53124/zlatan-ibrahimovic–un-drole-de-chantage-au-nom-de-domaine.shtml
http://www.lefigaro.fr/politique/2011/10/18/01002-20111018ARTFIG00508-hollande-se-fait-chiper-son-nom-de-domaine-pour-2012.php

Étranges noms
http://3.141592653589793238462643383279502884197169399375105820974944592.com/
http://www.111111111111111111111111111111111111111111111111111111111111.com/

Publié par Fred dans Internet, Référence, 0 commentaire

Podcasts

Les podcasts sont une anomalie technique, un standard maudit qui passe sans raison aucune de la hype à la ringarditude et vice versa.
Sur le papier, c’est cool : un fil RSS de MP3 à picorer quand on en a envie. Dans la pratique, ça passe souvent par le logiciel iTunes.

iTunes n’est pas obligatoire pour les auditeurs mais il est incontournable pour les diffuseurs, car c’est le plus grand répertoire de podcast. Donc si vous n’avez jamais écouté de podcast, n’ayez pas peur, ca s’écoute sans douleur sur le site de chaque émission.

J’aime bien écouter les podcasts car certaines émissions très longues prennent le temps d’aller au bout d’un sujet (ou de leur connerie). Il y a un coté amateur très sympa.

radio caroline podcasts

Petite sélection personnelle de Podcasts

L’agence tous Geeks
Podcast de vieux geeks. Ça rigole un peu, mais en bons geeks ça se prend au sérieux

La grotte du barbu
Olivier Chambon est un maker français très passionné, capable de s’enthousiasmer en essayant une défonceuse comme de se pâmer en fabriquant une pokeball high tech.

L’apéro du captain
C’est un peu comme l’agence tous geeks mais en beaucoup plus drôle. Comme ça picole tout du long, les fins d’émission peuvent être épiques. Déconseillé aux moins de 18 ans, pour cause d’humour graveleux et de wassuf.

Les clairvoyants
Podcast très pointu sur l’univers marvel : films, séries et comics. Un épisode par super-héro.

Gamerside
Podcast sur l’actu du jeu vidéo. Très bons épisodes musicaux.

Arteradio
La radio d’arte. C’est presque plus du podcast, mais c’est un contenu audio uniquement disponible en ligne. Grande qualité.

NASA podcasts
Des news des étoiles

Paris DJs
Un peu de douceur musicale

 

Publié par Fred dans Gaming, Geek, Internet, Wtf, 0 commentaire

Capturer des pages web facilement

Le dispositif pour une capture d'écran en 1980.

Le dispositif pour une capture d’écran en 1980.

Il est indispensable de savoir capturer facilement une page de site Internet quand on fait du web-design.

Les outils de bases de Windows (Imp écr, ou Alt + Imp écr, ou l’application native Outil Capture d’écran), de Mac OS (⌘ + Shift + 3) et leurs équivalents sur smartphone ne sont pas ultra performants pour capturer une longue page web.

Si vous ne voulez pas que l’assemblage de portions de captures d’écran devienne une part trop importante de votre travail, je vous recommande de passer par des outils dédiés.

Capturer une longue page web sur toute sa hauteur

Pour capturer en un clic une page dans son intégralité, le meilleur moyen actuel est de s’aider d’une extension de navigateur.  La solution la plus confortable est Awesome Screenshot, disponibles pour les navigateurs Chrome et Safari.
Awesome Screenshot vous permet de prendre une capture d’une page dans son intégralité, de l’annoter, de la recadrer et la retoucher.

Pour les utilisateurs de Firefox, l’extension n’est malheureusement plus mise à jour sur ce navigateur. L’extension qui s’en approche le plus est Nimbus Screenshot.
Firefox inclut de toute façon un module de capture d’écran. C’est Firefox Screenshot le bien-nommé.

Capture vidéo de votre site

Il est aussi facile de faire des captures vidéo de votre écran.
Sur PC, je recommande VLC (Média > Convertir/Enregistrer > Périphérique de capture. Dans le menu « Mode de capture », sélectionner « Bureau »).
Sur Mac, utilisez l’application native Quicktime (Fichier > Nouvel enregistrement de l’écran).
Sur Android, le logiciel gratuit AZ Screen Recorder fait très bien le boulot.
Certains outils payants offrent plus de possibilité, mais je ne les utilisent pas personnellement, préférant retoucher ou recadrer les fichiers générées avec un logiciel de retouche vidéo.

À noter, pour tous smartphones ou tablettes, l’application AirServer permet d’afficher un miroir de votre appareil en HD, et de l’enregistrer.

Publié par Fred dans Graphisme, Internet, 0 commentaire

Qwant, une alternative viable à Google

J’aime beaucoup Google. J’utilise quotidiennement leurs services à titre personnel et professionnel. À bien y réfléchir, je me suis rendu compte que je ne pouvais pas contourner Google.

Google-dépendance

Notre société est en pleine Google-dépendance et d’une certaine manière elle aime ça. C’est le paradoxe de l’utilisateur Google : on ne veut pas être « fiché », mais on n’accepte plus de se faire servir du contenu pas pertinent.

Or :

  • Un site Internet marchand qui se fait dé-référencer par Google perd 80% de ses visites
  • 90% des sites sur la toile ayant un marqueur Google Analytics, toute navigation avec un navigateur ayant été connecté à mon compte Google va renseigner le moteur de recherche sur ma navigation.
  • Contrairement aux autre GAFA, Google est incontournable. Qu’on aime ou pas, on participe à l’amélioration du moteur de recherche. Et quand on est un acteur d’internet, on est quasiment obligé de rentrer dans leur jeu. Quelqu’un qui n’aime pas Apple peut acheter Samsung, on ne peut pas contourner si simplement Google.
  • Il ne fait aucun doute que certains produits Google participent passivement à l’amélioration du moteur de recherche via l’analyse de big data. Google Chrome est à ce titre l’équivalent moderne de la Google Toolbar.
  • Google est en passe de devenir la régie publicitaire la plus importante du monde, sans pour autant participer équitablement aux économies locales par le truchement de l’optimisation fiscale.

googleevil

Bref j’adore Google, je ne veux pas diaboliser l’entreprise et céder à la paranoïa complotiste mais je voulais tester une alternative sur sa fonctionnalité principale : le moteur de recherche.

En 2013, une équipe française lance Qwant

Le moteur de recherche Qwant a pour ambition de ne pas tracer ses utilisateurs, de respecter la vie privée et d’afficher les résultats de manière neutre.

Les premières années, le résultat n’était pas ultra probant. L’algorithme de recherche n’étant pas très performant et l’ergonomie pas révolutionnaire.

Cela c’est toutefois grandement amélioré avec le temps et une grosse refonte en 2015. Le moteur dans sa version actuelle est tout à fait convaincant.

Certains désaxés osent même taper "Google" dans Qwant

Certains désaxés osent même taper « Google » dans Qwant

Qwant affiche maintenant une synthèse pour chaque recherche : Amorce de définition Wikipedia, images, résultats de recherche sur le web, dans les sites d’actualités et dans les réseaux sociaux. C’est une très bonne synthèse.

J’utilise Qwant quotidiennement depuis plus de 3 mois. Seule la recherche par images est réellement un cran en dessous de Google. On peut noter aussi l’absence de cartographie dans les résultats. En dehors de cela c’est du très bon boulot.

Autre bémol : l’utilisation sur mobile. Je me suis aperçu qu’on ne pouvait pas changer le moteur par défaut de Safari dans iOs. Deux solutions : installer firefox ou installer la page Qwant comme application. Dans les deux cas, on sort des applications par défaut d’iOs, ce qui n’est pas sans inconvénient. Un lien reçu pas email ou sms s’ouvrira dans le navigateur natif. Il parait que Google aurait payé Apple une somme astronomique pour cet avantage.

Pour plus d’infos n’hésitez pas à suivre leur compte Twitter.

[Edit] La contreverse Bing – Huawei

Tout n’est pas rose pour Qwant.

En mars 2017, selon la Lettre A, Bpifrance aurait refusé de participer à la levée de fonds en raison de doutes relatifs aux technologies utilisées par Qwant, en particulier l’usage de technologies fournies par Microsoft et de serveurs chez Huawei. Eric Léandri confirma l’utilisation de résultats provenant du moteur de recherche de Microsoft, Bing, aux fins de compléter les résultats générés par l’algorithme de Qwant ainsi que l’usage de la régie publicitaire de Bing.

Wikipedia

Donc Qwant Images = Bing Images, les « annonces » Qwant font appel a la régie de pub Bing et les serveurs et l’infrastructure réseau sont fournis par Huawei, prestataire chinois.

C’est assez décevant pour un moteur qui se pose comme le chevalier blanc de la non-conservation des données de ne pas aller jusqu’au bout de sa démarche…

Publié par Fred dans Internet, 0 commentaire
Google pour les graphistes et les designers

Google pour les graphistes et les designers

Google fournit gratuitement de nombreux outils aux graphistes et aux designers

Google est actuellement omniprésent sur internet. Tout le monde utilise leurs services, volontairement ou pas.
Ces services sont nombreux (trèèès nombreux en fait), comme en témoigne la structure d’Alphabet inc.
De nombreux services ont une vie courte : ils ne rencontrent pas l’adhésion des utilisateurs, ils sont donc abandonné. D’autres changent de forme : par exemple Google Maps en passant de l’entière gratuité à une formule payante pour les sites à forte fréquentation intégrant des cartes, ou Picasa qui s’arrête net, ou encore Sketchup qui est revendu. Gardez donc à l’esprit que les outils fournis par Google pour les graphistes ne sont pas forcément très pérennes. Il existe heureusement dans de nombreux cas des alternatives aux produits Google, mais ce n’est pas l’objet de cette liste.

google for design illustration by derek kim

Illustration : Derek Kim pour Google.com/design

Navigateur Internet

Chrome est un navigateur solide, rapide et gratuit. On peut s’y connecter avec son compte Google et sauvegarder sa configuration, pratique quand on utilise plusieurs machines.
Nativement la fonction « Examine l’élément » en clic droit et la possibilité de traduire instantanément le contenu de page se montrent très utiles.

Coté extensions, je recommande :

  • Awesome screenshot, pour faire tout type de captures d’écran notamment capturer une page très longue d’un seul clic. L’extension inclut un outil de floutage, et un outil de commentaire.
  • Eye dropper, pour faire des relevés colorimétriques dans une page.
  • What font, pour savoir rapidement quel police est utilisé dans une page.
  • Page ruler, pour mesurer sur une page.
  • Web developper, pour activer/desactiver image, javascript, css, pour surligner la structure de la page, accéder facilement aux médias de la page…

Chrome est aussi une plateforme d’expérimentation WebGL, HTML5, CSS3, Javascript via le site chromeexperiments.com.

Le moteur de recherche par image

google image search

La recherche par image, accessible en cliquant dans l’appareil photo à droite du champ de recherche, permet de trouver l’origine d’un visuel, trouver des déclinaisons, vérifier qu’on vous a pas piqué un visuel.

Exemple.

Également disponible en extension pour Chrome.

Polices de caractère

logo google fontsEn 2010, Google a changé la donne de la typographie en web-design.
Google Fonts propose plus de 600 polices de caractère très bien dessinées en usage libre et gratuit. On peut les utiliser dans un site grâce à un appel aux serveurs Google, ou télécharger la police et en disposer sur un ordinateur.
La police officielle de d’interface d’Android est une Google Font : Roboto.
Google fourni aussi une bibliothèque d’icônes.

google-icones-2

 

Logiciel d’animation HTML5

google webdesigner

Il n’est pas parfait (nécessitant une connexion, interface un peu poussive, en beta depuis 2013) mais il est gratuit et mis à jour : Google webdesigner est un logiciel d’animation HTML5 pour faire de l’UX design, ou de la publicité en ligne.

Cette liste Youtube en anglais rassemble les démos des développeurs de l’application.

Alerte rouge sur la pérennité du service, à n’utiliser que pour dépanner, ou réaliser des projets ne s’inscrivant pas dans la durée.

La cartographie

Google Maps est un très bon outil pour obtenir une cartographie rapidement. La résolution est insuffisante pour une bonne qualité d’impression, mais en ce qui concerne le web, c’est très utilisable.
Voici deux outils de personnalisation de carte :
Maps Engine de Google permet de créer des cartes avec des repères ou des itinéraires
Mapbuildr.com est un site tiers qui propose de personnaliser les couleurs et les informations affichées sur les cartes Google.

custom-google-maps-1

Attention, si vous avez en tête un projet de site incluant de la cartographie Google Maps ne sera pas forcément gratuit. Au delà de 25000 carte affichée par jour cela devient payant.

Streetview

Google street view

L’attirail complet

Petit cousin de Google Maps, Streetview est le résultat du quadrillage de toutes les routes du monde par les voitures Google et leurs caméras.

Le programme Arts et Culture permet de visiter des dizaines de musées du monde entier gratuitement, avec un niveau de zoom sur les œuvres complètement hallucinant.

Le coté business de Streetview c’est qu’on peut passer par un photographe certifié Streetview pour faire la promotion d’un endroit dans l’environnement Maps – Streetview – Places – Search. On peut aussi publier ses streetview relativement facilement avec les nouvelles caméras 360

Web-design

Un bon nombre des services Google cités précédemment sont utilisables pour la construction et la gestion de site internet. Google Fonts, Google Maps et Google Streetview ont été conçus dans l’optique d’une intégration dans un site internet.

Il faut ajouter :

Google Analytics, l’outil statistique est incontournable. Il y a beaucoup à dire sur le sujet. En ce qui concerne le graphisme et le web-design en particulier, les analyses statistiques sont indispensables à la bonne évaluation d’un design et à la bonne évolution d’un site dans le temps.

Google Analytics

Google Optimize est un outil découlant de l’usage de Google Analytics. Il permet la création et la gestion de tests comparatifs très fins, voire de servir un contenu spécifique à un utilisateur spécifique.
conversion-optimization-testing-multi-goalLe split-test, test comparatif ou A-B testing, c’est le juge de paix du design numérique. Sur un site à forte fréquentation ou peut rapidement voir quelle mise en page est la meilleure, quelle accroche a le meilleur impact ou plus simplement si le bouton vert vend plus que le bouton bleu.
Les tests comparatifs sont un soulagement pour le graphiste et le designer. On peut prouver qu’une couleur, une typo ou une mise en page particulière a de meilleurs résultats. La cohorte des utilisateurs qui défilent sur les pages tels les clients dans le bazar d’Au bonheur des dames est implacable de bon sens. Avant de faire un changement, il est indispensable de le soumettre à un test grandeur nature.
Il faut aussi noter que c’est aussi que ces données sont valables si l’on a un objectif clair et quantifiable (vente, abonnement, clic…).

Google Resizer permet de voir rapidement l’apparence d’un site sur ordinateur, tablette et mobile. Attention ça ne vaut pas un test sur un  vrai device.

Google Resizer

Ma maçonnerie est responsive !

De nombreux outils plus techniques et moins graphiques sont disponibles sur un portail dédié et sur cette page.

3D

Google s’est séparé de son logiciel d’édition 3D SketchUp. J’avoue ne pas avoir compris la manœuvre.

poly.google.com est une bibliothèque de modèles 3D téléchargeables gratuitement.

Google Earth affiche une modélisation 3D mondiale, avec des détails parfois saisissants

Bureautique

Google Drive est un outil de stockage et de partage de fichier type Cloud gratuit pour le grand public. Vous disposez de 15Go et d’un système de droit d’accès et d’édition assez cool.
Pour les pros, il y a le cloud pro, qui n’est pas connecté à drive. Il fournit espace disque mais aussi temps processeur.

Photos de Google permet de stocker, d’organiser, de retoucher sommairement et de partager facilement vos photos. Le service repose sur Google Drive. Plusieurs personnes peuvent administrer et partager un album.

Google documents est la suite de bureautique 
maison.
Docs est le traitement de texte, Sheets le tableur et Slides l’outil de présentation.
Si fonctionnellement ils peuvent sembler limités, ils présentent 4 avantages :

  • Pas d’installation nécessaire, tout se passe dans le navigateur
  • Gratuit, il faut juste un compte Google
  • Travail collaboratif, vous pouvez être à plusieurs sur le même document et voir en direct sur quelle zone travaille une autre personne qui a accès au document
  • Et la faculté étonnante d’ouvrir des .doc ou .docx corrompus que Word ou Open Office ne veulent pas ouvrir.

Et on peut « Embed » des documents dans un site, ou les intégrer à un CMS via des plugin spécialisés comme WordPress.com for Google Docs.

Doctrine graphique, documentation et recommandations

L’entreprise a une approche graphique rationnelle : le material design, qu’elle applique à la charte graphique de tous ses produits, notamment Androïd.

Le material design :

  • s’appuie sur la métaphore matérielle intentionnelle pour structurer le graphisme en cartes hiérarchisées graphiquement (typographie, couleur, forme, effet d’ombre, proportion…)
  • utilise un graphisme simple, accessible, vivement coloré, dans la lignée du design suisse.
  • se sert du mouvement pour attirer l’attention sur un point particulier ou matérialiser la continuité d’une action

google material design layering

Le portail du design de Google est riche en recommandations de design et en témoignages.
On trouve aussi d’intéressantes guidelines pour le design interactif et l’UX design dans le portail des développeurs.
Chaque service Google communique via via des comptes Google Plus (c’est à peu près l’unique utilité de ce réseau social) et des chaînes Youtube (la principale étant la chaine Google).

Formation et certifications

Google propose des formations en ligne et de événements sur son portail « Pour les pros » et sur son portail « Digital Active ».
Ces formations gratuites vulgarisent des sujets variés : référencement, Analytics, emailing, e-commerce, m-commerce, stratégie social media… et débouchent sur des certifications.

Le programme « Partners » permet aussi de passer les certifications Analytics, Adwords et Mobile.

Les cours de préparation sont ici :

Les examens de Google sont gratuits et ont entre 12 et 18 mois de validité.

Conclusion

Quoi qu’on puisse penser de l’entreprise supra-nationale, ces outils de Google pour les graphistes sont gratuits. « Si c’est gratuit, c’est toi le produit », et c’est vrai : Google se sert de votre manière d’utiliser ses services pour en affiner la pertinence.
Si cela vous pose des soucis de conscience ou de confidentialité, utilisez plutôt des services équivalents de la concurrence. Si cela ne vous inquiète pas, profitez de ce qui vous est donné.

Publié par Fred dans Graphisme, Internet, Référence, 0 commentaire

Genius, le site qui explique le texte

Genius.com est un site d’annotation et d’explication de texte.

L’idée vient d’une embrouille entre trois amis au sujet du sens des paroles de Family Ties, une chanson du rappeur Cam’ron.

« Rap Genius est le Talmud de l’internet »
Mahbod Moghadam, Tom Lehman et Ilan Zechory

genius fondateursConçu dans un garage par deux fondus de rap, le site se consacre maintenant à toutes les musiques, et même à d’autres sujets tels que la politique, la poésie, l’actualité…
N’importe quel utilisateur peut ajouter des textes ou des commentaires, un système de ranking incite les internautes à participer. Le francophone le plus actif est Guillaume Simonin, merci à lui pour ses milliers de participations.
Certains artistes ont un compte certifié et commentent les interprétations de leurs fans.

Il y a une communauté d’utilisateurs français. C’est à l’usage plus gratifiant que Wikipedia car l’équipe de modération est  permissive pour pas dire laxiste. On peut ajouter des commentaires décalés sans subir de censure immédiate.
D’ailleurs à la lecture, plus le texte est stupide, plus les commentaires sont drôles. COmme par exemple quand une chanteuse se sert d’une chanson pour régler des comptes, quand un candidat politique fait un long discours, quand une chanteuse enfonce des portes ouvertes ou si vous avez besoin d’un logiciel de traduction quand rappeur français chante dans votre radio.

Rien que pour vous une petite sélection de textes commentés en tous genres.
À noter au passage la possibilité d’embarquer sur un site tiers un morceau ou juste un commentaire. À noter aussi que leur API déconne un peu sur smartphone.



Publié par Fred dans Internet, Musique, 0 commentaire