Dreamweaver

A piacvezető WYSIWYG-szerkesztő

Telekommunikációs forradalom napjait éljük. Néhány filozófusnak a múlt század derekán tett óvatos jóslata szerint egy olyan világ van kibontakozóban, amelyben az ember a technológia segítségével a Föld bármely pontján befolyással bírhat, jelen lehet.

A Dreamweaver (ang. "álomszövő") az Adobe Systems által fejlesztett professzionális integrált fejlesztői környezet (IDE), amely egy WYSIWYG-szerkesztő (ang. What You See Is What You Get = amit látsz, azt kapod) és egy forráskód-szerkesztő kombinációja. A Dreamweaver lehetővé teszi a weblapok vizuális szerkesztését és olyan funkciókat nyújt, mint a kód színes jelölése, és az automatikus kódsegítség HTML-hez, CSS-hez, JavaScripthez és PHP-hez (én egyébként ebben a szent percben is Dreamweaverrel dolgozom). A WYSIWYG-szerkesztőkkel készített weboldalak nagy előnye a kész tartalomkezelővel készült társaikhoz képest, hogy mivel az utolsó bötűig ismerjük a kódot, és a keresés minden körülményére rugalmasan tudunk reagálni a legkülönbözőbb tagekkel, maximálisan kézben tarthatjuk az oldal keresőgép-optimalizálását és designját. Tehát az ilyen weboldalak rendszerint jól megtalálhatók és nagyon egyediek.

A magánórákat igényeinek megfelelően tartjuk. A tanfolyamhoz jegyzetet biztosítunk.

Időtartam: kb. 6 × 60 perc

1. Bevezetés

  • A Welcome Screen
  • A kezelőfelület
  • A paletták

2. Dokumentum- és site-kezelés

  • A weboldal és a siteroot
  • A site-os munka
  • Új site berendezése
  • Dokumentum létrehozása
  • Alapértelmezett böngészők definiálása
  • A Site-kezelő
  • Új dokumentum létrehozása
  • DOCTYPE, DTD (Document Type Definition)
  • HTML- és XHTML-dokumentumok konvertálása
  • Automatikus kódsegítség (Code Hinting)
  • Kijelölés
  • Szövegszerkesztés

3. Elemek beillesztése

  • Képek beillesztése (Insert / Image Obejcts)
  • Fireworks-integráció
  • Image Placeholder
  • Rollover Image
  • A világhálón elterjedt képformátumok
  • Médiaelemek beillesztése (Insert / Media)
  • Táblázatok
  • Táblázatok importálása
  • Űrlapok (Forms)
  • Űrlapelemek
  • Érvényesített (validált) űrlapelemek
  • Űrlapok formázása és tesztje

4. CSS-szerkesztés

  • CSS-szerkesztés automatikus kódsegítséggel
  • CSS-szerkesztés a tulajdonságpalettával
  • CSS-szerkesztés a Code Navigatorrel
  • Lap létrehozása sablonból (Layouts)
  • Sztenderd betűtípusok
  • Webfonts
  • Sablonos lap formázása CSS-sel
  • CSS3-áttűnések (Transitions)
  • Stíluslap nyomtatáshoz

5. Adaptív (responsive) webdesign

  • Mediaqueries
  • Multiscreen előnézet
  • Rugalmas layout-rács: Fluid Grid Layout
  • JavaScriptes keretrendszer mobiloldalakhoz: jQuery Mobile
  • Exportálás mobil alkalmazásként: PhoneGap

6. JavaScript-keretrendszerek

  • A JavaScriptről velősen
  • Viselkedések (Behaviors)
  • Spryok
    • XML-elemek
    • Érvényesítő űrlapelemek
    • Interaktív tartalomstrukturáló elemek
  • Snippets (Fecnik)
  • Webalkalmazások beillesztése a Widget Browserrel
  • jQuery Visualize diagramvarázsló

7. Weboldal-tesztelés és -közzététel

  • Adobe BrowserLab
  • W3C-érvényesítő (Validation)
  • Böngésző-inkompatibilitási problémák (Browser Compatibility)
  • Link-ellenőrző (Link Checker)
  • Weboldal-jelentés (Site Reports)
  • Weboldal közzététele

Kapcsolódó modulok: HTML, CSS, Grafikus Webdesign, Joomla!, Online Marketing