Hur man använder Adobe Dreamweaver

Adobe Dreamweaver är ett så kraftfullt verktyg för webbdesigners, eftersom det har så många saker du kan göra med det. Naturligtvis gör alla de saker du kan göra det utmanande att lära sig. Ta reda på några av de många saker som Dreamweaver kan göra, inklusive ändringar i den senaste versionen, CS5. Och glöm inte att kolla in de saker som finns saknas i Dreamweaver CS5.

Definiera en webbplats

• Starta en ny webbplats
• Skapa en webbplats
• Konfigurera endast de delar av webbplatsen som du behöver, när du behöver dem *Ny i CS5
• Konfigurera fjärr-, QA- och testservrar för mer kompletta arbetsflöden *Nyhet i CS5
• Skapa och publicera nya kataloger
• Ändra doctype
• Inkludera metadata på dina sidor

Sätta din webbplats live

• Definiera en fjärrplats
• FTP-filer till webbservern
• Använd ett versionskontrollsystem för att checka in och ut filer
• Anslut till Subversion för mer avancerad versionskontroll *Ny i CS5
• Lämna anteckningar till dina lagkamrater

Skapa webbsidor

• Skriv en sida i WYSIWYG-läge
• Skriv en sida i HTML
• Skapa en ny sida från en mall
• Skapa en ny sida från början
• Skapa en mall
• Spara filer i din webbplatskatalog
• Definiera sidegenskaperna

CSS

• Använd CSS-formatmallar
• Lägga till inline-stilar
• Skapa en extern stilmall
• Bifoga en extern stilmall
• Skapa klass-, ID-, tagg- och sammansatta CSS-väljare
• Redigera befintliga CSS-regler
• Skapa CSS för utskrivbara sidor
• Aktivera och inaktivera stilegenskaper *Ny i CS5
• Inspektera CSS-boxmodellen visuellt *Ny i CS5

Text

• Ändra text
• Använd olika typsnitt
• Infoga en radbrytning
• Använd specialtecken
• Inkludera dagens datum
• Skriv kommentarer
• Tillämpa HTML-taggar att sms: a
• Lägg till HTML-attribut till taggar

Länkar

• Länka text och bilder
• Kontrollera webbplatslänkar
• Ändra standardlänkfärgerna (länk, besökt, hovra, aktiv)
• Skapa verktygstips på länkar
• Skapa mailto-länkar
• Skapa webbsidaankare

Bilder

• Lägg till grafik på en sida
• Redigera bilder
• Ändra storlek på bilder
• Lägg till alternativ text till bilder
• Lägg till ytterligare tillgänglighetsalternativ till bilder
• Justera bilder och text
• Skapa en rollover-bild
• Använda sig av bildkartor
• Använd spårningsbilder
• Använd platshållare för bilder
• Infoga Fireworks HTML
• Infoga Photoshop-filer

Layout

• Använd de medföljande gratis mallarna *Nya CSS-startlayouter i CS5
• Infoga divs för layout
• Redigera div i CSS-formatpanelen
• Sätt i absolut placerade element
• Formatera absolut placerade element i fastighetsinspektören
• Använd linjaler, rutnät och stödlinjer

Listor

• Lägg till punktlistor och numrerade listor
• Anpassa listpunkter och siffror

Tabeller

• Skapa en tabell
• Lägg till rubrikrader och kolumner
• Använda sig av genomskinliga bilder för att hålla tabellceller öppna
• Skapa kolumner med fast bredd och flexibel bredd
• Ändra kantstilar för tabeller
• Bädda in en tabell i en tabell
• Importera tabelldata

Blanketter

• Använd ett mailto-formulär
• Definiera formuläråtgärder
• Lägg till text, radio, kryssruta, fil, bild, markerade rutor och dolda formulärfält
• Gör dina formulär tillgängliga med fältuppsättningar och etikettfält
• Skapa anpassade skicka-knappar
• Validera formulär med JavaScript (Spry)

Databaser och PHP-skript

• Bifoga din webbplats till en databas
• Skapa en PHP/mySQL-webbplats
• Använd Spry-element för att ansluta till databasen
• Infoga dataobjekt på dina sidor
• Testa och uppdatera en Spry-datakälla eller -skärm
• Redigera komplexa dynamiska webbplatser i designvy
• Upptäck alla dynamiskt relaterade filer för att sätta ihop PHP CMS-webbplatser (WordPress, Joomla och Drupal) *Nytt i CS5
• Anpassade klasstips för PHP-kod, inklusive ramverk från tredje part som Zend-ramverket *Ny i CS5

Ramar

• Bygg en inramad webbplats
• Redigera noframes-innehåll
• Formatera och styla dina ramar
• Ställ in standardlänkmål mellan ramar

Lägg till interaktivitet

• Bygg ett fotoalbum (inte längre i CS5)
• Lägg till ljud på webbsidor
• Skapa en rullgardinsmeny
• Använd Dreamweaver-beteenden för att öppna popup-fönster, skapa hoppmenyer, spela upp ljud, byta bilder och mer
• Lägg till RSS-flöden till en webbplats
• Infoga Flash-text som en rollover
• Infoga CSS-text som en rollover
• Sätt in andra plugins
• Lägg till Spry-menyrad, flikar, dragspel, verktygstips och hopfällbar panel
• Använd Widget-webbläsaren för att hitta nya widgets för din webbplats, utan att behöva känna till JavaScript

Testa dina sidor

• Testa dina sidor i Live View för att se ändringarna på grund av JavaScript och interaktivitet *Ny i CS5
• Validera din HTML
• Förhandsgranska dina sidor i flera webbläsare
• Använd BrowserLab för att förhandsgranska dina sidor i andra operativsystem *Ny i CS5
• Använd Device Central för att kontrollera hur sidorna ser ut på mobila enheter
• Kontrollera webbläsarens kompatibilitet
• Ändra inställningarna så att de matchar det som din webbplats behöver arbeta med
• Kontrollera interna länkar till webbplatsen
• Testa din webbplatss tillgänglighet (inte längre i CS5)
• Konvertera a Word-dokument till HTML

Anpassa Dreamweaver

• Lägg till tillägg
• Inaktivera tillägg
• Anpassa Dreamweaver med genvägar

Öka din effektivitet

• Använd inbyggda kortkommandon
• Använd kodavsnitt
• Skapa och använd mallar
• Skapa nya sidor från anpassade mallar
• Uppdatera mallar
• Inkludera en fil i en annan med Dreamweaver-biblioteket
• Uppdatera biblioteksobjekt
• Inkludera en fil i en annan med SSI
• Använd sök och ersätt