Evo 13 Responsive 
Autor: Karl-Heinz A.
Besucht 1138,
Followers 1,
Geteilt 0
Hallo,
bin gerade dabei, meine Website responsive zu gestalten. Bevor ich sie hochlade hätte ich noch eine Frage.
Auf der Startseite habe ich oben ein Textobjekt in Schriftgröße 18 (Begrüßungszeilen).
Dies wird bei gößerer Auflösung gut angezeigt (s. www.alt-konstanzer-hansele.de).
In der kleinen Auflösung für Smartphones verschiebt sich der Text und wird nicht mehr korrekt angezeigt. Nun kann ich dieses Textobjekt ja bei kleiner Auflösung zwar ausblenden, doch das will ich ja gerade nicht, denn die Begrüßungszeilen sollen ja auch auf dem Smartphone erscheinen.
Wie macht man das, dass sich der Text auf die kleine Auflösung optimal anpasst?
Gepostet am
Man könnte den Text auch in den Header stellen! Dort kann man die größe des Objekts bei jedem Breakpoint extra anpassen.
Oder du passt den Text per CSS Code an damit er am Handy verkleinert wird. Das ist aber individueller Code, dafür gibt es keinen Standardcode.
Autor
Leider habe ich den CSS Code nicht drauf!
Würde es auch gehen, wenn man das Projekt nochmal nur für die Auflösung 0px bis 720px erstellt? Dann könnte man ja denn Text auch entsprechend verkleinern. Nur stellt sich dann die Frage, wie man die beiden Projekte in der großen und der kleinen Auflösung auf dem FTP-Server wieder zusammenführt. Würde dies gehen und wenn ja wie?
Autor
Habe das mit dem Schriftzug jetzt anders gelöst. Die Website habe ich jetzt responsive hochgeladen.
Allerdings lässt sich das Headerbild in der vertikalen Handystellung in kleinster Auflösung 0-480px nicht anpassen.
Die Breite bleibt beim Wert 320 sodass das Headerbild in der Handystellung zu weit links steht. Warum läßt sich die Breite hier nicht verändern und das Bild besser anpassen? In der Vorschau springt es beim Wert 480 immer nach links und bildet den Rand.
Was wäre hier die Lösung?
Normalerweise schiebt man nur den Browser zusammen wenn man testet. Am Handy wird es anders ausschauen. Aber ja, anscheinend ist das so gewollt von INCO dass es ab 480px am linken Rand beginnt. Das ist es leider nicht dynamisch gestaltet aus welchen Gründen auch immer.
Man könnte es auch als Header Hintergrundbild einfügen ob es dann anders wirkt. (Im Header ausblenden und in der Struktur einfügen bei 480px.)
Wenn du den Text im Content angepasst haben willst, dann könntest du den Text als Grafik abspeichern, denn diese wird responsive angepasst.
Autor
Das mit dem Bild habe ich jetzt in der Struktur geändert. Es geht aber nur mit Horizontale Wiederholung oder Wiederholung in beide Richtungen. Optimal ist es zwar immer noch nicht, aber besser wie die leere Fläche vorher. Vielleicht könnte man es von der Softwareseite hier in der untersten Auflösung noch etwas flexibler gestalten.
Danke!
Noch zum Text im Content. Du meinst doch das obere Textobjekt auf der Startseite. Wie speichere ich hier den Text als Graphik ab? ...oder wäre es möglich, wenn ich den passenden CSS-Code von Dir erhalte?
Der Code ist individuelle und müsste auf deine Seite angepasst werden.
Am einfachsten wäre es wenn du "Paint" benutzt und einen Text schreibst und ihn abspeicherst und als Grafik einfügst.
Autor
Ok, danke hat geklappt.