[CSS] Frage: Wie/Wo erstelle ich die perfekte Homepage?

Lolle.herz
Hallo

Ich weiß das die Überschrift nicht wirklich passt.
Mein Vater und ich wollen eine Homepage erstellen also richtig (nicht nur HTML) Mein Vater kennt sich mit (HTML, CSS...) sehr gut aus und ich möchte von ihm lernen! Aber ich wollte mal fragen wo man das herbekommt also von keinem Anbieter so das man richtig wie diese Homepage nichts dahinter stehen hat. (Ich formuliere mich echt blöd ich weiß). Kann man das wo kaufen? Kann mir jemand einen Tipp geben welches das richtige ist?

Bitte helft mir!

Danke schonmal im vorraus.

LG Lolle.herz
Kilana
CSS unterstützen alle Browser, das liegt nicht an der HP Augenzwinkern
Du kannst also alles benutzen.

Da du keine Baukastenhomepage suchst (was ich gut finde!), wird vermutlich der Download eines FTP-Programms anstehen smile

Nun, ich hab meine kostenlose HP damals bei piranho.com gemacht. Ob die Seite noch existiert, weiß ich aber nicht ^.^
Lolle.herz
Danke für die hilfe. besteht deine Homepage noch?
Lolle.herz
Dir auch danke. Und dann wollte ich noch einmal was fragen wenn es erlaubt ist:

Weiß jemand wo man die perfekte Anmedlung erstellen kann?
Weil mein Vater ist für ein paar Tage auf geschäftsreise und es gibt doch auch diese Fertig Anmeldungen oder?

Also man sollte möglichts auswählen können z.b. auf so einen Pfeil drücke und das dann so (nehmen wir malsmile Pferderassen aufgelistet werden. falls jemand meine Frage versteht. Weiß jemand wie die seite heißt?
Stelo
Hier im Forum werden doch viele Tutorials zu den wichtigsten Sachen angeboten, wo du dir aneignen kannst, wie man Formulare schreibt, oder was auch immer du brauchst.

Eine perfekte Homepage wird wohl niemand schreiben können! Aber nur mal so für später: Du kommst dem perfekten schon nahe, wenn der W3C Validator gar nix zu meckern hat. Augenzwinkern
Lolle.herz
jop danke!
Stelo
Zitat:
Original von BlackTear
Zitat:
Original von Stelo
Hier im Forum werden doch viele Tutorials zu den wichtigsten Sachen angeboten, wo du dir aneignen kannst, wie man Formulare schreibt, oder was auch immer du brauchst.

Eine perfekte Homepage wird wohl niemand schreiben können! Aber nur mal so für später: Du kommst dem perfekten schon nahe, wenn der W3C Validator gar nix zu meckern hat. Augenzwinkern


Der W3C Validator ist lediglich für die Barrierefreiheit, hat aber mit Programmiersprachen (HTML und CSS zählen ja nicht dazu Augenzwinkern ) nichts am Hut. Heißt, es du kannst jede mögliche Sicherheitslücke in deine Scripte einbauen, hast den schlechtesten Login und die Seite kann dennoch valide sein Augenzwinkern

Ansonsten, wenn ich das mit der "Anmeldung" richtig verstanden habe, läuft das über PHP. Davon würde ich dir Lolle.herz, abraten. Üb' dich erst mal in HTML und CSS und wenn du das beherrscht, wag dich an PHP ran. Erst krabbeln, dann laufen Augenzwinkern

Hm ... ja, tut mir Leid. Eine eher unperfekte Antwort auf die Frage nach einer perfekten Homepage. Aber eine perfekte Homepage muss schließlich auch barrierefrei sein.
Die Frage war ja weder: Wie SIEHT eine perfekte Homepage aus? Oder: Die perfekte Sicherheit auf meiner Homepage oder so. Augenzwinkern
Aber du hast schon vollkommen recht ... Augenzwinkern
Thorim
nunja, der W3C Validator spielt schon eine Rolle für eine "perfekte" HP, garantiert eine korrekte Darstellung auf verschiedenen Browsern (sollte zumindest, klappt mehr oder weniger, aber auf den aktuellen Browsern passt das eig soweit, abgesehen vom IE8, der hat immernoch paar Fehlerchen)
für das Überprüfen vom CSS eignet sich der CSS-Validator von W3C

serverseitig gehören dann natürlich auch abgesicherte PHP-Scripte dazu (kein falsches Aufrufen von includierten Dateien, MySQL-Injections (nein, magic_quotes ist keine sichere Lösung) usw... usw...)

zum Thema PHP-Sicherheit findet sich hier einiges (nutze selber das Login-System von da, dort bezeichnet als Profi-System, allerdings selber nochmal etwas überarbeitet Augenzwinkern )
Oli
Zitat:
Original von Thorim
abgesehen vom IE8, der hat immernoch paar Fehlerchen
Das kann ich so nicht bestätigen. Nach meiner Erfahrung arbeitet der IE8 im Gegensatz zu den anderen IEs erstaunlich standardkonform, dafür muss man aber im <head> noch folgenden Code einfügen, damit der IE8 nicht als IE7 rendert:
code:
1:
<meta http-equiv="X-UA-Compatible" content="IE=8" />


Probleme dürfte es eher im (leider immernoch verbreiteten) IE6 geben, da dieser teilweise noch nichtmal CSS2 korrekt darstellt.


Eine perfekte Homepage ist m.M.n. von außen gut strukturiert, d.h. der Besucher findet sich zurecht und sie ist, in jedem Fall, übersichtlich aufgebaut. Das Design sollte ansprechend, aber nicht zu komplex sein, es sei denn, es ist eine Fotohomepage, sonst finde ich das übertrieben.

Zu den inneren Werten wäre so langsam auch XHTML statt HTML zu empfehlen. Das Design würde (fast) ausschließlich in CSS gestaltet werden. Frames kommen bei einer guten Seite m.M.n. auf keinen Fall in Frage, dafür gibts mittlerweile PHP und notfalls auch AJAX.
Thorim
Zitat:
Original von Oli
Das kann ich so nicht bestätigen. Nach meiner Erfahrung arbeitet der IE8 im Gegensatz zu den anderen IEs erstaunlich standardkonform


ich hab das auch nicht im Vergleich zu den anderen IEs gemeint, sondern allein im Vergleich zu anderen aktullen Browsern (Firefox 3.6, Safari 5, Chrome 4)
der IE8 ist definitiv viel standardkonformer als die Vorgängerversionen, keine Frage, aber hab auch schon einige Sachen entdeckt, die einfach falsch sind (beispielsweise: wenn ein Bild in einer Tabellenzelle hast und per CSS max-width auf das Bild anwendest, wird das Bild zwar korrekt verkleinert, aber die Tabellenzelle hat die Größe vom Originalbild)

von dem her ist CSS 2.1 immer noch nicht 100% drin, IE6 nunja, der behandelt ja schon width & height-Angaben falsch großes Grinsen


aber sonst kann ich dir zustimmen Oli
- übersichtlich
- keine Frames (da ist PHP nun wirklich mächtig, auch in Verbindung mit MySQL)
- JavaScript würd ich weitestgehend vermeiden, schon deshalb, weils nicht alle aktiviert haben, versuch eig immer JavaScript nur als "Extra" einzusetzen (zB Lightbox), so dass die Seite auch ohne geht)
- Design mit CSS (also auch kein Tabellendesign)
- XHTML (wobei das ne Geschmackssache ist, ich bevorzuge es, weil es einfach 100% klar ist bei nem validen XML-Dokument bis wohin welches Tag jezt gilt)
Stelo
@BlackTear: Na ja, ich war unentschlossen, nach welcher Antwort die Threaderstellerin eigentlich sucht. Deshalb bezog ich mich auf den Threadtitel. Danke trotzdem für den Hinweis. Aber keine Angst, ich weiß schon, dass ein bisschen mehr zu einer "perfekten" Homepage gehört. Freude

Aus Endnutzersicht ist eigentlich nur eine perfekt grafisch aufbereitete Homepage perfekt. Denn nur bei der klickt man nach 10 sec nicht wieder weg. smile Hm .. also mit grafisch meine ich natürlich das gesamte Äußere, sowohl den Aufbau, als auch Schriftarten, usw. usf.

Zitat:
Probleme dürfte es eher im (leider immernoch verbreiteten) IE6 geben, da dieser teilweise noch nichtmal CSS2 korrekt darstellt.

Und hier möchte ich doch kurz ein wenig Optimismus verbreiten: Das Ende des IE6
Stelo
Na wenn ich aber mal kurz einstringen darf, auch wenn es OT ist:

Barrierefrei im eigentlich Sinne heißt natürlich, dass es für möglichst alle Menschen, egal welche Einschränkungen diese haben, zugänglich ist.
Aber wenn man es etwas anders interpretiert, kommen wir sicher zu dem, was BlackTear meinte.

Eine Barriere ist schließlich etwas, was mich behindert. Eine fehlerhafte Darstellung behindert mich schließlich auch. Und diese fehlerhafte Darstellung umgehe ich, in dem ich meinen Code mit einem Validator überprüfe.
Oli
Zitat:

Zitat:

Das kann ich so nicht bestätigen. Nach meiner Erfahrung arbeitet der IE8 im Gegensatz zu den anderen IEs erstaunlich standardkonform, dafür muss man aber im <head> noch folgenden Code einfügen, damit der IE8 nicht als IE7 rendert:
code:
code:
1:
<meta http-equiv="X-UA-Compatible" content="IE=8" />



Wo hast du denn das her? Der IE8 rendert automatisch im IE8-Modus. Hier hat Microsoft endlich mal was richtig gemacht. IMHO war die Idee die Render-Modi an den Doctype zu knüpfen totaler Schwachfug..

Aus eigenen Seiten. Selbst erlebt. Klar, muss das nicht auf jede Seite zutreffen, aber in meinem Fall hatte der IE8 als IE7 gerendert, was sich nur dadurch beheben ließ. Falls du das weiterverfolgen möchtest, die Seite lief mit folgendem XML-Header/DocType:
code:
1:
2:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


Zitat:

Zitat:

Zu den inneren Werten wäre so langsam auch XHTML statt HTML zu empfehlen.

Ich frage es jedesmal. Warum? Die Diskussion ist schon so alt wie XHTML selbst und ich habe noch keine guten Argumente gesehen.

Ich empfehle XHTML, weil die Syntax weniger fehleranfällig ist. So findet man Fehler im XHTML-Code leicht mit dem Validator, während HTML solche Fehler einfach toleriert. Will man nun einen Darstellungsfehler ausfindig machen, hat man es bei XHTML meisten leichter. Außerdem können diese "tolerierten Fehler" in verschiedenen Browsern anders toleriert werden, wodurch die Seite anders aussieht. Ansonsten hat XHTML natürlich keinerlei Vorteile gegenüber HTML, es ist nur eine andere "Sprache", mit der man an sich das Selbe ausdrücken kann.

Zitat:

Zitat:

Frames kommen bei einer guten Seite m.M.n. auf keinen Fall in Frage, dafür gibts mittlerweile PHP und notfalls auch AJAX.

Lese ich auch häufig. PHP und AJAX können Inline-Frames aber zum jetzigen Zeitpunkt nicht ablösen.

Sie dienen auch einem völlig anderen Zweck. Inline-Frames (und genauso Frames) dienen zum Einbinden einer anderen Seite in eine bestehende.
PHP und AJAX fügen nur einzelnen Code, also keine kompletten HTML-Seiten ein. Sie ersetzen (i)Frames nicht, aber sind eine - zumindenst nach meiner Ansicht - brauchbare Alternative, um Inhalte aus anderen Quellen einzufügen.

Zitat:

Zitat:

Das Design würde (fast) ausschließlich in CSS gestaltet werden.

Wieso fast? Formatierungen haben im HTML nichts zu suchen! Header und Bold sind nicht für die Formatierung sondern zur semantischen Auszeichnung..

Da hast du vollkommen Recht, daher die Klammer. Aber manche Dinge können einfach nicht ausschließlich in CSS gestaltet werden, besonders der IE hat/hatte damit manchmal komische Probleme...


Zitat:
Ich hoffe es fühlt sich nun niemand zu sehr auf den Schlips getreten Augen rollen

Nein, ich sehe das als Wissens- und Meinungsaustausch Augenzwinkern .
Oli
Zitat:

Zitat:

Aus eigenen Seiten. Selbst erlebt. Klar, muss das nicht auf jede Seite zutreffen, aber in meinem Fall hatte der IE8 als IE7 gerendert, was sich nur dadurch beheben ließ. Falls du das weiterverfolgen möchtest, die Seite lief mit folgendem XML-Header/DocType:

Tatsächlich.. Ich habe das ganze grade ausprobiert mit nem kleinem Script:
code:
1:
2:
3:
4:
5:
6:
7:
<script type="text/javascript">
/*@cc_on
    if(document.documentMode && document.documentMode == 8) {
        alert(document.documentMode);
    }
@*/
</script>
Ohne Doctype fällt er sogar wieder zurück in den IE5-Quirksmodus.

Wenn du willst, dass der IE sich am Doctype orentiert, musst du EmulateIEx benutzen. IE=Edge weißt an, immer den aktuellen Modus zu benutzen. Finde hier ist die Beschreibung im MSDC ziemlich dürftig Augen rollen
Ich denke, das Problem ist hier, dass vor dem DocType noch der XML-Header steht, vielleicht funktioniert das dann nicht so richtig. Ich erinnere mich da an die Möglichkeit den IE6 in Quirksmode zu bekommen, indem man vor dem DocType einfach einen HTML-Kommentar geschrieben hat.

Zitat:

Zitat:
Ich empfehle XHTML, weil die Syntax weniger fehleranfällig ist.

In wie fern?
Naja, das ist vermutlich Meinungssache. Ich finde, dass man bei XHTML immer die gleichen Regeln zu beachten hat und dadurch der Code übersichtlicher wird - dementsprechend macht man auch weniger Fehler. Auch gibt es ein paar uneindeutige Fälle, wo man mit XHTML immer das gewünschte Ergebnis erreicht und in HTML, aufgrund der anderen Regeln, nicht. Beispiel - Möglicher HTML-Code:
code:
1:
<div class=gruppe1 gruppe2 id=id1>....</div>
Da die HTML-Syntax keine Anführungszeichen verlangt, ist der Code gültig, jedoch vermute ich, dass gruppe2 als Attribut und nicht als Wert für class gewertet wird. Durch die XHTML-Syntax ist man gezwungen Anführungszeichen zu machen und dieser mögliche Fehler ist ausgeschlossen:
code:
1:
<div class="gruppe1 gruppe2" id="id1">...</div>
Natürlich passiert soetwas nur, wenn man unachtsam ist, aber, diesen Fehler dann zu finden, könnte ein größeres Problem werden. In XHTML meldet dies sofort der Validator, weil die Anführungszeichen fehlen.

Zitat:

Zitat:
XHTML-Code leicht mit dem Validator, während HTML solche Fehler einfach toleriert.

Meinst du die OMITTags (Entfallene Start/End-Tags)?
code:
1:
2:
3:
4:
<ul>	<li>Eins
	<li>Zwei
</ul>
oder die Shorttags?
code:
1:
2:
<p/blupp/

sehe ich als kein gutes Argument, da diese Schreibweisen

1) sehr wenig verbreitet sind (meistens nur bei Profis, nein ich will nicht! sagen dass ich einer bin Augen rollen )
2) die Browser sowieso keinen SGML-Parser sondern einen Tag-Soup Parser benutzen und somit das in den meisten Browsern nicht funktioniert.

Da hast du Recht, meinte ich jedoch beides nicht. Ich meine, dass man z.B. innerhalb einer Tabellenspalte ein <div> anfangen kann und dieses erst in der nächsten Spalte wieder schließt. In XHTML gibt das einen Fehler im Validator, in HTML ist das korrekter Code - auch wenn mir fraglich ist, wie die Browser das interpretieren wollen - und siehe da, Firefox interpretiert anders als IE.
code:
1:
2:
3:
4:
5:
6:
<table>
 <tr>
  <td>123<div>456</td>
  <td>789</div>abc</td>
 </tr>
</table>

Firefox 3.6.3:

IE 8.0.7600:


Zitat:

Zitat:
Außerdem können diese "tolerierten Fehler" in verschiedenen Browsern anders toleriert werden, wodurch die Seite anders aussieht.

Da beides durch den Tag-Soup Parser läuft kann dir das selbe doch auch bei XHTML passieren? Solang beides noch als text/html ausgeliefert wird, sehe ich da keinen Unterschied.

Das stimmt, die Fehler werden vom Browser dennoch toleriert. Wenn man jedoch eine valide XHTML-Seite hat, hat man das Problem nicht, da der Validator im Gegensatz zum Browser nicht toleriert.

Zitat:

Zitat:

Sie ersetzen (i)Frames nicht, aber sind eine - zumindenst nach meiner Ansicht - brauchbare Alternative, um Inhalte aus anderen Quellen einzufügen.

AJAX unterliegt der Same Origin Policity für JavaScript. Damit ist das grundsätzlich ersteinmal nicht möglich, von anderen Seiten Inhalt zu holen. Nun könnte man eine Art Proxy mit PHP implementieren oder aber einen "richtigen" Proxy benutzen. Von mir aus auch mod_proxy für den Apache (hab ich zumindest immer so gelöst). In Firefox 3.5 hat sich da allerdings in der Hinsicht was getan smile wie das bei anderen aussieht, weiß ich aber nicht.

Mit "anderen Quellen" meinte ich ausschließlich das Nachladen von Inhalten des eigenen Servers, aber beispielsweise aus einer anderen Datei.

Zitat:
Das eigentliche Problem bleibt aber: Ich habe dann alles im selben Context. Mir persönlich würde das den Magen umdrehen.. Das wäre dann wohl XSS für Arme?

Und hier haben wir den Unterschied zwischen PHP, AJAX und iFrames. Wenn man externe Seiten, also nicht-eigene einfügen möchte, sind iFrames definitiv vorzuziehen. Sind es jedoch eigene Inhalte, sind iFrames oft unnötig. So kann man statt seinen Seiteninhalt im iFrame zu laden auch einen Parameter an die URL hängen und den gewünschten Inhalt mit PHP einfügen lassen. Das "lesen" dann z.B. auch Suchmaschinen als eine Seite - und nicht als 2 Seiten ohne Zusammenhang.

Zitat:
Ausserdem tritt hier wieder mein Lieblingsproblem mit der Zeichencodierung auf, die einigen wohl gar nicht so bewusst ist.

Oh ja. Das kenne ich.... Der AJAX-Inhalt muss mindestens die selbe Zeichenkodierung haben, wie das Dokument, in das dieser eingefügt werden soll.

Zitat:
Die Privilegien die der Benutzer vielleicht nur meiner Seite gegeben hat, hat somit auch die Fremdseite.
Das sind nur einige Probleme die mir nun in den Sinn kommen. Das würde ich mit einem I-Frame zumindest größtenteils umgehen.

Wieder korrekt. Daher - wie gesagt - AJAX nur für die eigenen Inhalte, für externe Inhalte sind iFrames vorzuziehen.

Zitat:

Zitat:

Aber manche Dinge können einfach nicht ausschließlich in CSS gestaltet werden, besonders der IE hat/hatte damit manchmal komische Probleme...

Welche sind das denn?

Ich bin mir nicht mehr sicher, aber ich glaube, es war unmöglich, ein <div> im IE6 ausschließlich mit CSS zu zentrieren...
Lolle.herz
Dankeschön an euch alle
Oli
Zitat:

Ich bin da eher der Meinung, dass man nicht grundsätzlich alles was möglich ist, auch einsetzen muss. Die meisten Validatoren kann ich auch hinreichend kofigurieren, so z.B schalt ich die Shorttags und OMITTags aus.

Wer Wert auf Validiatät seiner Seite legt, der wird auch soweit gehen können. Den anderen ist das sowieso egal. Auch wenn transitional valid ist, hat es meiner Meinung nach in neuen Seiten nichts verloren, da es auch Deprecated Elemente enthält.

Da geb ich dir Recht. Wenn man HTML wirklich beherrscht, hat man mit XHTML keinerlei Vorteile. Wie schon ein paar Posts höher gesagt, eine andere "Sprache" für das Selbe.

Zitat:

Zitat:

Da hast du Recht, meinte ich jedoch beides nicht. Ich meine, dass man z.B. innerhalb einer Tabellenspalte ein <div> anfangen kann und dieses erst in der nächsten Spalte wieder schließt. In XHTML gibt das einen Fehler im Validator, in HTML ist das korrekter Code

Nö, das ist genauso invalides HTML. Der Validator meldet mir den Fehler auch erwartungsgemäß. Welchen Validator hast du denn benutzt? Hab es nun mit Validdome und dem Validator von den Seiten des W3Cs gecheckt.

Da muss ich dir zustimmen, das ist als HTML ebenfalls invalide... Aber ich hatte schon so einen Fall, kann mich nur nicht mehr genau erinnern. Egal.

Zitat:
Das würde ich so nicht sagen. Die Browser sind schon sehr tolerant, dass sie die Seite trotz der vielen Fehler noch anzeigen. Da in den Spezifikationen nirgends Definiert ist, wie sich auf Fehler zu verhalten ist, liegt dies im Ermessen der Browserentwickler. In HTML5 hat sich das, meine ich mich zu errinern, geändert. smile

Mit HTML5 habe ich mich noch nicht wirklich befasst. Muss ich wohl mal nachholen... Augenzwinkern .

Zitat:

Ich denke, du meinst IE6 im Quirksmode? Dazu musst du dem Elterelement ein text-align:center geben z.B dem Body. Für moderne Browser genügt ein margin: 0 auto smile

Okay, ich hatte damals nicht bedacht, dass der IE im Quirksmode läuft, was natürlich wegen des XML-Headers der Fall war. Naja, ist paar Jahre her, damals wusste ich wahrscheinlich noch nichtmal, dass es einen Quirksmode gibt großes Grinsen .

Fazit: Wir könnten hier wahrscheinlich noch ewig Vor- und Nachteile aufzählen, die es nicht gibt, wenn man fehlerfreien Code schreibt. Ist wohl wirklich nur Geschmackssache. In jedem Fall ist zu empfehlen, die Syntax des Verwendeten zu beherrschen, egal ob HTML oder XHTML.