Podcast: Download (Duration: 25:08 — 15.8MB)

Willkommen zurück zu der ersten Episode im neuen Jahr 2019! Heute beschreibe ich für euch, welche Tools ich zum webdesignen benutze. Dabei geht es nicht um Tools, wie WordPress Plugins oder Analyse Tools, die zusätzlich genutzt werden, sondern in erster Linie darum, wie mein PC aufgebaut ist und welche Tools ich hauptsächlich dazu nutze, um Webdesign Arbeiten durchzuführen. Die Episode soll außerdem als Trainingsepisode für meine neuen Mitarbeiter dienen und einen Überblick über meine Arbeitsweise geben. Aber auch Ihr dürft selbstverständlich daran teilhaben! Die wichtigsten Tools sind für mich:

Das Display

Das wichtigste Werkzeug beim Webdesign ist ein großes Display. 27″, 3840×2160 sollten schon gegeben sein, um die Webseite zweimal darstellen zu können. Ich arbeite dann mit zwei Browserfenstern: der edit-Version und der normalen Ansicht.

Mozilla Firefox

Das zweite wichtige Tool ist für mich ganz klar Firefox. Chrome ist sicherlich auch in Ordnung, aber für mich persönlich ist Firefox der Favorit. Von Internet Explorer halte ich mich grundsätzlich lieber fern! Firefox hat ein paar Erweiterungen, die das Ganze zur Webentwicklungsengine machen. Zudem ist die Darstellung wirklich super.

  • Eines der Firefox Tools ist das ColorZilla Plugin. Das holt für dich ganz unkompliziert die Hexcodes von Farben runter, die Du auf Webseiten entdeckst. In der Leiste hast du dazu eine Pipette, mit der Du in die Farbe reinklickst, und schon hast du dazugehörigen Hexcode.
  • Das zweite Firefoxtool, dass dir beim webdesignen weiterhilft, ist das Webdesigntool. Darauf greifst Du zu über Strg+Shift+I, dann siehst Du die Webseite, so wie sie gerade heruntergeladen wurde im HTML-Code. Du kannst dir auf diese Weise die Font Gestaltung und weitere CSS Attribute anschauen. Das ist ist auch super, wenn Du die Bilderlinks aus dem HTML-Code rausziehen möchtest, die man über den Browser nicht bekommt. Auch CSS-Klassen können verwendet werden, um sich ein eigenes CSS zu bauen.

Browser stellen mit Hilfe des HTML-Codes die Webseite dar, die Du siehst. Ein Browser interpretiert manches anders als ein anderer Browser. Im Endeffekt ist es deshalb ratsam zwei verschiedene Browser zu verwenden, um die Ansichten miteinander zu vergleichen. Bei mir sind das eben Firefox und Chrome. Achte außerdem darauf, dass du mit deinem Browser nicht im WordPress angemeldet bist, nur dann siehst Du auch das was tatsächlich alle sehen, ohne private Details.

Notepad++

Notepad++ hat das Texteditoring zur Kunst erhoben. Es bietet zusätzlich eine Sprachenunterstützung, bei der die jeweilige Programmiersprache ausgewählt werden kann. Durch die Farbkodierung wird dann eine gute Darstellung und Struktur erreicht. Insgesamt ein super Tool für HTML aber auch PHP- und CSS-Entwicklung.

Filezilla

Filezilla ist ein FTP Client, der sauber strukturierten Zugriff auf FTP Server gewährleistet. Besonders praktisch ist, dass Zugangsdaten gespeichert werden können .

Keypass

Keypass ist ein Must-have für die Passwortverwaltung. Es kann sehr gut zur Erstellung von Passworttresordateien für Mitarbeiter genutzt werden und erleichtert das Passwortmanagment.

Fotoverarbeitungs-Tools

Wenn es um Fotoverarbeitungs-Tools geht, ziehe ich die Old-school Methode vor. Ich verwende in erster Linie:

  • Office 2010
  • MS Paint
  • PowerPoint

Mit Office kann ich Bilder genau zuschneiden und rauf und runter skalieren, mit Paint das Format verändern und mit Powerpoint dann noch Farbe darüberlegen und das Ganze etwas anstylen.

Das ist mein übliche Vorgehensweise im Tagesgeschäft. Für Vorschläge und Kommentare bin ich wie immer offen. Deshalb: Hör in die Episode rein und schreib mir, wenn Du etwas ergänzen möchtest!

OLAF out!