Adobe Dreamweaver CS6: Webdesign for alle?

I takt med at internettet bliver centrum for forretning, netværk og social interaktion, stiger behovet for personlige og virksomheds-hjemmesider. At få en professionel til at designe en hjemmeside kan dog være dyrt. Omvendt kan det at designe den selv virke umuligt, hvis du mangler den basale viden om HTML eller CSS, der typisk kræves for at tilpasse skabeloner i forskellige HTML-editorer.

Adobe Dreamweaver CS6 er en softwareløsning, der enten er inkluderet i Adobe Creative Suite eller kan købes som et selvstændigt program.

Dreamweaver giver dig mulighed for at skabe flotte, professionelt udseende hjemmesider, selv hvis du intet kender til HTML eller CSS, når du starter. Desuden kan det at skabe hjemmesider være så simpelt som at klikke med musen på de forskellige kommandoer og værktøjer, du finder i Dreamweaver-programmet.

Forskellen mellem Dreamweaver og HTML-editorer

Hvis du søger på software, der hjælper dig med at designe hjemmesider, vil du finde et væld af valgmuligheder. Disse valg kan dog opdeles i tre kategorier: programmer lignende Dreamweaver, HTML-editorer og Dreamweaver selv.

Sandheden er, at Adobe har mestret markedet for alt grafisk, såsom Flash, PDF-filer, foto-redigering, digitale illustrationer og (ja) hjemmeside-oprettelse. Adobe-software er ikke billigt at købe, men fordelene opvejer eller overstiger prisen. Adobe-programmer, inklusive Dreamweaver, er nemme at bruge og kræver meget lidt teknisk viden på et grundlæggende niveau. Med andre ord, hvis du eksperimenterede med Dreamweaver, er chancen stor for, at du ville kunne finde nok ud af det til succesfuldt at bruge programmet til meget basal hjemmeside-design.

Andre programmer, der ligner Dreamweaver, er ofte efterligninger. Du vil finde, at de tilbyder mange af de samme funktioner (kommandoer og værktøjer), men de kræver enten mere teknisk viden, er ikke lige så nemme eller effektive at bruge, eller deres brugerflader er så forvirrende, at du ikke kan finde ud af at bruge programmet. Disse programmers tiltrækning ligger i deres lavere pris, men de tilbyder simpelthen ikke de samme fordele, som Dreamweaver tilbyder alle brugere, uanset færdighedsniveau.

Det tredje valg, du har, når du vil designe dine egne hjemmesider, er en HTML-editor. Du kan Google disse og finde mange, nogle gratis og andre til meget lav pris. HTML-editorer er dog simpelthen kun editorer. De giver dig mulighed for at redigere HTML'en i hjemmeside-skabeloner for at tilpasse dem og gøre dem til dine egne. Dette betyder, at du som minimum skal have meget basal HTML-viden for at bruge de fleste HTML-editorer på markedet i dag.

Hvem bruger Dreamweaver?

Dreamweaver er ikke et basalt webdesign-softwareprogram. Det lille der siges om Dreamweaver, kunne føre dig til at tro, at det er et basalt program designet til begynderen. Men det ville ikke være sandt.

Dreamweavers brugerflade og værktøjer er nemme nok at bruge (når du først lærer hvordan), så en person, der aldrig har designet en hjemmeside før, kan gøre det succesfuldt med dette program. Når det er sagt, har Dreamweaver også avancerede værktøjer og funktioner, der giver dig mulighed for at tilføje mere form og funktion til dine hjemmesider, efterhånden som du lærer at bruge mere og mere af programmet.

Så det er sandt, at folk uden absolut ingen programmeringsviden bruger Dreamweaver til at oprette hjemmesider. Professionelle webdesignere og udviklere bruger dog også Dreamweaver, fordi de værktøjer og kommandoer, det tilbyder, gør deres arbejde lettere og sparer tid i forhold til at skrive kompleks kode til en hjemmeside i hånden. Dit færdighedsniveau med programmet vil bestemme, hvor meget du kan gøre med det, og hvor komplekse (og smukke) hjemmesider du kan skabe.

Dreamweaver CS6 versus Dreamweaver CC?

Med udgivelsen af den nyeste version af Dreamweaver er der en del forvirring og spørgsmål. Hvilken version er den nyeste? Hvilken version er bedst? Hvad er forskellene?

Lad os besvare spørgsmålene.

Dreamweaver CS6 er den version af Dreamweaver, der følger med Adobe Creative Suite 6. Du kan også købe den som et selvstændigt produkt. Dreamweaver CS6 kan købes i butikker eller bestilles online som en CD. Den kan også downloades fra Adobe-siden. Når du gør det, køber du også en licens til at bruge den. Når du har betalt for Dreamweaver CS6, er den din at bruge, så længe du ønsker. Du skal aldrig betale for den igen, medmindre du beslutter dig for at opgradere.

Dreamweaver CC er en del af Adobes nye Creative Cloud. Creative Cloud er abonnementsbaseret, hvilket betyder, at du betaler et månedligt gebyr for at bruge Dreamweaver, samt andre programmer du finder i Creative Suite. Dreamweaver CC downloades til din computer ligesom CS6. Når du har downloadet programmet, behøver du ikke internetadgang for at bruge det.

Du kan kun bruge Dreamweaver CC, så længe du betaler dine abonnementgebyrer. Creative Cloud-versionen af Dreamweaver er lidt anderledes end Creative Suite-versionen i menuindstillinger og metoder, der bruges til at fuldføre opgaver. Dette relaterer sig dog simpelthen til overgangen fra grundlæggende HTML i webdesign til CSS.

Hvis du bruger både CS6 og CC, vil du opdage, at Adobe lægger mere fokus på at modernisere CC end CS6. Dette skyldes Adobes rygtede planer om permanent at flytte alle sine programmer til Creative Cloud og udfase Creative Suite. Du vil stadig kunne købe en licens (som du gør med Creative Suite), men du vil gøre det via Creative Cloud-programmerne.

Myter vedrørende Dreamweaver CS6 og CC

Der cirkulerer et par myter om de to seneste versioner af det populære softwareprogram. Lad os aflive disse myter, især hvis du prøver at beslutte, hvilken version af programmet du vil bruge.

• Dreamweaver CC er ikke en basisversion (eller en skrællet version) af CS6. Begge versioner er fulde versioner af programmet.
• Du behøver ikke internetadgang for at bruge Dreamweaver CC. Fordi det er cloud-baseret, tror nogle mennesker, at du skal være online for at bruge programmet. Dette er ikke sandt. Du skal bruge internetadgang for at downloade programmet til din computer. Det er alt. Du behøver ikke være online for at bruge det, når det er installeret.
• Dreamweaver CS6 og CC er to helt forskellige programmer. Igen, dette er ikke sandt. Nogle menuvalg er forskellige i CC, men det er stort set det. De er det samme program. CS6 er versionen, du betaler én gang for, og det er det. CC er abonnementsbaseret.

Hvad er nyt i Dreamweaver (omkring CS6)

Der har været mange opdateringer og forbedringer i Dreamweaver siden udgivelsen af CS5, herunder:

• Fluid grid layouts: Disse layouts lader dig bygge komplekse, responsive designs til skærme i alle størrelser ved hjælp af et grid-system. Dette inkluderer designs til computerskærme, tablets og smartphones.
• CSS Transitions-panelet: Dette gør det nemt at skabe animerede effekter på websider uden at skulle kende CSS.
• Business Catalyst-forbindelse: Gør det muligt at administrere og udgive dine hjemmesider hurtigere end før ved hjælp af Dreamweaver.
• CSS3 og HTML5: For endnu bedre designkraft.
• Integration med Browser Lab: Lader dig teste sider for W3C-validering.
• Og mere!

Grundlæggende om webdesign

Der er nogle grundlæggende regler, så at sige, for at bygge og designe en hjemmeside. Disse er vigtige at kende, før du faktisk begynder at bruge Dreamweaver. Vi vil gennemgå disse regler i denne artikel, før vi går videre til at bruge Dreamweaver. Tag dig tid med denne artikel og sørg for at lære den præsenterede information, især hvis du aldrig har designet en hjemmeside før.

Det grundlæggende i webdesign

En hjemmeside er en serie af sider, der er linket sammen. Hver hjemmeside, du designer, vil have en forside (home page). Forsiden er den side, besøgende ser, når de besøger dit site. Den kan kaldes den første side på dit site. Hvis dit domæne er www.abcxyz.com, vil din forside være den side, folk ser, når de går til www.abcxyz.com. Forsiden kaldes også index-siden.

Når det er sagt, vil din forside også linke til de andre sider på dit site. Disse sider kan indeholde links til andre sider – eller undersider – inden for dit site. Det er dog vigtigt at huske, at din forside linker til alle dine hovedsider på dit site; hvorimod undersider oprettes, når du opretter links på andre sider (ikke forsiden) til andre sider, der ikke er linket fra forsiden.

Site-struktur

Din hjemmesides struktur har to sider: hvad du ser, og hvad de besøgende, der kommer til dit site, ser. Hvad du ser, består af sider, mapper og filer. Hvad din bruger ser, er designet og navigationen (hvordan de kommer fra én side til den næste). Lad os diskutere begge sider af dit sites struktur.

Hvad besøgende ser

Som nævnt ovenfor er, hvad din bruger ser, designet og navigationen på dit site. Når de først kommer til din hjemmeside, vil de være på din forside. Hvad vil de se der? Hvordan vil de bevæge sig fra forsiden til andre sider på dit site?

Dine besøgende skal nemt kunne se navigationen på dit site samt vigtig information på siderne. Du skal sikre dig, at dine brugere kan:

• Nem at se og komme til vigtig information på alle sider og placeringer på dit site
• Nem at bevæge sig mellem sider
• Nem at bevæge sig mellem sektioner
• Vende tilbage til hovedsiden (forsiden) på dit site og andre sider i ét trin (klik med musen)

Hvad du ser

Lad os nu tale om det andet aspekt af administration af dit site – eller hvad du ser. Du vil organisere det, du ser, som talt om tidligere i denne artikel. Du vil planlægge dette, før du nogensinde begynder at designe dit site, så du nemt kan organisere sider, mapper og filer, mens du designer sitet.

Du vil oprette disse tre systemer, før du begynder at designe dit site:

• Filnavngivningssystem: Dette vil være, hvordan du navngiver filer. Hvis du navngiver billeder, vil du beslutte dig for, hvordan du vil navngive billederne. Måske vil du have, at billederne matcher dine sidenavne. For eksempel kan et billede på din 'om'-side hedde om1.jpg. Et andet billede på din 'om'-side kan hedde om2.jpg. Du vil måske også navngive filer efter, hvad de repræsenterer. For eksempel, hvordan_man_strikker.jpg for et billede, der passer til tekst, der fortæller, hvordan man strikker.
• Mappesystem: Du vil placere billeder, animationer, CSS-filer, JavaScript-filer osv. i mapper for at gøre det nemt at finde disse ting, når du har brug for dem. Opret alle dine mapper på forhånd. Det eneste, du ikke skal oprette en mappe til, er dine sider.
• Sidesystem: Hvordan vil du navngive dine sider? Den enkleste måde er at navngive dem efter deres type. For eksempel: om.html, kontakt.html. Du kan også navngive dem ved hjælp af nøgleord, hvis du optimerer dit site, mens du opretter det, såsom hvordan_man_strikker.html.

Om HTML, XHTML og HTML5

HTML er et opmærkningssprog, du bruger til at 'opmærke' en side – eller give instruktioner til, hvordan en webside skal se ud. Det er ikke et programmeringssprog. Du skriver HTML ved hjælp af tags. Tagsene er opmærkningsinstruktionerne, der fortæller din webbrowser, hvordan siden skal se ud.

<b> er et eksempel på en opmærkning, der fortæller en webbrowser, at teksten efter tagget skal vises med fed skrift. Dette er et åbningstag. Du bruger et åbningstag, hvor du vil have opmærkningsinstruktionerne til at begynde. Du bruger et lukketag, hvor du vil have opmærkningsinstruktionerne til at ende. </b> ville være lukketagget for at fortælle webbrowseren at stoppe med at bruge fed skrift.

Her er et eksempel:

<p><b>Sådan gør du tekst fed med HTML.</b></p>

XHTML anbefales til de fleste hjemmesider i dag. Det er blot en strengere version af HTML. HTML5 er derimod den nyeste version af HTML, men mange af de tags, der er forbundet med HTML5, understøttes endnu ikke af alle webbrowsere. Dreamweaver anbefaler, at du udfører dit designarbejde i XHTML.

Statiske og dynamiske hjemmesider

Hjemmesider kan grupperes i to kategorier: statiske sites og dynamiske sites. Statiske sites er dem, der er bygget med et program som Dreamweaver. Dynamiske sites bruger avanceret programmering med en database og genererer websider dynamisk.

Tænk på det på denne måde. Et statisk site er som at skrive en bog. Hver side oprettes i hånden. Statiske websider er en samling af sider med en .htm- eller .html-udvidelse. Hver side er en separat fil.

Et dynamisk site er mere som et lager, der er fyldt med billeder, ord, videoer og farver. Disse elementer trækkes ned fra hylden med lynets hast, når du klikker på siden for at se den, og siderne oprettes, som de vises i din browser. Disse sider gemmes ikke som individuelle sider. I stedet er de stykker af sider, der kan samles for at skabe en side. Et eksempel på en dynamisk hjemmeside er Amazon. Én person kan gå til Amazons forside og se anbefalede bøger til dem. Når en anden person besøger, vil de dog se forskellige anbefalinger. Begge personer besøger dog den samme URL – eller side.

Dynamiske sites har sideudvidelser som PHP eller ASP.net. Du kan oprette dynamiske hjemmesider ved hjælp af Dreamweaver; dog foretrækker de fleste professionelle designere og udviklere Microsoft Visual Studio eller Eclipse. Dreamweaver bruges bedst til statiske sider.

Cascading Style Sheets eller CSS

CSS er ikke et alternativ til HTML. CSS er en tilføjelse til HTML. Du kan bruge Cascading Style Sheets, eller CSS, til at anvende stilarter. CSS, når du først får greb om det, kan være et hurtigere alternativ til at anvende stilarter end at bruge HTML. Med HTML skal du etablere ting som skrifttyper og farver flere gange på en side eller hjemmeside. Ved hjælp af CSS kan du anvende én stil igen og igen på en side eller en hjemmeside uden at skulle skrive HTML-kode, hver gang du bruger stilen.

Nedenfor er nogle flere fordele ved at bruge CSS:

• Det forenkler designændringer. Du kan gemme CSS i headeren på din side, eller du kan gemme det i en separat fil for at anvende det på flere sider. Hvis du bruger én stil på flere overskrifter og derefter vil ændre stilen, kan du simpelthen ændre CSS'en i stedet for at ændre hver enkelt overskrift.
• Når du adskiller indhold fra design, kan du oprette forskellige typografiark til forskellige målgrupper og enheder. CSS giver dig mulighed for nemt at designe dit site til skærme i forskellige størrelser, herunder mobile enheder, så dit site ser bedst ud for alle, der ser det. At gøre det er så simpelt som at linke til et typografiark.

Dreamweaver vs. WordPress: En sammenligning

At vælge den rette platform til at bygge din hjemmeside kan være udfordrende, givet de mange tilgængelige muligheder. Mens WordPress og Dreamweaver er to af de mest populære platforme på grund af deres omfattende tilpasningsmuligheder, er det vigtigt at bemærke, at der er nogle betydelige forskelle mellem dem. Derfor vil vi i dette afsnit sammenligne WordPress og Dreamweaver for at hjælpe dig med at beslutte, hvilken der passer bedst til dine behov.

WordPress vs Dreamweaver: Hvem er de til?

Mens WordPress og Dreamweaver giver dig mulighed for at bygge responsive og effektive hjemmesider, adskiller de sig markant i deres tilgang.

Hvad er WordPress?

WordPress er et brugervenligt Content Management System (CMS), der giver dig mulighed for nemt at bygge og administrere en hjemmeside. Over tid er det blevet en af de mest udbredte platforme til at oprette hjemmesider og står for mere end 43% af internettet. Som en open source og gratis platform tilbyder den en utrolig mængde temaer og plugins, både gratis og premium, der udvider WordPress' kernefunktioner.

Uanset om du sigter mod at oprette en blog, et learning management system (LMS), et medlemskabssite eller en online butik, gør WordPress det nemt at lære og mestre. Dette gør det til et fremragende valg for både begyndere og erfarne udviklere.

Hvad er Dreamweaver?

Dreamweaver, en del af Adobe Creative Suite, bruges til at designe, udvikle og implementere hjemmesider. Brugere har tre brugerflader at vælge imellem, herunder kode, split (kode og visuel) eller en visuel brugerflade med en træk-og-slip-editor. Dog er kodningsfærdigheder essentielle, hvis du vil bygge en fuldt responsiv hjemmeside. Ligesom WordPress understøtter Dreamweaver brugen af HTML, CSS, Javascript og PHP. Men det er op til brugeren at sætte alle brikkerne sammen.

Ved hjælp af Dreamweaver kan udviklere oprette websider fra bunden eller vælge fra forudlavede skabeloner og forhåndsvise deres designs på forskellige browsere og skærmstørrelser. Selvom Dreamweaver ikke er lige så populært som WordPress, har det stadig omkring 0,3% af markedsandelen for alle hjemmesider på internettet.

Så, hvem er de til?

At sammenligne WordPress og Dreamweaver kan være komplekst, da de har forskellige tilgange til at oprette hjemmesider. WordPress er brugervenligt og ideelt for dem uden webdesign-erfaring. Desuden tilbyder det utrolig alsidighed og kan modificeres af udviklere eller udvides med plugins og temaer for at oprette forskellige slags hjemmesider.

På den anden side, selvom Dreamweaver tilbyder en træk-og-slip-brugerflade, skal du stadig kode elementer, der skal trækkes, for at sikre, at de fungerer. Det er sandsynligt også nødvendigt at ansætte en full-stack udvikler, hvis du ønsker at oprette mere end en informativ hjemmeside. Som et resultat er Dreamweaver bedre egnet til dem med avanceret kodningsviden.

WordPress vs Dreamweaver: Priser

Når det kommer til priser, er WordPress og Dreamweaver meget forskellige. Når det er sagt, er de ret jævnbyrdige, når man medregner tilføjelser. Lad os undersøge, hvad du skal forvente, hvis du vælger en af disse platforme.

WordPress Priser

Det er svært at beregne den samlede pris for WordPress. Selvom WordPress i sig selv er gratis, er der andre variabler at overveje. Før du overhovedet begynder at designe, skal du vælge et domæne og få en hostingplan. Selvom dette ikke er store omkostninger – du kan få et domæne for mindre end 200 kr. om året – når du medregner andre ting som plugins og temaer, kan omkostningerne hurtigt løbe op.

Dreamweaver Priser

Når du vælger Dreamweaver som dit værktøj til at oprette hjemmesider, er den gode nyhed, at der ikke er mange omkostninger at bekymre sig om – i hvert fald hvis du planlægger at kode selv. Selvfølgelig skal du købe et domæne og webhosting, men du skal også betale for Dreamweaver-softwaren. Omkostningen for Dreamweaver er cirka 150 kr. om måneden før skat.

Men hvis du ønsker adgang til Adobes fulde pakke af kreative produkter, herunder Dreamweaver, stiger omkostningen til omkring 400 kr. om måneden. Det giver mening for de fleste, der bruger Dreamweaver, at vælge hele Creative Cloud. Dette gælder især, hvis du planlægger at oprette en mere avanceret hjemmeside, der kræver fotoredigeringsværktøjer og en måde at lave skalerbare vektorgrafik (SVG) eller animationer.

I sidste ende, hvis du vil oprette en hjemmeside hurtigt og ikke har meget kodningserfaring, er WordPress vejen at gå. Men hvis du vil udvikle apps eller brugerdefinerede hjemmesider baseret på HTML, PHP eller Bootstrap, kan Dreamweaver være et godt valg.

Ofte Stillede Spørgsmål (FAQ)

Før vi runder af, lad os besvare nogle af de mest almindelige spørgsmål om Dreamweaver (og WordPress).

Bruger nogen stadig Dreamweaver?

Ja, Dreamweaver bruges stadig, især af professionelle webdesignere og udviklere, der værdsætter dets værktøjer til at arbejde direkte med kode og skabe brugerdefinerede, statiske eller komplekse sites.

Er Dreamweaver CC en skrællet version af CS6?

Nej, dette er en myte. Både Dreamweaver CS6 og Dreamweaver CC er fulde versioner af programmet. Forskellen ligger primært i licensmodellen (enkeltkøb vs. abonnement) og hvordan opdateringer leveres, samt et skift i fokus mod nyere webteknologier i CC.

Skal jeg have internetadgang for at bruge Dreamweaver CC?

Nej, ikke konstant. Du skal bruge internetadgang for at downloade programmet og for licensvalidering (typisk en gang om måneden for abonnenter). Men selve brugen af programmet til at designe og kode kræver ikke, at du er online.

Er Dreamweaver CS6 og CC helt forskellige programmer?

Nej, de er fundamentalt det samme program med den samme kernefunktionalitet til webdesign. Brugerfladen og menuvalg kan variere lidt, især i CC, da det er nyere og har et større fokus på moderne webstandarder som CSS, men de er ikke to radikalt forskellige stykker software.

Hvis du vil læse andre artikler, der ligner Adobe Dreamweaver CS6: Webdesign for alle?, kan du besøge kategorien Fotografi.