DBO Design

DBO DESIGN

Content Reactor 3.0

Tout savoir sur fonts awesome

Rédigé par dbodesign Aucun commentaire
Classé dans : Webmastering Mots clés : aucun

Vous avez sans doute vu (à moins que vous viviez dans une grotte), des sites internets récents afficher des pictogrammes avec l'énoncé de leurs prestations et offres, qui vous semblent familiers de site en site...

Il y a fort a parier qu'il s'agit de Fonts Awesome. [icon name="external-link-square" class="" unprefixed_class=""] C'est la librairie de pictogrammes vectoriels la plus utilisée actuellement. Avec le développement des sites internets responsive et leur storytelling (on scrolle, on scrolle !).

Storytelling et pictogrammes

Invention du Web Marketing qui remonte aux années 2000, le "storytelling" impose une lecture du site selon le précepte de retenir le visiteur en lui faisant comprendre la solution à son/ses problème(s) en 3 secondes. Le séduire, le convaincre, puis le rassurer, et l'inviter à une action au bout du scroll. Les pages d'accueil des sites récents sont donc "tapantes" volontiers visuelles (grandes images ou vidéos, gens jeunes et souriants...) et quelques mots-clés qui identifient immédiatement la raison d'être du site, "ce ce que l'on fait". Plus en profondeur, invariablement on retrouve l'offre, des chiffres animés sur le nombre de prestations délivrées, clients satisfaits, etc., l'équipe, les références clients, un "call to action" boutons bien visible pour aller vers les tarifs et offres détaillées, et le formulaire de contact et les coordonnées en bas de page.

Le rôle des pictogrammes

Pour souligner l'offre et/ou les points forts, des icônes précèdent le texte court qui les accompagne. Des pictogrammes qui participent à cette idée de décrire au client ce dont on parle de la manière la plus rapide possible. Habitués que nous sommes au code de la route, puis aux mobiles et à leurs hordes d'applications et de fonctionnalités, nous nous sommes accoutumés à ces petits graphiques très stylisés, et à ses standards. Ils sont entrés durablement dans nos vies, presque au titre d'un langage parallèle, une sorte de langage visuel alternatif à l'alphabet telles les langues asiates ou les anciens hiéroglyphes. Il s'agit d'idées-symboles, un mot=une image, puisque proposer des rébus aux visiteurs serait contre-productif. Leur rôle est d'avantage de résumer visuellement un point fort à retenir.

Mais on peut les utiliser aussi comme:

  • Informations complémentaires (ex. logo de banque ou de carte sur un site E-Commerce)
  • Réseaux sociaux et applications disponibles
  • Symboles associés à un texte dans un bouton
  • Symboles animés d'action (ex. spinner de chargement)
  • Icônes d'interface (UX design)
Un peu de technique

Les pictogrammes vectoriels ne sont pas nouveaux. Le concept remonte aux débuts de l'informatique. Un logiciel bien connu d'Adobe®, le géant du graphisme pro, Illustrator®, permettait en effet de produire de tels graphismes, en vectoriel. Comparer le vectoriel avec ce qui se fait en pixels prendrait un article entier, nul besoin donc d'entrer dans les détails. En deux mots, les avantages du vectoriel sont:

-Formes déduites de points de coordonnées vs. tous les points calculés (pixels). Le vectoriel (souvent ensuite décliné en .svg) est très léger et déformable à toutes les échelles et tous les usages (web, print...). Illustrator (Adobe) est le logiciel de graphisme vectoriel de référence, une vraie fabrique à logos. Il se prête donc très bien pour des pictogrammes, et fontes de caractères. En matière de fontes justement, une police qui dira bien des choses aux infographistes old school: Windings [icon name="external-link" class="" unprefixed_class=""], fut longtemps le moyen d'intégrer des pictogrammes standards dans des présentations à l'ère de l'imprimé. Pour le web, l'idée d'utiliser une fonte coule de source:
  1. Un visuel déjà bien stylisé et étudié (pourquoi réinventer la roue?)
  2. Léger
  3. Déformable à toutes les échelles (Vectoriel on vous dit... ;))
  4. On peut y appliquer les même tailles, couleurs, et effets que les fontes (magie du CSS)
  5. S'affiche sans surprise sur desktop, tablette et mobile (responsive)
  6. Compatible avec l'agrandissement pour mal-voyants
Les avantages de Fonts Awesome C'est une des bibliothèques les plus utilisées. De fait, elle reçoit de fréquentes nouvelles requêtes et introduit de nouveaux pictogrammes grâce à ses nombreuses contributions. Cette fonte utilise le standard .svg pour le vectoriel.
  • Son catalogue compte actuellement 2300+ références dans tous les domaines.
  • Lorsqu'on travaille en code, il suffit parfois de deviner le nom de l'icône pour tomber juste.
  • La mise en oeuvre est simple et souple: Le code de base dans un site ressemble à: <i class="fa fa-object fa-lg"></i>
  • Sur un CMS comme wordpress, un simple shortcode suffit (une fois le plugin installé)
  • Outre des paramétrages CSS, on peut y appliquer des effets dans le code de déclaration:
<i></i> est une convention html pour "insert". Après la classe qui déclare l'objet (ici "fa-objet") on y applique une référence de taille "fa-lg" pour "Fonts Awesome - Large". Les autres mesures sont exprimées en "x" (agrandi x fois) comme dans "fa-7x". Cerise sur le gâteau (clin d'oeil à la vidéo de pâtisserie hilarante [icon name="youtube" class="" unprefixed_class=""] présentant la nouvelle version) on peut combiner les icônes et leur appliquer des animations. Un exemple combinant un peut tout:
<i class="fas fa-spinner fa-pulsefa-7x"style="color:red"></i>
Les Graphistes au chômage !

-En effet cette nouvelle mode des sites internets privilégie les photos (de grande taille pour carousels, galeries et autres), et les graphismes vectoriels tels que ces pictogrammes. Les illustrations et graphismes "à l'ancienne" en .gif et .png ont vécus. La vitesse d'affichage et l'impact via la standardisation ont eu raison des derniers infographistes se risquant encore à proposer des choses pour internet. Les infographies n'ont plus le vent en poupe et les graphismes personnalisés appartiennent au passé, de même que les animations en flash. L'époque n'est plus au graphisme.Le revers de la médaille est qu'on perd également singulièrement en personnalité, chaque site se ressemblant car utilisant les mêmes templates bootstrap dictés par le storytelling à l'américaine... et les même librairies de pictogrammes. Et le CSS est Roi pour tenter de se différencier.

Inconvénients Utiliser ce genre de solution pour son site semble couler de source pour ce qui est de la flexibilité. Mais des inconvénients existent cependant:
  1. Fonte pas acceptée par tous les navigateurs (anciennes versions notamment)
  2. Doivent être mis à jour.
  3. Une librairie importante à charger pour parfois trois pictogrammes.
  4. Ne couvre pas tout. Rien de plus rageant que d'avoir trouvé toutes ses icônes sauf une*.
  5. Manque d'originalité. Plus difficile de se démarquer avec ces icônes "bateau".
*Derniers manques en date: La réalité virtuelle, le panier... et des icônes d'applications et de marques comme scoopit. Voir toutes les requêtes https://github.com/FortAwesome/Font-Awesome/issues Alternatives à Fonts Awesome
  • https://material.io/icons/
  • https://css-tricks.com/icon-fonts-vs-svg/
  • http://fontastic.me/ (9000 icônes)
  • https://github.com/DiemenDesign/LibreICONS
  • http://glyphicons.com/
  • http://ionicons.com/
  • https://www.iconfinder.com/
  • http://zavoloklom.github.io/material-design-iconic-font/
Et bien sûr vous pouvez utiliser vos propres icônes exportées en .svg avec un peu de javascript. Et vous, utilisez-vous des icônes vectoriels. Si oui, de quelle bibliothèque et avec quels effets ?

Test de CMS: Grav

Rédigé par dbodesign Aucun commentaire
Classé dans : Webmastering Mots clés : aucun
Grav est un CMS de type "flat-file", sans base de données php-mysql. Récent, simple et léger comme la plupart des CMS de ce type, c'est une proposition tentante pour un nouveau site. Le test: Qu'est ce que Grav ? Historique: "Grav" vient de "gravity", mais n'est pas inspiré du film catastrophe spectaculaire en apesanteur montrant Sandra Bullock et George Clooney et mis en scène par Alfonso Cuarón (2013) d'après ses créateurs. C'est un simple nom de code initial et provisoire qui est resté. Comme l'indique la documentation officielle, le CMS utilise les dernières et meilleures technologies du genre comme:
L'équipe derrière ce CMS n'est pas néophyte: Rocket Theme s'est spécialisée pendant longtemps dans la personnalisation de templates pour Joomla, Magento, et Wordpress, avant de développer un pont ambitieux avec Wordpress, appelé Gantry 5. C'est ce framework qui permet d'ailleurs la construction du CMS Grav. Il est défini comme un CMS "Hybride", "Flat-File" dans le sens où il se sert de php. Les CMS statiques sont en général en html et ont comme triple avantage une faible consommation de ressources serveur et une sécurité quasi parfaite, ainsi qu'une sauvegarde plus simple. Grav utilise notamment des fichiers au format Yml ou en format json pour ses configurations. Le seul inconvénient est une vitesse d’écriture de fichiers plus lente que pour une base de données. Il offre aux développeurs et linuxiens la possibilité d'utiliser le CMS en ligne de commande également. Enfin Grav est un CMS open source et ses déjà nombreux templates et plugins sont également gratuits avec une communauté croissante, la plupart basés sur Bootstrap ce qui est en soit attendu, mais aussi toujours une bonne nouvelle pour plus de flexibilité. Alors souhaitons à ce CMS de se faire une place au soleil dans les années à venir.

Installation de GRAV:

Très simple. Il suffit d'envoyer les fichiers sur le ftp et de se logger sur la page par défaut pour l'installation, en remplissant les quelques données de base: Nom d'utilisateur, nom réel, nom d'admin, mail et mot de passe. Et pour ceux ayant accès aux lignes de commande, en deux lignes de quelques termes c'est fait. Comme la plupart des CMS, Grav fournit une page "démo" à personnaliser ou supprimer. Grav explique que contrairement aux CMS habituels à la courbe d'apprentissage élevée et aux nombreux conflits de plugins, son système se base entièrement sur le contenu, central, avec des "évènements" rapportés. Grav se dit aussi bien user friendly que designer-friendly et developer-friendly. C'est ce que nous allons voir.

Impressions de GRAV CMS

-1er point positif, l'interface rappelle furieusement le fameux template bootstrap, et le choix de themes modernes utilisables est intéressant, plus que pour certains CMS flat file assez pauvres et souvent non-responsives comme zwii et getsimple cms. Le thème de base "antimatter" est déjà en soit assez bien conçu. Remplacer la page de contenu dynamique d'exemple par le template "business" présenté est également assez simple, de même que la création de pages. -Laisser le site en jachère quelques temps m'a permis de tester la mise à jour, et elle est rapide et intuitive quoique moins facile d'usage que celle de wordpress. Il faut ouvrir les plugins un par un chaque fois pour éxécuter la mise à jour. Sur wordpress il suffit de cocher tous les plugins présents, de sélectionner update dans le menu déroulant, et chaque module se met à jour à son tour automatiquement sans quitter le gestionnaire. Il s'agit de point à améliorer dans le futur. -Autre point positif, l'ajout de "médias" se fait directement depuis le menu sous le champ de texte de l'éditeur et fonctionne en glisser-déposer. Reste un point à explorer, dans l'onglet "avancé" de l'éditeur de contenu, tester les fonctionnalités d'override. -Points plus négatifs par contre, il n'y a pas d'autosave (pas de BDD dont pas de scheduler), les codes d'images et de liens ne sont pas forcément intuitifs, et l'éditeur est assez minimaliste (pas de texte justifié par exemple). Maintenant il est presque certain q'un plugin existe ou sortira assez rapidement. J'ai trouvé une pirouette, en travaillant en mode code et en incluant en style en dur qui a fonctionné mais obligé à placer des espacements qui avaient sauté. Tout comme wordpress même en mode "code" les paragraphes (sauts de ligne) sont reconnus comme tels. Il a fallu donc jouer du "BR /", avant de revenir a un système de spans. Il faut savoir que l'éditeur génère son propre code, il faut donc l'apprivoiser. Ex. Un (gras) devient **Texte**, un (Italique) devient _texte_. Une image c'est [![](texte)], un lien c'est juste (texte). C'est assez économique en caractères et participe de la légèreté de l'ensemble tel que promis.

Verdict

Finalement, dans sa forme initiale présente, GRAV est déjà parfait pour un petit site vitrine d'une dizaine de pages, administrable par le client. Parions qu'avec la foule de plugins bientôt disponible des sites plus ambitieux seront possibles. Seul bémol cependant à l'usage, le fameux moteur du back office, Twig est assez verbeux et pas forcément intuitif pour des personnes habituées à Joomla et Wordpress; Pour quelqu'un qui n'a jamais eu de CMS et débute, c'est déjà plus facile, n'ayant rien de préconçu. J'aurai sans doute l'occasion de revenir sur ce CMS très intéressant lors de l'ajout de nouveaux contenus. Et vous, connaissez vous GRAV ? L'avez-vous testé ou même développé des sites pour des clients ou votre propre usage ? N'hésitez pas à me laisser vos impressions.

Que vaut la création d'un Google site ?

Rédigé par dbodesign Aucun commentaire
Classé dans : Webmastering Mots clés : aucun

Un temps suspendu, Google sites, l'un des nombreux services de la galaxie Google (indexé sur Gmail) à fait son retour, à travers une intégration pro avec G suite. Sous abonnement, la suite ajoute à un nom de domaine propre l'espace web, une boite mail et les nombreux services Google dont le couplage automatique avec Google+. En version gratuite, on peut très bien créer un site Google gratuit si hébergé en sous-domaine comme la plupart des plate-formes de blogging.

Test et Impressions Google offre une interface en drag-and-drop java réactive et très ergonomique, intuitive à la manière d'un concrete5. Techniquement, la composition en "page unique" permet de réviser à tout instant les paramètres généraux (image d'en-tête, logo, slogan, titre...) et les contenus internes.

Pour simplifier l'interface, on ne voit pas de différences entre "pages" et "articles". Cela simplifie la gestion et ce type de site est d'avantage vu comme une vitrine (Pour publier des posts, utilisez Google+). Le panneau d'interface comprend quatre actions principales: -Insérer un texte (fonctions basiques de mise en page, p. ex. on ne peux changer ni le style de police, ni la couleur, ni justifier...). Un séparateur est accessible depuis le panneau, "composant". -Insérer une image: Depuis une URL externe (hotlink), ses albums, Google Drive, ou via une recherche. -Insérer un lien (URL externe) -Importer (depuis son ordinateur). On suppose des documents et photos. Plus bas, Google propose d'uploader des contenus depuis Google drive. Il semble toutefois impossible d'ouvrir les dossiers (bug?). A retester donc depuis Chrome.

Intégrations: Les classiques "Embeds" sont facilités, Google permettant d'intégrer: -Vidéo Youtube (Via des "imports" (depuis où?) et directement par recherche) -Agenda (importé depuis le service du même nom) -Carte (Embed Google maps, avec toutes ses fonctionnalités, mode street, earth, pins, etc).

Insertions: Tirant parti de la puissance de son cloud et de ses 5GO offerts, Google Sites offre la possibilité d'intégrer des documents type Google Docs, textes, tableaux, sliders, feuille des calcul, et graphiques, dont ceux générés avec la G suite. (Réponse à la fameuse suite Microsoft(R)).

Comme précisé dans les caractéristiques du site, l'espace disponible est de 100mo, mais ne précise pas si cela inclus les "rapatriements" depuis le Drive, ou même le web (hotlink). Aucune limite en revanche pour le nombre de pages. J'ai testé une arborescence à 5 niveaux (4 niveaux de pages filles) sans problème. Reste évidemment dans ce cas l'affichage.

Le système est parfaitement responsive. Tout est dynamique et les contenus se replacent gentiment en colonne sur mobile. Il y a même un effet de profondeur en scroll sur la bannière d'en-tête qui peut changer sur chaque page. La solution trouvée pour l'affichage des sous-menus est assez élégante: Seule la page fille s'affiche, et un icône est sollicité pour afficher la sous-page fille et ainsi de suite, presque sans décalage (qui pose un problème de "sortie" du cadre en général et oblige à scroller en latéral). Le classique hamburger affiche une colonne latérale large et lisible qui permet de déplier le menu.

La construction en drag-and-drop est très intuitive et permet cependant une certaine latitude de mise en page. Les pages sont construites en "sections" chacune pouvant être personnalisée et/ou duplicable. Des "guides" avec un magnétisme réduit sont également présents pour dimensionner les blocs de contenus (texte, image, embeds,..) avec des poignées, ce qui permet éventuellement d'espacer un peu plus les blocs que le standard. A l'ancienne il faudrait batailler avec des padding et spacing tous azimuth et de fréquentes updates du serveur pour afficher le résultat. On apprécie aussi le fait que les images importées ont un "cadre" qui se redimensionne de manière intelligente en agrandisant et "cachant" des portions de l'image pour correspondre au format voulu.

Côté SEO: Venant de Google on s'attend bien entendu à un sans faute. Pourtant à la vue du code on ne décele ni titre ni description (certes plus prise en compte) et le code se révèle finalement assez lourd (Voir ici) et les textes ne sont même pas accessibles, l'ensemble donnant l'impression d'être encodé en base 64 (Un paradoxe car l'éditeur ne supporte pas les images enocodées en base 64). Pour un test de long terme, il faudrait donc créer un site de test riche en mots-clefs et attendre 3 mois en publiant une nouvelle page de contenus chaque semaine.

Bilan: Pour un néophyte, créer son site sur Google donnera la satisfaction d'un résultat rapide et facile, particulièrement si Google est utilisé pour tout ou presque. Maintenant on ne le comparera qu'à des plate-formes freemium comparables, car face aux CMS classiques que sont Wordpress, Joomla et Drupal, on pense notamment à la foule de plugins utilisables par ces trois plate-formes (Forum, E-commerce, etc). On ne parlera pas non plus du choix très restreint de "templates" et finalement d'une personnalisation réelle assez limitée.

Comparons donc ce qui est comparable. Dans son registre du microsite, Google Site est une excellente façon de débuter sans prise de tête. Mais pour un webmaster (pas de mode code!) ou un utilisateur averti, les limitations de Google sites finiront par apparaitre assez vite, le concept est trop frais et complètement intesté sur le plan du référencement, sans compter la présence en bas de page de la référence publicitaire "fait avec". Nulle doute également que la nature des données entrées en disent long sur l'utilisateur, alimentant encore les databank commerciales du géant Californien. ;). Sur le plan collaboratif en revanche, et la construction d'un mini-intranet, Google Sites se révèle finalement bien plus facile à mettre en place grâce à ses nombreuses possibilités d'intégration.

Particulier ou association qui souhaite une présence en ligne facile? Parfait !. Si vous êtes un professionnel desespéré d'avoir un site le jour même, Google site est aussi une solution de facilité. Idem pour mettre en place rapidement un intranet basique. Pour le reste, rien de tel que le sur mesure.

Avez-vous testé Google Sites ? Pensez-vous l'utiliser ? N'hésitez pas à commenter votre expérience. Exemple live: https://sites.google.com/s/0B7bURKf82hn-UUdMZUFqdEdQMnc/p/0B7bURKf82hn-VDVyazNJSVkwWG8/edit Pour aller plus loin: alternatives-to-google-products Comparatif Wordpress/Google site (il fallait oser)

CMS sans base de données: Zwii

Rédigé par dbodesign Aucun commentaire
Classé dans : Webmastering Mots clés : aucun
Qu'est ce que Zwii ? Un récent CMS ou Content Management System (comme il y en a des dizaines), mais là où le choix se restreint et ce qui le rend intéressant, c'est que c'est un CMS sans base de donnée. Vous allez me dire "et alors ?". Si, ça fait une réelle différence que je vais expliquer ici. La première bonne raison, c'est la sécurité. Les bases de données de tous poil standard (MySql en particulier) sont la cible de hordes de robots malveillants et de hackeurs en général. leur but ? Pénétrer la base, voler des données, utiliser la structure du site pour générer du spam ou des liens pourris. Pas de base, pas de risque, vous réduisez la surface d'attaque. La seconde bonne raison c'est la simplicité côté webmaster comme utilisateur: Installation hyper-rapide car pas de base de données à créer pour à remplir lors de l'installation avec des identifiants et mots de passe suplémentaires. Pas de sauvegarde de base ni de back up régulier à faire, ni de surveillance particulière de l'ip ou du serveur. La troisième bonne raison c'est la simplicité. (user friendly) Côté utilisateur, ça tourne vite est c'est léger et très simple à utiliser. En effet faute de base qui gère des tonnes de données les concepteur d'un CMS de ce type se limitent au strict minimum. Pas de courbe d'apprentissage, on est très vite en mesure de créer et d'éditer du contenu. La troisième bonne raison c'est la vitesse. Pas de base de données ou de serveur (qui peut être poussif) à interroger avant d'afficher des contenus. C'est léger, c'est fluide, aussi bien pour le visiteur que pour l'utilisateur côté back office, pas de freeze ou de temps mort. Zwii en détail Personnellement je ne connaissait pas Zwii avant d'avoir effectué une recherche web sur "site sans base de données". J'avais déjà testé CMS made simple, mais il existe aussi pulse cms, Grav, Pico, batflat... Cette nouvelle tendance s'appelle aussi "flat file CMS". Ce qui pourrait vaguement se traduire comme "CMS en dur". Pour tester Zwii: Connectez vous sur la page de login et entrez les identifiants suivants: -login: login -mot de passe: password Vous pouvez également tester Concrete5 sur http://www.spiders-encyclopedia.com/ A voir aussi: cmscritic.com/flat-file-cms/ readerspark.com/non-database-content-management-systems/ 1and1.com/digitalguide/hosting/cms/cms-without-database-a-useful-alternative/ queness.com/post/16142/11-lightning-fast-flat-file-cms

Une alternative aux hébergements d'image gratuits

Rédigé par dbodesign Aucun commentaire
Classé dans : Webmastering Mots clés : aucun
https://youtu.be/w5jOEdKQpXY Que ce soit pour vos clients ou vos propres sites, vous avez sans doute eu besoin à un moment ou à un autre d'héberger vos images sur un serveur (pas le vôtre). Héberger des images sur un autre serveur peut présenter quelques avantages: -Grandement diminuer la charge serveur lors de l'affichage de vos sites -Eviter les problèmes de hotlinking (vos images affichées ailleurs, mais physiquement hébergées sur votre serveur) -En cas de déménagement du site et/ou de changement de nom de domaine, les liens images ne changent pas Les plates-formes d'hébergement d'images sont nombreuses, en voici quelque-unes parmi les plus importantes avec leur conditions d'hébergement: -Photobucket: Limite 2Go ou 8Go avec app -Imgur: En fonctions des vues+limite taille (img/vid) -Flickr: Permanent (compte yahoo) -ImageShack: 90 jours, +Limites uploads/jour +Compte -TinyPic: En fonction des vues+limite/jour -SmugMug: Illimité mais payant -Shutterfly: Limité+ Compte obligatoire -Free Image Uploader: Permanent -CTRLQ: Passe par embeds, utilise Gmail Mail Merge -Imgbb: Pour forums, limite 16mo, compte nécéssaire -Picasa: Une fois gérés sur l'ordinateur les images sont transférées sur le cloud Google Mais c'est aussi une solution qui présente des inconvénients: -C'est du provisoire: La plupart des plates-formes d'hébergement d'image ont été créé au départ pour les Forums, et leur durée d'hébergement est assez courte, l'image étant souvent éliminée si pas affichée pendant un certain temps. Cela privilégie la "fraîcheur" des contenus. Même principe avec les applications récentes et réseaux sociaux comme instagram et snapchat. -Limitations SEO: Les images ne sont plus hébergées sur votre site, ce qui veut dire qu'elles ne cmptent plus pour son référencement, surtout si elles sont rares et apportent une vraie plus-value. Il est connu aussi en SEO qu'une image avec un nom significatif (ex.terme1terme2terme3.jpg) conserve un avantage marginal mais mesuré sur le référencement, et est plus facile à trouver. Le chemin d'accès également sémantique peut compter (ex. http://site.com/terme1/terme2/images/terme1terme2terme3.jpg) peut aider au crawling et à la manière dont Google voit le site. -La plate-forme peut être en maintenance, indisponible à certains moments, voir changer de nom ou disparaître. -Il y a presque toujours des limitations globale de taille (quelques Go) Pour éviter certains de ces inconvénients il existe une alternative peu connue: Héberger ses images sur son compte Google Drive La solution est séduisante en effet: -Pas de limite de durée -Pas de risque de disparition ou indisponibilité, vu la popularité et les ressources de Google -Une gestion "saine", en interne sans être obligé de taper des captcha de validation antispam, ou de subir des tonnes de publicités, sans compter les lenteurs de scripts tiers. Malheureusement Google Drive ne propose plus nativement de le faire. On ne peut que partager le lien vers l'image, pas l'intégrer comme image. Il faut en passer par une application tierce, GDurl direct Permalinks, qui est une sorte de bit.ly permettant d'afficher des liens cryptés pointant vers votre Drive. L'installation s'installe simplement, et l'utilisation est assez intuitive, quoique mériterai d'avantage de simplicité. 1-Une fois l'application téléchargée et installée sur votre navigateur, connectez l'application avec le compte Google souhaité. 2-Rendez-vous sur le site de l'application (dans vos favoris). 3-Parcourez le Google Drive à la recherche de votre dossier d'images 4-Au survol de l'image, cliquez sur le pictogramme en forme de lien 5-Une boîte de dialogue apparaît pour la création d'un lien public, à valider 6-Cliquer sur le nouveau pictograme "share file" qui apparait à la place (chaînon+user) 7-Confirmer la boite de dialogue 8-Cliquer "create GDurl" pour générer le lien. 9-Vous basculez dans une page d'affichage. Un champ contient le lien à copier (CTRL+c) 10-Collez le lien dans la balise image (si travail en code) ou dans la boîte de dialogue et le champ "URL" en mode Wysiwig sur votre site/blog. 11-Revenu sur la page gdURL il faudra cliquer précédent dans le navigateur pour avoir accès de nouveau à son tableau de gestion des images. Le site pour se rémunérer en version gratuite affiche des publicités, pas trop gênantes, et un bouton de support Paypal. C'est un système qui fonctionne, mais comme dut plus haut l'ergonomie mériterai plus d'attention pour diminuer la charge de travail sur les gros volumes. Les étapes pour rendre le lien public et le partage mériteraient d'être traités d'un clic, et l'affichage du lien partageable en popup, ce qui éviterai les aller-retour avec le panneau de gestion Google Drive et les boîtes de dialogue intempestives. C'est particulièrement fastidieux si la connection est lente, et dans certains cas les scripts publicités peuvent causer des conflits (notamment sur IE). Il est noté également que pour les grandes images, l'embed (intégration) est bloquée par Google à cause de l'impossibilité de les scanner pour possible virus. Toutefois les avantages de cette solution de long terme semblent convaincants. Avant de l'adopter pour vos projets, il reste à se poser la question technique de l'utilité de gdURL en mettant en balance la Vitesse de chargement du site / popularité des images de son site (SEO).
Fil RSS des articles de cette catégorie