Anfänger Problem mit Photoshopdesgin

moppolero · 11.11.2009

Hallo Leute,

bei mir handelt es sich um ein kleines anfänger Problem. Ich hab schon viele Tuts angeguckt, aber hierbei handelt es sich nur um eine kleine Frage. Ich danke euch allen für eure Antworten und Vorschläge.

Also ich hab vor kurzer Zeit erst angefangen mit Photoshop und Dreamweaver. Und jetzt stehe ich vor einem Layoutproblem glaube ich. Mein Design habe ich in Photoshop gemacht. Alles geslict und dann in html&bilder gespeichert.

Meine erste Frage ist, ob ich meine Seite falsch geslict habe und wie ich am besten das layout anfage, da die tabellarische Form mir Probleme bereitet.

Es geht um diese Seite

Wenn ich im Contentbereich einen größeren Textg reinschreibe, gehen in der rechten Menüleiste die Überschriften alle runter..

Wie muss ich die Menüleiste anpassen?

Anschließend wollte ich webspell oder eine ähnlich Scriptsammlung auf meine Seite anpassen.

Ich weiß, dass es sich hierbei um ein Anfängerproblem handelt, aber ich bitte Sie um ihr Verständnis! Vielen Dank im vorraus!

oxygen · 11.11.2009

AW: Anfänger Problem mit Photoshopdesgin

als erstes die tabelle01 - deine festgelegte breite von 1281 und die höhe 1024 solltest du rausnehmen (also die werte 1281 und 1024)

standard - ist noch xga - heisst 1024 x 768
(nicht jeder besucher kommt mit widescreens ins netz)

musst du unbedingt mit tabellen bauen ???
mit div könntest du deine probleme beseitigen

wenn du dich etwas mit html, css, php, js ... befassen willst - wäre das auch für deine seite ganz praktisch - der funpicserver unterstützt das auch ganz brauchbar

hier bekommst du frisches css und html

CrazyLopp · 11.11.2009

AW: Anfänger Problem mit Photoshopdesgin

Kann es sein das du von Photoshop schon die index.html hast?
Ich kann dir nur vorschlagen das du die diese beiden Tutorials mal anschaust, da wird ganz einfach erklärt wie du es selber schreiben kannst, wirklich empfehlenswert...

Hier die Tuts

Mfg
Crazylopp

sfischer · 11.11.2009

AW: Anfänger Problem mit Photoshopdesgin

hallo,

du wirst dir schon einige grundlagen in html und css aneignen müssen, den früher oder später bekommst du probleme (denk mal an all die verschiedenen browser)!
und wenn du das tust mache es gleich richtig, ohne tabellen.

dein problem ist, dass du eine feste höhe angegeben hast und die wird natürlich vom inhalt gesprengt! das kannst du umgehen wenn du deinem inhalt einen overflow:auto; verpasst. wenn der inhalt zu viel ist wird ein scrollbalken angezeigt. ist aber keine schöne lösung!

gruß sfischer

MrPuschel · 11.11.2009

AW: Anfänger Problem mit Photoshopdesgin

Erstmal: Die Anderen haben recht.
Andererseis: Es ist nicht so dramatisch wie es dargestellt wird

Für den ersten Versuch ganz gut, du solltest dir mal ein Tutorial zur Gestaltung eines Webdokuments mit div anschauen. Hier ein ausführliches Tutorial:

Solltest du keine große Lust haben dich komplett dadurch zu arbeiten, such bei google einfach mal nach den Begriffen css div layout float. Da wirst du sicher fündig. Zu guter letzt noch eine alte Seite von mir deren Sourcecode du dir mal anschauen kannst.

Seite: (Augenmerk auf die divs)

Css dazu:

Hoffe es hilft dir weiter,

Gruß Chris

moppolero · 11.11.2009

AW: Anfänger Problem mit Photoshopdesgin

Ich danke euch allen für die schnellen Antworten! Ich werde mich da mal durchkämpfen und berichte, dann von meinen Erfolgen

Herzlichen Dank

highjanni · 12.11.2009

AW: Anfänger Problem mit Photoshopdesgin

ich hab mir das nicht genau angesehen...aber ich glaube da liegt alles in einer tabelle. wenn du unbedingt mit tabellen arbeiten willst, was ich nicht empfehle, dann mußt du sie wohl verschachteln. mit dreamweaver geht das alles eigentlich ganz easy.
da du aber anfänger bist, nutze die chance und arbeite dich in css ein.
gute literatur dazu bietet peter müller mit "little boxes" teil 1 und 2. beides gibt es glaube auch als videotraining. manchmal ist es einfach besser und einfacher, wenn man etwas anhand von beispielen gezeigt bekommt.
viel spaß und gute erfolge!

Konstrukt · 13.11.2009

AW: Anfänger Problem mit Photoshopdesgin

es ist auch möglich die seite aus photoshop direkt als css zu exportieren.
dabei musst du nachdem du auf speichern gedrückt hast, in dem nun
geöffneten dialog unter "dateityp" [html und bilder] auswählen und unter
"einstellungen" in dem dropdownmenu auf [andere] klicken. es erscheint ein
weiter dialog, in dem du darauf achtest, dass bei "ausgabe im xhtml-format"
ein häkchen gesetzt ist. nun klickst du auf [weiter] und wählst im nächsten
dialog "css erstellen" aus. es gibt noch einiges mehr einzustellen, wenn du
möchtest, aber so hast du immerhin schonmal eine solide css-grundlage.

moppolero · 13.11.2009

AW: Anfänger Problem mit Photoshopdesgin

So, danke für die Antworten!

Ich hatte das schon versucht! Des weiteren hab ich noch einige Änderungen am Desgin gemacht ( Downloadbutton und noch einen Menüunterpunkt).

Exportiert hab ich alles mit Photoshop, so wie empfohlen.

Jetzt wollte ich mir noch nen paar Sachen über "div css float" durchlesen..

Ist es besser die vorhandenen div tags in 3 Tabellen zu unterteilen, also Header, Content und Footer.

moppolero · 15.11.2009

AW: Anfänger Problem mit Photoshopdesgin

Hallo liebe Leute,

ich habe mir diverse Tutorials angeschauen, aber dennoch verstehe ich noch nicht ganz float und clear im Bezug auf mein Layout.

Hier in dem Beispiel hab ich den Overflow auf visible gemacht.

Wie muss ich den overflow beim contentbereich machen?

Damit der Footer sich mitbewegt, wie muss ich float und clear benutzen? Und vor allem, muss ich auf was achten im contentbereich?

Kann man irgendwie die Zeilenumbrüche kotrollieren, wenn ich einen ellenlangen Text eingebe? quasi automatische Ümbrüche?

Mir ist auch noch aufgefallen, dass der contentbereich etwas zu breit ist, obwohl die die breite ja fest definiert ist. Woran liegt das?

Könnte mir jemand ein Videotutorial empfehlen für mein Problem?

Danke im vorraus

highjanni · 15.11.2009

AW: Anfänger Problem mit Photoshopdesgin

noooochmal.............besorg dir "little boxes" das videotraining und fang am besten von vorn an...............und nicht mitten drin. das wird doch sonst nur flickwerk. außerdem lernst du gleich auch alles besser zu verstehen.
das training ist auch für anfänger geeignet.