askunce

Personas : futile mais indispensable

michael — 2009-04-28T18:31:11Z

Issue des expérimentations du Mozilla Labs, Personas est une extension qui permet de personnaliser très légèrement mais extrêmement facilement votre navigateur Firefox.

Description du tutoriel vidéo

A la différence des thèmes pour Firefox, "Personas" ne modifie que le bandeau supérieur et le bas du navigateur, l'impact est donc léger mais l'intérêt de cette extension est surtout sa prise en main.

Tous les personas de la galerie sont disponibles en temps réel (fini les téléchargements) et pour visualiser l'application d'un persona vous n'avez qu'à survoler son libellé. Cette usabilité va faire des envieux !

Les créatifs ne sont pas oubliés car il est possible de créer ses propres personas.

Fonctionnalités présentées :
téléchargement de l'extension (elle n'est pas dans le catalogue habituel),
accès au menu des personas via son icône,
choix et application de nouveaux Personas,
création d'un Persona ... personnalisé,
désactivation de l'extension.

Liens externes

SIte dédié ,
Mozilla Labs ,
Galerie des personas.

Sytlish : Personnalisation graphique d'un site

michael — 2009-02-03T15:47:06Z

Vous souhaitez modifier l'apparence d'une page web, masquer les bannières publicitaires de tout un site ou encore vous familiariser avec le language CSS ... Stylish est fait pour vous.

Description du tutoriel vidéo

L'utilisation ludique de stylish est de customiser l'apparence d'un site web connu (exemple : passer Google sur fond rose, violet, noir ... ). Pour cela stylish propose de vous connecter au site userstyles.org pour trouver des styles dédiés à la page voire au site sur lequel vous évoluez. Aucune compétence en CSS n'est requise pour cette opération.

Si vous maîtriser les CSS vous pouvez rapidement transformer l'apparence d'un site internet et l'adapter à vos goûts (polices, couleurs ... ) ou à vos besoins (masquer des blocs publicitaires).

Cas pratique

Cette extension nous permet de personnaliser, à la charte d'un client, une de nos applications sans avoir à toucher une seule ligne de code sur le serveur de production.

Description du tutoriel vidéo

utilisation de l'icône de Stylish,
"trouver des styles pour cette page",
connexion au site userstyles.org,
installation d'un style,
impact du style sur la charte graphique du site,
activation/désactivation du style personnalisé,
cumul de plusieurs styles,
gestion des styles (créer, modifier, supprimer),
créer un style personnalisé,
saisie de code CSS (Cascading Style Sheet).

Ce que vous ne verrez pas dans cette vidéo

Le but de cette vidéo n'est pas d'apprendre le langage CSS, même si un exemple de saisie est abordée rapidement.

Si vous souhaitez en savoir plus sur l'utilisation des CSS, consultez ce site www.alsacreations.com.

Liens externes

Téléchargement de l'extension stylish ,
Présentation en français de Stylish
Site recensant des styles personnalisés : userstyles.org.

Scrapbook : Edition d'un page archivée

michael — 2009-01-22T19:23:28Z

Les outils mis à disposition par scrapbook vont vous permettre de personnaliser vos sauvegardes directement dans Mozilla Firefox

Description du tutoriel

Sans rentrer dans une présentation détaillée de Scrapbook , cette extension de Firefox permet de sauvegarder sur votre poste des pages web.

Une fois archivé, vous avez la possibilité de modifier ces pages à l'aide d'outils (surligneur, note flottante, gomme, dom eraser) proposés par Scrapbook. L'objectif est de mettre en évidence ou de garder uniquement le contenu qui vous intéresse.

Fonctionnalités présentées :
sauvegarde d'une page web,
ouverture de cette page à l'aide du panneau latéral,
présentation du surligneur et de ses 4 options graphiques,
insertion d'une note flottante et saisie d'un contenu textuel,
attache d'un lien à une sélection,
utilisation du lien pour accéder à une nouvelle page,
suppression d'un contenu sélectionné,
suppression des objets de la page (dom eraser),
annulation d'une modification.

Ce que vous ne verrez pas dans cette vidéo

La prise en main de cette extension est présentée dans : Scrapbook : première utilisation

Scrapbook est un module complémentaire (add_ons) de Firefox, il est nécessite donc une installation, un tutoriel "Gérez les modules complémentaires" explique ce type de manipulation.

Liens externes

Page de ce module Firefox

Screengrab : capture de page web

michael — 2008-12-10T18:53:10Z

Comment transformer en image une page haute de 2000 px en une seule fois ? Utilisez Screengrab !

Description du tutoriel

Dans la famille "Capture d'écran", Screengrab propose une fonctionnalité fonctionnalité qui continue à nous bluffer. Elle permet de copier la totalité d'une page web même si celle-ci n'est pas affichée totalement à l'écran ! Fini les copies multiples et les laborieux montages, cette extension nous fait gagner un temps fou.

Les autres fonctionnalités restent basiques :
copie de la vue en cours,
copie d'un cadre spécifique,
copie d'une partie de la fenêtre à l'aide d'une sélection manuelle.

Fonctionnalités présentées :
copie d'écran de la totalité d'une page web,
copie d'écran de la portion visible d'une page web,
copie d'écran d'une sélection (manuelle),
sauvegarde sous forme d'un fichier,
copie dans le presse-papier pour la coller dans une application dédiée.

Ce que vous ne verrez pas dans cette vidéo

Les options de Screengrab permettent de modifier le format d'exportation (PNG ou JPG) ainsi que le formatage du nom de fichier.

Liens externes

Page de téléchargement du module .

Utilisation de Integrated Gmail

michael — 2008-12-09T15:55:46Z

Ce module complémentaire permet de grouper la plupart des services Google dans Gmail.

Description du tutoriel

Cette extension permet d'ajouter dans Gmail des services Google sous forme d'onglet. Le paramétrage de cette extension reste simple (pensez à rafraîchir votre page après chaque modification).

Nous ne sommes pas fan de "Integrated Gmail" pour 2 raisons :
l'ergonomie n'est pas optimale,
on arrive un meilleur résultat en utilisant les raccourcis clavier de Firefox.

Dans ce cas, pourquoi faire un tutoriel sur "Integrated Gmail". Elle n'est qu'un prétexte pour faire comprendre qu'en poussant l'utilisation de Firefox certaines extensions ont parfois peu intérêt.

Fonctionnalités présentées :
activation de l'extension "Integrated Gmail"
visualisation de nouveaux services (Reader, Agenda ) dans Gmail,
réduction des onglets,
ajout et suppression d'onglet,
ergonomie de l'application,
utilisation des liens proposés par Gmail,
utilisation de raccourcis clavier pour naviguer entre les onglets.

Ce que vous ne verrez pas dans cette vidéo

L'installation d'un module complémentaire est présentée dans le tutoriel : "Gérez les modules complémentaires ".
L'utilisation en détail de 30 raccourcis clavier de Firefox

Liens externes

Page de téléchargement du module .

Web Developer : gérez le redimensionnement

michael — 2008-11-23T17:29:44Z

Ce tutoriel vidéo présente les possibilités de re-dimensionnement que propose Web Developper

Description du tutoriel

Les fonctionnalités liées à la taille de la fenêtre en cours sont groupées dans l'onglet "Resize" (redimensionner) de la barre d'outils.

Le terme "viewport" est utilisé dans ce tutoriel, il s'agit de l'espace dédié au contenu de la page web. Il correspond aux dimensions de la fenêtre moins les barres (menu, perso, Google, web developer ...).

Les fans de cette extension trouveront que nous débutons par le plus facile et pas forcément par le plus utile. Notre objectif premier est de vulgariser l'utilisation de Web Developer et de proposer des conseils utiles pour tous.

Fonctionnalités présentées :
visualisation des dimensions de la fenêtre en cours,
visualisation des dimensions du contenu (viewport),
affichage des dimensions dans le titre,
re-dimensionnement précis d'une fenêtre,
création de dimensions personnalisées,
utilisation du zoom,
utilisation du zoom de Firefox.

Ce que vous ne verrez pas dans cette vidéo

L'installation d'un module complémentaire est présenté dans le tutoriel : "Gérez les modules complémentaires ".

Avertissement

Après débat, nous avons choisi d'utiliser la version anglaise de cette extension. Nos commentaires restent en Français.

Liens externes

Page de téléchargement du module
Page officielle du module
Version française du module

Customize google : A quoi ça sert ?

michael — 2008-09-30T06:51:22Z

En quelques clics "CustomizeGoogle" permet d'adapter à vos besoins, les services proposés par Google.

Description du tutoriel

Vous trouverez toutes les informations nécessaires à l'installation d'une extension firefox dans "Gérez les modules complémentaires".

Cette vidéo permet de comprendre l'objectif de "CustomizeGoogle". A l'aide d'exemples simples vous verrez comment cette extension améliore l'apparence et ajoute des fonctionnalités aux services Google.

Si vous deviez ne tester qu'une seule option, choisissez : "Résultats des pages suivantes à la suite de la première".

Fonctionnalités présentées :
suppression des publicités,
ajout d'un compteur,
affichage de tous les résultats sur une seule page,
filtrage des sites que vous connaissez déjà,
choix de langue pour l'interface (ex : le breton),
choix de langue pour les résultats (ex : le tchécoslovaque).

Liens externes

Page de téléchargement du module "CustomizeGoogle"

En savoir plus

Le tutoriel "Paramétrez les langues" explique comment utiliser les langues pour améliorer vos recherches.

Descriptif de la vidéo

Format : Flash
Durée : 3 minutes environ

Bloc-notes : installation

michael — 2008-09-12T17:29:07Z

Cette extension est un raccourci pour accéder à votre bloc-notes Google, elle permet à la fois de l'enrichir mais aussi de le consulter en un seul clic.

Description du tutoriel

Cette vidéo présente l'installation de l'extension "Google Bloc-notes" et une rapide collecte d'informations. Vous aussi verrez le comportement du mini bloc-notes dans le navigateur. Pour en savoir plus sur l'utilisation du bloc-notes consultez le tutoriel Utilisation de Google Bloc-notes

Fonctionnalités présentées :
téléchargement et installation de l'extension,
visualisation de l'icône,
affichage et comportement du mini bloc notes,
collecte d'informations à l'aide du mini bloc-notes,
collecte d'informations à l'aide du clic droit,
retrouver des notes,
utiliser le titre d'une note comme lien.

Ce que vous ne verrez pas dans cette vidéo

Certains termes ne sont pas approfondis (mini bloc-notes, fenêtre externe, libellés ...) vous les trouverez dans les tutoriaux de la rubrique Google Bloc-notes.

L'installation présentée s'effectue sur Mozilla Firefox. Il est possible d'arriver au même résultat sur internet explorer.

A savoir

Un raccourci "bloc-notes" est présent dans la barre d'outils version 5

Liens externes

Page de téléchargement du module "Bloc-notes"

Descriptif de la vidéo

Format : Flash
Durée : 2 minutes environ

Scrapbook : première utilisation

michael — 2008-05-22T13:25:24Z

Vous souhaitez conserver des archives de vos pages web préférées avant qu'elle ne disparaissent. Essayez Scrapbook, vous pourrez en plus les organiser par thèmes.

Description du tutoriel

Cette vidéo se contente de parcourir les fonctions de base que sont la capture d'une page web et l'organisation de votre collection de pages web disponibles sur votre disque dur.

Vous pourrez comparer la qualité d'une capture par rapport à un "enregistrer-sous".

Fonctionnalités présentées :
"Enregistrer-sous" de Firefox,
comparaison du résultat avec la page d'origine,
capturer une page à l'aide de scrapbook,
reconnaître l'original de la copie,
paramétrer une capture,
marquer une page,
afficher le panneau latéral,
modifier l'arborescence.

La fonctionnalité "Marquer une page" est identique à un favori, aucun fichier n'est copié sur votre disque dur.

Pré-requis

Scrapbook est un module complémentaire (add_ons) de Firefox, il est nécessite donc une installation, un tutoriel "Gérez les modules complémentaires" explique ce type de manipulation.

Liens externes

Page de ce module Firefox

Descriptif de la vidéo

Format : Flash
Durée : 2 minutes environ

Colorzilla : première utilisation

michael — 2008-03-09T18:50:37Z

Retrouvez les couleurs contenus dans une page web. Créez votre palette de couleurs personnalisées.

Description du module complémentaires

ColorZilla est une extension pour Firefox qui permet de récupérer une couleur présente dans une page web.

A l'aide de la pipette Colorzilla, vous sélectionnez la couleur et automatiquement vous aurez sa description en RVB ou en héxadécimal.

Cette extension propose aussi une exploration du DOM de la page, elle vous retournera la balise utilisée pour l'élément que vous avez sélectionné. Cette possibilité est moins complète qu'une extension comme Web Developer mais le service rendu vaut le détour.

Le clic droit permet d'accéder à de multiples services comme l'archivage de vos couleurs préférées. La fonction zoom reste anecdotique.

Colorzilla est une extension indispensable si vous faites du webdesign.

Installation d'un module complémentaire pour Firefox

Le tutoriel "Gestion des modules compémentaires" propose de vous l'expliquer en image

Liens externes

Firefox : site officiel
Colorzilla : description et téléchargement

Descriptif de la vidéo

Format : Flash
Durée : 1 minute environ