Skapa webbfotogallerier

Ett webbfotogalleri är en webbplats som innehåller en startsida med miniatyrbilder samt gallerisidor med bilderna i full storlek. Varje sida innehåller länkar som gör det lättare för besökarna att navigera på webbplatsen. När en besökare t.ex. klickar på en miniatyrbild på startsidan så läses den tillhörande fullstorleksbilden in på en gallerisida. Med kommandot Webbfotogalleri skapar du automatiskt ett webbfotogalleri av en grupp bilder.

Photoshop innehåller en rad olika galleristilar som du kan välja bland med hjälp av kommandot Webbfotogalleri. Om du är en van användare och har erfarenhet av HTML kan du skapa en ny stil eller anpassa en stil genom att redigera en uppsättning HTML-mallfiler.

Varje mall för galleristilar innehåller olika alternativ. Om du använder en förinställd stil kan en del alternativ vara nedtonade eller otillgängliga för just den stilen.

Skapa ett webbfotogalleri

Skapa webbgallerier med Adobe Bridge

I Adobe Bridge finns uppdaterade funktioner för webbgallerier. Instruktioner finns i Skapa ett webbfotogalleri i Adobe Bridge-hjälpen. Du kan också titta på självstudierna nedan.

Använda Photoshops äldre, valfria plugin-program

Se till att färgerna matchar

Om du arbetar med foton i en stor arbetsfärgrymd, t.ex. ProPhoto RGB eller Adobe RGB, kan det hända att färgåtergivningen påverkas när bilderna visas i ett webbgalleri med en webbläsare som inte läser inbäddade färgprofiler. Om så är fallet kan du prova att konvertera bildprofilerna till sRGB (som används som standard i de flesta webbläsare) innan du optimerar dem eller inkluderar dem i ett webbfotogalleri. Konvertera dem till sRGB på något av följande sätt: Det kan vara bra att arbeta med kopior av bilderna.

• Du kan konvertera enskilda bilder genom att välja Redigera > Konvertera till profil och sedan sRGB. Se Tilldela eller ta bort en färgprofil (Illustrator, Photoshop).

• Om du vill konvertera en mapp med bilder kan du använda bildbearbetaren. Välj Arkiv > Skript > Bildbearbetare. Se Konvertera filer med bildbearbetaren.

Om du använder bildbearbetaren kan du spara filerna direkt i JPEG-format och i den storlek som du vill ha. Om du vill göra det så måste du se till att inaktivera Ändra bildstorlek i alternativen för stora bilder.

Alternativ för webbfotogalleri

Alternativ för filtillägg, kodning och metadata.

Använder antingen .htm eller .html som filnamnstillägg.

Använder UTF-8-kodning.

Anger dimensionerna och förkortar hämtningstiden.

Bevarar informationen om metadata.

Textalternativ för den banderoll som visas på varje sida i galleriet. Ange text för var och en av följande:

Galleriets namn.

Namnet på den person eller organisation som är ansvarig för fotografierna i galleriet.

Kontaktinformation för galleriet, t.ex. ett telefonnummer eller en företagsadress.

Det datum som visas på varje sida i galleriet. Som standard används dagens datum.

(Tillgängligt för vissa webbplatsstilar) Alternativ för texten på banderollen.

Alternativ för de huvudbilder som visas på varje sida i galleriet.

(Tillgängligt för vissa webbplatsstilar) Infogar en numerisk sekvens (som börjar med 1 och slutar med det sammanlagda antalet sidor i galleriet) som löper vågrätt längs överkanten på varje gallerisida. Varje nummer är en länk till respektive sida.

Ändrar storlek på källbilderna så att de placeras på gallerisidorna. Välj en storlek på snabbmenyn eller ange en storlek i pixlar. Välj vilka bildstorlekar du vill begränsa när du ändrar storlek i Begränsa. För JPEG-kvalitet väljer du ett alternativ på snabbmenyn, anger ett värde mellan 0 och 12 eller drar reglaget. Ju högre värde du väljer, desto bättre bildkvalitet och större fil får du.

Anger bredden på gränsen runt bilden i pixlar.

(Tillgängligt för vissa webbplatsstilar) Anger alternativ för visning av bildtexter under varje bild. Markera Filnamn om du vill visa filnamnet eller markera Beskrivning, Medarbetare, Titel och Copyright om du vill visa beskrivningstext från dialogrutan Filinformation.

(Tillgängligt för vissa webbplatsstilar) Ange teckensnitt och teckenstorlek för bildtexten.

Alternativ för galleristartsidan, inklusive storlek på miniatyrbilderna.

Anger storleken på miniatyrbilderna. Välj på snabbmenyn eller ange ett värde i pixlar för bredden på varje miniatyrbild.

Ange antalet kolumner och rader som miniatyrbilderna ska visas i på startsidan. Det här alternativet kan inte användas för gallerier med stilen Vågrät ram eller Lodrät ram.

Anger bredden på gränsen runt varje miniatyrbild i pixlar.

(Tillgängligt för vissa webbplatsstilar) Anger alternativ för visning av bildtexter under varje miniatyrbild. Markera Filnamn om du vill visa filnamnet eller markera Beskrivning, Medarbetare, Titel och Copyright om du vill visa beskrivningstext från dialogrutan Filinformation.

(Tillgängligt för vissa webbplatsstilar) Ange teckensnitt och teckenstorlek för bildtexten.

Alternativ för färger på element i galleriet. Om du vill ändra färg på ett visst objekt klickar du på dess färgruta och väljer en annan färg med hjälp av färgväljaren. Du kan ändra bakgrundsfärgen för varje sida (alternativet Bakgrund) och för banderollen (alternativet Banderoll).

Visar text över varje bild som en åtgärd mot stöld.

Anger den text som ska visas. Välj Egen text om du vill ange anpassad text. Markera Filnamn, Beskrivning, Tillskrivning, Titel eller Copyright om du vill visa text som hämtas från dialogrutan Filinformation.

Ange teckensnitt, färg och justering för bildtexten.

Placera texten på bilden i en viss vinkel.

Stilar för webbfotogalleri

I Photoshop finns en mängd olika stilar som du kan använda på ett webbfotogalleri. Om du är en van användare och har erfarenhet av HTML kan du skapa en ny stil eller anpassa en stil genom att redigera en uppsättning HTML-mallfiler.

De stilar för webbfotogallerier som ingår i Photoshop finns i separata mappar på följande platser:

Program/Adobe/Adobe Photoshop CS5/Förinställningar/Webbfotogalleri.

Adobe Photoshop CS5/Förinställningar/Webbfotogalleri.

Namnet på mapparna visas som ett alternativ på menyn Stilar i dialogrutan Webbfotogalleri. Varje mapp innehåller ett antal HTML-mallfiler som används av Photoshop när galleriet skapas:

Bestämmer layouten för den bildtext som visas under varje miniatyrbild på startsidan.

Bestämmer layouten för de ramar som används för att visa sidorna.

Bestämmer startsidans layout.

Bestämmer layouten för gallerisidorna där bilderna visas i full storlek.

Thumbnail.htm anger layouten för de miniatyrbilder som visas på startsidan.

Varje mallfil innehåller HTML-kod och variabler. En variabel är en textsträng som ersätts av Photoshop när du anger motsvarande alternativ i dialogrutan Webbfotogalleri. En mallfil kan till exempel innehålla följande TITLE-element som består av två HTML-koder som omger en variabel (token):

<TITLE>%TITLE%</TITLE>

När galleriet genereras av Photoshop med hjälp av mallfilen ersätts variabeln %TITLE% med den text som du har angett i Platsnamn i dialogrutan Webbfotogalleri.

Om du vill skaffa dig mer ingående kunskaper om en stil kan du öppna och studera dess HTML-mallfiler med en HTML-redigerare. Eftersom bara standardvarianten av ASCII-tecken får användas när man skapar HTML-dokument, kan du skapa, öppna och redigera sådana dokument med en vanlig textredigerare, till exempel Anteckningar (Windows) eller TextEdit (Mac OS).

Anpassa stilar för webbfotogallerier

Du kan anpassa en befintlig webbfotogalleristil genom att redigera en eller flera av dess HTML-mallfiler. När du anpassar en stil måste du följa de här riktlinjerna för att galleriet sedan ska kunna skapas på rätt sätt i Photoshop:

• Stilmappen måste innehålla de här filerna: Caption.htm, IndexPage.htm, SubPage.htm, Thumbnail.htm och FrameSet.htm.

• Du kan byta namn på stilmappen men inte på HTML-mallfilerna inuti mappen.

• Du kan låta filen Caption.htm vara tom och lägga de HTML-koder och variabler som bestämmer bildtextlayouten i filen Thumbnail.htm.

• Du kan ersätta en variabel i en mallfil med rätt text eller HTML-kod så att ett alternativ ställs in med hjälp av mallfilen istället för i dialogrutan Webbfotogalleri. En mallfil kan till exempel innehålla ett BODY-objekt med följande attribut för bakgrundsfärg och en variabel som värde:

  bgcolor=%BGCOLOR%

  Om du vill ställa in bakgrundsfärgen röd kan du ersätta variabeln %BGCOLOR% med ”FF0000”.

• Du kan lägga till HTML-kod och variabler i mallfilerna. Alla variabler måste skrivas med versaler och inledas och avslutas med ett procenttecken (%).

Anpassa eller skapa en webbfotogalleristil

Variabler för webbgalleristilar

I Photoshop används variabler i HTML-mallfilerna för att definiera en standardstil för webbfotogallerier. De här variablerna används i programmet för att skapa ett galleri utifrån det du anger i dialogrutan Webbfotogalleri.

När du anpassar eller skapar en galleristil kan du lägga till vilka variabler som helst i HTML-mallfilerna, med undantag för %THUMBNAILS% och %THUMBNAILSROWS%, som bara kan förekomma i filen IndexPage.htm. När du lägger till en variabel måste du komma ihåg att du också måste lägga till HTML-kod i filen så att variabeln kan användas på rätt sätt.

Du kan använda följande variabler i HTML-mallfilerna:

Bestämmer färgen för aktiva länkar.

Bestämmer namnet på en bildfil.

Gör att det går att gå tillbaka till miniatyren för bilden som användaren visar i stället för att gå till början på index. Detta börjar gälla när användaren klickar på knappen Hem.

Bestämmer färgen för banderollen.

Bestämmer teckensnittet för banderolltexten.

Bestämmer teckensnittsstorleken för banderolltexten.

Bestämmer bakgrundsfärgen.

Bestämmer teckensnittet för bildtexten under varje miniatyrbild på startsidan.

Bestämmer teckenstorleken för bildtexten.

Infogar dokumenttiteln som en bildtext från filinformationen.

Bestämmer vilken teckenuppsättning som ska användas på en sida.

Bestämmer kontaktinformationen för galleriet, som till exempel telefonnummer och plats.

Expanderar till webbfotogalleriet i Adobe Photoshop CS5.

Infogar copyright-informationen som en bildtext från filinformationen.

Infogar medarbetarinformation som en bildtext från filinformationen.

Anger länken till den aktuella startsidan.

Finns i SubPage.htm och pekar på den första indexsidan.

Bestämmer vilket datum som ska visas på banderollen.

Bestämmer e-postadressen i kontaktinformationen för galleriet.

Anger bildfilsinformationen för en bildtext.

Bestämmer filnamnet för en bild. Använd den här för metadata som visas som HTML-text.

Bestämmer URL-filnamnet för en bild. Använd bara det här alternativet för URL-filnamn.

Anger länken till den första gallerisidan som visas i den högra ramen i en ramuppsättning.

Anger länken till startsidan som visas i den vänstra ramen i en ramuppsättning.

Bestämmer galleriets rubrik.

Bestämmer ramlinjetjockleken för fullstorleksbilden på en gallerisida.

Aktiverar kryssrutan Lägg till bredd- och höjdattribut för bilder. På så sätt kan användaren hämta attributen och hämtningstiden förkortas.

Den här variabeln ersätts med ett numeriskt värde (endast) som motsvarar bildens bredd.

Anger länken till en gallerisida.

Om kryssrutan Ändra bildstorlek är markerad innehåller den här variabeln bildpixelvärdet som används i panelen Stora bilder. Om kryssrutan inte är markerad innehåller den här variabeln en tom sträng. Det här är användbart för JavaScript i mallar eftersom den maximala höjden och bredden för alla bilder på platsen kan visas.

Anger URL-adressen för en fullstorleksbild på en gallerisida.

Aktiverar kryssrutan Lägg till bredd- och höjdattribut för bilder. På så sätt kan användaren hämta attributen och hämtningstiden förkortas.

Den här variabeln ersätts med ett numeriskt värde (endast) som motsvarar bildens bredd.

Bestämmer färgen för länkar.

Anger länken till nästa gallerisida.

Skapar en länk från stor förhandsvisningsbild till nästa stora förhandsvisningsbild.

Anger länken till nästa startsida.

Infogar numrerade länkar på underordnade sidor till alla stora förhandsvisningsbilder.

Anger den aktuella sidans placering (t.ex. sidan 1 av 3).

Anger namnet på den person eller organisation som är ansvarig för fotografierna i galleriet.

Anger länken till föregående gallerisida.

Anger länken till föregående startsida.

Bestämmer galleriets rubrik.

Bestämmer galleriets rubrik.

Bestämmer textfärgen.

Bestämmer storleken på miniatyrbildernas gränser.

Aktiverar kryssrutan Lägg till bredd- och höjdattribut för bilder. På så sätt kan användaren hämta attributen och hämtningstiden förkortas.

Den här variabeln ersätts med ett numeriskt värde (endast) som motsvarar bildens höjd.

Den här variabeln ersätts med miniatyrbilder med hjälp av filen Thumbnail.htm för ramstilar. Du måste placera den här variabeln ensam i en enda rad utan radbrytningar i HTML-filen.

Innehåller pixelvärdet för miniatyrbilden i panelen Miniatyrbilder. Det här är användbart för JavaScript i mallar eftersom den maximala höjden och bredden för alla miniatyrbilder på platsen kan visas.

Anger länken till en miniatyrbild.

Den här variabeln ersätts med rader av miniatyrbilder med hjälp av filen Thumbnail.htm för andra stilar än ramstilar. Du måste placera den här variabeln ensam i en enda rad utan radbrytningar i HTML-filen.

Aktiverar kryssrutan Lägg till bredd- och höjdattribut för bilder. På så sätt kan användaren hämta attributen och hämtningstiden förkortas.

Den här variabeln ersätts med ett numeriskt värde (endast) som motsvarar miniatyrbildens bredd.

Bestämmer galleriets rubrik.

Bestämmer färgen för besökta länkar.