Jak používat Adobe Dreamweaver

Adobe Dreamweaver je tak mocný nástroj pro webové designéry, protože s ním můžete dělat tolik věcí. Samozřejmě, že všechny ty věci, které můžete dělat, ztěžují učení. Zjistěte některé z mnoha věcí, které Dreamweaver umí, včetně změn v nejnovější verzi CS5. A nezapomeňte zkontrolovat věci, které jsou chybí v Dreamweaveru CS5.

Definování webu

• Spusťte nový web
• Vytvořte web
• Nastavte pouze části webu, které potřebujete, když je potřebujete *Novinka v CS5
• Nastavte vzdálené servery, servery kontroly kvality a testovací servery pro úplnější pracovní postupy *Novinka v CS5
• Vytvářejte a publikujte nové adresáře
• Změňte typ dokumentu
• Zahrňte do svých stránek metadata

Uvedení vašeho webu do provozu

• Definujte vzdálené místo
• FTP soubory na webový server
• Ke kontrole souborů použijte systém správy verzí
• Připojte se k Subversion pro pokročilejší správu verzí *Novinka v CS5
• Nechte poznámky pro své spoluhráče

Vytváření webových stránek

• Napište stránku v režimu WYSIWYG
• Napište stránku v HTML
• Vytvořte novou stránku ze šablony
• Vytvořte novou stránku od začátku
• Vytvořte šablonu
• Uložte soubory do adresáře vašeho webu
• Definujte vlastnosti stránky

CSS

• Používejte šablony stylů CSS
• Přidávání inline stylů
• Vytvořte externí šablonu stylů
• Připojte externí šablonu stylů
• Vytvářejte selektory tříd, ID, značek a složených CSS
• Upravit stávající pravidla CSS
• Vytvořte CSS pro tisknutelné stránky
• Povolení a zakázání vlastností stylu *Novinka v CS5
• Vizuálně zkontrolujte model krabice CSS *Novinka v CS5

Text

• Upravte text
• Používejte různá písma
• Vložte zalomení řádku
• Používejte speciální znaky
• Uveďte dnešní datum
• Pište komentáře
• Aplikovat HTML tagy napsat
• Přidejte ke značkám atributy HTML

Odkazy

• Propojte text a obrázky
• Zkontrolujte odkazy na stránky
• Změnit výchozí barvy odkazu (odkaz, navštíveno, najetí myší, aktivní)
• Vytvářejte tipy pro nástroje na odkazech
• Vytvořte odkazy mailto
• Vytvořte kotvy webových stránek

snímky

• Přidejte grafiku na stránku
• Upravit obrázky
• Změňte velikost obrázků
• Přidejte k obrázkům alternativní text
• Přidejte k obrázkům další možnosti usnadnění
• Zarovnejte obrázky a text
• Vytvořte obrázek převrácení
• Použití obrazové mapy
• Použijte trasovací obrázky
• Použijte zástupné symboly pro obrázky
• Vložte HTML Fireworks
• Vložte soubory Photoshopu

Rozložení

• Použijte přiložené bezplatné šablony *Nová úvodní rozvržení CSS v CS5
• Vložit prvky div pro rozvržení
• Upravte prvky div na panelu stylů CSS
• Vložte absolutně umístěné prvky
• Naformátujte absolutně umístěné prvky v inspektoru vlastností
• Použijte pravítka, mřížky a vodítka

Seznamy

• Přidejte seznamy s odrážkami a číslované seznamy
• Přizpůsobte si odrážky a čísla seznamu

Tabulky

• Vytvořte tabulku
• Přidejte řádky a sloupce záhlaví
• Použití průhledné obrázky držet buňky tabulky otevřené
• Vytvořte sloupce s pevnou šířkou a flexibilní šířkou
• Změňte styly ohraničení tabulek
• Vložit tabulku do tabulky
• Importujte tabulková data

formuláře

• Použijte formulář mailto
• Definujte akce formuláře
• Přidejte text, rádio, zaškrtávací políčko, soubor, obrázek, výběrová pole a skrytá pole formuláře
• Zpřístupněte své formuláře pomocí polí sady polí a štítků
• Vytvořte vlastní tlačítka pro odeslání
• Ověření formulářů pomocí JavaScriptu (Spry)

Databáze a PHP skriptování

• Připojte svůj web k databázi
• Nastavte stránky PHP/mySQL
• Pro připojení k databázi použijte prvky Spry
• Vložte datové objekty do svých stránek
• Testujte a aktualizujte zdroj dat Spry nebo displej
• Upravte složité dynamické weby v zobrazení návrhu
• Objevte všechny dynamicky související soubory a sestavte stránky PHP CMS (WordPress, Joomla a Drupal) *Novinka v CS5
• Vlastní tipování tříd pro kód PHP, včetně rámců třetích stran, jako je rámec Zend *Novinka v CS5

Rámečky

• Vytvořte si zarámovaný web
• Upravit obsah noframes
• Naformátujte a upravte své rámečky
• Nastavte výchozí cíle propojení mezi snímky

Přidat interaktivitu

• Vytvořte si fotoalbum (již není v CS5)
• Přidejte zvuk na webové stránky
• Vytvořte rozevírací nabídku
• Pomocí chování Dreamweaveru můžete otevírat vyskakovací okna, vytvářet skokové nabídky, přehrávat zvuk, přepínat obrázky a další
• Přidejte kanály RSS na web
• Vložit text Flash jako rollover
• Vložit text CSS jako rollover
• Vložte další pluginy
• Přidejte panel nabídek Spry, panely s kartami, akordeon, tip nástroje a skládací panel
• Pomocí prohlížeče widgetů vyhledejte nové widgety pro svůj web, aniž byste museli znát JavaScript

Otestujte své stránky

• Otestujte své stránky v živém zobrazení, abyste viděli změny způsobené JavaScriptem a interaktivitou *Novinka v CS5
• Ověřte svůj HTML
• Prohlédněte si své stránky v několika prohlížečích
• Použijte BrowserLab k náhledu stránek v jiných operačních systémech *Novinka v CS5
• Pomocí aplikace Device Central můžete zkontrolovat, jak stránky vypadají na mobilních zařízeních
• Zkontrolujte kompatibilitu prohlížeče
• Změňte nastavení tak, aby odpovídalo tomu, s čím váš web potřebuje pracovat
• Zkontrolujte odkazy na interní stránky
• Otestujte dostupnost svého webu (již není v CS5)
• Převést a Dokument aplikace Word do HTML

Přizpůsobte si Dreamweaver

• Přidejte rozšíření
• Zakázat rozšíření
• Přizpůsobte si Dreamweaver pomocí zkratek

Zvyšte svou efektivitu

• Používejte vestavěné klávesové zkratky
• Použijte úryvky kódu
• Vytvářejte a používejte šablony
• Generujte nové stránky z vlastních šablon
• Aktualizujte šablony
• Zahrňte jeden soubor do druhého pomocí knihovny Dreamweaver
• Aktualizujte položky knihovny
• Zahrnout jeden soubor do druhého pomocí SSI
• Použijte vyhledávání a nahrazování