3 Fragen zu Layout / Ausrichtung

onpoint · 20.09.2010

Hey!

Ich hätte da ein paar Fragen..werd sie einfach mal nummerieren

1. Oft sieht man bei schon fertigen Seiten, dass man je mehr Inhalt in den Inlay kommt, desto weiter weitet sich das Layout nach unten aus..also dass das Layout sich quasi von alleine zieht..hoffe das war verständlich ausgedrückt...wie funktioniert das wenn man selbst via photoshop ne Seite macht? Ist das überhaupt möglich? Da man ja dann eher einzelne Bildelemente hat..und ich kann mir nicht vorstelle wie diese sich "ziehen" sollen..

2. Wird meine Homepage () im Firefox korrekt dargestellt, im Internet Explorer jedoch sind einige Bildelemente minimal verschoben....wo kann da der Grund liegen?

3. Ihr seht bei meiner Homepage z.B. dass sie ein Rechteck ist, das mittig dargestellt wird..was, wenn ich ne seite möchte, die rechts, oben, links unten bis zu den Rändern geht und auch in allen Auflösungen so bleibt? dass sie quasi keinen background hat sondern den kompletten Bildschirm füllt..

Hoffe ihr könnt mir da weiterhelfen, wäre dankbar für Antworten!

Lg

Josef17 · 20.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

Ich hab meine HP mit NetObjekt Fusion aufgebaut, das geschieht das alles von alleine. Wenn ich ein Bild einsetze, was eigentlich nicht passt, erweitert sich der Platz von selbst. Das Bild scaliere ich dann wieder passend indem ich es an den Ecken anfasse und ziehe ( bei gedrückter Strg Taste bleibt das Seitenverhältnis bestehen)

onpoint · 20.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

hmm, wäre das irgendwie auch möglich, ohne dass ich die Software ändern muss? Hatte eigentlich nicht vor von Photoshop abzuweichen..

Doitsu · 20.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

Na ja, das ausweiten nach unten ist eigentlich ganz einfach:
Als erstes mal die Struktur der Seite, du brauchst einen Div-Container, der alles beinhaltet, was auf der Seite angezeigt wird:

Code:

<div id="wrapper">
  <div id="header">Header.</div>
  <div id="content">Content.</div>
  <div id="footer">Footer.</div>
</div>

So, dem wrapper geben wir nun das Bild mit, welches sich immer nach unten ausbreiten soll. Dem header halt das Headerbildchen. & dem Footer dann das Bild, welchen den Abschluss macht.

was dann alles in allem so ausschaut:
^^^^^^^^ Header
///////////////////////Content
///////////////////////der sich
///////////////////////nach unten
///////////////////////verlaengert
vvvvvvvvvvvvfooter

Am besten waere es dann noch, wenn das 'Content'-Bild nur eine 1 Pixel breite Linie ist. Das ganze laesst sich dann natuerlich auch weiter einziehen, um z.B. dem Contentbreich auch noch einen Anfang & Ende zu geben.

Edit:
Frage 2 & 3 vergessen :uhm:

zu 2: Ich vermute mal das Leerzeichen dran schuld sind..

3: Von der Idee wuerde ich die Finger lassen, mach lieber ein festes Layout mit einer gewissen Breite, bist du besser mit dran. aber:
eig. muesstest du das Bild dann nur so schneiden, dass es sich auch in die Breite verlaengern kann, dann richtest du die ganze Geschichte mit floats aus - ist aber ganz schoene Spielerei & wuerde mich nicht wundern, wenn es irgendwie zu anzeige Fehlern kommen wuerde.

Edit2:
Habe mir eben mal die Seite angeschaut - Ich wuerde sie an deiner Stelle komplett neu machen. z.B. hast du Bilder drin, die die gleiche Farbe haben wie dein Hintergrund - wozu soll das gut sein? ^^ Dann weg mit den Tabellen, benutze div's & css - ist evtl. jetzt einiges an Arbeit, lohnt sich aber durch z.B. schnellere Ladezeiten. Wenn du die Bilder, mit der Hintergrundfarbe drin behalten willst, dann schneide die wenigstens auf 1x1 Pixel & vergroesser die durch HTML - da nix drin zu sehen ist, ist das relativ. Dazu dann nur 1 Bild, nicht 4.

onpoint · 20.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

Doitsu schrieb:
z.B. hast du Bilder drin, die die gleiche Farbe haben wie dein Hintergrund - wozu soll das gut sein? ^^ Dann weg mit den Tabellen, benutze div's & css - ist evtl. jetzt einiges an Arbeit, lohnt sich aber durch z.B. schnellere Ladezeiten.

Erstmal danke für die ganzen Tipps!

Aber welche Bilder meinst du?

Ich finde auf meiner Seite keine Bilder mit derselben Farbe wie der Hintergrund...

-edit-

und dann noch ne Frage...ist es möglich mein Design an ein CMS System einzubinden? Habe mir Webspell runtergeladen und auch schon installiert..wüsste jedoch nicht wie ich das eingebunden bekomme...ein wenig html erfahrung bringe ich mit.

lg

Doitsu · 20.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

Sicher geht das - allerdings stellt man CMS normalerweise per CSS ein (soweit ich weiss), habe mir sowas noch nie angeschaut.

Ich finde auf meiner Seite keine Bilder mit derselben Farbe wie der Hintergrund...

Bilder/index_* (Oben/Rechts/Links vom content)

Edit:
fuer Webspell gibt es aber auch ein Forum, wo man wuensche aeussern kann - die Coden dir dann dein Design zurecht (kostet aber)
DE - Suche Forum webSPELL.org CMS

onpoint · 20.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

Achsoo du meinst die Bilder die er quasi selbst gesliced hat?

Nach dem Bau der Seite slice ich die Seite und nehme mir halt das was ich brauche, wie Buttons etc...den Rest generiert er sich wohl selbst und somit hab ich am schluss manchmal viele kleine Bilder..

wäre denk ich parktischer wenn er größere Brocken slicen würde...oder macht man das am besten alles manuell?

Doitsu · 20.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

Oehm, das slicen an sich kann man Photoshop ueberlassen (sofern du jetzt von Photoshop redest), allerdings solltest du sagen, wo er slicen soll. Ich selber schneide die Bilder aber selbst aus, so weiss ich genau, was passiert & kann die Bilder auch selbst bennen.
Aber das Markup, welches Photoshop erstellt, sollte man auf keinen Fall benutzten - das ist ziemlich schlecht. Setzt dich ein bissel mit CSS Auseinadner (width/height/float/clear die wichtigsten Begriffe in dem Zusammenhang.) das ganze tust du dann halt mit Divs umsetzen.

Hier mal 2 Links:

Stichpunkt CSS: Layout ohne Tabellen

TomorrowGraphics · 20.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

wenn es ums slicen und vernünftiges coden geht kann ich diese beiden video-tutorials empfehlen

onpoint · 21.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

Danke an alle für die nette Hilfe!

Habe jetzt bei mir den Downloadbereich etwas verändert...quasi mit nem php script..

allerdings gibts noch paar dinge die ich ändern will...undzwar hab ich alles per include gut in den frame bekommen..funktioniert auch alles super!

doch wenn man z.b. auf den jeweiligen track klickt werden die tabellen quasi größer und es kommt ein Scrollbalken.. (siehe )

wie kann ich das vermeiden? würde gerne die tabellen in dem script etwas schmaler machen, da sowieso nichts verloren geht was das angeht..

ist mir das irgendwie möglich?

lg

TomorrowGraphics · 21.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

bboydaniele schrieb:
...undzwar hab ich alles per include gut in den frame bekommen..funktioniert auch alles super!

Per include in einem Frame?
Das ist unnötig.
Um den Befehl include('seitedieichladenmöchte.php'); zu nutzen brauchst du keinen Frame, das kannst du hinladen wo du möchtest.

bboydaniele schrieb:
doch wenn man z.b. auf den jeweiligen track klickt werden die tabellen quasi größer und es kommt ein Scrollbalken.. (siehe )

wie kann ich das vermeiden? würde gerne die tabellen in dem script etwas schmaler machen, da sowieso nichts verloren geht was das angeht..

ist mir das irgendwie möglich?

lg

Das Zauberwort heißt 'overflow'
Ob das bei frames geht weiß ich nicht... geh ich aber mal von aus...
Gib deinem Frame einfach mal per css overflow:hidden; dann lässt der die scrollbalken weg...

edit:
Wenn ich auf Tracks klicke passiert das nicht.
Nur wenn ich bei 'neue downloads' auf den link klicke.

vielleicht per css ein Max-Width geben... Die scrollbalken weglassen würde ja nicht das problem lösen...

onpoint · 21.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

TomorrowGraphics schrieb:
edit:
Wenn ich auf Tracks klicke passiert das nicht.
Nur wenn ich bei 'neue downloads' auf den link klicke.

vielleicht per css ein Max-Width geben... Die scrollbalken weglassen würde ja nicht das problem lösen...

hmm ich merke gerade dass er mein Layout total zerbaut wenn ich auf TRACKS klicke..da wirds wohl in der Breite UND höhe einen kleinen tick zu groß..

mit Max-Width konnte ich leider nichts erreichen..bzw wo soll ichs reinschreiben? habs mal beim Script an sich reingeschrieben..habe dort separat ein Bedienfeld, wo ich css codes reinschreiben kann..das steht alles drin:

Code:

body{
scrollbar-3d-light-color:#f2f2f2f;
           scrollbar-arrow-color:#5579A6;
           scrollbar-base-color:#ededed;
           scrollbar-dark-shadow-color:#5579A6;
           scrollbar-face-color:#ededed;
           scrollbar-highlight-color:#f5f5f5;
           scrollbar-shadow-color:#7E838C
}


select.select
{
    
    background-color: #ffffff;
    color: #093349
    font-size: 9pt;
}



TEXTAREA {
 FONT-SIZE: 11px;
 FONT-FAMILY: Tahoma,Helvetica;
background-color: #f5f5f5;
    color: #093349
}

.input {
 FONT-SIZE: 12px;
 FONT-FAMILY: Tahoma,Helvetica;
     background-color: #f5f5f5;
    color: #093349

 
 border-top-width : 1px;
 border-right-width : 1px;
 border-bottom-width : 1px;
 border-left-width : 1px;
 text-indent : 2px;
}

.ab {
 FONT-SIZE: 12px;
 FONT-FAMILY: Tahoma,Helvetica;
 COLOR: #000000;
 BACKGROUND-COLOR: #CFCFCF;

 
 border-top-width : 0px;
 border-right-width : 1px;
 border-bottom-width : 1px;
 border-left-width : 1px;
 text-indent : 2px;
}



A:hover {color: #000000;TEXT-DECORATION: underline;POSITION: relative; TOP: 1.5px; LEFT: 1.5px  }

margin:0px auto;

-edit-

logischerweise müsste der code ja direkt in den frame mit der max-width..tut sich jedoch leider nichts..bleibt ohne veränderung..

-edit2-

irgendwie vergisst er wenn ich auf TRACKS gehe Scrollbalken zu erstellen...stattdessen zersplittert er mir das Layout..

TomorrowGraphics · 21.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

bboydaniele schrieb:
irgendwie vergisst er wenn ich auf TRACKS gehe Scrollbalken zu erstellen...stattdessen zersplittert er mir das Layout..

Ich sehe gerade das dem IFrame per style="" einen höhen wert zugehordnet ist...
Wenn du die höhe da nicht unterschiedlich eingetragen hast, dann wird das irgent ein Skript sein, das die höhe der zu ladenden seite ermittelt.
Versuch das mal rauszunehmen.

Gib deinem IFrame mal eine id
id="contentFrame" oder so...

dann schreibst du in die css datei folgendes

HTML:

iframe#contentFrame{
  height:495px!important;
  max-heigt:495px;
  overflow:hidden;
}

Das mit der Breite liegt übrigens daran, das die Seite die du in den Frame lädst so breit ist^^
Aufgrund der länge des Songtitels und dem Datum hintendran

'Details zu: BboyDaniele - Fühlt ihr den Scheiss (Produced by Kinex Beats) vom: 21.09.201' ist nunmal so lang

Warum der Jedoch keinen vernünftigen Zeilenumbruch macht, kann ich dir nicht sagen...

edit:
Übrigens muss ich Doitsu weiter oben Recht geben...
Am sinnvollsten wäre es dein Design nochmal neu aufzubauen mit Div-Containern und Css.
Mit so tausendmal verschachtelten Tabellen wird dabei wahrscheinlich auch nie ein gutes Google-Ranking rauskommen.
Mal ganz abgesehen davon, das du dir wahrscheinlich 80% Code sparen kannst...

die beiden Links die ich gepostet habe sind da wirklich sehr hilfreich und in ein paar stunden hast du ein fertiges, dynamisches design, das vernünftig gesliced ist und daher keine Probleme wie die Verschiebung in deinem nach sich zieht.

onpoint · 21.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

Ja, da geb ich euch auch Recht! Ich bin gerade dabei deine Links / Videotutorials durchzugehn und mich darin einzuarbeiten...wenn, dann will ichs richtig machen!

dann gehts denk ich auch schneller wenn ich in dem bereich schon etwas eingearbeitet bin.

Für den Übrgang würd ichs nur trotzdem gern jetzt erstmal so hinbekommen..ich mein..irgendwie muss es ja möglich sein...

dein vorschlag im letzten Beitrag hat leider nichts gebracht..

Habe die festen Werte im Script weggemacht und er har den Aufbau jetzt etwas verändert...wenn ich auf TRACKS gehe splittet er mir jedoch trotzdem mein bild

-edit-

mir fällt auf dass er unter TRACKS den Bildschirm erst zerhaut, sobald ich nen zweiten Track reinlade! Also scheint von der Breite her alles ok zu sein...an der Höhe muss es irgendwie liegen..

aber normalerweise darf er in nem Iframe doch nicht den rest des layouts verhauen?? iframe ist doch iframe..sobald der inhalt größer wird macht er scrollbalken...oder nicht?

TomorrowGraphics · 21.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

Also wenn ich mir den quelltext deiner Seite angucke, dann hat der IFrame keine id bekommen...

da wird auch nirgens eine css datei geladen... nur ein paar befehle direkt ins html geschrieben...

Mittlerweile verstehe ich auch das hauptproblem...
Du möchtest ja wahrscheinlich noch mehr Lieder einfügen...
Und da du keine Scrollbalken im IFrame haben möchtest, sagt mir das, du möchtest das dein content bereich nach unten wächst...
Daher dann auch das lustige kleine JS namens setIframeHeight()

Leider muss ich dich enttäuschen.
So wie deine Seite geschrieben ist wird das nicht möglich sein.
dazu hättest du sie anders Slicen müssen.
Der Browser kann ja nicht einfach deine Grafiken verlängern wo er es gerade braucht... da müsstest du ihm schon auf die Sprünge helfen und das ganze anders Slicen. jede ecke einzeln etc...

onpoint · 21.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

TomorrowGraphics schrieb:
Also wenn ich mir den quelltext deiner Seite angucke, dann hat der IFrame keine id bekommen...

da wird auch nirgens eine css datei geladen... nur ein paar befehle direkt ins html geschrieben...

Mittlerweile verstehe ich auch das hauptproblem...
Du möchtest ja wahrscheinlich noch mehr Lieder einfügen...
Und da du keine Scrollbalken im IFrame haben möchtest, sagt mir das, du möchtest das dein content bereich nach unten wächst...
Daher dann auch das lustige kleine JS namens setIframeHeight()

Leider muss ich dich enttäuschen.
So wie deine Seite geschrieben ist wird das nicht möglich sein.
dazu hättest du sie anders Slicen müssen.
Der Browser kann ja nicht einfach deine Grafiken verlängern wo er es gerade braucht... da müsstest du ihm schon auf die Sprünge helfen und das ganze anders Slicen. jede ecke einzeln etc...

nene du verstehst das etwas falsch..

Scrollbalken sind definitiv ok! Solange es Scrollbalken nach UNTEN sind!
Runterscrollen sollen die Leute, das ist kein problem..nur der SEITLICHE scrollbalken hat mich gestört beim Klicken auf die einzelnen Tracks..

Das Hauptproblem liegt jetzt an der Stelle, dass sobald ich einen zweiten Track hinzufüge und er diesen unter den ersten legt, mein layout zerspringt, was ich mir garnicht erklären kann..er müsste ja dann wieder den scrollbalken erstellen und der ganze inhalt müsste in dem iframe liegen...

die id vom iframe hab ich wieder raussgenommen weils nichts bewirkt hat..

hoffe ich konnte es jetzt etwas verständlicher ausdrücken

Lg

TomorrowGraphics · 21.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

dann muss einfach das javascript setIframeHeight() raus
und du musst drauf achten das dein titel von dem track nicht zu lang ist...
oder selbst einen zeilenumbruch im titel einfügen...

edit:
ok.. mir fällt grad noch was auf^^
wenn der vertikale scrollbalken erscheint benötigt der einen gewissen platz...
da deine navigation aber genau so breit ist wie dein iframe wird da wohl immer ein horizontaler scrollbalken mit entstehen...

ich frag mich aber immernoch warum der zeilenumbruch bei den einzelnen tracks nicht automatisch bzw. vernünftig erscheint...

onpoint · 21.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

TomorrowGraphics schrieb:
dann muss einfach das javascript setIframeHeight() raus
.

Sag mal wo findest du das setIframeHeigh() bei mir?

ich finde nichts^^ haha

- edit -

ach ich habs gefunden!! es liegt in der html vom PHP SCRIPT, nicht in meinen dateien

nur wo find ich die datei? der browser quelltext zeigt mir an es wäre meine erstellte php mit dem include befehl..jedoch steht dort nichts drin außer halt mein include befehl...komisch..

-edit2-

bin glaub ich im script fast jede datei durchgegangen die bisschen größer war..ich finde den quellcode nirgens...-.-

-EDIT3-

Habs hinbekommen! Habe die Datei gefunden und den Setitiframebefehl raussgenommen, jetzt zerhaut er mir nicht mehr meine Seite!

Jedoch macht er mir wieder nen MINIMALEN horizontalen Scrollbalken...im grunde dasselbe problem wie wenn man auf den jeweiligen Track klickt..

Wenn wir das jetzt noch lösen haben wirs geschafft ^^

TomorrowGraphics · 22.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

bboydaniele schrieb:
Jedoch macht er mir wieder nen MINIMALEN horizontalen Scrollbalken...im grunde dasselbe problem wie wenn man auf den jeweiligen Track klickt..

Wenn wir das jetzt noch lösen haben wirs geschafft ^^

das hatte ich weiter oben schonmal geschrieben

TomorrowGraphics schrieb:
edit:
ok.. mir fällt grad noch was auf^^
wenn der vertikale scrollbalken erscheint benötigt der einen gewissen platz...
da deine navigation aber genau so breit ist wie dein iframe wird da wohl immer ein horizontaler scrollbalken mit entstehen...

onpoint · 22.09.2010

AW: 3 Fragen zu Layout / Ausrichtung

ups, glatt überlesen

das heißt rein theoretisch wäre es nur möglich, wenn ich den Script selbst verändere, heißt ihn in der Horizontale kleiner mache bzw. nen bestandteil ganz wegnehme damit er nicht so breit ist?