Arbeta med Device Central och Dreamweaver

Använd Adobe Device Central med Dreamweaver

Med Device Central kan Dreamweaver-webbdesigners och -utvecklare förhandsgranska hur Dreamweaver-filer kommer att se ut på olika mobila enheter. I Device Central används Operas Small-Screen Rendering™ för att ge designers och utvecklare en bild av hur deras webbsidor kommer att se ut på skärmen. Funktionen innebär också att designers och utvecklare kan testa om deras CSS fungerar som det ska.

En webbutvecklare kan till exempel ha en kund som vill göra en webbplats tillgänglig från mobiltelefoner. Webbutvecklaren kan använda Dreamweaver för att skapa preliminära sidor och Device Central för att testa hur sidorna ser ut på olika enheter.

  1. Starta Dreamweaver.
  2. Öppna en fil.
  3. Gör något av följande:
    • Välj Arkiv > Förhandsvisa i webbläsare > Device Central.

    • Klicka och håll ned knappen Förhandsvisa/Felsök i webbläsare  på dokumentfönstrets verktygsfält och välj Förhandsvisa i Device Central.

Tips för att skapa Dreamweaver-webbinnehåll för mobila enheter

Device Central förhandsvisar webbsidor skapade i Dreamweaver med Operas Small-Screen Rendering. Med den här förhandsvisningen kan du få en bra bild av hur webbsidan ser ut på en mobil enhet.

Obs! Operas Small-Screen Rendering behöver inte vara förinstallerat på en enskild emulerad enhet. Med Device Central får du bara en förhandsvisning av hur innehållet skulle se ut om Operas Small-Screen Rendering hade varit installerat.

Använd tipsen nedan när du vill försäkra dig om att webbsidor skapade i Dreamweaver visas på rätt sätt i mobila enheter.

  • Om du använder Adobe® Spry-ramverket när du utvecklar innehåll lägger du till följande rad med HTML på dina sidor så att de kan rendera CSS och köra JavaScript™ korrekt i Device Central:<link href="SpryAccordion.css" media="screen" rel="stylesheet" type="text/css"/> <link href="SpryAccordion2.css" media="handheld" rel="stylesheet" type="text/css"/>

  • Operas Small-Screen Rendering kan inte visa bilder, popup-fönster, understrykningar, genomstrykningar, överstrykningar, blinkningar eller markeringsramar. Försök att undvika de här elementen i din design.

  • Webbsidor för mobila enheter ska vara enkla. Tänk speciellt på att använda få teckensnitt, teckenstorlekar och färger.

  • Om du förminskar bildstorlekar och använder färre färger ökar det chanserna för att bilderna ska visas som avsett. Använd CSS eller HTML för att ange en exakt höjd och bredd för varje bild du använder. Skapa alternativ text för alla bilder.

Obs!

Operas programwebbplats är en bra källa till information om hur du optimerar webbsidor för mobila enheter.

Mer information om hur du skapar innehåll för mobila enheter finns på www.adobe.com/go/learn_cs_mobilewiki_se.

Adobe, Inc.

Få hjälp snabbare och enklare

Ny användare?