Webdesign Daily – Mozilla TowTruck, WordPress Bookmarklet & Site Tour Plugins
Kommentare

Wie immer stellen wir Euch an dieser Stelle nützliche Tipps, Tricks und Fundstücke für Webdesigner und -entwickler vor.

Mozilla TowTruck – Kollaborieren in Echtzeit

Mozilla hat mit TowTruck ein neues, webseitenbasiertes Kollaborationswerkzeug vorgestellt. Das experimentelle Labs-Projekt soll es Website-Entwicklern ermöglichen gemeinsam in Echtzeit an Webprojekten zu kooperieren.

Geschrieben wurde es in HTML, JavaScript und CSS, die Integration per Button auf der eigenen Website soll sich deshalb einfach gestalten. Plugins werden keine benötigt.

Mozilla TowTruck
Das User Interface von Mozilla TowTruck (© Mozilla).

Um eine Kollaboration zu starten, klickt man den grünen „Collaborate“-Button und das TowTruck Interface erscheint. Dann teilt man den von TowTruck generierten Link mit seinen Kontakten. Wird die Kollaborationseinladung angenommen und der Kontakt ist live dabei, sieht man Mouse und Cursor der Kollaborateure (was ein wenig an Google Docs bzw. Google Drive erinnert) und gemeinsam das Projekt bearbeiten.

Auch ein Text-Chat mit den Co-Workern ist möglich. Das auf WebRTC basierende Voice-Chat-Feature ist laut den Machern derzeit noch sehr „experimental“.

Das TowTruck Projekt ist OpenSource, eine weitere Einführung gibt’s im folgenden Video:

TowTruck Alpha – From Mozilla Labs from Simon on Vimeo.

WordPress Admin Toolbar Bookmarklet

Dieses JavaScript Bookmarklet richtet sich an Administratoren und Designer von WordPress Websites. Mithilfe von jQuery fügt es das Default WordPress Admin-Menü zu jeder Seite hinzu, auf der man sich gerade befindet. Das Menü wird mit CSS gestyled und in der oberen rechten Ecke angezeigt. Vorausgesetzt man surft gerade über eine WordPress basierte Website, bekommt man so aus dem Frontend umgehend Zugriff auf das gesamte WordPress Admin-Backend – natürlich nur, wenn man sich mit korrekten Zugangsdaten einloggt.

WordPress Toolbar Bookmarklet

Das WordPress Toolbar Bookmarklet wird wie jedes Bookmarklet einfach in die Bookmark Toolbar gezogen (Bildquelle: http://iamnotagoodartist.com)

Zu finden ist das Bookmarklet hier: http://iamnotagoodartist.com/other/wordpress-admin-toolbar-bookmarklet/

jQuery Plugins für Website Touren

Zu wissen, wie User über meine Website surfen und wie sie den gebotenen Content wahrnehmen gehört heutzutage zum guten Ton, wenn es an Website Analytics geht. Doch anstatt sich auf die Intuition des Users zu verlassen, besteht immer auch die Möglichkeit, den Website-Besucher mit simplen Methoden über die Seite zu führen. Simpel ist gut, doch das heißt nicht, dass solche Site Touren hässlich aussehen müssen. Es gibt eine Reihe von JavaScript Plugins, die die Führung des Users vereinfachen und dabei auch noch stylisch rüber kommen. Hier sind drei Alternativen:

Pageguide.js
Dieses Plugin überzeugt durch ansprechende Optik, insbesondere die Hervorhebungen sehen toll aus. Ein spezieller Fuß- oder Kopfbereich erlaubt ein einfaches Navigieren durch die einzelnen Schritte der Site Tour und liefert dabei noch Infos zu den Schritten. 

Pageguide.js

Bootstrap Tour
Dieses jQuery Site Tour Plugin lädt die Inhalte der einzelnen Tourabschnitte in Bootstrap Popup-Fenstern. Die einzelnen Abschnitte der Tour und der Inhalt werden in JavaScript definiert (inklusive zahlreichen Optionen bezüglich Farbe und Verhalten der Overlays).

Bootstrap Tour

Crumble
Dieses Plugin verfolgt einen anderen Ansatz. Ein Interface aus Sprechblasen führt hier den User über die Website. Klickt man auf die Blase, erscheint der nächste Tourabschnitt. Crumble setzt das Script grumble.js voraus, das auf Github runtergeladen werden kann.

Crumble

 

 

 

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -