Bevor wir mit der ersten Lektion beginnen, werden wir uns unsere Arbeitsmittel beschaffen.
Dazu gehören neben der Lektüre und Nachlagewerke auch Software zur Bildbearbeitung, ein Editor um unseren Quellcode zu schreiben und das ein oder andere Tool, das uns bei der Arbeit unterstützen wird.
Wir werden im Großen und Ganzen auf kostenlose Programme und Fachliteratur setzen, jedoch kann auch das ein oder andere kostenpflichtige Buch interessant sein.
Entsprechende Kaufempfehlungen spreche ich zu gegebener Zeit aus. Der Erwerb ist aber nicht zwingend notwendig um mit diesem Tutorial zu arbeiten.
Software zum Webseiten erstellen
Browser
Um unsere Arbeit und Ergebnisse beim Webseiten erstellen zu betrachten, benötigen wir einen Webbrowser. Da jeder eine andere Vorliebe hinsichtlich der Browsernutzung hat, müssen wir uns auf einen einigen.
Ich freue mich, dass Du auch der Meinung bist, dass der Mozilla Firefox für die Entwicklung von Webseiten ideal ist. 😉
Der Firefox erleichtert uns das Leben bei der Entwicklung von Webseiten, nicht nur mit dem ein oder anderen netten Plugin, sondern er ist auch nahe am sogenannten Webstandard dran.
Wobei das Wort Webstandard, wenn auch immer wieder gerne genutzt, nicht wirklich richtig ist – es sind nämlich nur Empfehlungen, die von dem sogenannten W3C (World Wide Web Consortium) ausgesprochen werden.
Jedoch halten sich immer mehr Firmen an diese Empfehlungen um das Internet zu einer besseren Welt zu machen – oder um einfach noch mehr Geld zu raffen.
Informationen zum W3C:
Falls also noch nicht geschehen, lade Dir bitte die aktuelle Version des Mozilla Firefox herunter und installiere diesen.
Download Firefox: Firefox Deutsch
Webentwickler Plugins Firefox:
Um entsprechende Plugins bzw. Erweiterungen beim Firefox zu installieren, gehe auf die Website von Mozilla und gebe oben rechts im Suchfeld das gesuchte Plugin ein. Gleich das erste Ergebnis kannst Du dann über die Schaltfläche „zu Firefox hinzufügen“ installieren.
Folgende Plugins sollten installiert sein:
Web Developer
Toolbar, die unter anderem folgende Features beinhaltet:
- Anzeige von Cascading Style Sheets
- Änderung der aktuellen Fenstergrößen
- Styles deaktivieren
- Grafiken ein/ausblenden
- ID/Klassendetails anzeigen
uvm.
Html Validator von Marc Gueury
Dieses kleine aber wertvolle Plugin zeigt Dir genau an ob Dein HTML Quellcode dem aktuellen Webstandard nach W3C entspricht. Fehler werden genau angezeigt und Du kannst dadurch punktgenau nacharbeiten.
FireBug
FireBug ist ein sehr mächtiges Tool zum Debuggen der Website. Sollten eventuelle Fehler, z.B im JavaScript oder CSS-Quellcode vorhanden sein, zeigt dies ein Icon an.
Weitere Tools zur Entwicklung
PSPad
PSPad unterstützt das Syntax-Highlighting für die verschiedensten Scipt- und Programmiersprachen. PSPad ist Freeware und äußerst leistungsstark.
Download PSPad: PSPad Deutsch
XAMPP
Mit XAMPP installierst Du einen lokalen Webserver. XAMPP ist eine Sammlung der Programme Apache, MySQL, PHP und Perl auf dem Du Deine Webseiten testen kannst ohne diese vorher auf Deinen Webspace zu laden.
Download XAMPP: APACHEFRIENDS XAMPP Deutsch
FileZilla
Ein schlanker und kostenloser FTP-Client um Dateien vom Webspace rauf/runter zu laden
Download FileZilla: FileZilla
Bildbearbeitungsprogramm:
GIMP – Open Source Grafikprogramm für die Bearbeitung und Erstellung von Grafiken und Bildern.
Download Gimp bei Heise: GIMP
Literatur – Open Books
SelfHTML – Das Standardwerk von Stefan Münz um HTML zu erlernen
CSS4You – CSS 2.1 Referenz für Einsteiger und Fortgeschrittene
Selfphp – Befehlsreferenz und Kochbuch für die serverseitige Skriptsprache PHP
php.net – Offizielles PHP-Handbuch. Komplette Sprach- und Befehlsreferenz
Openbooks von Galileo-Computing
JavaScript und Ajax – Komplettes Handbuch inkl. Sprachreferenz
Linux – Praxisnahes und umfangreiches Linux-Handbuch
Openbook von O’REILLY
Praktischer Einstieg in MySQL mit PHP
Nicht das Du Dich jetzt erschlagen fühlst von der ganzen Literatur– Du musst natürlich nicht alles lesen und wenn Du gar nicht willst auch nichts herunterladen – schließlich leben wir in einer freien Welt. 😀
Nach meiner Erfahrung jedoch stellt sich bei der Entwicklung von Websites doch die ein oder andere zuätzliche Frage oder es kommt einem eine Idee, die umgesetzt werden will und in einem Tutorial nicht erklärt wird.
Wenn Du alles verdaut, heruntergeladen und installiert hast, flitzen wir zum nächsten Teil des Tutorials.
1 Comment
[…] Tools, um Deinen Quellcode zu überprüfen, solltest Du seit dem zweiten Teil dieses Tutorials installiert […]