# 👁️‍🗨️ Om detta avsnitt

Du ska göra en bra post för instagram eller liknade.

Namn som används

• NAME Namnet på posten som du vill skapa
• X Formatet på bild filen.

1 Ladda ned exempel projektet.

Ladda ned denna fil:

• https://htsit.se/f/post.zip

2 Packa upp alla filer!

Detta kallas ibland för att extrahera.

3 Titta igenom de exemplena som redan finns.

Titta på all kod och alla filer. Du måste inte förstå allt, men försäk få en överblick.

4 Fundera igenom något du skulle vilja lägga upp på Instagram eller liknande.

Du kan gärna göra en skissa.

5 Kom på ett namn, gärna ett ord för du ska döpa filer till detta namn sedan.

Detta namn kommer du använda på flera ställen.

6 Kom på en text som du vill ha på bilden

Tänk på att den inte får vara för lång.

7 Hitta en bild som du har rätt att använda.

Ska du lägga ut en bild behöver du ha rätt att använda den. Du kah hitta bilder som du har rätt att anvädna här:

• + Wikimedia common

8 Ladda ned den till "image" mappen

Döp om bilden så den hetter NAME.

Det gör att den är lätt att skapa en sökväg till.

9 Om du inte själv har copyright på den så måste du lägga till en länk till "COPYRIGTHS.md" filen.

Du behöver inte skriva exapt på samma sätt som de andra bilderna som finns i dokumentet. Men det räcker med att du lägger till en llänk till den.

10 Kopiera filen "cat.html" till "NAME.html"

Du ska nu skapa din egen variant av filen.

cp cat.html NAME.html
  

Kommandot ovan fungera på UNIX system sås som linux och finns med här som en referens.

11 Gå in i din html fil och ändra texten till det du har tänkt.

Du hittar tyexten i ett h1-element.

<h1> Välkommen till IT! </h1>
  

12 Ändra länken till den externa css filen.

Du ska anävnda en extern css fil. Ändra sökvägen i fillen till "./css/NAME.css".

<link rel="stylesheet" href="./css/cat.css" />
  

13 Gå in i "css" mappen och kopier filen "cat.css" till "NAME.css"

Se till att vi har en egen css fil för din poster.

cp cat.css NAME.css
  

Vi bör alltid använda en extern css fil.

14 Gå in i din css-fil och ändra bilden.

Ändra sökväg "../image/NAME.X"

background-image: url("../image/cat.jpg");
  

15 Gå in i din css-fil och ändra texten så den blir som du vill ha den. Du kan:

• Ändra text egenskaper
• Ändra font, ta gärna en web font som i tidigare övning.
• Ändra font egenskaper såsom storlek och font vikt.
• Du får gärna ha en webbfont.

16 ✔️ Öppna html filen i en webbläsare.

Gör gärna ändringa enligt punkt 15 tills det blir bra.

Du borde nu ha en bra poster som du kan använda på social medier.