In diesem Beitrag möchte ich euch einige kleine Helfer vorstellen, die euch als Webdesigner und Entwickler den Alltag wesentlich erleichtern können. Zwar handelt es sich bei den Tools nicht um Open Source Software, sondern um kommerzielle Produkte, die relative geringen Investitionskosten lohnen sich aber, da der Workflow wesentlich vereinfacht wird.
Bei den Tools handelt es sich um eine Mac Applikation und zwei Photoshop Plugins für Windows und Mac OS.
(weiterlesen …)
Heute morgen hat mir mein lieber Kollege Dennis Kovarik eine wirklich interessante Webseite via Skype zu kommen lassen, die sich auch direkt einen Platz in meiner Bookmark Liste verdient hat.
(weiterlesen …)
Jedem Webdesigner sollte text-indent:-9999px; eigentlich bekannt sein, es wird in der Regel verwendet um zum Beispiel bei Logos oder anderen Bildern, die mit SEO-Texten oder Bildbeschreibungen hinterlegt sind, die entsprechenden Text auszublenden. Ein anderer Anwendungsfall, sind über Bilder gesetzte Texte, die z.B. aus Lizenz Gründen nicht via @font-face eingebunden werden können.
Mit text-indent:-9999px; wird dann der Text in einen so hohen negativ Bereich eingerückt, dass dieser nicht mehr über dem Bild sichtbar ist. Diese Variante ist nun allerdings nicht mehr wirklich aktuell und es gibt auch aus technischer Sicht wesentlich bessere Lösungen.
Das grundsätzliche Problem mit text-indent:-9999px; ist, dass der Browser jedes mal ein 9999px Großen Container rendern muss, obwohl es hier Performance technisch bessere Varianten gibt.
(weiterlesen …)
Die aktuelle Smartphone, Tablet und sogar Computer Generation beschert uns mit den, umgangssprachlich als Retina Displays bekannten (danke Apple), High-DPI (HiDPI) Displays schärfere Schrift und grandiose Bilder. Wer bereits ein Endgerät mit Retina Display sein eigenen nennen darf, wird mir zustimmen, dass der Wechsel zurück zu einem normal aufgelösten Gerät, sich doch sehr unangenehm anfühlt (bei mir bezieht sich das ganze auf einen Vergleich zwischen dem iPad 1 und einem iPad 4). Plötzlich werden Schriften und Bilder grob und pixelig, ganz generell springt einem jeder einzelne Pixel ins Auge.
Aber diese Zeiten sind ja Gott sei Dank vorbei, ab jetzt werden nur noch Geräte mit Retina Displays gekauft und alles ist gut, aber Moment da war doch noch etwas…
Wenn wir jetzt auf unseren neuen und schicken Retina-Tablets auf nicht für High DPI Displays optimierten Webseiten surfen, wirken Bilder und Icons auf einmal merkwürdig verwaschen und gar nicht so schön scharf, wie es eigentlich sein sollte.
(weiterlesen …)
In diesem kleinen Artikel möchte ich euch den Code-Editor Sublime Text 2 vorstellen, den ich seit einigen Tagen selber auch relativ häufig verwende. Bei mir stellt es sich in der Regel alle paar Monate oder wenn die Software gut ist, auch nur alle paar Jahre ein, dass ich die Software wechsle. Damit meine ich keine einfachen Versions-Updates, sondern den Wechsel von einem Software-Produkt zum anderen.
Zu Sublime Text 2 hat mich mein aktueller Editor Coda 2 von Panic gebracht oder besser gesagt getrieben.
(weiterlesen …)
Animationen im Internet entwickeln sich ebenso weiter, wie der Rest der digitalen Welt. In diesem Artikel erfahren Sie, wie aktuelle Animation mit Hilfe von CSS3 umgesetzt werden können. Neben der Möglichkeit diese selber zu programmieren gibt es auch Software mit der entsprechende Animationen realisierbar sind. Sie werden in diesem Artikel an einigen Praxisnahen Beispielen den Umgang mit CSS3 Animationen lernen, sowie Software entdecken, mit der sich HTML5 und CSS3 Animationen umsetzen lassen.
Wer kennt sie nicht, die Ursprünge von Animationen im Internet? Meist handelte es sich hier um blinkende, hüpfende oder drehende GIF Grafiken. Mein persönlicher Favorit der alteingesessenen GIF-Animationen ist das drehende und hüpfende @-Zeichen, mit Verknüpfung auf Email-Adressen oder Kontaktformulare. Leider gibt es immer noch zu viele Webseiten, die diese oder ähnliche Grafiken verwenden. Doch diese liegen in der Regel weit entfernt von jeder professionellen Linie.
(weiterlesen …)
Ist euch Data Becker ein Begriff? Den Düsseldorfer Fachverlag für Software, IT-Literatur, PC-Zeitschriften und Computer-Zubehör gibt es noch immer. Er wurde 1981 gegründet und ist nach Unternehmensangaben einer der ältesten deutschen Fachverlage für Computer-Themen. Die Software-Abteilung von Data Becker hat sich mittlerweile auf Internet-Lösungen spezialisiert. Jüngstes Erzeugnis ist eine Windows-Anwendung namens „A5 HTML5 Animator“, mit der sich Web-Animationen in HTML5 erstellen lassen. Die Software ist aktuell kostenlos als Preview-Version zum Download erhältlich. Im Oktober soll die finale Version erscheinen.
Vergleichbar sein soll die Software mit bekannten Lösungen wie Tumult Hype, Sencha Animator oder Adobe Edge. Da HTML5 und die Erstellung von Animationen für uns Webmaster wichtige Themen im Arbeitsalltag sind, habe ich mich mit Michael Bieber, der bei Data Becker federführend für die Software zuständig ist, kurz unterhalten. Im Interview plaudert er ein wenig aus dem Nähkästchen und stellt uns die Software, die unter www.a5-animator.de heruntergeladen werden kann, näher vor.
(weiterlesen …)