HTML Anfänger: Responsives Design

Hallo,

ich baue mir gerade eine kleine neue Webseite auf. Natürlich möchte ich diese gleiche so umsetzten, dass diese auf allen Geräten gut aussieht.

Mein Aufbau hat in etwa diese Form wenn die Seite mit einem großen Bildschirm aufgerufen wird.

http://img5.fotos-hochladen.net/uploads/entwurfymhqwnbg64.png

Dieser Entwurf sollte auch so bleiben (hat persönliche Gründe). Nun eben meine Frage wie könnte ich daran weiter arbeiten, dass die Seite nicht nur kleiner geschoben wird, denn irgendwann kommen wir an einem Punkt an wo es einfach nur scheiße aussieht. Meine Idee war folgende:

Das Logo bekommt bei einer Handy Größe die volle Breite, darunter ein Button der übe die ganze Zeile geht mit der Bezeichnung „Navigation“ klickt man da drauf schiebt sich der ganze Content nach unten und die Navigation erscheint, ebenfalls pro Punkt eine Zeile.

Die Box auf der rechten Seite verschwindet komplett, ist auf einem Handy nicht wichtig, hier könnte man auch einen Navigationslink einblenden lassen, der den Inhalt (Kundenmeinungen) anzeigt.

Der Inhalt, klar der wird unten komplett angezeigt, erst die Überschrift dann Text.

Die Grafik darüber, da bin ich ehrlich gesagt noch am überlegen ob diese einfach ganz raus fliegt. Verbraucht nur unnötig Platz und Traffic. Was ich dann allerdings mit dem Text und dem Slogen mache, ist mir noch nicht klar. Könnte ich rein von der Reihenfolge über meinen Content packen, denn auch auf dem großen Bildschirm ist dieser immer im Zusammenhang mit dem Text, der darunter erscheint.

Vielleicht habt Ihr ja noch eine Idee was ich machen könnte. Ach ja, sind die User gewöhnt, dass auf kleinen Ausgabegeräten Bereiche komplett wegfallen oder z.B. wie ich es vor habe nur über einen Link zu finden ist?

  1. Hallo

    Vielleicht habt Ihr ja noch eine Idee was ich machen könnte.

    Ohne den konkreten Inhalt der Seite zu kennen läßt sich darüber überhaupt keine seriöse Aussage treffen.

    Ach ja, sind die User gewöhnt, dass auf kleinen Ausgabegeräten Bereiche komplett wegfallen oder z.B. wie ich es vor habe nur über einen Link zu finden ist?

    Bist du kein User?

    Ja das sind die User gewohnt und das stört sie in der Regel überhaupt nicht. Es ist im Gegenteil eher so, das viele User sich wünschen, auch in großen Fenster "nur" den Inhalt der mobilen Version sehen zu müssen. Das sind die Informationen die wirklich interessieren.

    Unnütze Grafiken und Werbung will kein User.

    Gruss

    MrMurphy

  2. Tag,

    http://img5.fotos-hochladen.net/uploads/entwurfymhqwnbg64.png

    Dieser Entwurf sollte auch so bleiben (hat persönliche Gründe). Nun eben meine Frage wie könnte ich daran weiter arbeiten, dass die Seite nicht nur kleiner geschoben wird, denn irgendwann kommen wir an einem Punkt an wo es einfach nur scheiße aussieht.

    dazu müsstest du verraten, welche Bereiche was darstellen. Deine Idee, eine Skizze zu zeigen, ist gut (kommen die Wenigsten drauf), aber die Beschriftung ist leider kaum lesbar, geschweige denn aussagekräftig – von "Logo" mal abgesehen.

    darunter ein Button der übe die ganze Zeile geht mit der Bezeichnung „Navigation“

    Das Menü kannst du auch unter einem Hamburger verstecken, jenes Symbol mit drei horizontalen Strichen übereinander, wie es auf jedem Smartphone aufgedruckt ist. Stecken allerdings wichtige Punkte drin, solltest du sie direkt anzeigen.
    Das Impressum wäre weniger wichtig und könnte im Aufklappmenü landen, erklärst du aber auf drei Seiten die drei tollen Seiten deines Produktes, solltest du diese drei Seiten auch einzeln nennen.

    Die Box auf der rechten Seite verschwindet komplett, ist auf einem Handy nicht wichtig, hier könnte man auch einen Navigationslink einblenden lassen, der den Inhalt (Kundenmeinungen) anzeigt.

    Ich weiss nicht, an welche Form von Kundenmeinungen du denkst, aber falls es um Eigenlob geht: Lass' es besser ganz weg. Interessiert keine Sau, denn das glaubt keine Sau, und auf nicht wenige wirkt sowas gar lächerlich. "Hannes P. aus E., 26: Wuppifix hat mein Leben verändert!", "Lydia A. aus P., 68: "Ich war skeptisch, aber Wuppifix hat mich überzeugt!" ...

    Die Grafik darüber, da bin ich ehrlich gesagt noch am überlegen ob diese einfach ganz raus fliegt. Verbraucht nur unnötig Platz und Traffic. Was ich dann allerdings mit dem Text und dem Slogen mache, ist mir noch nicht klar.

    Überlege dir, ob der Text einen wesentlichen Informationsgehalt hat und/oder ob er sich noch kürzen lässt, ob vielleicht sogar nur der Slogan alleine reicht.

    Vielleicht habt Ihr ja noch eine Idee was ich machen könnte. Ach ja, sind die User gewöhnt, dass auf kleinen Ausgabegeräten Bereiche komplett wegfallen oder z.B. wie ich es vor habe nur über einen Link zu finden ist?

    Seit es das Web gibt, sind tendieren die meisten Seiten eher dazu, überladen zu sein. Google hat seinerzeit nicht nur mit brauchbaren Suchergebnissen Furore gemacht, sondern auch mit seiner fast leeren Startseite.