kaxigt.com

Jag skriver om webben för webben

Planera skapa publicera bygga hemsida

Postad: 30 augusti 2007 | HTML-guider | No Comments
Lästid: 4 minuter

Att planera skapa publicera bygga en hemsida är inte alltid så lätt. Innan Du börjar med att bygga din hemsida är det bra att fundera över vilken publik den ska rikta sig åt. Tycker du om att skapa webdesign och grafik kommer du med all säkerhet att lägga upp dina alster så andra kan ladda hem det.

Föredrar du poesi och dikter så är det åt lyrikälskarna du kommer att vända dig. Oavsett vilket finns det några ”tumregler” Du bör tänka på. Dessa underlättar för dina besökare.

Denna artikel är en mycket kortfattad guide. Jag rekommenderar att du läser den mer heltäckande guiden Börja blogga! En nybörjarguide om WordPress DNS SEO när du är klar med denna.

Här får Du några tips.

  • Hämta gärna inspiration från andras sidor men försök att hitta din egen stil.
  • Undvik tungladdad grafik.
  • Tänk på att felaktig inlagda javascript fördröjer svarstiden.
  • Gif-animationer som blinkar, glittrar och flyger omkring kan vara kul – men sällan för besökaren.
  • Scrollande textslingor kan också upplevas som störande.
  • Blanda inte olika teckensnitt utan använd en enhetlig till brödtexten och rubrikerna.
  • Till rubriker ska du använda <h1>, <h2>, <h3> osv. Till styckeindelningen använder du <p>.
  • Blanda inte heller stora och små bokstäver.
  • Glöm inte bort de synskadade eller de med nedsatt syn. Skriv ALLTID in titleattributet i länkarna och altattributet i bilderna!
  • När Du skriver för webben bör du uppmärksamma dig om att alla inte kan läsa eller se lika bra som du själv. Lite mindre textstorlek ökar svårigheterna för de flesta, väldigt liten textstorlek är svårtläst för alla
  • Texten ska vara läsbar – det vill säga färgen på texten, i förhållande till färgen på bakgrunden, avgör om sidan är läsbar eller ej. Likaså är det viktigt att hålla tydliga styckeindelningar. För mycket text på en gång är svårläst, ha ”luft” mellan dina stycken. Ha också gärna vissa fetstilta ord som hållpunkter i texten du särskilt vill markera eftersom de flesta skummar sidans innehåll.
  • Vänsterställd text.
  • Har Du musik – ge besökaren en möjlighet att stänga av den.

Planera skapa publicera och bygga hemsida

En hemsidas struktur är uppbyggd av HTML – Hyper Text Markup Language. Du kan även välja att skriva XHTML – Extensive Text Markup Language. Till det sistnämnda krävs CSS – cascading style sheet i olika nivåer. En förutsättning för att kunna skapa en hemsida är att Du har grundläggande kunskap i någon av dessa programspråk.

Börja därför med att planera innan du skapar och publicerar din hemsida. Varför vill jag ha en hemsida? Vad ska den innehålla? Till vilka ska den vända sig? Hur ska själva uppbyggnaden av strukturen se ut? Vad är viktigt för denna? Hur gör jag en bra länk och katalogstruktur? Finns det något annat jag bör tänka på?

Sist men inte minst – hur ska designen se ut?

Tumma inte på tillgängligheten och användbarheten när du skapar hemsidan

Genom att följa denna tankekarta och skriva ned dina idéer så är chansen mycket god att även slutresultatet blir bra. Du får då en genomtänkt sida som är överskådlig i både länkar, text och struktur. Läser du sedan information om hur tillgänglighet och användbarhet fungerar har du alla gånger fått in en fullträff!

Planera skapa publicera bygga

När du ska göra en hemsida behöver du en så kallad html-edtor. Det är i denna du skriver din kodning. En del använder ett wysiwyg-program som Dreamweaver. Andra väljer att göra sina anteckningar i Notepad som finns i windows.

Tyvärr kostar många html-editorer en hel del pengar. Men det finns bra gratisalternativ att kunna ladda ned från nätet så du kan skapa och publicera din sida. Här får du några länkar till bra gratisprogram.

Cross Browser

Crossbrowser betyder att en hemsida är tänkt att se ut och uppföra sig likadant i alla (moderna) webbläsare. Nu är detta en sanning med modifikation eftersom det kan förekomma smärre skillnader – dock är dessa så små att man trots allt kan benämna en tillgänglig och valid sida för crossbrowser.

Hur skapar man då en sådan?

Främst handlar det om att använda absolut rena koder vare sig det handlar om html eller xhtml. Det innebär att (x)html-koderna används till det som de är gjorda för – att bygga struktur. Därför stoppar man inte in några css-koder. Det orsakar genast problem eftersom webbläsarna kan läsa in koderna olika.

Webbstandard

Ett bra hjälpmedel för att få en sida crossbrowser är att validera sin sida. Detta bör man göra oavsett programspråk. Varför det är viktigt, hur webbläsarna tänker, samt varför man bör testa sidan är viktigt att veta.

Men hur ska jag kunna styla utseendet om jag inte får göra det i html-koden?

Det näst kraftfulla verktyget på en hemsida är CSS – din stilmall – eftersom den talar om för din html hur denna ska se ut och uppföra sig. Med andra ord är det din stillmall som styr utseendet på hemsidan.

Eftersom CSS är ett eget språk ska det också behandlas som så och inte nästlas in i html-koden. Exempel på felaktigt använd css är denna:

<table width="92%" border="1" cellspacing="0" cellpadding="40" bordercolor="#000000" background="strip.jpg"></table>

En annan enkel liknelse är om vi försöker prata engelska med en engelsman på svengelska. Hur mycket tror ni att han skulle förstå? Det är således minst lika viktigt att validera sin CSS.

Publicera

Hemsidan är klar – äntligen tänker du kanske. Nu handlar det bara om att skicka upp den på nätet och det är här som många stöter på problem. Självfallet måste du ha en webbplats att förvara den på.

Men du måste ha ett filöverföringsprogram för att kunna skicka upp dina filer på nätet. Dessa program kallas för FTP (File Transfer Protocol). En del html-editorer har även en ftp-funktion.

Som vanligt kostar många ftp-program en slant, dock finns det några bra gratisvarianter av dessa också.

Överföra filer

När du har installerat ditt ftp-program och startar upp det för första gången kommer du att bli tillfrågad om några uppgifter som du ska fylla i. Först ska du fylla i adressen till ftp-servern.

Det är servernamnet på den plats där du ska ha din hemsida. I de flesta fall benämns denna som hostname.

Vanligt är att adressen dit börjar med ftp://xxxxxxx.xxx – men det kan också röra sig om siffror. Nästa information du ska fylla i är ditt användar id/ user id och lösenord/password så du kan koppla upp dig på ftp-programmet och logga in på servern.

Alla uppgifter får du från ditt webbhotell.

connection wizzard

En del ftp-program, som exempelvis betalprogrammet CuteFtp, har en såkallad connection wizzard.

Planera skapa publicera ISP

Därefter undrar den om du vill identifiera ”uppkopplingen”, det vill säga döpa den till exempelvis ditt hemsidenamn för att särskilja den specifika uppkopplingen om du har fler konton på andra servrar men använder samma ftp-program.

Publicera hemsida

För att kunna kopplas upp måste du ange rätt serverinformation – det vill säga dina uppgifter som kopplar upp dig mot servern. Nu ska du fylla i hostname.

Planera skapa publicera hostname

Därefter ditt användar id/ user id och lösenord/password samt om du vill dölja lösenordet.

Planera skapa publicera ID

Klickar du sen på nästa har du möjlighet att välja ”default local directory” vilket innebär att du direkt kan peka programmet till din mapp.

Planera directory

Sista steget ber dig bocka för om du automatiskt vill loggas in till siten varje gång du öppnar programmet. När du har valt dina alternativ trycker du på slutför så kommer du att kopplas upp om alla uppgifter stämmer.

Planera skapa publicera slutför

Indexdokument

Det första dokumentet på hemsidan bör heta index.htmlindex.htmindex.php eller index.asp eftersom det är ditt indexdokument servern söker efter i första hand. Index är med andra ord ditt ”startdokument” och därför bör man inte heller ha olika indexdokument i samma rotkatalog även om dessa har olika filändelser som htm, php eller asp.

Ett annat skäl till att använda startdokumentet index är att slippa långa webbadresser, för anger du ett annat dokument som startsida kommer denna att lägga sig sist i din URL (Uniform Resource Locator).

Exempel utan ett indexdokument: http://www.din_sida.com/dokumentnamnet.html.
Exempel med ett indexdokument: http://www.din_sida.com