FYSIKUMS WEBB- OCH MEDIAKURSER

[Läs mer om Javascript i artikeln "Klientsidestekniker: Javascript"]

Webbsidor byggs upp med hjälp av tre webbtekniker

Med HTML-kod lägger man in de olika komponenter som webbsidan består av i rätt odnningsföljd i sidan: text (med stycken, rubriker, fet eller kursiv text), bilder, länkar, tabeller, listor, flashfilmer, formulär, o.s.v. Vart och ett av dessa objekt har ett standardiserat utseende (t.ex vit bakgrundsfärg för sidan, standradtypsnitt för text eller standardfärger för länkar).

Med stilmallar kodade enligt standarden CSS kan webbutvecklaren bestämma själv hur objekten ska se ut, t.ex annorlunda typsnitt eller bredd på sidomarginaler. Med stilmallsteknik skapar man också något som kanske egentligen hamnar under rubriken "webbsidekomponent", nämligen lager.

Slutligen har en del av webbsideobjekten specifika beteenden. Mest uppenbart exempel är väl länkarna, som om man klickar på dem initierar nedladdningen av en annan webbsida, eller skicka-knappen i ett formulär som skickar iväg ifyllda data till webbservern. Återigen finns det ett särskilt kodspråk som kan användas av webbutvecklare som vill modifiera standardbeteenden för länkar och andra komponenter, eller skriva helt egna beteenden för komponenter som normalt inte har några beteenden alls. Det kodspråk som används för att styra webbsidekomponenters beteenden kallas javascript.

Dreamweaver hjälper oss att lägga in javascriptkod i webbsidor

Dreamweaver hjälper ju oss webbutvecklare att skapa webbplatser utan att vi ska behöva koda någon HTML- eller stilmallskod själva. Med hjälp av menyer och knappar i den grafiska arbetsmiljön i programmet kan vi lägga in komponenter och definiera stilregler. Det finns visserligen ett kodvisningsläge för den som vill pilla med koden själv, men det ska inte vara nödvändigt - och det här är ju hela poängen med grafiska webbeditorer som Dreamweaver! På exakt samma sätt kan vi få hjälp av Dreamweaver att lägga in javascriptkod utan att vi själva behöver bry oss om de kletiga detaljerna i kodningen.

Det finns bara en handfull fördefinierade javascript-kodsnuttar att välja mellan i Dreamweaver, men tillräckligt många för att man ska klara sig för enklare webbsidor. Vill man lägga in egna javascript-avsnitt får man gå över i editorns kodningsläge.

Javascript i webbsidor och Actionscript i flashfilmer

Av någon anledning har man valt att döpa den javascriptkod som hanteras av Dreamweaver för "beteenden" (eng. "behaviors") i stället för "javascript". Det är lite förvirrande för den kodningsvane som letar efter menyer för "javascript", men man vänjer sig snabbt.

En möjlig anledning till att Macromedia döpt om javascriptmenyerna i Dreamweaver kan vara att man på det sättet får en tydligare paralell till hanteringen av "actionscript" i programmet Flash, som också kallas beteenden i det programmet. Actionscript är för flashfilmer vad javascript är för webbsidor: ett kodspråk man kan använda för att finjustera beteendet på de komponenter man lagt in i webbsida resp. flashfilm. Rent tekniskt är de två kodspråken väldigt lika, och det är ganska lätt att lära sig det ena om man kan koda i det andra. Också det grafiska arbetssättet med "beteenden" i Dreamweaver resp. Flash är snarlikt, för de utvecklare som bara vill arbeta i det grafiska läget i programmen.

Andra skriptspråk

Ett annat motiv bakom terminologin "beteende" i stället för "javascript" är att det faktiskt finns ett par andra skriptspråk utöver javascript som kan användas för att styra webbsidekomponenters beteenden. Exempel är Microsofts priatkopia av javascript, omdöpt till Jscript, och en annan Microsoftteknik VBscript, löst byggd på programmeringsspråket Visual Basic. Slutligen finns ECMAscript som är den variant av javascript som antagits som standard av standardiseringsorganisationen ECMA. De allra flesta webbsidor med beteendestyrning använder dock javascript, och det är också det man får i Dreamweaver.

Javascript + stilmallar = dynamisk HTML

Riktigt hippt blir det om man kombinerar alla tre webbteknikerna (ja, HTML måste ju alltid finnas med, så i praktiken pratar jag nu om att kombinera stilmallar med javascript). Man kan t.ex knyta klickning av en länk till att stilegenskaperna för ett annat objekt ändras. Den kanske viktigaste typen av kombination är javascriptstyrda skikt (där skikten definieras med stilmallsteknik). Standrexemplet är väl de populära utfällbara menyerna.

Kombinationen av javascript och stilmallar brukar lite löst kallas "DHTML" eller "Dynamisk HTML", men det är inte ett tekniskt begrepp, utan bara ett etablerat slanguttryck bland webbutvecklare. Dreamweaver kan hjälpa till med enklare tillämpningar av DHTML, men det mesta får man fixa och trixa till själv (t.ex finns inga menyer för infogande av utfällbara menyer, något som är en stor besvikelse för de flesta Dreamweaver-användare).

Lär dig använda javascript i Dreamweaver

Jag tänker introducera dig till javascript i Dreamweaver steg för steg. Först en av de kanske mest efterfrågade tillämpningarna av javascript, överrullningsbilder (bilder som växlar inehåll när man för muspekaren över dem), som är så vanlig att de har fått en egen undermeny under menyn "Infoga". Sedan finns en rad andra färdigskrivna javascriptsnuttar som du kan foga in via den särskilda s.k. "beteende"-panelen i Dreamweaver. Fler färdiga javascript kan hämtas ner från webben i form av tillägg (eng. extensions) till Dreamweaver. Och slutligen kan du skriva egna javascript i Dreamweavers kodläge. Lycka till med skriptningen av dina webbsidor!