[How to] Eigene HTML bzw. PHP Seite bauen

  • How to 1: Layout erstellen + Zusammenbauen in PHP
    Version 1.0 | 6.6.2013



    Ich weiß nicht, ob jemand das überhaupt braucht oder will? :khahaha: Aber ich tu es einfach! (Kann ja gelöscht werden, falls es keiner braucht!)


    Wie baue ich mir meine eigen Homepage, und zwar ganz ohne Baukasten?


    Im Prinzip ganz einfach, ich zeige dir wie!


    1. Was braucht man?


    1.1 Xampp
    http://www.apachefriends.org/de/xampp-windows.html
    Du solltest, falls du noch keinen Webspace hast (also Onlinespricher für deine Website) dir lokal auf deinen PC xampp Installieren (Emuliert einen Webserver auf deinem PC!)
    Somit kannst du in aller Ruhe deine Seite entwicklen und auf deinem PC Teste (da keiner darauf zugreifen kann, bzw. sollte) Bedenke, dein PC ist kein Server, falls du mit der Idee spielst, deinen PC als Server zu missbrauchen xD


    1.2 Einen Texteditor oder MS Expression Web Editor (kostenfrei) nachfolger von Frontpage
    http://www.chip.de/downloads/M…ression-Web_21853363.html


    oder den Editor von MS (notepad.exe glaub ich) heißt das Teil.


    So, für beide gilt das selbe Prinzip. Daher packe ich beides mal als eins in diese Anleitung!


    1.3 HTML oder PHP?
    Ich würde PHP benutzen, da Dynamischer, HTML5 ist zwar auch schon besser, aber eben noch BETA. Mit PHP machst du nichts weiter falsch.


    1.4 Ein Programm zum Grafikenbarbeiten Adobe Photoshop oder Gimp.
    Damit erstellen wir Grafiken für unsere Seite.



    ~~~~~~~ Fangen wir an ~~~~~~~


    Installiert XAMPP auf euren PC. Einfach Setup ausführen und nach der Installation starten wir den Apache Server.

    Klick auf Starten und der Apache startet. Wenn es geklappt hat, wird der Apache grün (siehe Foto!).


    So, öffent nun euren Browser und schreibt in die Adresszeiel: localhost und drückt ENTER.
    Das sollte dann so aussehen!


    Ok, gehen wir nun in unseren htdocs Ordner (falls du bei der Installation nichts geändert hast) ist das dann: C:\xampp\htdocs


    Oder legen wir uns dann einen Ordner an, den nennen wir anime. ;) Also in ewa so:


    E:\xampp\htdocs\anime und in den Ordner Anime, legen wir noch einen Ordner an, und zwar img. Also so: E:\xampp\htdocs\anime\img\


    Der img Ordner ist für die Grafiken später.


    Unsere Page wird Links die Hyperlinks haben, oben den Header (Logo) und links bis Mitte die News und Inhalt und unten den footer (Abschluss der Seite). Also in etwa so:


    Layout erstellen:


    Video 1

    [video][media]http://www.youtube.com/watch?v=nn9tyimXvYY[/media][/video]


    Video 2


    [video][media]http://www.youtube.com/watch?v=Sp3lI_U9zDk[/media][/video]


    Video 3


    [video][media]http://www.youtube.com/watch?v=bjFbKchcQTI[/media][/video]


    Video 4 Ende
    Fertig. Ich hoffe es war verständlich, anderen falls, hier Fragen!! ^.^


    [video][media]http://youtu.be/-dCdDYvcKUg[/media][/video]



    Dazu lasse ich das Video laufen, das jetzt alles zu schreiben wäre FUUUUUUUUU :ichwillaber:


    Download der Dateien inkl. der .PSD Datein! 1,5MB

  • Wieso vergleichst du php mit html ? Bzw das man eher PHP vbenutzen soll ? Ich meine, du vergleichst Äpfel und Birnen... HTML dient zu Kommunikation mit dem Server, den Aufbau der Seite erledigt immernoch HTML und CSS

  • HTML dient zu Kommunikation mit dem Server, den Aufbau der Seite erledigt immernoch HTML und CSS


    Der erste Abschnitt macht 0 Sinn :D
    HTML/CSS ist eine "Wiedergabesprache" in Form von Gestaltung und Aussehen einer Seite.
    PHP ist für die Anwendung simpler oder komplexer Aufgaben gedacht: Login-Abfrage, Mathematische Formeln, etc. pp


    Nach dem EVA-Prinzip:
    Input: HTML/CSS (sichtbar)
    Verarbeitung: PHP (nicht sichtbar)
    Output: HTML/CSS (sichtbar)

    ,,Willst du den Charakter eines Menschen erkennen, so gib ihm Macht." - Abraham Lincoln

  • "1.3 HTML oder PHP?
    Ich würde PHP benutzen, da Dynamischer, HTML5 ist zwar auch schon besser, aber eben noch BETA. Mit PHP machst du nichts weiter falsch. "


    ich bezog mich auf das

  • Absolut minderwertiges Tutorial mit großen Fehlern drin. Der Vergleich zwischen HTML5 und PHP ist wie ein Vergleich zwischen CPU und Grafikkarte: "Ich empfehle dir eine CPU, weil die mehr kann, als eine Grafikkarte."


    Zitat

    HTML dient zu Kommunikation mit dem Server

    Nein, dazü dient das HTTP.

  • PHP kommuniziert aber auch net mit "dem" Server. Zumindest nicht allgemein - bspw. mit einem Datenbankserver schon, aber mit der Kommunikation Client <-> Server hat PHP nicht viel am Hut.

  • Naja PHP öffnet die Verbindung, bzw spricht den Server an ^^ Direkt kommunizieren tun sie nicht, das stimmt

  • PHP öffnet aber nicht gerenell ne Verbindung, nur wenn im Code bspw. ein fsockopen vorkommt oder du nen DB-Server ansprichst oder so.


    Vorallem wie soll eine Serverseitige Programmiersprache auch den Server ansprechen, wenn der Nutzer ne Anfrage stellt? Der Webserver spricht PHP an.


    Also quasi:
    HTTP-Request vom Browser -> Webserver -> PHP -> Webserver -> HTTP-Response vom Server (Schemahaft)

  • Absolut minderwertiges Tutorial mit großen Fehlern drin. Der Vergleich zwischen HTML5 und PHP ist wie ein Vergleich zwischen CPU und Grafikkarte: "Ich empfehle dir eine CPU, weil die mehr kann, als eine Grafikkarte."


    Zitat

    HTML dient zu Kommunikation mit dem Server

    Nein, dazü dient das HTTP.

    Was redest du? xD


    Es geht hier um das Thema Dynamic. Da sind keine Fehler, nur weil du HTML magst. Ein vergleich zwischen PHP und HTML macht sehr Wohl Sinn, weil dein Vergleich zwischen CPU und Grafikkarte überhaupt nicht zusammen passen.


    Der Vergleich PHP + HTML wäre nach deinem Beispiel so richtig: Welche Grafikkarte? ATI oder Nvidia. Aber der vergleich zwischen CPU und GPU = FAIL. Setzen 6.


    Der PHP Compiler erledigt alle Fragen, die mit PHP zusammen hängen (dieser wird auf dem Server ausgeführt), HTML geht mehr oder weniger einfach so. PHP ist da ein bisschen komplexer und daher liegt auf dem Webserver (IIS oder Apache oder nginx).


    Dieses Forum hier zb. verwendet eben HTML auch PHP (includes usw), wenn wir, der User nun dieses Forum aufrufen, erledigt der Server, die Anfragen vom Client (also wir die hier Surfen). Hätte der Server keinen PHP Compiler, würde es nicht so aussehen, wie es eben jetzt aussieht.


    Optisch könnte man das alles hier mit HTML machen, nur eben ohne MySQL Untersützung, weil ohne PHP da nix geht. Somit müsste man wenn dann alles mit HTML lösen wobei einige Methoden eben nur mit PHP gehen. Und hier kommen wir dahin, was ich meine, weshalb man nicht nur auf HTML setzen sollte, WAS DIE DYNAMIC einer Webseite angeht.

  • Nein. Im Endeffekt sind PHP und HTML zwei völlig verschiedene Dinge: PHP ist eine Programmiersprache (oder von mir auch aus Scriptsprache genannt), HTML eine Auszeichnungssprache. Ohne HTML gäbe es keine semantische Auszeichnung, ohne PHP dafür keine Berechnungen im Hintergrund [dazu gheört auch das Holen von Daten aus ner Datenbank]. Also beides nicht vergleichbar, da du PHP nicht für semantische Auszeichnung nutzen kannst (PHP-Tabellen-Klassen aus Frameworks erzeugen für die semantische Auszeichnung im Vodergrund auch nur HTML) und HTML nicht für Berechnungen.


    Also vergleiche ich quasi - falls du dich mit WPF auskennst - C# mit XAML oder - falls du bspw. Android-Anwendungen entwickelst - Java und XML. Das eine dient für die semantische Auszeichnung [bei den Desktopsprachen auch fürs Design], das andere für die Berechnungen.


    Und ich glaube, dass ich durchaus weiß, wovon ich rede. Entwickel selber mit PHP, HTML5, CSS3 und Javascript Webanwendungen.


    Zitat

    Optisch könnte man das alles hier mit HTML machen, nur eben ohne MySQL Untersützung, weil ohne PHP da nix geht. Somit müsste man wenn dann alles mit HTML lösen wobei einige Methoden eben nur mit PHP gehen. Und hier kommen wir dahin, was ich meine, weshalb man nicht nur auf HTML setzen sollte, WAS DIE DYNAMIC einer Webseite angeht.

    Wenn es um dynamisches Generieren der semantischen HTML-Auszeichnung geht, hast du Recht. Wobei ich unter Dynamik eher Sachen wie die Tabmenüs meine, die (i.d.R.) per Javascript geregelt sind - ja, mir ist bewusst, dass man ein Tabmenü durchaus auch mit CSS3 erstellen kann.


    Zitat

    nur weil du HTML magst

    Ich mag alle Websprachen, mit denen ich arbeite, gleichermaßen. Ich mag HTML5, ich mag aber auch PHP, CSS3 und JS.



    Erstmal: Kommunikation MIT dem Server läuft so ab (falls du Kommunikation mit nem DB-Server meionst, hätteste das so schrieben sollen):
    HTTP-Request von Client an Server -> Webserver -> PHP -> Webserver -> HTTP-Response von Server an Client

    Avatar: Fanart von "mystical-mayhem" auf deviantart.

    Einmal editiert, zuletzt von WombatWeb ()

  • Wieso seh ich das jetzt erst? O.o
    Also ich muss WombatWeb auf voller Linie zustimmen. Für Webseiten und Webanwendungen wie Foren et cetera benötigt man in der Regel kein PHP, HTML hingegen schon. PHP läuft serverseitig und ist hauptsächlich für die Auswertung von Anfragen und die Ausgabe von Inhalten zuständig. Es lässt sich jedoch wunderbar durch andere serverseitige Sprachen ersetzen - JavaScript (auf einem node-Server), Perl, Ruby, ...
    HTML hingegen lässt sich nicht so einfach wegdenken. (Wir lassen Spezialfälle mal beiseite~)


    HTML sagt uns, was etwas bedeutet. Ob etwas eine Überschrift ist, oder ein Zitat, oder ein Listenpunkt, ...
    CSS sagt uns, wie unser HTML am Ende aussehen soll
    Die serverseitige Sprache stellt zu 90% einfach eine Anbindung an den Datenbankserver da, um Inhalte in diese schreiben zu lassen bzw. aus dieser auszulesen und verarbeitet auszugeben.
    JavaScript ist für die Benutzerinteraktionen und für Kommunikationen mit dem Webserver - wenn die Seite nicht neu geladen werden soll - zuständig.


    WombatWeb : Ich finde es allerdings... interessant, dass Du jQuery einer Sprache gleichsetzt O.o

    Falls Fragen zu Themen wie der Beitragserstellung bestehen kann man sich gerne an mich wenden :)