Nyhetsbrev från ProgramSupport Mars 2015

Dags för månadens nyhetsbrev med tips för effektivare arbete i dina grafiska program.

Snabb korrigering av brutna länkar i InDesign

InDesign CS6 och nyare har en användbar sökfunktion som gör det betydligt lättare att hitta bilder och korrigera brutna länkar hos dokument.

Medlemmar kan läsa mer i avdelningen Användartips till InDesign:

Skapa PDF-filer med lagom kvalitet för webben

Det är numera vanligt att PDF-filer publiceras på webbplatser för att ge tillgång till dokument som kan läsas och skrivas ut med bra kvalitet. Det är då viktigt att PDF-filerna tas fram med inställningar som ger både bra bildkvalitet och rimlig filstorlek så att nerladdning kan ske utan onödig fördröjning.

Medlemmar kan läsa mer i avdelningen Användartips till Acrobat:

Hämta in färger med Adobe Color

Med appen Adobe Color kan du via din mobila enhet hämta in färger hos verkliga motiv för användning i Adobes tillämpningsprogram via molntjänsten i Creative Cloud

Läs mer i avdelningen appar till mobila enheter:

Retina-upplösning hos bilder i webbsidor

Allt fler använder numera mobila enheter för att ta del av information på webben. Moderna mobiltelefoner och surfplattor erbjuder betydligt högre pixeltäthet än traditionella bildskärmar till datorer. Enheter med högupplösta skärmar höjer därför kraven på de bilder som publiceras på webben.

Enheter med högupplösta skärmar

Apple använder Retina som benämning på enheter med högre pixeltäthet medan övriga tillverkare, bl a Samsung, använder benämningen HiDPI.

Högupplösta skärmar debuterade på mobilen iPhone 4. Modellerna 4, 4S, 5 och 5S har alla 326 dpi upplösning vilket kan jämföras med en vanlig bildskärm som enbart har 72 dpi. Hos iPhone 6 och 6 Plus har upplösningen ökats ytterligare till 401 dpi.

Surfplattorna iPad 3, 4, Air och Air 2 har 264 dpi medan iPad Mini har 326 dpi.

Allt fler moderna bärbara datorer har också högupplösta skärmar. MacBook Pro Retina var först på marknaden men nu finns också flera PC-datorer som Acer Aspire V15 Nitro Black Edition, Dell Precision M3800, Lenovo Yoga 3 Pro och Toshiba P50T-B-10T. Apple erbjuder även en stationär modell, iMac Retina med upplösningen 220 dpi.

Högre krav på bilder till webbsidor

Även om den stora majoriteten av alla datorer fortfarande har lågupplösta skärmar så kommer den ökande användningen av högupplösta skärmar att höja kraven på de bilder som publiceras på webben. Hos webbplatser som har många mobila användare är det därför lämpligt att redan nu erbjuda två varianter av bilder, både med normal pixeltäthet för äldre skärmar och med dubbel eller tredubbel pixeltäthet för högupplösta skärmar.

Webbläsaren väljer lämpliga bilder

Apple har fastställt riktlinjer för hur mobila iOS-enheter skall hantera bilder med hög pixeltäthet. Principen är att man publicerar minst två varianter av alla bilder i en och samma bildmapp. De högupplösta varianterna skall ha samma filnamn som den lågupplösta fast med tilläggen @2x resp @3x. Siffran 2 resp 3 anger dubbel eller tredubbel pixeltäthet.

Hos enheter med Android skall man istället använda samma filnamn för alla varianter av bilder men placera dem i var sina mappar namngivna med vissa fastställda namn.

Det finns flera olika metoder för att bestämma vilka varianter av bilder som webbläsaren skall använda. Den enklaste metoden med iOS är att använda ett fritt JavaScript benämnt retina.js som helt automatiskt väljer lämpliga bilder beroende på enhetens upplösning.

Du kan hämta skriptet retina.js från webbadressen:

http://imulus.github.io/retinajs/

Kopiera skriptfilen till webbservern och placera det i en undermapp benämnd scripts.

Skriv in nedanstående kodrad i slutet av de webbsidor som skall använda skriptet, omedelbart före sista </body>.

<script type="text/javascript" src="/scripts/retina.js"></script>

Nedanstående skärmbilder illustrerar strukturen hos denna webbsida som använder den ovan beskrivna tekniken för automatiskt val av lämplig bild.

Exempel på struktur hos en webbplats som erbjuder automatiskt val av bilder med lämplig pixeltäthet. Enbart bilden ps_logga finns tillgänglig i två olika varianter.

Exempel på bild som är anpassad för Retina-skärmar

Alla som har en iOS-enhet, alternativt en Macintosh med Retina-skärm, kan prova att navigera till nuvarande sida med webbläsaren i enheten:

http://www.programsupport.se/nyhetsbrev/nyhet_mars_15.html

Lägg märke till att den vänstra bilden, benämnd ps_logga, får betydligt högre kvalitet än den högra, benämnd varning, eftersom loggan finns tillgänglig även i en variant med 2 ggr pixeltäthet (filnamnet slutar med @2x).

Loggan till vänster får högre kvalitet på Retina-skärmar.

Det var allt för den här gången. Nästa nyhetsbrev kommer i slutet av april.

© 2015 www.programsupport.se