nicht angemeldet
Layout und Idee... und nun ?!
Moin moin...
Also, hab mir heute ein Layout für meine eigene HP gemacht. Hier ist erstmal das Bild:
http://web296.nsi11.miniserver.de/bilder/home.jpg
So. Da wo die große freie Fläche ist soll später ne Textarea sein, mit Texten, Bildern, Votes etc...
Die verschiedenen Gegenstände wie z.B. die Kamera, das Handy, das Fragezeichen oder der Fußball soll man anklicken können (ich umrande das dann mit ner Linie quasi wie in einer Imagemap). Wenn man die Gegenstände anklickt soll in der Textbox dann die entsprechende Kategorie zum Vorschein kommen.
Zusätzlich will ich zu jedem Gegenständ ein Rollover einbauen, in dem der Gegenstand die Farbe wechselt...
Jetzt frag ich mich nach dem "wie"...
... Imagemap ? Beherrsche ich, wir aber schwierig mit Rollover und der Textarea in der Mitte...
... Flash ? Wäre bestimmt geil, aber kann ich nicht so gut...
... Tabellen ? Wird sicherlich schwierig, hab noch keinen Plan wie ich das machen sollte...
... Frames ? Wie soll da denn die Aufteilung erfolgen ? Damit durchschneide ich ja die Gegenstände...
Wäre für Tipps dankbar O_o
Sportfreund
-
Ohne jetzt große Ahnung von Flash zu haben:
... Imagemap
Darum kämst Du bei einer HTML-Lösung nicht drumrum, wenn wirklich NUR die Bilder anklickbar sein sollen und nicht noch etwas rundrum.
... Flash ?
Das ganze sieht mir ziemlich nach einer Flash-Anwendung aus!
... Tabellen ?
Tabellen werden (zumindest sollten sie das) nicht zur Positionierung
von Elementen innerhalb eines HTML-Dokumentes benutzt. Dafür gibt es CSS.... Frames ?
Bitte gleich wieder aus dem Gehirn streichen!!! ;)
Lutz
-
Ja, das mit den Tabellen klingt ja gut, aber kan man das nicht mit einer Imagemap kombinieren ? Also in die Tabellenabschnitte jeweils eine Imagemap...
Und geht bei einer Imagemap ein Rollover?
-
Also habe jetzt folgenden Plan:
Ich zerlege das Bild in 5 Teile:
Einmal den Teil oben, dann links, dann die Mitte (Textarea), dann rechts und den Teil unten.
Das baue ich dann mit Hilfe von einer Tabelle wieder zusammen.
In den 4 Teilen um die Textarea herum baue ich 4 Imagemaps (geht da Rollover-Effekt ? Das muss nämlich sein, sonst funktioniert das nicht... und ich will keine Vierecke, sondern genaue Bereiche um die Gegenstände heurm)... in de rMitte bleibt dann die Inhaltsseite..
Allerdings dürfte sich die Seite bei jedem Klick neu laden, was zu unerträglichen Ladezeiten führt. Kann man das später irgendwie so einstellen, dass sich ab dann nur noch die Textarea lädt, während der Rest bleibt ?
Oder muss ich dazu mit Frames teilen?
-
Heißa, Sportfreund,
Das baue ich dann mit Hilfe von einer Tabelle wieder zusammen.
Du hast ihn wohl nicht richtig verstanden, eine Tabelle sollst du _nicht_ verwenden.
Du bist dir hoffentlich im klaren, dass dein Layout _sehr_ schwer fürs Web zu realisieren wird, eine Website sollte schließlich ordentlich skalierbar und sowas bleiben. Solltest du eine Print-Design-ähnliche Seite erstellen wollen, würde ich dir absolute Positionieren oder Ähnliches in CSS empfehlen.
Gautera!
Grüße aus Biberach Riss,
Candid Dauth--
Ein Fußball-Fan? Noch auf der Suche eine Schlafmöglichkeit im Großraum Stuttgart für die WM 2006? Wie wäre es mit Herrenberg, einer gemütlichen Kleinstadt am Rande des Schönbuchs – von der Lage her ideal, auch für andere Vorhaben im Urlaub. Ferienwohnungen-Herrenberg.com.
http://cdauth.de/-
Warum wird das sehr schwer zu realisieren ? :D
Und wie meinst du das mit CSS?-
Heißa, Sportfreund,
Warum wird das sehr schwer zu realisieren ? :D
Naja, dein Design muss sich an die Browserfenstergröße und an die Schriftgröße deines Benutzers anpassen, wenn du ein Design hast, das aus einer einzigen Grafik besteht, wird sowas schwer.
Und wie meinst du das mit CSS?
Du solltest dir anscheinend dringend das SelfHTML-Kapitel über CSS durchlesen, CSS ist im Web die Sprache, mit der Designs erstellt werden. Mit HTML kann man keinerlei Design festlegen.
Gautera!
Grüße aus Biberach Riss,
Candid Dauth--
Ein Fußball-Fan? Noch auf der Suche eine Schlafmöglichkeit im Großraum Stuttgart für die WM 2006? Wie wäre es mit Herrenberg, einer gemütlichen Kleinstadt am Rande des Schönbuchs – von der Lage her ideal, auch für andere Vorhaben im Urlaub. Ferienwohnungen-Herrenberg.com.
http://cdauth.de/
-
-
-
-
-
-
Hi,
http://web296.nsi11.miniserver.de/bilder/home.jpg
So. Da wo die große freie Fläche ist soll später ne Textarea sein, mit Texten, Bildern, Votes etc...
Die verschiedenen Gegenstände wie z.B. die Kamera, das Handy, das Fragezeichen oder der Fußball soll man anklicken können (ich umrande das dann mit ner Linie quasi wie in einer Imagemap). Wenn man die Gegenstände anklickt soll in der Textbox dann die entsprechende Kategorie zum Vorschein kommen.
Zusätzlich will ich zu jedem Gegenständ ein Rollover einbauen, in dem der Gegenstand die Farbe wechselt...
Jetzt frag ich mich nach dem "wie"...
Genau so, wie Du auch die Vorlage erstellt hast: als Collage.
Erinnere Dich: Du hast alle Teile ausgeschnibbelt und auf einem gemeinsamem Medium zusammengestellt (Mit Tesafilm, wie's aussieht, aber das spielt rein gar keine Rolle). Das kannst Du nicht ganz genau 1:1 auf's Web übertragen, denn da gibt es als Umriss nur Kästchen. Allerdings verfügen einige Graphikformate über die Möglichkeit die "Farbe" Transparent anzugeben (z.B. GIF, PNG usw).
So, wenn Du mir bis hierhin folgen konntest hast Du nun alle Einzelteile Deiner Collage als -- ich nehme mal an GIF- -- Bild mit transparentem Hintergrund vorliegen. Die baust Du nun wieder als Collage zusammen, der gemeinsame Hintergrund ist nun eine HTML-Seite.
Es wird in der Reihenfolge dargestellt, wie es angegeben ist: das zuletzt angegeben Bild wird über allen anderen platziert. Ändern kannst Du das mit der CSS-Angabe 'z-index'.
Die Position kannst Du in CSS mit -- nun rate mal, genau: "position" (hier dürfte wohl "position: absolute;" passen. Zumindest für's erste) und allen Anverwandten ("left","right", "top", "bottom" usw) bestimmen. Der Punkt "0,0" ist übrigens oben links! Es ist möglich die Position mit Pixeln zu bestimmen, aber davon sollte Abstand genommen werden, da es dann nur für eine einzige Darstellungsgröße (Platz im Browserfenster und zwar _Netto_, ohne Scrollleisten, Zusatzfenstern und allem, die reine dargestellte Fläche der Webseite) paßt. Besser wären relative Angaben, bezogen auf die eingestellte Schriftgröße. Aber das ist etwas komplizierter.
Der gewünschte Rollover funktioniert dann wie gewohnt. Falls Du überhaupt nicht weißt, wie das funktioniert frage das hiesige Archiv, das weiß normalerweise alles. Da es das aber nicht immer gut erklären kann und mitunter auch gut vesteckt, bist Du natürlich herzlich eingeladen hier im Forum nachzufragen.Noch ein kleiner Tip zuletzt: versuche nicht alles auf einmal zu implementieren, fang ganz klein an. Probiere Dich z.B. erstmal darin ein paar Bildchen "aufzukleben". Hast Du das im Griff fängst Du eine neue Datei an und probierst da, den Textbereich zu positionieren. Dann bau' beides zusammen. Fang eine neue Datei an, platziere zwei Bilder mit Überlappung und probiere da den Rollover aus, baue dann alles zusammen.
Probiere verschiedene Fenster- und Schriftgrößen aus und schaue zu, wie Dein mühselig zusammengefummeltes Design in sich zusammenfällt.
Frage hier nach: "Watt der Mist denn soll?" ;-)so short
Christoph Zurnieden