PDA-Version auf Basis der Druckansicht

smart · Beitrag von **smart** » Do 17. Aug 2006, 23:17

Liebe Leute,
ein Halbwissender traut sich wieder an eine für ihn zu große Aufgabe - aber nur so kann man ja lernen...

Ich würde gerne eine PDA-freundliche Version meiner Website erstellen. Heißt im Klartext:

* Eine vereinfachte Ansicht, nach Möglichkeit mit kleineren Bildern (da ich aber auf der Website eine Spaltenbreite von 400px benutze und somit die Bilder auch verhältnismäßig klein hochlade, ist das eher Nebensache).

* Ein einfaches Menü, welches klein genug ist, im Header der Seite angezeigt zu werden. Also nur mit einer Unterkategorie, Beispiel: "Home - Kontakt". So kommt der User per Link immer wieder auf die höhere Ebene und kann dort aus dem Menü zur nächsten Unterseite wechseln.

* Eine Ignorierung der Formatierung, sodass alles simpel und in kleiner Schrift angezeigt wird - ähnlich der Druckeransicht (style_print.css).

Leider habe ich keine Ahnung, an was für eine Aufgabe ich mich dort wage. Hat jemand von euch Erfahrung?

Beitrag von **emergence** » Fr 18. Aug 2006, 09:24

ad. css
-> http://contenido.org/forum/viewtopic.ph ... hlight=pda

smart · Beitrag von **smart** » Fr 18. Aug 2006, 12:32

Das ist schon alles viel mehr, als ich es will.

#ayshe hat geschrieben:Zunächst habe ich dem Kunden vorgeschlagen, den Output mit speziellem CSS für die Mobilen Geräte anzupassen. Das wäre ja noch leicht.

Leider fehlt mir da der Background. Hat jemand schon Ähnliches auf die Beine gestellt? Oder besser: Hat jemand schon einen ganz einfachen Style und ein einfaches Layout, an dem ich mich orientieren könnte?

smart · Beitrag von **smart** » Fr 18. Aug 2006, 14:23

Mittlerweile habe ich ein bisschen experimentiert: Das Ergebnis entspricht schon sehr meinen Vorstellungen.

Jetzt suche ich noch eine Möglichkeit, alle Grafiken automatisch verkleinern zu lassen. Gibt es da eine Chance, eine Maximalgröße für Grafiken einzurichten? Ich habe es erst folgendermaßen versucht (mit dem Bewusstsein, dass große Grafiken dann immer noch groß sind - und der Traffic sich vermutlich ja auch nicht ändert, stimmt's?):

style_mobil.css

Code: Alles auswählen

img, a img {
	width: 50%;
	height: 50%;
}

Allerdings funktioniert das mal gar nicht. Dann werden die Grafiken merkwürdigerweise extrem verzogen. Viel höher, die Breite bleibt die Originalbreite. Hat jemand einen Tipp?

smart · Beitrag von **smart** » Fr 18. Aug 2006, 14:55

Neben meiner Frage oben wüsste ich dann noch gerne, wie ich die neue Ansicht integrieren kann. Würde gerne einen Link auf die Startseite setzen und eine Subdomain direkt auf die vereinfachte CSS-Version legen - nur was genau muss ich da im Link definieren? Schließlich soll eingerichtet sein, dass sich Layout , Template und Style für alle nachfolgend angeklickten Artikel ändern. Muss ich tatsächlich Kopien der ganzen Artikel anlegen? Bietet sich dazu die Anlage einer neuen Sprache an?

Ich weiß - viiiieeeele nervige Fragen.

Ich danke dem, der die passenden Antworten hat!

smart · Beitrag von **smart** » Sa 19. Aug 2006, 16:49

Niemand???

i-fekt · Beitrag von **i-fekt** » Sa 19. Aug 2006, 16:56

das geht viel einfacher. Du gibst deiner Seite das entsprechende CSS mit und sagst via media-Attribut für welches Ausgabemedium das CSS ist.

Code: Alles auswählen

<link rel="stylesheet" type="text/css" href="pfad/zur/handheld-css-datei.css" media="handheld"/>

smart · Beitrag von **smart** » Sa 19. Aug 2006, 17:03

Das habe ich zufällig genau gerade einmal ausprobiert - und es hat mit meinem PDA nicht funktioniert. Außerdem unterscheidet sich ja auch das Layout der beiden Versionen...

mvf · Beitrag von **mvf** » Sa 19. Aug 2006, 18:51

smart hat geschrieben:Das habe ich zufällig genau gerade einmal ausprobiert - und es hat mit meinem PDA nicht funktioniert. Außerdem unterscheidet sich ja auch das Layout der beiden Versionen...

wenn das layout korrekt aufgebaut ist, dann steuerst du auch das handheld layout komplett über css und damit die optik total (beispiel finden sich im zengarden für media screen) sprich genau wie es i-fekt oben schrieb

und wie immer ist 'geht nicht' etwas wage, was sagt denn dein handheld was es für ein css nutzt, eventuell haste das nicht richtig eingebunden und der handled nut gar nicht das pda.css

also ein paar mehr infos tun wie immer gut

stell doch mal was online mit 2 unterschiedlichen css dateien und switche im browser zb FF das style auf handheld

smart · Beitrag von **smart** » Sa 19. Aug 2006, 22:06

mvf hat geschrieben:und wie immer ist 'geht nicht' etwas wage, was sagt denn dein handheld was es für ein css nutzt, eventuell haste das nicht richtig eingebunden und der handled nut gar nicht das pda.css

Du hast Recht: Die Anzeige funktioniert, glich nur extrem der "normalen" Ansicht der Website mit der Standart-CSS. Habe es aber dann doch erkannt.

Jedenfalls habe ich mich jetzt aus verschiedenen Gründen für zwei unterschiedliche Layouts entschieden. Das ist einfach flexibler. Jetzt wüsste ich nur gerne, ob sich dafür die Anlage einer neuen Sprache anbietet (sodass ich auch Artikel kopieren kann und diese evtl. noch PDA-freundlicher gestalten kann), und ob Ihr eine Lösung für mein Grafik-Problem (siehe oben) habt...

mvf · Beitrag von **mvf** » So 20. Aug 2006, 02:16

smart hat geschrieben:Jedenfalls habe ich mich jetzt aus verschiedenen Gründen für zwei unterschiedliche Layouts entschieden. Das ist einfach flexibler.

Das stimmt so nicht ganz IMHO, wie oben beschrieben ist zengarden eine wunderbares contra-Argument.

Wenn Du ein sauberes, css basiertes Layout hast, dann 'drückst' Du das in jede gewünschte from mit nur einem weiteren CSS.

Suche mal im board nach Druckmodul da siehste den Ansatz it einem Layout und unterschiedlichen css für screen und print. Handheld wäre dan nur ein weiteres CSS

smart · Beitrag von **smart** » So 20. Aug 2006, 13:42

mvf hat geschrieben:
smart hat geschrieben:Jedenfalls habe ich mich jetzt aus verschiedenen Gründen für zwei unterschiedliche Layouts entschieden. Das ist einfach flexibler.
Das stimmt so nicht ganz IMHO, wie oben beschrieben ist zengarden eine wunderbares contra-Argument.

Für mich gibt es da mittlerweile mehrere Vorteile:
1) Ich kann den Inhalt auf den PDA abstimmen. Also z.B. Artikel anlegen, die PDA-spezifisch sind (Linklisten zu PDA-Seiten, etc.). Außerdem kann ich von vornherein Spielereien weglassen und die Beiträge umgestalten.

2) Ich kann das Forum besser einbinden, welches ich auch als vereinfachte Version habe. Das kann ich in der zweiten "Sprache" (oder wie auch immer ich es lösen werde) dann ganz einfach einbinden.

3) Ich kann auf der Seite ganz anders mit Werbung umgehen, also z.B. PDA-spezifische Werbung einbauen (wenn es sowas in Zukunft geben wird)...

Für mich spricht also viel dafür, die Seite in einer abgespeckten Version parallel laufen zu lassen. Es mag bei anderen Seiten anders sein und vor Allem weniger aufwändig. Das ist auch der einzige Grund, der mich davon abhält: Ich muss den gesamten Seiteninhalt auch in der PDA-Version pflegen...

Jetzt hätte ich dann nur noch die Frage, waum meine 50%-Grafik-Einstellung nicht geht, und ob es evtl. eine Alternative gibt, um Grafiken nicht zu groß werden zu lassen. Einige Grafiken werde ich in der PDA-Version eh entfernen...

P.S.: Danke für den ZenGarden-Tipp - eine interessante Seite!