blog.icedcream.de » Einsteigergrundlagen http://blog.icedcream.de Entwurf, Entwicklung und Pflege von Webseiten Tue, 20 Sep 2011 09:53:11 +0000 http://wordpress.org/?v=2.9 en hourly 1 Bei langen Projekten die Motivation behalten http://blog.icedcream.de/webdevelopment/einsteigergrundlagen/bei-langen-projekten-die-motivation-behalten http://blog.icedcream.de/webdevelopment/einsteigergrundlagen/bei-langen-projekten-die-motivation-behalten#comments Sat, 31 Jan 2009 13:23:59 +0000 Macks http://blog.icedcream.de/?p=83 Mir ging es in der vergangenheit häufig so, dass, wenn ich an einem umfangreicheren Projekt arbeitete, ich spätestens bei der Programmierung des Backends die Motivation verlor und das Projekt in den Sand setzte. Deshalb gibt es in meinem Projekte-Ordner auf meinem PC so viele unfertige Programmdateien. Ich spreche nicht von bezahlten Kundenaufträgen, sondern von selbstständiger Arbeit, mit der man erst nach Fertigstellung und dann nur vielleicht hätte Geld mit verdienen können.

Ich denke, dass es vielen so geht, weshalb ich jetzt die Ursachen meines eigenen Motivationsverlustes während umfangreicher Projekte ergründen möchte:

  1. Keine durchdachte Planung
  2. Zu durchdachte Planung
  3. Fehlender optischer Leitfaden
  4. Fehlende Disziplin

1. Keine durchdachte Planung

Wenn ich eine Idee für ein neues Projekt habe, geht es in meinem Kopf um nichts anderes mehr. Ich sammle überall, wo ich nicht am Projekt arbeiten kann, Ideen. Kaum bin ich an meinem Arbeitsplatz, lege ich los. Die Konsequenz ist immer die selbe: Ich vergesse grundlegende Funktionen, habe keine Struktur im Code und arbeite schlampig, weil ich möglichst bald Ergebnisse sehen möchte. So bleibt von der Motivationsexplosion am Anfang nur noch die Stille des toten Projekts übrig.

2. Zu durchdachte Planung

Bei einem anderen Projekt habe ich gedacht, obrigen Fehler auf alle Fälle vermeiden zu müssen und habe wochen- und monatelang mein Projekt geplant. Angefangen umzusetzen habe ich es nie, weil ich immer Angst hatte, etwas zu vergessen.

3.  Fehlender optischer Leitfaden

Im Informatikunterricht wurde uns Schülern gelehrt, dass zuerst Struktur und Inhalt, dann Layout und Design kommen. Bei kurzen Texten und kleinen Programmen mag diese Arbeitsweise sehr sinnvoll sein, aber wenn ich wochenlang an einem Admin-Backend mit Schriftart “Times” und blau-violetten Links arbeite, vergehen Lust und Sinn für Struktur bei mir verloren.

4. Fehlende Disziplin

An meinen “freiwilligen Projekten” arbeitete ich früher immer nur, wenn ich Lust und Laune dazu hatte. Da aber oben genannte Fehler bei mir eintraten, kam diese “Schöpfungslust” nach der Motivationsexplosion nie wieder.

Meine Konsequenz für aktuelle und zukünftige Projekte

1. Planen, aber nicht zu viel

Wenn ich eine Idee für ein Projekt und genug Zeit habe, setze ich mich mit einem Notizblock oder Rechner in Ruhe hin und mache Brainstorming: Welche Funktionen müssen inkooperiert werden, welche wären nette Gimmicks und welche können warten? Wie soll die Benutzeroberfläche aufgebaut sein? In Welche Navigationspunkte lassen sich die Menüs gliedern?

Ich ziehe also eine klare Linie zwischen notwendigen erweiternden Funktionen. Dann suche ich mir die Funktionen aus, die ich in der ersten Programmversion einsetzen will. Die anderen kommen auf eine Liste für Updates. Wichtig ist natürlich noch die Bedienung für den Benutzer: Wenn man sich über diese im Klaren ist und ein bisschen flexibel programmieren kann, kann man nach kurzer Zeit schon mit der Umsetzung anfangen. Bei großen Projekten kommt da vor der eigentlichen Programmierung meistens Logo und Design, damit ich einen optischen Leitfaden und Struktur für Benutzeroberfläche und Backend habe.

2. Ziele setzen

Ich habe mir für ein aktuelles Webprogramm, das ich zusammen mit Georg erstelle, klare Ziele gesetzt. Immer, wenn ich ausreichend Zeit und nicht gerade einen kreativen Rausch an der Gitarre habe, erstelle ich mindestens eine Funktion für das Programm. Das hört sich nach nicht viel an, aber auch wenn man nur 1-2 mal die Woche genug Zeit findet, so kann man die Zeit gut einschätzen, die benötigt wird, bis das Projekt fertiggestellt ist. Wenn die Funktionen umfangreicher sind, dann setze ich meine Ziele zeitlich: “Wenn ich von 18 bis 20 Uhr nichts zu tun habe, arbeite ich in dieser Zeit an meinem Programm”.

]]> http://blog.icedcream.de/webdevelopment/einsteigergrundlagen/bei-langen-projekten-die-motivation-behalten/feed 2 Der Unterschied zwischen HTML und PHP http://blog.icedcream.de/webdevelopment/einsteigergrundlagen/der-unterschied-zwischen-html-und-php http://blog.icedcream.de/webdevelopment/einsteigergrundlagen/der-unterschied-zwischen-html-und-php#comments Sun, 04 Jan 2009 12:31:40 +0000 Macks http://blog.icedcream.de/?p=72 Sehr häufig liest man in Internet-Foren Fragen wie “Ich will mir eine Homepage bauen. Was ist besser, PHP oder HTML?”. Manche fragen sich sogar, ob man PHP vor HTML lernen sollte. Um allen Webdesigneinsteigern den Anfang zu erleichtern, möchte ich erläutern, warum HTML und PHP zwei ganz verschiedene Sachen sind.

Für was steht HTML?

HTML steht für “Hypertext Markup Language”, was übersetzt “Hypertext Auszeichnungssprache” bedeutet. Das sagt auch schon aus, worum es bei HTML geht: Text strukturieren. Der sogenannte Hypertext (also Text im WWW, wenn ich das mal so frei übersetzen darf) wird von HTML-Code ausgezeichnet. Die HTML-Tags verleihen dem Text in erster Linie Struktur. Im HTML-Code werden dem Browser auch grundlegende Informationen, wie der Titel der Seite, aber auch Infos für Suchmaschinen, die meist in META-Tags stehen, mitgegeben.

Ein einfacher Aufbau einer HTML-Seite könnte so aussehen:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

  <head>
    <title>Titel der Homepage</title>
  </head>

  <body>
    <h1>Überschrift</h1>
    <p>Text, Text und noch mehr Text, der zur Überschrift passt.</p>
    <h2>Unterüberschrift</h2>
    <p>Spezifischere Informationen, die zur Unterüberschrift passen.</p>
  </body>

</html>

Jetzt haben wir schon einen strukturierten Text. Alles, was in den <body>-Tags steht, wird ausgegeben. So gut wie jedes Tag wird auch standardmäßig von jedem Browser mit einer Formatierung versehen. Zum Beispiel stellt jeder Browser standardmäßig <h1> größer als <h2> dar, was auch irgendwie logisch ist. Um aus dem HTML-Code nun eine schöne Seite mit fetter, farbiger Schrift, buntem Hintergrund und zentrierter Überschrift zu machen, bedient man sich des CSS-Codes.

CSS

CSS steht für Cascading Stylesheets und kann als Ergänzung zu HTML angesehen werden. Wie bereits erwähnt, verändern HTML-Tags, die eigentlich nur zur Strukturierung des Textes gedacht sind, unweigerlich die Formatierung eines Textes. Um dieses Aussehen zu verändern, kann man mit CSS HTML-Tags manipulieren. Mit CSS wird bspw. angegeben, dass Text innerhalb aller <p>-Tags auf der Seite einen Abstand von 10px nach oben hat und in der Schriftart “Verdana” dargestellt werden soll, oder, dass die Überschrift mit der ID “header” blau, zentriert, mit Schriftgröße 18px und in der Schriftart “Georgia” dargestellt werden soll.

Das Ganze wollte ich nur grob anreißen, deswegen verweise ich an dieser Stelle nochmal auf Wikipedia, wo HTML und CSS nochmal ausführlich erklärt sind, sowie auf SelfHTML, eine Seite, die alles weiß, was es zu HTML zu wissen gibt.

Und was ist jetzt PHP?

PHP steht für “PHP: Hypertext Preprocessor” (eine solche Abkürzung nennt man rekursives Akronym). Auch hier sagt der Name schon alles aus: PHP bereitet Hypertext (also HTML-Text/-Dokumente) auf.  PHP ist eine Scriptsprache und somit, im Gegensatz zu HTML, dynamisch. PHP kann zwar weder Text strukturieren, noch formatieren, aber PHP kann strukturierten Text unter bestimmten Bedingungen ausgeben lassen. Folgendes Beispiel zur Verdeutlichung:

Nehmen wir an, wir haben eine Webseite und möchten ein Kontaktformular integrieren. Mit HTML legen wir jetzt fest, dass wir 3 Felder (Name, E-Mail, Nachricht) und einen Bestätigungsbutton haben. Mit CSS machen wir diese Felder 350px breit, geben ihnen einen weißen Hintergrund, sowie einen Rand mit dem Farbcode #343434. Und wie lassen wir dieses Formular jetzt eine E-Mail versenden?

Hier kommt PHP ins Spiel: Mit PHP überprüfen wir die abgesandten Formulardaten. Wir prüfen, ob die angegebene E-Mail-Adresse ein @-Zeichen, sowie mindestens einen Punkt enthält. Wir prüfen, ob ein Name überhaupt angegeben ist und durchsuchen den eingegeben Nachrichtentext auf eine Mindestlänge von 50 Zeichen. Wenn das alles gegeben ist, schicken wir eine E-Mail ab, ansonsten lassen wir das Formular nochmal anzeigen und teilen dem User per HTML mit, welche Felder er nicht korrekt ausgefüllt hat.

Ich hoffe dieses Beispiel hat alles nochmal verständlicher gemacht. Mit PHP lassen sich also nicht nur “primitive” Webseiten, die, wie z.B. Textdateien, statisch sind, sondern komplexe Applikationen wie Internetforen, Gästebücher und Content-Management-Systeme wie Wordpress realisieren.

Fazit

PHP ist weder besser als HTML, noch wichtiger als CSS. Eine gutes PHP-Programm nützt wenig, wenn man per HTML und CSS keine Übersichtliche Bedienung gestalten kann. Genauso wenig ist ein super-übersichtliches, schönes Forum nützlich, wenn es vor Sicherheitslücken und PHP-Fehlern strotzt. Nichts ist besser oder wichtiger als das andere: HTML und CSS sind die Sprachen des Internets. PHP ist das Gehirn, das weiß, wann welcher Text in welcher Form angebracht ist und noch viel mehr kann, als nur zu sprechen.

IEtester

]]> http://blog.icedcream.de/webdevelopment/einsteigergrundlagen/der-unterschied-zwischen-html-und-php/feed 4