- 3 interessante Infografiken für Developer
Infografiken liegen im Trend. Dabei ergeht es zumindest mir mit ihnen mittlerweile so wie mit der nächsten Powerpoint-Präsentation im nächsten Meeting: Sie hängen mir zum Halse raus. Allerdings stolpere ich ab und zu doch über die ein oder andere Ausnahme. Die folgenden drei Ausnahmen beschäftigen sich mit dem Freelancertum, der Datenflut im Weltennetz und der Updatehäufigkeit des Google Algorithmus. Nicht schon wieder Powerpoint, bitte! (Bildquelle: Benjamin Thorn / pixelio.de) Data Never Sleeps: Eine Minute im Internet Auf der Basis von Daten aus Website-Monitoring-Diensten wie Pingdom entwickelte das Team von Domo die folgende Infografik. Sie zeigt, was in jeder Minute eines Tages im Netz los ist. So erfährt man, dass Google 2 Mio. Suchanfragen abwickelt, auf YouTube 48 Stunden Video-Content hochgeladen werden oder Facebook-User fast 700.000 Inhalte teilen. Im direkten Vergleich interessant ist, dass Instagrammer mit 3.600 Bildern pro Minute aktiver sind als Flickr-User, die indes immer noch auf 3.125 Bilder pro Minute kommen. Wer die E-Mail abschreiben will, sollte sich das anhand der Zahlen nochmal überlegen. Sie dominiert mit über 200 Mio. Sendungen pro Minute weiter klar die Datennetze. (Bitte auf die Grafik klicken, um die vollständige Version zu sehen) (Quelle: Domo-Blog) Inside The Mind Of A Freelancer: Was geht [...]
- jQuery: Erste Beta der Version 1.8 bringt zahlreiche Änderungen
Gestern wurde im offiziellen jQuery-Blog die öffentliche Verfügbarkeit der ersten Beta der neuen Version 1.8 bekanntgegeben. Entwickler sind aufgefordert, ihre Anwendungen unter Einbindung der 1.8er Beta zu testen und etwaige Bugs zentral zu melden. Gleichzeitig vermeldet das Team, dass mittlerweile die Hälfte aller großen Websites von der beliebten Javascript-Bibliothek angetrieben wird. Die kommende Version bringt zahlreiche Veränderungen, die nicht nur im Hinzufügen von Funktionalität, sondern insbesondere in deren Entfernen bestehen. Was auf den ersten Blick paradox klingt, ist Teil der natürlichen Evolution des inzwischen sechs alten Projekts. Wir stellen die wichtigsten Änderungen kurz zusammen. In drei Tagen startet die jQuery-Konferenz in San Francisco… Modularität Mit Version 1.8 wird jQuery modular. Unter Verwendung des Kommandozeilentools grunt kann sich jeder eine angepasste jQuery-Version erstellen, die lediglich die von der eigenen Website benötigten Module enthält. Ausgeschlossen werden können derzeit die Module ajax, css, dimensions, effects und offset. Durch das Ausschließen aller optionalen Module wird die einzubindende Bibliothek etwa um ein Drittel kleiner und bringt nurmehr 21kb auf die Waage. Der Unterschied erscheint in absoluten Zahlen nicht besonders hoch, kann jedoch auf mobilen Plattformen spürbare Auswirkungen zeitigen. Vorsicht ist dann geboten, wenn man auf Dritt-Plugins setzt, da diese mit Abhängigkeiten zu Modulen arbeiten könnten, [...]
- Bookmarklet Combiner schafft Platz in der Lesezeichen-Leiste
Ich weiß nicht, wie Ihr Workflow aussieht, wenn Sie Inhalte im Netz teilen oder ablegen. Ich jedenfalls benutze, wo immer es möglich ist, Bookmarklets. Dabei handelt es sich um diese kleinen Javascript-Fetzen, die Funktionen ausführen, wie das Teilen der Seite, auf der man sich gerade befindet, auf Twitter oder das Ablegen der Seite für späteres Lesen in Pocket oder Instapaper. Wo immer ein Dienst existiert, der Daten aufnehmen will, er verfügt über ein Bookmarklet. Ich ziehe Bookmarklets inzwischen auch dedizierten Plugins, Extensions and what not vor, wenn diese nicht über nennenswert größere Funktionalitäten verfügen als ihre Scriptlet-Pendants. Der Haken an dieser Vorliebe ist: Der Platz in der Lesezeichenleiste wird knapp, man ist gezwungen sich eine Ordnerorganisation zu überlegen. Real Life Bookmarklets: Voll retro (Bildquelle: Andreas Carjell / pixelio.de) Bookmarklet Combiner kann beliebig viele Bookmarklets mit einem Klick abfeuern Das kleine Onlinetool Bookmarklet Combiner geht einen anderen Weg. Es kombiniert einfach beliebig viele Bookmarklets in eines, das man dann auch noch mit anderen teilen kann, so man das möchte. Die Vorgehensweise ist simpel und erklärt sich bei der ersten Nutzung nahezu von allein. Sämtliche zu kombinierenden Bookmarklets werden nacheinander unter Punkt 1 “Enter bookmarklets”, beginnend mit einem Namen, in die dafür [...]
- Socialite.js: Flexible Social Media-Integration jetzt in neuer Version 2.0
Socialite.js ist ein etabliertes kleines Javascript-Tool für die flexible Einbindung verschiedener Social Media-Dienste. Das Interessante an Socialite.js ist zweierlei. Zum einen wird die Einbindung der Buttons durch beliebige Events gesteuert. So ist man nicht darauf angewiesen, den Besucher auf den Seitenaufbau warten zu lassen, bloß weil die Social-Knöppe noch nicht geladen sind. Zum anderen kann auf die manuelle Einbindung der nativen Buttons der verschiedenen Dienste verzichtet werden. Socialite.js verhält sich exakt wie die Originale. Vor gut zwei Wochen brachte Entwickler David Bushell die Version 2.0 seines Tools hervor. Jeder kennt jeden um fünf Ecken (Bildquelle: Gerd Altmann / pixelio.de) Socialite.js: Jetzt mehrsprachig und mit Hook-Funktionalität In Version 2.0 unterstützt Socialite.js Mehrsprachigkeit, kann mithin einfacher lokalisiert werden. Zudem führt Bushell Event-Hooks in das Tool ein. So können die Social Buttons geladen werden, wann der Seitenbetreiber das will. In Frage käme am Beispiel einer Magazinseite etwa das Laden beim Öffnen eines Beitrags oder beim Überfahren eines Beitrags mit der Maus oder sogar erst nach einem ausdrücklichen Klick. Hier sind der Fantasie nur insofern Grenzen gesetzt als es lediglich eine begrenzte Anzahl denkbarer Events gibt. Socialite.js implementiert übrigens die einzelnen Dienste streng nach deren Vorgaben. Es ersetzt also die ansonsten händisch zu erledigende [...]
- Freepik: Suchmaschine für kostenlose Design-Ressourcen
Fotos, Vektorgrafiken und Photoshop-Dateien: Diese drei Begriffe definieren ziemlich genau die Bereiche, in denen jeder Designer ständig auf der Suche ist. Freepik ist ein Suchmaschine aus dem schönen Spanien, die sich genau auf diesen Bedarf spezialisiert hat und zur ersten Anlaufstelle werden will. Das Konzept ist einfach. Suchende verwenden es wie jede andere Suchmaschine auch mit frei formulierten Begriffen. Freepik gibt darauf hin mehr oder weniger passende Suchergebnisse zurück. In meinem kurzen Test konnte der Dienst durchaus überzeugen, wenn auch nicht uneingeschränkt. Freepik: die Startseite Freepik: Lizenzen bleiben auch hier Fallstricke Freepik funktioniert nach eigenen Angaben mit automatisiert das Internet durchforstenden Robots. Nur so ist auch die immense Zahl von über 1,3 Mio. verschiedenen Ressourcen zu erklären, die Freepik zu finden verspricht. Laut Betreiber erfolgt auch die Beurteilung des Content und die Katalogisierung, sofern er für relevant gehalten wird, automatisiert. Die Angaben zur jeweiligen Ressource werden aus der Ursprungsseite ausgelesen und auf Freepik mit angezeigt. Hier ist die gültige Lizenz von besonderer Bedeutung, denn hierin lauert bekanntlich das größte, vor allem teuerste Konfliktpotenzial. Hat man sich für eine Ressource entschieden und sich auf Freepik die relevanten Informationen angeschaut, führt ein Klick auf den Download-Link zur Ursprungsseite, die die Ressource letztlich [...]
- Update 2012: Einnahmen-Ausgabenrechnung für jedermann (mit Excel)
Vor zwei Jahren schrieb Dr. Web-Autorin Manuela Müller einen bis heute viel beachteten Beitrag zum Thema Einnahme-Überschussrechnung. Eigens für diesen Beitrag entwarf sie eine entsprechende Kalkulationstabelle auf der Basis von Open Office und Excel. Dieses Tool nahm sich unser Leser Thomas Räbiger vor und arbeitete es auf den heutigen Stand der Erfordernisse um. Freundlicherweise stellt er es der Dr. Web-Leserschaft zur freien Verfügung. Kleine Einschränkung der aktuellen Version: Sie funktioniert nur unter Excel ab der Version 2007 für Windows und der Version 2008 für Macintosh. Der Versuch, mittels des Befehls “Speichern unter” eine ODS-Version, sowie eine für ältere Excel-Versionen zu generieren, scheiterte mit Warnhinweisen zu verloren gehender Funktionalität. So haben wir es gelassen. Ansonsten finden Sie nachfolgend den ursprünglichen Beitrag, allerdings auf den aktuellen Rechtsstand gebracht. (Bildquelle: Thorben Wengert / pixelio.de) Der Fiskus: das unbekannte Wesen Für viele Selbstständige – vor allem für Existenzgründer – ist die Buchführung eine lästige Pflicht. Dies vor allem, weil sie ein großer Zeitfresser ist. Besonders dann, wenn weder Buchführungskenntnisse noch eine entsprechende Software vorhanden sind und zudem die Neigung besteht, ein- und ausgehende Rechnungen nebst Zahlungsbelegen bunt durcheinander gewürfelt in Ablagekörben oder Schuhkartons zu horten, wird die Buchführung zu einer Mammutaufgabe. Mit ein wenig [...]
- AngularJS erweitert HTML um Anwendungslogik und Web Components
Vor zwei Tagen stellte ich das Mozilla-Projekt X-Tag an dieser Stelle vor. Mit X-Tag ist es möglich, auf der Basis von Javascript eigene HTML-Elemente zu entwerfen und zu verwenden, als würden sie im Standard so bereit gestellt. X-Tag basiert locker auf dem aktuellen Stand der Diskussion des W3C Arbeitspapiers zu Web Components, wobei es sich auf den Teilbereich Custom Elements beschränkt. Googles AngularJS schlägt in die gleiche Kerbe, ist dabei aber nicht nur auf Custom Elements beschränkt, sondern liefert einen anwendungslogischen Teil mit. Wir werfen einen Blick auf Googles Vorschlag. AngularJS: Model Driven Views und Custom Elements AngularJS ist ein komplexes Javascript-Framework, entworfen mit dem Ziel, HTML fitter für Web Apps zu machen. Mit AngularJS wird HTML dynamischer und kann in begrenztem Umfang direkt auf Benutzereingaben reagieren. Im Grunde liefert AngularJS keine wirklich alleinstellenden Leistungsmerkmale. So kann alles, was mit AngularJS möglich ist, auch auf andere Weise, etwa mittels jQuery, das AngularJS übrigens integriert, erreicht werden. Der Unterschied besteht nicht in der Leistungsfähigkeit, sondern in der Art und Weise der Umsetzung. Und die ist in der Tat anders… Wie bei X-Tag ist es auch bei AngularJS sinnvoll, sich die Vorgehensweise anhand eines Codebeispiels zu verdeutlichen. Der folgende Code erzeugt ein [...]
- jQuery Knob: Canvasbasierter Drehknopf für virtuelle Thermostate
Schon gut. Natürlich ist das folgend vorgestellte jQuery-Plugin Knob nicht für virtuelle Thermostate erdacht worden. Vielmehr lässt sich mit dem flexibel konfigurierbaren Drehrädchen so ziemlich alles steuern, was man üblicherweise mit solchen Bedienelementen im Web steuert. Es eignet sich beispielsweise für die Lautstärkenregelung, die Erhöhung von Helligkeit und/oder Kontrast, das Spulen innerhalb von Medien, eben ganz generell die Einstellung beliebiger Werte in Web Apps. jQuery Knob funktioniert sogar auf Touchscreens Der jQuery Knob ist ein rein Javascript- und HTML5-basierter Drehregler, der sowohl auf Touchscreens, wie auch mit Mausrad und Tastatur verwendet werden kann. Hat der Benutzer Javascript deaktiviert, wird der Bereich, in dem eigentlich der Knob zu sehen sein sollte, als reines Input-Element des Typs Text angezeigt. Die Knobifizierung des Input-Elements erfolgt durch die Vergabe der Klasse “dial”. Den eigentlichen Canvas zeichnet sich das Plugin per Anwendungslogik zum gegebenen Zeitpunkt selbst. Auf Grafikdateien wird komplett verzichtet. Mit HTML5 Data-Attributen fügt man dem Input-Element Optionen hinzu, die sich sowohl auf das Verhalten wie auch auf die Optik auswirken können. So konfiguriert man Mindest-, wie Höchstwerte, legt einen Endpunkt fest, schaltet die Steuerung aktiv oder inaktiv (für reine Infodisplays) und kümmert sich um das Layout des Reglers, der im Standard in einer [...]
- Initializr jetzt auch mit Bootstrap und “Mobile First”-Template
Initializr ist ein Onlinedienst, mit dessen Hilfe man sich eine Projektvorlage auf der Basis der HTML5 Boilerplate (H5BP) zusammenklicken kann. Vor ziemlich genau einem Jahr berichtete ich erstmals darüber. In der Zwischenzeit wurde das Projekt des Entwicklers Jonathan Verrechia deutlich erweitert. So ist es mittlerweile nicht nur möglich, H5BP zu verwenden. Vielmehr steht ein dediziertes Responsive-Template, sowie Twitters Shooting Star Bootstrap zur Verfügung. Initializr: die Initialzündung für das eigene Webprojekt Junge, wie die Zeit vergeht. Da dachte ich vor knapp 12 Monaten noch, Initializr habe keine große Perspektive. Zu limitiert erschienen mir die Möglichkeiten. Lediglich H5BP wurde unterstützt, responsives Design nur in dessen Rahmen und den Modernizr musste man sich manuell besorgen. Umso überraschter war ich, bei einem Routine-Blick auf ältere Projekte feststellen zu können, dass Verecchia in den letzten 12 Monaten keineswegs untätig gewesen ist. So hat er vor allem eine handfeste Alternative für das responsive Webdesign durch den Einbau von Twitters Bootstrap in Initializr geschaffen, auch Modernizr backt er jetzt gleich mit ein. Bootstrap, das Framework aus dem Hause Twitter, stand zum Start des Initializr noch gar nicht zur Verfügung, sondern wurde erst letztes Jahr im Juli der Web-Öffentlichkeit zugänglich gemacht. Seither erlebt es einen regelrechten Boom. Developern, [...]
Bildquelle: GitHub Repo.js bindet die Dateistrukturen der Projekte ein Clarkes Plugin bindet die Repositories, also die Dateiablagen der Projekte ein. Dazu verwendet es die beiden komplementären Scripte Vangogh und highlight.js, die sich im Wesentlichen um die Optik der Darstellung kümmern. Ein mit Repo.js eingebundenes Repository lässt sich bis auf die Dateiebene anzeigen. Das Öffnen der einzelnen Dateien ist ebenfalls möglich, allerdings ohne weitere Formatunterstützung. So werden vorhandene Grafiken nicht als solche angezeigt. Sämtliche Dateien werden als Quelltext geöffnet, eine Umsetzung etwa von Markdown findet ebenfalls nicht statt. Der Aufruf ist simpel. Nachdem jQuery und Repo.js eingebunden sind, reicht folgender Codeschnipsel an der Stelle der Website, die das Repository anzeigen soll: $(’body’).repo({ user: ‘darcyclarke’, name: ‘Repo.js’ }); Screenshot: So sähe das mit dem [...]