Hompage basteln ist garnicht so leicht

Computer: Software & Programmierung HTML & CSS
#1

Liebe/-r Experte/-in,
ich hoffe sie können mir helfen. Eine Freundin versucht gerade für mich eine Homepage zu erstellen. Leider klappt es alles nicht ganz so wie ich mir das Vortselle. Ich habe ihr eine Photoshop Hintergrund (Himmelverlauf mit Rasen) ein Logo und zwei freigeschnittene Blumen (aus meinem Logo) zur Verfügung gestellt. Den Hintergrund hat sie jetzt wohl irgendwie wiederholent eingesetzt weil man sonst den Rasen nicht sehen konnt. Ok kann ich mit leben, fällt nicht groß auf. Den Mittelbereich hat sie gut hinbekommen (LOGO, Testfeld,Navigation) nur wollte ich zwei größere Freigestellte Blumen links und rechts davon haben. Das bekommt sie nicht hin.
Jetzt wollte ich gerade eine Freundin das bis jetzt erstellte zeigen und bei der war alles verschoben zu sehen…Problem Nummer zwei!!! Wenn ich es öffne ist es OK, verste ich nicht.
So ich hab es mal kopiert…

Kindertagespflege Kullerkekse in Issum-Sevelen

Über mich   Tagespflege   Fotos   Kontakt

Willkommen bei den Kullerkeksen
Ihr Kind in liebevollen Händen!

Kindertagespflege in Issum-Sevelen

© 2012 Kullerkekse » Impressum

Was müssen wir machen um meine beiden freigestellten Blumen zu rein zu bekommen? Und warum war es auf einem anderen Bildschirm so verschoben.
Ich wäre für jede Hilfe total dankbar. Auch wenn es total umgemodelt wird weil sie was falsch gemacht hat.

Grüße Nina Becker

#2

Hallo Nina!

Problem 1:
Stichwort Positionierung: de.selfhtml.org/css/eigenschaften/positionierung.htm

Die Objekte müssen Positionseigenschaften haben (Position Absolute z.B.)

Problem 2:
Höchstwahrscheinlich die Browserinkompatiblität :smiley:
Internet Explorer und Firefox/Crome/Opera/Safari (Und wie sie alle Heissen) gehen unterschiedlich in der Darstellung mit dem HTML Content um.

Daher muss das dann alles optimiert werden :smiley:

Viele Grüße,
Askan

#3

Hallo Nina,

Homepage basteln ist auch nicht so einfach wie viele glauben.

  1. Erstens sollte das Programm mit der du die Seite machst eine Vorschau bieten. So siehst du vor der Veröffentlichung wie die Seite tatsächlich aussieht.

  2. Muss eine Auflösung(z.B 1024x768)für die Seite festgelegt werden, sonst bricht der Text und die Bilder um und werden versetzt angezeigt. Dann passt auch das Hintergrundbild.

  3. Sollte das Programm kompatibel zu Internetexplorer und Firefox sein. Sonst stimmen die Darstellugen nicht.

Die Freigestellten Blumen sollten in einem frei verschiebbaren Layer sein oder in einer Tabelle gefasst werden sonst sind sie einer Schrift gleichzusetzten und fliessen im Text mit und bleiben nicht dort wo du sie hingesetzt hast…

Ist leider ein bischen zu kompliziert um alles technisch genau zu erläutern. Da hilft auch der HTML Code nicht den du mitgesendet hast. Am Besten ist wenn du die ganze Seite schickst… in ZIP

LG Rudi
Webdesigner
www.synoweb.de

#4

Hallo Nina,

richtig! Und deshalb gibt es auch den Beruf des Informatikkaufmanns und Webdesigners wie ich einer bin. Leider muss ich ja auch von irgendetwas leben und seit jeder seine Homepages selbst bastelt (so sehen sie meist auch aus) kann ich das nicht mehr.

Ich bitte um Verständnis, dass ich das nicht auch noch unterstütze, dass man mir die Existenz nimmt bzw. bereits genommen hat.

MfG
OldieForum.com

#5

Hallo Nina,

Ich denke mal es ist nicht das Budget da, um einen professionellen Webdesigner zu beauftragen, daher fand ich die Kritik nicht ganz nachvollziehbar. Die Gefahr kommt doch aus anderer Richtung (Adobe Muse, Business Catalyst und Squarespace). Ein Businesskunde wird es nicht selber machen. Des weiteren ist Wissen viral, es vermehrt sich und ist nicht weg, wenn man es weiter gibt und in der IT schnell veraltet.

  1. DTD - Was ist das für ein Dokument HTML /XHTML?
  2. Alle Styleinformationen in die CSS Datei.
  3. Bsp für divs: links(width:20% float:left) content(width 60%) rechts (width:20% float: right)
    Bilder in die Divs links und rechts.

Wenn nicht anders, die komplette Website packen als zip und mir senden.

Viele Grüße,
Andreas

#6

Hallo Nina,

ich halte das ganze Projekt für ziemlich antik, so habe ich vor 10 Jahren rumgebastelt. Heutzutage gibt es Systeme, deren man sich bedienen kann. Mit einem CMS (Content Mangement System) ist Dein Vorhaben ein Spaziergang, keine Quälerei. Du modifizierst einfach das System (Ganz ohne html!) nach Deinen Wünschen, anstatt eines neu zu erfinden.

In solchen Systemen ist auch vorgegeben, dass Du in allen gängigen Browsern die selbe, fehlerfreie Darstellung hast, ohne verschobene oder seltsam veränderte Elemente. Meine Empfehlung: schmeiss alles bisherige in den Müll! Mache es neu und einfacher, aber richtig!

Für meine Partner biete ich z. B. so ein System auf einem kostenlosen Server an:
http://geld.square7.ch/
Darin kann man ALLES ändern und anpassen, Hintergründe, Farben, Grafiken, einfach alles, nur begrenzt durch Deine Fantasie …

Gerne liefere ich Dir persönlich Informationen, schicke mir bei Interesse eine PN.

Dan

#7

Hallo Frau Becker,
steht die Seite im Netz und wenn ja gibt es ein Link zu dieser Seite?
Wir sehen uns die Sache auch gerne mal an.
Ist die Seite als HTML oder CMS aufgebaut?
Wir nehmen auch gerne telefonischen Kontakt - über eine Festnetz Nummer - auf. Oder über Skype-Name: wavebrook oder Mail: [email protected]
Web: http://waveswebdesign.de
mfg
Helmut Winkenbach

#8

Hallo,
also den Code den Sie gepostet haben, bringt nicht wirklich viel.
Es bringt auch nichts hier irgendein Code hineinzustellen, man müsste sich mal die Grafiken etc. anschauen.

Ich empfehle meistens bei HPs ein CMS.
Dort hat man eine gewisse Basis wo man drauf aufbauen kannn.
Ein bsp. wäre Joomla, es gibt aber noch viele andere gute CMS.

Sie können gerne mal mit uns Kontakt aufnehmen.
[email protected]

www.green-host.de

Das installieren solch eines CMS ist für unsere Kunden auch kostenlos.

#9

Hallo, aller Anfang ist nicht so leicht. Wenn ein Fehler im Quelltext ist, dann wird dieser von verschiedenen Browsern anders ausgegeben. Deshalb sieht man auch etwas anderes als andere. Schaut Euch diesen Quelltext an, hier habe ich Bilder mit css an verschiedenen Stellen platziert: http://www.l-seifert.de/ (Rechtsklick mit der Maus und dann auf Quelltext anzeigen klicken) Mit css kann alles an die richtige Stelle gebracht werden. Css schreiben zu koennen ist genauso wichtig wie html.

Ich hoffe, dass ich Euch helfen konnte.

Viel Freude beim schreiben.
Lothar Seifert

Liebe/-r Experte/-in,
ich hoffe sie können mir helfen. Eine Freundin versucht gerade
für mich eine Homepage zu erstellen. Leider klappt es alles
nicht ganz so wie ich mir das Vortselle. Ich habe ihr eine
Photoshop Hintergrund (Himmelverlauf mit Rasen) ein Logo und
zwei freigeschnittene Blumen (aus meinem Logo) zur Verfügung
gestellt.

Grüße Nina Becker

#10

Hallo,
ich erstelle Homepages meist mit NetObjects Fusion, da gibt es solche Proleme nicht.
Sie sollten aber auf jeden Fall, ein festes Seitenlayout haben, sonst sieht Ihre Site überall anders oder verschoben aus. Das liegt an unterschiedlicher Darstellung durch Grafikkarte oder Monitorgröße, des einzelnen Betrachters.

MfG

#11

Hi Nina,

das Tag, das nach geöffnet wird, wird nicht wieder geschlossen. Das kann je nach Browser schon zu komischen Artefakten, sprich Murks, führen.
Außerdem gibt’s ein schließendes zuviel.
Beides ist ganz einfach vermeidbar, wenn man den Validator des W3-Konsortiums benutzt:
http://validator.w3.org

Davon abgesehen ist veraltet und sollte nicht mehr benutzt werden.

Zu den Bildern kann ich nicht viel sagen. Ein Higru Bild kann jedem Container-Element zugeordnet werden, dabei kann die Position, und das Repeat-Verhalten („Kacheln“) definiert werden.

Deine Anforderung kann im Prinzip so umgesetzt werden:

... und ab hier der eigentliche Inhalt ...



Damit ist das Higru-Bild immer in voller Größe sichtbar, sofern das Fenster groß genug ist. Ist das Fenster größer, kommt die Hintergrundfarbe zum Tragen. Auf's "Kacheln" würde ich verzichten, das sieht eigentlich immer grausam amateurhaft aus, außer man gibt sich viel Mühe mit einem Bild, das an allen Rändern nahtlos zur nächsten Kachel passt.
Das linke und rechte Bild haben je 5% der gesamten Fensterbreite Abstand vom Rand und bewegen sich mit, wenn die Fensterbreite verändert wird.
Wenn die beiden Blumen nicht am oberen Rand kleben sollen, dann statt 'top' einen Pixelwert angeben.
Die 'min-height' muss so groß sein wie das jeweilige Bild plus oberem Abstand - das sorgt dafür, dass das Bild vollständig sichtbar ist, wenn der container mangels Inhalt eigentlich zu klein ist, um das ganze Bild darzustellen.

Das und noch viel mehr steht in SelfHTML.

Gruß
Thomas
#12

Hallo Nina,
das ist mit so einem „Code Schnippsel“ gar nicht so leicht zu Beantworten. Am einfachsten sollte es jedoch mit einem Tabellen Aufbau sein. ANsonsten müssten einfach zwei Container erzeugt werden die einer festen Größe und Position zugeschrieben sind.
Das was dieses „verschobene Aussehen“ angeht, liegt daran das es nur auf eine Auflösung angepasst wurde. User die also eine andere Auflösung haben sehen alles verschoben. Daher immer mit % arbeiten und niemals mit px.
Mehr kann ich ohne mehr Informationen und dem QUellcode da allerdings auch nicht sagen.

#13

Hallo,

vor einiger Zeit habe ich bei wer-weiss-was eine Frage gestellt und du hast mir geantwortet. Ich habe nun noch einge Sachen auf meiner Homepage geändert, alles ist so wie ich es gerne hätte. Nur eins bekomm ich nicht hin.

Die beiden Bilder links und rechts neben dem Content. Es sind zwei freigestellte Blumen, diese sollen links und rechts unten fixiert werden. Ich weiß weder wie ich das hinbekomme (versuche schon seit langem rum) noch kann ich mit den vielen Fachausdrücken der anderen nichts anfangen. Ich bin leider nicht vom Fach, mir muß man genau sagen wo genau ich was einfügen muss.
Da du das anscheinend beruflich machst wollte ich fragen was es kosten würde wenn du mir die beiden Bilder einfügst.

Die Seite (leider ohne Blumen)
www.kullerkekse.net

Gruß Nina

#14

Das lässt sich in der Kürze nicht beantworten.