It was a long time since I started the development of my extension for Firefox. I easily manage to create a sidebar and list all the tabs. But quickly I found my first difficulties…
I searched how to create a thumbnail of a web page. Well, it’s quite easy there is a function for that : drawWindow. But I wanted to creat partial thumbnails, as explained of Alexander Limi article. And playing with ratio, screen width, thumbnail width was quite disappointing. I managed to create partial thumbnail, but only blurred.
Then is decided to create 2 XBL element. One for the tab container and another for the tabs (including the favicon, the title and the thumbnail). Here started the nightmare. I hacked TabSidebar extension to get inspiration but it’s a long process to dive in a project with thousands lines of code.
So, three days ago I give up and decided to test JetPack, by Mozilla Labs. JetPack should represent the future of extensions. It includes the jQuery framework (very handy for animations and events management) and you don’t need to restart the browser after installing jetpacks. However it’s a young plateform, there is a lot of bugs, you cannot localize your strings, there is no mechanisms for preferences handling, etc.
Anyway, I tried it and here it is :
Clearly, it lacks of polish, the code is messy and I have seen a lot of bugs. Moreover it’s broken with JetPack 0.5pre2…
Another screenshot, closer :
I don’t completely abandon the classic extension, but I will wait to finish the JetPack prototype so I will be more trained with JavaScript stuff. I think it’s all a matter of learning curve. JetPack one is more accessible ;)
As you may know, my first goal was to develop an extension which enable us to paste an URL into the download manager. This action should start the download of the file represented by the URL. The extension was just the first part, then I planned to create a bug on bugzilla and submit a patch on the Firefox trunk. The bug is filled (bug 506881) but as you can see it was marked as RESOLVED
WONTFIX :( I will finish my extension anyway but I had to find a new project.
So I decided to work on tabs.
I decided to use the sidebar and remove the traditional tab bar. Let’s imagine that you have less than X tabs (X will probably be calculated from the size of your screen), Firefox will display a sidebar with websites thumbnails. Moreover, the « new tab » button will have a search field to create directly a tab with the search results.
Those ideas are from Alexander Limi, a Mozilla employee. I encourage you to read his article Reinventing tabs for the browser to better understand the design purposes.
If I have more time, I plan to add « work spaces ». It’s like a box where you store a set of tabs, for later use.
Souvenez-vous, Firefox 1.0 avait fait découvrir les onglets au plus grand nombre (même si ce ne fut pas le premier navigateur à les gérer). Au fil du temps tous les navigateurs s’en sont dotés à tel point que maintenant sortir un nouveau navigateur sans onglets nous semble improbable.
Cependant la façon dont les différents navigateurs intègrent les onglets est, à quelques exceptions près, la même :
une barre d’onglet horizontale, placée au dessus ou en dessous de la barre de navigation,
l’ensemble des pages Web ouvertes sont listées par ordre d’ouverture de gauche à droite, en affichant leur titre.
Il n’y a bien qu’Opera 10 beta qui se démarque légèrement en permettant d’afficher une miniature de la page Web au dessus de son titre.
Opera 10 beta 2 et les miniatures dans les onglets
Comme nous pouvons le voir, l’innovation n’est pas au rendez-vous. J’y vois plusieurs raisons :
Certains internautes sont tout simplement satisfaits de la gestion actuelle des onglets.
Il y a un besoin de changement, notamment chez les utilisateurs avancés. Il suffit de voir le nombre d’extensions pour Firefox liées à la gestion des onglets (270+). Cependant chaque personne a ses propres besoins et selon l’utilisation que nous avons du Web, nos attentes peuvent être sensiblement différentes. Dans ce cas, comment satisfaire le plus de monde ? En attendant de trouver la réponse, le système ne bouge pas.
En étant large, nous pouvons classer les utilisateurs de navigateurs Web en deux catégories :
Les novices : ils ont un usage irrégulier d’Internet et n’ouvrent jamais plus d’une dizaine d’onglets à la fois.
Les expérimentés : Ils oscillent entre 10 et 30 onglets ouverts. Certains vont même jusqu’à une centaine d’onglets.
Ce sont ces derniers les plus insatisfaits. Certains ont déjà trouvé la parade en installant des extensions comme :
TabMixPlus : l’apparence de la barre d’onglet reste légèrement la même mais de nombreuses nouvelles fonctionnalités sont rajoutées (mise en valeur des onglets non lus, création de groupe d’onglets, etc.).
Exemple avec deux parties du panneau d’options de TabMixPlus
TreeStyleTab : les onglets sont affichés sous forme d’arbre dans un panneau latéral.
TreeStyleTab en action
FoxTab : cette extension permet de passer d’un onglet à un autre selon plusieurs manières plus ou moins « bling-bling » comme l’effet Windows Vista, via un carrousel, en mosaïque, à la coverflow, etc.
Foxtab en action
TabSidebar : cette extension affiche les onglets via la miniature de leur page Web dans un panneau latéral.
TabSidebar en action
Etc.
Pour ma part, j’ai juste adopté Tabs Open Relative qui ouvre les onglets à droite de celui en avant-plan et non pas tout à droite.
Si une solution qui pourrait satisfaire tout le monde (ou presque sinon on ne s’en sort pas) est trouvée, il restera à convaincre les gens de changer leur habitude. C’est un des freins les plus importants, si ce n’est le plus important, dans l’innovation. Pour arriver à mettre en place un nouveau système qui minimise le nombre de râleurs il faut absolument proposer une solution non pas 2 fois mieux mais 10 fois mieux que celle actuelle. Il faut que les utilisateurs se disent « mais comment ai-je pu faire avant ? ».
Est-ce que j’ai une telle solution ? Évidemment non, et elle n’est d’ailleurs pas facile à trouver puisque nombreux sont les gens à s’être penchés sur la question sans avoir trouver. Parmi les quatre projet les plus aboutis, j’ai retenu :
Reinventing tabs for the browser, par Alexander Limi : c’est un article d’un nouvel employé Mozilla (travaillant sur l’Expérience Utilisateur de Firefox), ancien de chez Google. Il propose d’utiliser un panneau latéral contenant la miniature des onglets, tant qu’il y en a peu d’ouverts. Au delà d’un seuil, les miniatures passeraient à un affichage comme TreeStyleTab. Enfin, pour les utilisateurs les plus expérimentés, il propose d’enlever toute interface du navigateur hormis la page Web et d’utiliser uniquement une version plus puissante d’Ubiquity.
Les différents niveaux de gestion des onglets selon Alexander Limi
Firefox.next: Tabs on the side?, par Aza Rakin : Aza fondateur d’Humanized est maintenant « Head of User Experience for Mozilla Labs ». Dans sa réflexion il propose aussi de se servir d’un panneau latéral. Il est possible d’y ranger les onglets dans des « work spaces » ou de les classer dans une catégorie « applications » pour les sites comme Gmail.
Prototype avec panneau latéral par Aza Raskin
Designing Firefox 3.2, par Oliver Reichenstein : ici l’auteur imagine gérer les onglets comme on gère la musique dans iTunes. La solution ne semble efficace que si l’on doit gérer un très grand nombre d’onglets. Une fois de plus, le panneau latéral est mis à contribution.
Le problème commun à chacune de ces approches est d’ordre technique : ce ne sont que des schémas visuels, il n’y a pas de prototypes à tester. La conception d’un prototype est donc le sujet que j’ai choisi pour mon projet MMTC.
Pour l’instant la solution que je considère la plus intéressante à tester est un mélange de la proposition d’Alexander Limi et d’Aza Raskin. Plus d’informations dans les prochains jours.
Je viens de tout casser, ou presque. J’approche dangereusement de la fin des études et donc de la recherche de travail, j’ai donc voulu rendre mon site plus complet et plus facile à retrouver. Le Navigosaure n’existe donc plus car :
le design était trop simple,
l’adresse était trop compliqué (je voyais passer du navigozor, navigauzore, etc.),
je n’étais pas administrateur de mon serveur,
j’utilisais encore Dotclear 1.2.
J’ai d’abord cherché un nom de domaine. tb.fr m’aurait plus s’il n’était déjà pris. À la place, ce sera donc tb4.fr (le premier qui trouve pourquoi 4 aura un free hug la prochaine fois qu’on se verra) avec Dotclear 2.1 et un nouveau design. En tant qu’administrateur/rédacteur ça me change la vie (dans le bon sens) mais mis à part ça :
je perd mon beau PageRank™ et mon référencement,
le site perd beaucoup en accessibilité,
je n’ai pas fini d’appliquer un style à tout les éléments, notamment les formulaires et les commentaires,
le nom de domaine est toujours aussi nase, mais plus court.
Malgré ces défauts il me fallait vite mettre en ligne la nouvelle version. Je vais maintenant utiliser le principe d’amélioration continue (notamment via les retours que j’aurais en commentaires) pour redonner à mon site une bonne qualité Web.
Sur une initiative de la Mozilla Foundation, de Mozilla Europe et de l'Universidad Rey Juan Carlos de Madrid (via LibreSoft), est né le Madrid Mozilla Technologies Course. C'est un cours de 3 mois, principalement en ligne, sur les technologies Mozilla avec une semaine de cours intensive à Madrid même. Le cours terminera mi-octobre avec le rendu d'un projet suivi, si réussite, de l'obtention d'un diplôme par l'université.
Comme vous l'avez peut-être déjà deviné, j'ai eu la chance de voir ma candidature acceptée et je suis d'ailleurs actuellement à Madrid, avec une vingtaine de camarades, en train d'assister aux cours de Paul et de Vivien.
En plus du suivi évident des cours, les élèves doivent rédiger en anglais au moins un article par semaine, ce que je vais donc faire directement sur ce site Web dans les semaines à venir. Le sujet des articles tournera autour de l'écosystème Mozilla, comprenant aussi bien des informations sur mon projet, sur Mozilla vu de l'intérieur ou sur la programmation XUL.