Zum Inhalt springen

Webdesign

Pick: „LiveReload“ für Web-Designer oder so

LiveReload_350In der bitundso Folge Nr. 330 (LINK zur Folge) hat Gerrit ein Tool vorgestellt, welches sich „LiveReload“ nennt und speziell für Leute interessant sein dürfte, die sich hin und wieder mit Webseiten beschäftigen. Ich selber bin davon auch immer wieder „betroffen“ und wer kennt nicht die umständliche Arbeitsweise:
Datei lokal bearbeiten, (per FTP  *) auf den Server schieben und dann im Browser (per Reload) kontrollieren, ob alles passt. Genau hier setzt LiveReload an und möchte einem das Leben leichter machen. Es überwacht quasi, ob ein Speichern-Button gedrückt wurde und nimmt dies dann zum Anlass im Browser einen Reload durchzuführen. Die App findet ihr auf: http://livereload.com und im MacApp-Store und kostet US$9.99 bzw. 8,99 EURO. Das Programm ist derzeit für den MAC in der Version 2, für Windows als Beta-Version und für Linux als Browser-Erweiterung „guard-livereload“ zu bekommen.
Ich halte diese App für ein sehr nützliches Tool und möchte nicht mehr darauf verzichten. Also einfach mal einen Blick darauf werfen – es lohnt sich.

* Was auch gehen müsste, was ich aber noch nicht selber getestet habe: Man müsste eine Verknüpfung mit einem FTP Programm und LiveReload machen können. Zum Beispiel mit „Transmit“ von panic. Und dann würde wenn man etwas in einem Editor bearbeitet (z.B. Coda von panic) sowohl die Datei per FTP auf den Server geschoben werden, als auch eine Sofort-Vorschau im Browser angezeigt werden. Dies funktioniert deswegen so gut, weil LiveReload auch das Temp-Verzeichnis vom „Transmit“ überwacht und die Voraschau mit den lokalen Dateien erzeugt.

(Pick) xScope

Heute möchte ich euch das Programm „xScope“ (Mac App Store Link) von der Iconfactory vorstellen. Aber alles mal der Reihe nach. 
Da ich hin und wieder Webseiten erstelle und gestalte, war ich auf der Suche nach einem Tool, welches mit eine Art Lineal oder Hilfslinien auf Bildschirm zeichnet. Leider kannte keiner meiner Bekannten ein solche Tool, weswegen ich auf die Idee kam, Gerrit van Aaken (Twitter: @gerritvanaaken) von http://praegnanz.de/ , der mit von BitsundSo bekannt war, via Twitter (http://twitter.com/#!/gerritvanaaken) um Rat zu Fragen. Und tatsächlich hatte er den Tipp, dass ich mir mal das „xScope“ anschauen sollten.
In der Tat macht dieses Programm genau dass, was ich mir vorgestellt habe. Und ich denke mal, jeder, der Hin und wieder mit Design vom Webseiten zu tun hat, kann diese Programm brauchen und wird es zu schätzen wissen. Nachfolgend einige Funktionen, die das Designer oder Programmierer-Leben leichter machen:

  • Dimensions – mit mit kann man „Entfernungen“ von einem Bezugspunkt messen
  • Rulers – ein horizontales und vertikales Bildschirm-Lineal, mit dem man in Pixel messen kann.
  • Screens – Bildschirme von verschiedenen mobilen Geräten werden als Ausschnitt auf dem Mac-Bildschirm dargestellt. So kann man Prüfen, wie und ob es auf dem mobilen Geräte passt.
  • Loupe – eine Bildschirmlupe, die auch gleichzeitig den HEX Wert der Farbe angibt über welcher man sich gerade befindet.
  • Guides – horizontale und vertikale Hilfslinien, die sich frei auf dem Bildschirm verschieben lassen. Mein Killer-Feature!
  • Frames – Rahmen, der in der Größe frei einstellbar ist, um feste Größen am Bildschirm darzustellen.
  • Crosshair – Fadenkreuz, welches die x und y Koordinaten der jeweiligen Bildschirmposition anzeigt.

Das Programm kann über die Webseiten der der Iconfactory (http://iconfactory.com/software/xscope) zum Preis von $29,99 oder über den Mac App Store für 15,99 EUR bezogen werden. 

Ich möchte dieses Programm wirklich wärmstens weiter empfehlen, da es mir das digitale Leben um einiges einfacher gemacht hat. Absolute Kaufempfehlung. 🙂