Toppbild i utbildningskatalogen
Kurs- och programsidor kan ha en bild i toppytan högst upp under ingressen. Bilden kallas för toppbild. Det går inte att lägga in bilder på andra platser på sidan.
En kurssida med toppbild. Notera att fotografens (eller upphovspersonens) namn alltid ska finnas med i bildtexten.
Bildstorlek
Bilden i toppytan ska visas i helbredd, 768px, och rekommenderad höjd på bilden är 385px. Om bilden är högre blir det obalans på sidan och det kan störa överblicken av informationen.
Lägga in en toppbild
Toppbild lägger du in under Egenskaper/Metadata.
- Klicka på kugghjulet ("Redigera"-symbolen):
- Välj Egenskaper
- Välj Metadata.
Gå till verktygslisten, klicka på kugghjulet, välj Egenskaper och sedan Metadata.
Välj typ av marknadsföring
När du är under metadata ser du rubriken "Välj typ av marknadsföring". Under den finns ett fält där du kan välja antingen bild eller olika typ av video. Välj Bild.
Under rubriken Välj typ av marknadsföring väljer du Bild.
Välj länkmål för bilden
För att ladda upp en bild som visas i toppytan klickar du på Välj länkmål (under rubriken Bild).
Klicka i fältet där det står Välj länkmål.
Då kommer du till en lista med möjliga länkmål. Det första som visas är interna sidor. Här behöver du byta länktyp till Bild.
Ladda upp bilden
Därefter laddar du upp bilden som du vill använda, genom att först klicka på Bilder på sidan och sen på Ladda upp bild.
Innan du laddar upp en bild måste du alltså ha laddat ner en bild på din dator. Gå exempelvis till Mediabanken för att hitta bilder som du kan ladda ner. I mediabanken ska du välja nerladdningsformat ”3. Digital publicering”.
Så här ser det ut när du laddat upp bild på sidan. Notera att i trädet till vänster hamnar bilden under Bilder på sidan (se pilen). Du ska inte ladda upp bilder någon annanstans i strukturen.
Klicka på OK för att spara.
Justera bildens storlek
Bilder som migrerats har oftast för hög höjd, så du behöver gå in och justera bildens storlek. Bilden ska visas i helbredd, 768px, och rekommenderad höjd på bilden är 385px.
- Gå in under Egenskaper > Metadata.
- Klicka på bildens länkmål
- På höger sida ser du själva bilden. Gå till bildens högra hörn, då syns en penna (den är inte synlig om man inte ställer sig i bildens högra hörn med musen).
- Klicka på pennan för att redigera bilden.
Om du ställer dig med muspekaren vid det högra hörnet på bilden så blir en penna synlig. Klicka på pennan.
- När du klickar på pennan kommer du till redigeringsläget för bilden.
- Du behöver nu ändra bildens storlek genom att beskära den. Obs, ändra inte inställningarna i högerspalten – dessa ändrar bildstorleken proportonerligt, så om du minskar höjden blir även bredden mindre. Bilden ska ha fullbredd, så därför ska vi inte ändra något i högerspalten.
- Klicka på "Beskärningssymbolen" uppe till vänster.
Klicka på symbolen uppe till vänster.
- I fältet uppe längst till vänster fyller du i bildens bredd: 768
- I fältet bredvid fyller du i bildens höjd: 385
- För att måtten ska aktiveras, klicka utanför fälten där du fyllt i måtten.
- Du ser nu att ytan i mitten av bilden ändrar storlek.
De två röda fyrkanterna markerar var du lägger in bildens bredd och höjd. Pilen visar ytan som kommer att vara synlig när bilden har beskurits.
Välj hur bilden ska beskäras
Det som ligger i den skarpa fyrkanten (se bilden nedan) är det som kommer att synas när du beskurit bilden. Så se till att den här fyrkanten visar det som är viktigt, att man får med exempelvis människors huvuden.
I de två exempelbilderna nedan har vi markerat det som inte kommer att synas med röd markering:
Bilden här ovanför är ett exempel på en dåligt beskuren bild. Om man beskär bilden så här, så kommer inte människornas ansikten att vara med på bilden.
En bild som är beskuren på rätt sätt. Det viktiga syns i den skarpa fyrkanten. Nu kan man trycka på Spara som ny bild.
- Du kan flytta på den skarpa fyrkanten genom att dra i den. Obs, dra inte i hörnen eller kanterna, för då ändrar du storleken som du ställde in (bredd 768px, höjd 385px). Utan ställ muspekaren i mitten av ytan och håll nere vänster musknapp för att dra i det markerade området. När du är nöjd med placeringen, släpp musknappen.
När du är nöjd med beskärningen, klicka på knappen Spara som ny bild.
- Klicka sedan på OK...
Den nya versionen av bilden sparas som bild på sidan.
- Och klicka på OK igen.
- För att bilden ska bli synlig på utsidan behöver du nu trycka på Publicera (i den svarta listen till höger).
- Glöm inte att lägga in bildtext och eventuell alternativtext.
Före och efter. Till vänster ser vi hur bilden såg ut innan vi justerade den, till höger ser vi den beskurna versionen som tar upp mindre plats.
Alternativtext (alt-text)
Alternativtext (alt-text) är den text som läses upp för personer som inte kan se webbsidan. Den syns alltså inte visuellt på sidan, men uppfattas av skärmläsare som läser av sidan.
I Sitevision kallas alternativtext ibland för ”Bildbeskrivning”.
Lägga in alt-text
Om bilden ska ha alt-text lägger du in det under rubriken Bild/Alternativ text.
När bör man inte lägga in alt-text?
Bilder som enbart är dekorativa ska den inte ha alternativtext (alt-text). Om man inte lägger in alt-text så hoppar skärmläsaren över att läsa upp bilden.
Lägg inte in fotografens namn som alt-text, för då syns det inte på sidan. Fotografens namn ska stå som bildtext.
Bildtext
I bildtexten ska du alltid lägga in fotografens (eller upphovspersonens) namn. Skriv Foto [Förnamn Efternamn], exempelvis ”Foto: Eva Dalin”.
Du kan givetvis även lägga in mer text som handlar om bilden, men det är viktigt att inte glömma fotografens namn.
Spara och publicera
När du har lagt in länkmål, bildtext och eventuell alternativtext klickar du på OK för att spara.
Kom ihåg att publicera kurs- eller programsidan, för att bilden ska bli synlig för besökare.