Hoe Adobe Dreamweaver te gebruiken

Adobe Dreamweaver is zo'n krachtige tool voor webdesigners, omdat je er zoveel dingen mee kunt doen. Natuurlijk maken al die dingen die je kunt doen het een uitdaging om te leren. Ontdek enkele van de vele dingen die Dreamweaver kan doen, inclusief wijzigingen in de nieuwste versie, CS5. En vergeet niet te kijken naar de dingen die dat wel zijn ontbreekt in Dreamweaver CS5.

Een site definiëren

• Start een nieuwe website
• Maak een website
• Stel alleen de delen van de site in die u nodig heeft, wanneer u ze nodig heeft *Nieuw in CS5
• Stel externe, QA- en testservers in voor completere workflows *Nieuw in CS5
• Nieuwe mappen maken en publiceren
• Het doctype wijzigen
• Metagegevens opnemen in uw pagina's

Uw site live zetten

• Definieer een externe site
• FTP-bestanden naar de webserver
• Gebruik een versiebeheersysteem om bestanden in en uit te checken
• Maak verbinding met Subversion voor meer geavanceerd versiebeheer *Nieuw in CS5
• Laat notities achter voor je teamgenoten

Webpagina's maken

• Schrijf een pagina in WYSIWYG-modus
• Schrijf een pagina in HTML
• Een nieuwe pagina maken op basis van een sjabloon
• Maak een nieuwe pagina vanaf het begin
• Een sjabloon maken
• Sla bestanden op in uw sitemap
• Definieer de pagina-eigenschappen

CSS

• CSS-stijlbladen gebruiken
• Inline stijlen toevoegen
• Een extern stijlblad maken
• Een externe stylesheet bijvoegen
• Maak klasse-, ID-, tag- en samengestelde CSS-selectors
• Bestaande CSS-regels bewerken
• CSS maken voor afdrukbare pagina's
• Stijleigenschappen in- en uitschakelen *Nieuw in CS5
• Inspecteer het CSS-boxmodel visueel *Nieuw in CS5

Tekst

• Tekst wijzigen
• Gebruik verschillende lettertypen
• Een regeleinde invoegen
• Speciale tekens gebruiken
• Voeg de datum van vandaag toe
• Schrijf opmerkingen
• Van toepassing zijn HTML-tags sms'en
• HTML-kenmerken aan tags toevoegen

Links

• Link tekst en afbeeldingen
• Controleer sitelinks
• Wijzig de standaard linkkleuren (link, bezocht, zweef, actief)
• Maak tooltips op links
• Mailto-links maken
• Webpagina-ankers maken

Afbeeldingen

• Afbeeldingen aan een pagina toevoegen
• Afbeeldingen bewerken
• Formaat van afbeeldingen wijzigen
• Alternatieve tekst toevoegen aan afbeeldingen
• Extra toegankelijkheidsopties toevoegen aan afbeeldingen
• Afbeeldingen en tekst uitlijnen
• Een rollover-afbeelding maken
• Gebruik maken van afbeelding kaarten
• Overtrekafbeeldingen gebruiken
• Plaatsaanduidingen voor afbeeldingen gebruiken
• Vuurwerk-HTML invoegen
• Photoshop-bestanden invoegen

Lay-out

• Gebruik de meegeleverde gratis sjablonen *Nieuwe CSS-startlay-outs in CS5
• Div's invoegen voor lay-out
• Bewerk divs in het deelvenster CSS-stijlen
• Absoluut gepositioneerde elementen invoegen
• Maak absoluut gepositioneerde elementen op in de eigenschappencontrole
• Linialen, rasters en hulplijnen gebruiken

Lijsten

• Lijsten met opsommingstekens en genummerde lijsten toevoegen
• Pas lijst opsommingstekens en nummers aan

Tafels

• Maak een tabel
• Koptekstrijen en kolommen toevoegen
• Gebruik maken van transparante afbeeldingen om tabelcellen open te houden
• Creëer kolommen met vaste breedte en flexibele breedte
• De randstijlen van tabellen wijzigen
• Een tabel insluiten in een tabel
• Tabelgegevens importeren

Formulieren

• Gebruik een mailto-formulier
• Formulieracties definiëren
• Tekst, radio, selectievakje, bestand, afbeelding, selectievakjes en verborgen formuliervelden toevoegen
• Maak uw formulieren toegankelijk met veldenset en labelvelden
• Aangepaste verzendknoppen maken
• Formulieren valideren met JavaScript (Spry)

Databases en PHP-scripting

• Koppel uw site aan een database
• Een PHP/mySQL-site opzetten
• Gebruik Spry-elementen om verbinding te maken met de database
• Gegevensobjecten in uw pagina's invoegen
• Test en update een Spry-gegevensbron of display
• Bewerk complexe dynamische sites in de ontwerpweergave
• Ontdek alle dynamisch gerelateerde bestanden om PHP CMS-sites samen te stellen (WordPress, Joomla en Drupal) *Nieuw in CS5
• Aangepaste klassenhints voor PHP-code, inclusief frameworks van derden zoals het Zend-framework *Nieuw in CS5

Kaders

• Bouw een ingelijste website
• Noframes-inhoud bewerken
• Formatteer en style je lijsten
• Standaard linkdoelen tussen frames instellen

Interactiviteit toevoegen

• Een fotoalbum maken (niet meer in CS5)
• Geluid toevoegen aan webpagina's
• Een vervolgkeuzemenu maken
• Gebruik Dreamweaver-gedrag om pop-upvensters te openen, springmenu's te maken, geluid af te spelen, afbeeldingen om te wisselen en meer
• RSS-feeds toevoegen aan een site
• Flash-tekst invoegen als rollover
• CSS-tekst invoegen als rollover
• Andere plug-ins invoegen
• Voeg Spry-menubalk, panelen met tabbladen, accordeon, knopinfo en inklapbaar paneel toe
• Gebruik de widgetbrowser om nieuwe widgets voor uw site te vinden, zonder dat u JavaScript hoeft te kennen

Test uw pagina's

• Test uw pagina's in Live View om de wijzigingen als gevolg van JavaScript en interactiviteit te zien *Nieuw in CS5
• Valideer uw HTML
• Bekijk een voorbeeld van uw pagina's in verschillende browsers
• Gebruik BrowserLab om een ​​voorbeeld van uw pagina's in andere besturingssystemen te bekijken *Nieuw in CS5
• Gebruik Device Central om te controleren hoe de pagina's eruitzien op mobiele apparaten
• Controleer de browsercompatibiliteit
• Wijzig de instellingen zodat deze overeenkomen met wat uw site nodig heeft om mee te werken
• Controleer interne sitelinks
• Test de toegankelijkheid van uw site (niet meer in CS5)
• Converteren naar Word document naar HTML

Dreamweaver aanpassen

• Extensies toevoegen
• Extensies uitschakelen
• Pas Dreamweaver aan met snelkoppelingen

Verhoog uw efficiëntie

• Gebruik ingebouwde sneltoetsen
• Gebruik codefragmenten
• Sjablonen maken en gebruiken
• Genereer nieuwe pagina's van aangepaste sjablonen
• Sjablonen bijwerken
• Voeg het ene bestand toe aan het andere met de Dreamweaver-bibliotheek
• Bibliotheekitems bijwerken
• Voeg het ene bestand toe aan het andere met SSI
• Gebruik zoeken en vervangen