OMG: Mailverkehr unter [e-mail]

[Matthias Scharwies]

Servus!

Ich glaube ja, dass in punkto Webdesign bereits alles gesagt und darüber geschrieben wurde und verlinke daher gerne auf's SELFWiki, anstatt den fehlerhaften Code unserer Kunden eigenhändig zu debuggen.

1. eine (kurze) Anfrage

Auch über Mail erreichen uns immer wieder Anfragen:

Ich wollte auf meinen alten Projekten (nicht responsive) nur die Schriftart für kleine Bildschirme vergrössern. Funktioniert irgendwie nicht. Auf dem Handy sind sie immer noch gleich klein.

Liegt das am Handy oder wird das generell nicht umgesetzt?

@media screen and (max-width: 425px) {
   p {
    font-size:1.5em;
   }
}

2. eine kurze Antwort

evtl. liegt es unvollständigen Grundgerüst. <meta name="viewport" content="width=device-width, initial-scale=1.0"> ist zwingend erforderlich, damit Handys die Webseite nicht komplett darstellen. Verwendest Du feste Breiten oder gar Tabellen? HTML/Tutorials/responsive_Webdesign/bestehende_Webseiten_umbauen

3. Ah, eine Tabelle

Herzlichen Dank für deine Antwort.

Zum Grundgerüst: Gehört das auch auf Seiten, die nicht responsive sind? Und ja, ich arbeite mit Tabellen auf den nicht responsiven Seiten. Wenn auch mit nur wenigen. Es gibt auch schon div’s.

Brüllheulne

Hier ein Beispiel:

(Link entfernt)

4. eine (längere) Antwort

Ja, mittlerweile surfen über 50% der Nutzer mit dem Smartphone. Also sollten/müssen alle Seiten responsive sein.

1. Problem (fehlendes Grundgerüst): Ohne die Meta-Viewport-Angabe skaliert Safari (und die anderen Telefone) die Seite so klein, dass sie auf den Natel-Bildschirm passt. Das ist nicht gewollt, da die Schriftgröße dann zu klein ist! Du verwendest <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

Mittlerweile könntest Du mit utf-8 auch smileys und emojis verwenden.

2. Problem (Tabellen-Layout) Der Browser (auch in einem Telefon steckt ja ein solches Programm) stellt die Inhalte wie in einer Tabelle gewollt nebeneinander dar - du musst nach unten und zur Seite scrollen, um an die Inhalte zu kommen.

Und ja, ich arbeite mit Tabellen auf den nicht responsiven Seiten. Wenn auch mit nur wenigen. Es gibt auch schon div’s.

Da gibt's mittlerweile Elemente wie header, nav und article:

HTML/Tutorials/Seitenstrukturierung

Ich kann Dir nur empfehlen, deine Web-Kenntnisse auf den neuesten Stand zu bringen und Deine Webseite(n) zu überarbeiten. Der Aufwand ist nicht zu groß. Wir haben ein Tutorial, dass alle Belange anspricht:

CSS/Tutorials/Einstieg/Webseiten responsiv umbauen

Anmerkung: Vielleicht habt ihr in den letzten Änderungen gesehen, dass ich im CSS-Einstieg einiges umverteilt habe. Der "Gute CSS-Stil" findet sich nun im Syntax-Kapitel. Das oben erwähnte Kapitel, dass ja das HTML-Markup erst einmal unberücksichtigt lässt und sich auf den Verzicht fester Breitenangaben und eine kurze Einführung von media queries beschränkt, wurde durch ein Grid-Beispiel erweitert.

Das nächste Kapitel ist eine Baustelle. Eigentlich sollte das neue Beispiel Design03 noch am gleichen Tag fertiggestellt werden, aber mir kommt dauernd etwas dazwischen. 😟

5. Die finale Antwort

Die alten Seiten werde ich wohl nicht mehr responsive machen. Aus Erfahrungsgründen. Ich habe an die 20 Projekte und leider festgestellt, dass diejenigen, die ich komplett auf responsive umgestellt haben, in den Suchresultaten von Google von den vordersten Plätzen für Jahre verschwunden waren. Und auch heute noch nicht wieder dort sind.

Ich glaube, die Handys sind gar nicht so das Problem, zumal die Tendenz nach immer grösseren geht. In den Smartphones kann man die Seiten gut mit den Fingern leicht vergrössern.

Mir fällt nix mehr ein.

tl;dr

Das nächste Mal kommt der Textbaustein:

„SELFHTML wird von Freiwilligen getragen. Da unsere manpower begrenzt ist, können wir individuelle Fachfragen leider nicht persönlich beantworten.

Bitte stellen Sie ihre Frage im SELF-Forum. Dort findet sich eine breite Community, die ihre Fragen kompetent beantwortet.“

Herzliche Grüße

Matthias Scharwies