frage zu design
freak
- design/layout
0 ichen0 mortimer
0 mortimer0 Mathias Bigge0 freak
0 chris0 Lehrer
0 Jens Holzkämper
hi!
[link]http://www.djcrackman.net/usr/chopin/design.gif[/link]
weiß wer von euch, wie ich so ein layout von meiner homepage machen kann?
soll ich das irgendwie grafisch lösen, oder mit tabellen. wenn ich da tabellen verwenden kann, wie geht das?
lg
freak
hi
du kannst das mit einer hintergrundgrafik machen, und alle seitenelemente mit position:absolute; ausrichten. also mit vielen <div>'s
tschü ichen
Was dann dazu führen würde dass alles auf wackeligen beinen steht und als layer-technik so dahin "schwebt"
Lös es mit tabellen! So festgeschnurrt wie möglich...
Stell dir vor zu hast eine DinA4 Seite quer gelegt...darauf hast du kleine quadrate ... du kannst sie in ihrer breite und höhe verändern wie du magst...
So legst du Quadrat über quadrat und verschachtelst die ebenen immer höher!...
Es macht spass! =)
ciao
Ich würde die vorschlagen es (natürlich) tabellarisch zu lösen. JEdoch die Tabellen dann mit kleinen(!!) Grafischen Effekten zu verbessern...
Sprich:
-Hintergrund einen leichten verlauf (5 pixel hoch-wiederholt sich)
-Ecken auffällig aber schlicht hervorheben...
-Deam Head der Tabelle einen Eyecatcher verpassen..
Machst du es nicht wir ddeine Seite ein 08/15-PHPNuke-NummerTausendfünfhundertdrei-Seite sein... *rolleyes*
ciao
www.indyaner.de
Ich würde die vorschlagen es (natürlich) tabellarisch zu lösen. JEdoch die Tabellen dann mit kleinen(!!) Grafischen Effekten zu verbessern...
Sprich:
-Hintergrund einen leichten verlauf (5 pixel hoch-wiederholt sich)
-Ecken auffällig aber schlicht hervorheben...
-Deam Head der Tabelle einen Eyecatcher verpassen..
hi!
danke, für deine antwort, jedoch bin ich (noch) nicht so gut in html... ich weiß nicht, wie ich die einzelnen verbindungs linien zwischen z.b. dem Menü und den News machen soll
lg
freak
hi,
danke, für deine antwort, jedoch bin ich (noch) nicht so gut in html...
dann lerne, an hand von kleineren/simpleren beispielen, und setze komplizierte sachen erst dann um, wenn du den nötigen kenntnisstand hast.
es sind bekanntlich noch keine meister vom himmel gefallen - also besteht kein grund, dass du genau das jetzt versuchst.
gruss,
wahsaga
Hi freak,
mit Tabellen dürfte das schwierig sein. Wie man den hinteren Rahmen machen könnte, findest Du hier:
http://aktuell.de.selfhtml.org/tippstricks/css/runde_ecken/index.htm
Da siehst Du, wie man die runden Ecken *g* hinbekommst.
Den Rest machst Du mit fest positionierten Divs.
Um einen Einstieg zu finden gibt es verschiedene Wege. Entweder Du fängst an, den Code von Hand zu schreiben und schaust Dir die Folgen der verschiedenen Änderungen immer wieder in einemm Browser an, etwa dem Mozilla, der sehr standardkonform reagiert.
Oder Du benutzt einen WYSIWYG-Editor wie Dreamweaver an, der Dir erlaubt, grafisch zu arbeiten und gleichzeitig den erzeugten Code anzeigt.
Vielleicht ist eine Mischung aus beidem ein guter Ansatz.
Dann solltest Du für den Anfang noch einen passablen CSS-Editor haben, der Dir ebenfalls die erzeugten Formate direkt anzeigt, etwa TopStyle.
Viele Grüße
Mathias Bigge
hi, Mathias Bigge!
danke, für deine hilfe.
du meinst, ich soll alles grafisch lösen?
jedenfalls, wenn nicht, wie bekomme ich dann die einzelnen verbindungslinien zwischen den tabellen hin?
lg
freak
Hihi!
ich finde für den Anfang die Lösung mit Tabellen etwas einfacher und hier auch sinnvoller... Wenn Du das Ganze verschachtelst, kannst Du Dir ne Menge bytes und dem User dadurch Downloadzeit ersparen, in dem Du einzelne Elemente einfach im Table-Background repeatest! Natürlich wäre eine DIV, also Stylesheet only Lösung auch Akzeptabel und Du müsstest allerdings
in diesem Fall eine komplette Hintergrundgrafik reinpflatschen, was
unnötig Speicher frisst... Mit Stylesheets alleine sind sehr komplexe Layouts leider nicht immer möglich! Vor allem mit Ecken wirds an dieser Stelle ziemlich happig...
Kommt eben immer darauf an, was man genau fürn Layout umsetzen möchte! Ich schlage vor, Du schaust Dir den Vorschlag mit den Runden Ecken nochmal genauer an...
Viele Grüße
Chris
Hihi!
repeatest!
wiederholst.
reinpflatschen,
einsetzen,
Tach,
weiß wer von euch, wie ich so ein layout von meiner homepage machen kann?
im Gegensatz zu den anderen bin ich der Meinung du solltest unter keinen Umständen versuchen das ganze mit Tabellen zu lösen, gerade, wenn du erst mit dem lernen anfängst. Denn was bringt es, wenn du jetzt etwas lernst, was seit 1997 nicht mehr zeitgemäß sein sollte.
Also nur als Denkanstoß:
Versuche dir als erstes die logische Struktur deines Dokumentes vorzustellen, das hat mit dem späteren aussehen nichts zu tun:
Menü, News und Sonstiges sind offensichtlich Listen von Dingen, also formatiere sie mit <ol> und <li>. Überschrift ist eindeutig ein <hx>, der Text in der Mitte wäre vermutlich in Absätzen, also <p> am besten aufgehoben. Es wird sich vermutlich anbieten die Absätze des Textes noch mal in einem Elternelement <div> zusammenzufassen. Das wäre eigentlich alles was mit HTML zu erledigen ist.
Jetzt kommt der Teil: wie soll ich das Design umsetzen, das ich mir vorstelle:
Am besten geht man von hinten nach vorne vor. Das "Quadrat" mit den abgerundeten Ecken sollte ein weiteres div sein, welches alle anderen Elemente enthält. Willst du wirklich runde Ecken, dann schau dir http://aktuell.de.selfhtml.org/tippstricks/css/runde_ecken/index.htm an; ich würde es lassen. Das div darüber enthält dann die Texte, und bekommt einen Margin um den Abstand zum vorherigen div anzuzeigen. Jetzt mußt du "nur noch" die <ol> und <hx> Elemente positionieren, im Optimalfall relativ und nicht absolut. und schon hast du ein solches Design, wie du es wünscht. Die von dir eingezeichneten Linien wären jeweils die Räder der Block Level Elemente.
Wenn du dabei noch konsequent die Einheiten em oder % verwendest und den Validator (http://validator.w3.org) bemühst, wirst du ein sehr gutes, barrierefreies und modernes Ergebnis erhalten.
mfg
Woodfighter