201310Dez

Type Rendering Mix: Web-Schriftarten richtig glätten

Individuelle Schriftarten auf einer Website sind in erster Linie etwas Positives, da sie dem angedachten Design gerecht werden und für mehr Harmonie sorgen, wenn die gesamte Typografie entsprechend abgestimmt wurde. Allerdings werden Web-Schriftarten nicht in allen Browsern und Betriebssystemen gleich dargestellt. Ich hatte vor einiger Zeit berichtet, da seit Windows Vista und einer aktivierten Hardwarebeschleunigung das GDI-Rendering durch DirectWrite ersetzt wurde. Unter Mac OS X und iOS kommt das Font-Rendering "Core Text" zum Einsatz, das alle Schriftarten etwas kräftiger darstellt. Unter Android und Linux wiederum werden Texte durch FreeType angezeigt.
Um den verschiedenen Betriebssystemen und Browsern gerecht zu werden, kann das Skript Type Rendering Mix genutzt werden: Hiermit werden 2 CSS-Klassen auf das "html"-Element angewendet, die Aufschluss über das Font-Rendering (Rasterizer und Anti-Aliasing-Methode) geben.

Type Rendering Mix - Apply CSS based on the text rasterizer and antialiasing your browser is using

Wenn in einem Webdesign also eine eigene Schriftart verwendet wird, kann die CSS-Klasse "tr-coretext" beispielsweise so angepasst werden, das hier ein leichterer Schriftschnitt verwendet wird (font-weight). So kann in den unterschiedlichen Systemen ein einheitliches Schriftbild besser gewährleistet werden.

201309Dez

JavaScript: Zufallsdaten aller Art mit Chance.js

Für Designer ist es das "Lorem Ipsum", für Entwickler sind es Zufallsdaten: Blindtext oder temporäre Inhalte, die später durch echten Content ersetzt werden. In JavaScript können derartige Daten vor allem für automatisierte Tests interessant sein, wenn verschiedene Werte überprüft werden sollen. Mit der Bibliothek Chance.js können zufällige Daten aller Art erzeugt werden: Boolesche Werte, Strings, Zahlen, Textblöcke, Personendaten, Adressdaten, Farbwerte, E-Mail-Adressen, Zeitangaben, Beträge oder gar GUIDs.

Chance.js - Utility library to generate anything random for JavaScript

Chance.js steht als Standalone-Skript zur Verfügung und kann im Browser, mit RequireJS oder Node.js genutzt werden. Ein paar Beispiele:

  • chance.birthday({string: true, american: false});
  • => "28/6/1993"
  •  
  • chance.word({length: 5});
  • => "valve"
  •  
  • chance.natural({min: 1, max: 20});
  • => 14
  •  
  • chance.color()
  • => "#123456"

Auf der Website des Skripts findet sich die Dokumentation zu allen Funktionen sowie den möglichen Optionen.

201308Dez

Headroom.js: Kopfleiste durch Scrolling ausblenden

Der Effekt dürfte mittlerweile schon auf der einen oder anderen Website gesichtet worden sein: Wird durch das Scrollen der Seite ein gewisser Punkt erreicht, verschwindet der Kopfbereich der Seite. Oft handelt es sich dabei um eine kompakte Navigation, die wichtige Elemente beinhaltet. Dieser Effekt kann also nützlich sein, wenn ein Menü innerhalb eines bestimmten Bereichs der Seite angezeigt werden soll.
Wer zu dem Effekt das passende JavaScript-Modul sucht, ist mit Headroom.js gut bedient.

Headroom.js - Hide your header until you need it

Das Plugin kann direkt in JavaScript, in Verbindung mit jQuery oder mit AngularJS verwendet werden. Es bietet verschiedene Optionen wie eine Toleranz, einen vertikalen Offset sowie Klassen, die beim Eintreffen der Ereignisse vergeben werden. Mehr Details gibt es bei GitHub.

201304Dez

reSRC: Sammlung freier Bücher über Programmierung

Was darf es denn sein? Ein Exkurs in die Grafikprogrammierung mit DirectX, OpenGL und Shadern? Oder doch eher die Bereiche Software-Architektur, Datenbanken, Betriebssysteme und Datamining? Allein die Liste der unterschiedlichen Fachgebiete und Programmiersprachen scheint endlos zu sein: Bei reSRC gibt es die "List of Free Programming Books", die Entwickler-Herzen höher schlagen lässt. Hier dürfte wirklich für jeden Programmierer etwas dabei sein.

reSRC - List of Free Programming Books

Neben sprachunabhängigen Bereichen, die teilweise oben schon aufgezählt wurden, gibt es für ziemlich jede Programmiersprache Links zu kostenlosen PDF-eBooks oder Websites: Von ASP.NET und Assembler über C++, CoffeeScript und Dart, vorbei an Erlang, Go, Haskell, JavaScript und Lua bis hin zu Objective-C, PHP, Processing, Python, Ruby, Scala, SQL oder gar TypeScript. Inzwischen gibt es für JavaScript sogar Unterbereiche wie Knockout.js, AngularJS, Backbone oder node.js. Da lohnt sich das Stöbern also.