Responsives Webdesign mit Flash-Inhalt

[osi83]

hallo zusammen,

ich würde gerne wissen, wie ich meine flash-webseite für verschiedene endgeräte anpassen kann, wie es hier gezeigt wird:

Responsive Webdesign & CSS3 Media Queries | kulturbanause blog - Artikel, Tutorials, Downloads, Tipps, Hacks, Snippets und aktuelle Szene-News rund um Webdesign, Social Media und digitale Bildbearbeitung

es müsste ja quasi meine webseite zum teil verkleinert angezeigt werden und der inhalt auch teilweise anders aufgebaut/angeordnet werden (landascape/portrait/mobil).

bin um jeden tipp dankbar, wie man so etwas umsetzen kann
(wie gesagt das ganze mit flash und nicht css3/media-queries)

gruß,
osi

[Martin Kraft]

Theoretisch bietet Flash noch mehr Möglichkeiten als HTML/CSS auf verschiedene Bildschirmgrößen zu reagieren und die Anzeige dabei total zu verändern.

Technisch benötig man dafür nur einen RESIZE-Listener, das für die Darstellung zuständige Script aufruft, sobald sich die Bildschrimgröße ändert. Was dieses Script dann mit den neuen Bildschirmdimensionen (stage.stageWidth und stage.stageHeight) anfängt bleibt Dir überlassen.

Und diese große Freiheit erschwert die Sache dann im Vergleich zu HTML/CSS auch erheblich, weil man eben nicht mit einfachen Kniffen den Browser dazubringt die Anzeige umzusortieren, sondern es selbst erledigen muss. Das Flex-Framework versucht hier Abhilfe zu schaffen und bietet insbesondere für Apps einige Automatismen zur Organisation der Inhalte in Verschieden Darstellungsgrößen.

Praktisch ist das Thema für Flashwebsiten kaum von belang, da die insbesondere bei mobilen Endgeräten noch mit ganz anderen Problemen zu kämpfen haben, als nur den Bildschirmdimensionen (und deshalb meist ausschließlich für den Desktopbereich optimiert sind):

• Zunächst einmal wäre da die Tatsache, dass es schlicht keinen Flashplayer für iOS gibt und daher Flashseiten auf iPhone, iPad und iPod eh nicht nicht laufen.
  
  
• Und auch für die übrigen mobilen Betriebssysteme soll der FlashPlayer in absehbarer Zukunft nicht mehr weiterentwickelt werden...
  
  
• Zudem werden mobile Endgeräte meist per Touch bedient. Und anders als in HTML, wo der Browser die Seite einfach entsprechend anders interpretieren kann, muss man sich in Flash selbst darum kümmern, dass die Website mit TouchEvents bedienbar bleibt.
  Die in Flashseiten exzessiv eingesetzten MOUSE_OVER-Events z.B. existieren auf TouchGeräten einfach nicht!
  
  
• Und letztlich wäre da noch die Performance: Viele Flashseiten sind so gebaut, dass sie selbst bei einem Desktopsystem an die Leistungsgrenzen gehen. Und das zwingt wesentlich schlechter motorisierte Geräte (wie Smartphones und Tablets) in die Knie.

Statt Deine Flashseite jetzt mit großem Aufwand anzupassen, würde ich Dir daher empfehlen, für mobile Endgeräte eine ordentliche HTML-Fallbackversion zu erstellen!

[osi83]

dreamweaver cs5.5 bietet ja da wohl eine recht einfache lösung.
allerdings kenne ich mich damit nicht aus. gibt es denn gute tutorials dass man als anfänger eine recht simple webseite hinbekommt?

[Martin Kraft]

Zitat von osi83

dreamweaver cs5.5 bietet ja da wohl eine recht einfache lösung.

»Eine recht einfache Lösung« wofür

• Für eine Flashsite sicherlich nicht.
  Für Flash und AS3 ist Dreamweaver schlicht das falsche Programm.
  
  
• Für eine responsive HTML möglicherweise.
  Grundsätzlich kann man mit Dreamweaver nahezu jedes Responive Design/Fluid Layout/Progressive Enhancment/Media Quiries-Framework verwenden und es gibt auch entsprechende Tutorials (z.B. hier und hier). Ob man das aber als »einfach« bezeichnet, hängt ganz vom Anwender ab.

Zitat von osi83

allerdings kenne ich mich damit nicht aus. gibt es denn gute tutorials dass man als anfänger eine recht simple webseite hinbekommt?

Das klingt jetzt für mich (im Gegensatz zur ersten Frage und dem Thema) nicht danach, als hättest Du Dich schon eingehend HTML/CSS/JS beschäftigt?!

Ohne Dich entmutigen zu wollen: Responsive Design ist bei Leibe kein Anfänger-Thema oder etwas für das man in Dreamweaver nur einen Haken setzen oder ein Plugin instalieren müsste, sondern eine technische und gestalterische Herangehensweise, die eine grundlegendes Verständnis der benutzten Technologien (also HTML/CSS/JS) voraussetzt.

IMHO müsstest Du Dich also vorab in diese Techniken einarbeiten, oder Du suchst Dir ein fertiges Template (WordPressTheme etc.), dass die gewünschten Features bereits sauber umsetzt, und versuchst es nach Deinen Vorstellungen anzupassen...

[osi83]

das dreamweaver nichts mit flash-programmierung zu tun hat ist klar.
hatte das nur in erwägung gezogen, da du die umsetzung mit flash sehr schwierig/problematisch und nachteilig wäre.
ich hatte gelesen dass speziell dreamweaver cs5.5 für diese unterschiedlichen darstellungsweisen geeignet ist bzw. das ein schwerpunkt ist mit css3 media queries ist.
so kann man spezielle css stylesheets für dektop, tablet, smartphone erstellen und diese auch direkt in ner live-view betrachten. außerdem gibt es wohl die möglichkeit in den einstellungen der dreamweaver-webseite auswählen, dass die entsprechenden auflösungen erkannt werden und dann die entsprechende css- darstellung geladen wird.

ist das soweit richtig?
gibt es tutorials wie man stylesheets css erstellt? hab bisher immer nur das ergebnis davon gesehen aber nicht wie man da ran geht.

grüße,
osi