|
kust
Beiträge: 241
|
 Optimierung für Mobile Geräte
|
Kann ich bestehende Webseiten welche mit DynPG erstellt wurden für Mobile Geräte (iPhone, iPad, Smartphone) nachträglich optimieren ?
Beispiele: www.hombi.ch oder www.hrns.ch
MfG kust
|
|
|
|
|
|
|
11.02.2015 21:10
|
ZITIEREN
| ANTWORTEN
|
|
Urs Gamper
Beiträge: 530
|
Hoi Kust
dynpg ist nicht mit dem Layout von Websites verbunden.
Du kannst also ein responsive Design erstellen und den Inhalt wie bei den momentanen Sites verwenden.
Allerdings bedeutet es zum Teil eine etwas andere Vorgehensweise in TinyMCE. Das heisst, dass man darauf achten muss, wie man Tabellen einbindet etc.
Vielleicht eine Hilfe mobil-barrierefrei.ch
Bei Fragen kannst du mich jederzeit kontaktieren.
Grüessli
Urs
|
gamper media GmbH
5621 Zufikon
+41-56-631 80 23
|
|
|
|
|
11.02.2015 21:57
|
ZITIEREN
| ANTWORTEN
|
|
kust
Beiträge: 241
|
Danke Urs für den Tip "ein responsive Design erstellen " und für den Link.
Habe auch hier noch reingeschaut:
http://www.dieproduktmacher.com/in-5-schritten-von-der-aktuellen-website-zum-responsive-design/
Nachdem ich folgende Ergänzungen ausgeführt habe, wird die Naviagtion sowie der Inhalt in angenehmer Schriftgrösse angezeigt auf dem iPhone
bei index.php & info.php:
Meta Viewport wie auf der oben erwähnten Webseite enthalten.
bei css/Basic.css:
img {max-width: 100%; height: auto;}
Bei www.hombi.ch mit iPhone i.O. - Android kann ich selber nicht testen.
MfG kust
|
|
|
|
|
|
|
12.02.2015 11:56
|
ZITIEREN
| ANTWORTEN
|
|
kust
Beiträge: 241
|
Bei anderen Webseiten war der Erfolg nicht sogut wie bei www.hombi.ch
Darum habe ich nach weiteren Möglichkeiten gesucht, eine gut lesbare Anzeige auf dem Handy anzubieten. Nun habe ich mit der Software "MobileWebsite-R4E" von www.ads-content.de verschiedene Versuche ausgeführt. Um die sehr einfache Einbindung zu zeigen, habe ich die PDF-Datei mit dem sehr kurzen Handbuch als Beilage angehängt.
Zugegeben, auf der Webseite www.ads-content.de hat es auch 2 komische Hinweise:
1. Link zu einem Test für die Mobil-Tauglichkeit - mit diesem Test konnte ich gar nichts anfangen (mit folgendem Test hat es dann vor und nach der Optimierung besser funktioniert: https://www.google.com/webmasters/tools/mobile-friendly/)
2. Der Hinweis "Kein Support nach dem Kauf" - dies hat mich etwas irritiert, aber in meinem Fall war der Support dann auch nicht notwendig (css-, php- und html-Kenntnisse genügen).
Die verschiedenen Versuche werde ich später beschreiben.
MfG kust
|
|
|
|
Attachments
|
|
1
|
Attachment (Dateityp: pdf, Größe: 506 Kb)
|
|
|
|
03.03.2015 21:10
|
ZITIEREN
| ANTWORTEN
|
|
kust
Beiträge: 241
|
"MobileWebsite-R4E" eingebunden bei www.kavalleriemusik.ch
Im DynPG habe ich die Tabelle mit dem Jahresprogramm in eine neue Seite kopiert. Dort habe ich die Tabelle auf 280 px verschmälert.
>> http://www.kavalleriemusik.ch/info.php?t=Jahresprogramm-m&read_group=37
Oben auf dieser Seite hat es einen Link "Mobile-Version (für Handy angepasst hier anzeigen)".
Unten auf dieser Seite hat es "Weitere Information zur Mobile-Version".
Im DynPG habe ich von dieser Seite die HTM-Ansicht gewählt und den ganzen HTML-Code bei "MobileWebsite-R4E" eingefügt. Dies ist ein gangbarer Weg, weil dieses Jahresprogramm nicht oft geändert wird und weil diese Tabelle mit Word so angeliefert wird (Absprache mit dem Termin-Manager).
Bei den Seiten "Vorstand", "Musikkommission" und "Impressum" habe den HTML-Code aus DynPG zu "MobileWebsite-R4E" kopiert und leicht angepasst:
width: 100% bei der Tabelle und zu lange Worte mit Trennzeichen versehen.
Hier also Doppelspuriger Unterhalt, was mit Zusatz-Aufwand verbunden ist.
Auf der nächsten Seite zeige ich ein dynamisches Beispiel mit Inhalten aus einer MySQL-Datenbank.
|
|
|
|
|
|
|
03.03.2015 21:52
|
ZITIEREN
| ANTWORTEN
|
|
kust
Beiträge: 241
|
"MobileWebsite-R4E" eingebunden bei www.musikagenda.ch
Im DynPG habe ich von der Seite www.musikagenda.ch/auftritte.php die php-Datei kopiert und so angepasst, dass eine schmale Anzeige entsteht.
>> www.musikagenda.ch/auftritte-m.php
Bei "MobileWebsite-R4E" habe ich bei "Blaskapelenkonzerte" unter dem Titel "Blaskapelenkonzerte im Zürcher Oberland" einen Link zu folgender Seite eingefügt:
>> www.musikagenda.ch/auftritte-m.php?viewtype=normal
Dadurch wird diese Seite immer mit den aktuellen Informationen aus der MySQL-Datenbank auf dem Handy angezeigt - in optimaler Breite und in einer gut lesbaren Schrift.
Weitere Möglichkeiten, DynPG ohne Doppelspurigkeit beim Unterhalt mit einer Mobile-Version zu verbinden würden mich natürlich interessieren.
Freundliche Grüsse
kust
|
|
|
|
|
|
|
03.03.2015 22:17
|
ZITIEREN
| ANTWORTEN
|
|
Urs Gamper
Beiträge: 530
|
Hoi Kurt
Ja das ist noch ganz interessant.
Allerdings ist dies für eine grössere Website mit ständig wechselnden Inhalten wohl nicht gerade benutzerfreundlich.
Da ist mir die Variante mit dem Erstellen eines eigenen Templates und dem Einbinden der Bootstrapnavigation sowie eines eigenen CSS halt schon viel sympatischer. Zudem benötigt dies nicht viel mehr Zeit, hat aber den Vorteil, dass kein Inhalt doppelt erfasst werden muss.
Aber wie bereits oben erwähnt, hat dies ja eigentlich auch nichts mit dynpg zu tun.
Trotzdem vielen Dank für deine Schilderung. Du müsstest per CSS noch steuern, dass die Navigation noch etwas grössere Buttons erhält. Dann sieht das Ganze doch recht gut aus.
Grüessli
Urs
|
gamper media GmbH
5621 Zufikon
+41-56-631 80 23
|
|
|
|
|
03.03.2015 22:42
|
ZITIEREN
| ANTWORTEN
|
|
kust
Beiträge: 241
|
Danke Urs für diese Antwort sowie für den Hinweis "Schriftgrösse". Für das Menü und die Buttons habe ich die Schriftgrösse im CSS angepasst.
Hast du mit iOS oder Android getestet ?
Habe nun noch Artikel zum Thema "Einbinden der Bootstrapnavigation" gelesen. Wäre natürlich schon das Richtige um den doppelten Unterhalt bei den Inhalten zu vermeiden.
Kannst du mir eine www-Adresse angeben, bei welcher eine Bootstrapnavigation angewendet wird. Wenn möglich mit der Navigation in der linken Spalte wie bei www.hombi.ch
Freundliche Grüsse
kust
|
|
|
|
|
|
|
04.03.2015 17:07
|
ZITIEREN
| ANTWORTEN
|
|
Urs Gamper
Beiträge: 530
|
Hoi Kurt
| Zitat | | Hast du mit iOS oder Android getestet ? |
Mit Android
Ich erstelle seit gut zwei Jahren eigentlich alle Websites mit Bootstrap.
Mit vertikaler Navigation findest du z.B.
Kaisertanz
Homöopathie Egli
Grüessli
Urs
|
gamper media GmbH
5621 Zufikon
+41-56-631 80 23
|
|
|
|
|
04.03.2015 17:40
|
ZITIEREN
| ANTWORTEN
|
|
kust
Beiträge: 241
|
Danke Urs für die beiden Adressen - sehen sehr gut aus, auch auf dem Handy !
Um den doppelten Unterhalt bei den Inhalten zu vermeiden, habe ich für meine DynPG-Seiten (Navigation immer in der Spalte am linken Rand) eine Lösung gefunden.
Nach wie vor verwende ich die Software "MobileWebsite-R4E" von www.ads-content.de.
Im Mobil-Menü von www.hombi.ch bei "Übersicht" wird ab dem zweiten Link die Datei mobil.php?artikel=xx verwendet, in welcher nur die Inhalte vom mittleren Teil angezeigt werden - mit eigener CSS-Datei. Die Artikel-Nummer kann beliebig angegeben werden.
Mit diesem Stand werde ich meine Versuche abschliessen. Vielen Dank für alle Tips.
Freundliche Grüsse
Kurt Stettler
|
|
|
|
|
|
|
26.03.2015 10:52
|
ZITIEREN
| ANTWORTEN
|
|
kust
Beiträge: 241
|
Habe festgestellt, dass sich das Modul Bildergalerie für das Anzeigen von Bildern auf dem Handy recht gut eignet (1 Bild pro Zeile, 99 Zeilen pro Seite).
Aber nur wenn folgende Zeile in der php-Datei enthalten ist:
meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"
Nun wäre es schön, wenn die Zoom-Funktion mit 2 Finger auf dem Handy verwendet werden könnte.
Wenn die Zeile mit scalable=no weggelassen wird, kann Zoom verwendet werden. Weil aber die Seite mit den kleinen Bildern eine fixe Breite hat (für Diashow starten und Seiten-Nummern unten rechts) werden die Bilder nur klein angezeigt und müssen zuerst manuell vergrössert werden.
Kann ich die Seitenbreite irgendwo verändern oder die Zeilen mit "Diashow starten und Seiten-Nummern unten rechts" weglassen ?
2 Beispiele:
http://www.kavalleriemusik.ch/mobil.php?artikel=124 mit scalable=no
http://www.kavalleriemusik.ch/foto.php?artikel=124 ohne scalable=no
Freundliche Grüsse
kust
|
|
|
|
|
|
|
28.05.2015 00:29
|
ZITIEREN
| ANTWORTEN
|
|
kust
Beiträge: 241
|
Es hat sich erledigt, nachdem ich mit den Stickworten iPhone & skalieren "gegoogelt" habe.
Lösung:
meta name="viewport" content="width=device-width,initial-scale=1.0"
in der php-Datei foto.php
Beispiel:
http://www.kavalleriemusik.ch/mobil.php?artikel=123
bei allen Links zu den Bildern.
Freundliche Grüsse
kust
|
|
|
|
|
|
|
28.05.2015 15:58
|
ZITIEREN
| ANTWORTEN
|
