A kurzus végére már ilyen weblapokat is fogtok tudni készíteni. Bár a Dreamweaver 8.0-ás verzióra készült a videó, de a CS3-ra, és a CS4-re is 90%-ig használható az itt bemutatott tudás.

A Dreamweaver előző verzióival már szilárdan biztosította vezető szerepét a vizuális webszerkesztők versenyében. A Dreamweaver 8 jól felkészült a legújabb technológiákra, vizuálisan tervezhetünk összetett CSS alapú oldalelrendezéseket, írhatunk PHP 5 és Coldfuson MX 7 kódot. A Dreamweaverrel a fejlesztőcsapat minden tagja - grafikusok, fejlesztők és programozók - egyetlen, integrált felületen dolgozhatnak statikus és dinamikus web oldalak megtervezésén, kialakításán és fenntartásán a legújabb szabványok alkalmazásával.

PÉLDA OKTATÓVIDEÓK:

PÉLDA OKTATÓVIDEÓK:

OKTATÓVIDEÓ-LISTA

A Dreamweaver oktatóvideók 1.része: Alapok
Site létrehozása
Mappák létrehozása
Fájlok létrehozása home page beállítása
Linkek gyors létrehozása
Cím adása az oldalakhoz

A Dreamweaver oktatóvideók 2.része: CSS formázások
CSS alapok
CSS állomány gyors létrehozása
Link stílusának megváltoztatása
Háttérkép a CSS-ben

A Dreamweaver oktatóvideók 3.része: Táblázatok
Táblázat készítése
Táblázatban táblázat
Táblázat létrehozása CSS-el
Tábla másolása új dokumentumba

A Dreamweaver oktatóvideók 4.része: Template
Template elkészítése
Template lényege
Template képek szerkesztése
Templateben lévő képek eltüntetése
Ismétlési régió a templateben
Kezdőoldal kialakítása

A Dreamweaver oktatóvideók 5.része: Egyéb átalakítások
Transzparenskép alkalmazása
Javítás a templaten
Föld lap elkészítése

A Dreamweaver oktatóvideók 6.része: Fotóalbum, galéria a weblapon
Fotóalbum készítése
Galéria készítése CSS-el

A Dreamweaver oktatóvideók 7.része: Kapcsolattartás létrehozása
Kapcsolattartás, a form-lap
Form ellenőrzése

A Dreamweaver oktatóvideók 8.része: Szöveg formázása
Lista átrendezése
Szöveg tulajdonságainak módosítása
Szöveg igazítása
A CSS stílusoknál fontos konklúzió
Fejléc plusz szöveg alakításainak első lépése
Fejléc és szöveg alaprendezése
Fejléc keretezése
Kapitális kiskapitális, kisbetűs fejlécek
Szavak közti hely
Betűk közti hely
Másfeles sorköz
Bekezdések beljebbvitele
Iniciálé
Listajelek saját képeinkre cserélése első módszer
Listajelek saját képeinkre cserélése második módszer
Listaelőnyök
Menü, mint egy vízszintes lista

A Dreamweaver oktatóvideók 9.része: Táblázat kicsit keményebben
Táblázat készítése CSS-el
Alapbeállítások egy táblázatra
Táblázat elhelyezése a lapomon belül
Táblázat elrendezése és háttere

A Dreamweaver oktatóvideók 10.része: Hasznos apróságok
A bolygók oldalainak felépítése
A Földleírás html javítása
Bolygók leírásainak létrehozása
Linkek beállítása

A Dreamweaver oktatóvideók 11.része: Form elemek
Szöveg kiemelése
Szöveg adása az állapotsorhoz
Görgetősáv színének változtatása

A Dreamweaver oktatóvideók 12.része: Képekből álló websablon elkészítése
Egy képekből álló weblapsablon elkészítése
A gördítősáv beállítása
Képekből álló weblap létrehozása fireworksal

A Dreamweaver oktatóvideók 13.része: Képekből és táblázatokból álló profibb honlap elkészítése
Képekből és táblázatokból álló profibb weblap
Weblap tartalommal feltöltése
weblap befejezése

A Dreamweaver oktatóvideók 14.része: Framekkel, div-tagakkel, layerekkel elkészíthető profibb weblapok
Framek és képek
Rétegek plusz táblázat
Layerek által létrejött weblap
Layerek befejezése

A Dreamweaver oktatóvideók 15.része: Egy mai modern weblap létrehozása
Div taggal a5ponthu
a5ponthu lábléce
a5 linkek beállítása
a5 közepének változtatásai
a5 befejezése
a5 közepe div tagekkel

OKTATÓVIDEÓK LEÍRÁSA

A Dreamweaver oktatóvideók 1.része: Alapok
Site létrehozása
Site létrehozása a C meghajtóra
Mappák létrehozása
Az általunk majd használt mappák létrehozása (képek, keretek stb.)
Fájlok létrehozása homepage beállítása
Állományok készítése, homepage beállítása (index-, merkur.html stb.)
Linkek gyors létrehozása
Linkek készítése, szerkezetük vizsgálata
Cím adása az oldalakhoz
A html oldalakhoz címek rendelése (nem állomány-elnevezés, átnevezés)

A Dreamweaver oktatóvideók 2.része: CSS formázások
CSS alapok
Adott állomány stílussal való ellátása (alaplépések)
CSS állomány gyors létrehozása
Új stíluslap gyors létrehozása
Link stílusának megváltoztatása
Linkek létrehozása és stílussal való ellátása
Háttérkép a CSS-ben
Háttérkép létrehozása, stíluslapok formázásával

A Dreamweaver oktatóvideók 3.része: Táblázatok
Táblázat készítése
Táblázat létrehozása a stíluslapok figyelembe vételével
Táblázatban táblázat
Táblázatba újabb táblázat, és képek beszúrása
Táblázat létrehozása CSS-el
Táblázat létrehozása CSS stílus segítségével
Tábla másolása új dokumentumba
Táblázat képekkel, háttérrel való másolása

A Dreamweaver oktatóvideók 4.része: Template
Template elkészítése
Template készítésének alapjai (sok hasonló oldal létrehozásának egyszerű verziója)
Template lényege
A sablon változtatásának előnyei, hátrányai
Template képek szerkesztése
Template-n belüli képek változtatása (melyek elvileg nem változtathatóak)
Templateben lévő képek eltüntetése
Eltüntethető képek (régiók) létrehozása
Ismétlési régió a templateben
Régiók létrehozása szerkeszthető felsorolással, templatén belül
Kezdőoldal kialakítása
A templatéból új oldalak létrehozása

A Dreamweaver oktatóvideók 5.része: Egyéb átalakítások
Transzparenskép alkalmazása
Méretigazítás nélkül, táblázatrészek létrehozása (transzparensképek alkalmazása)
Javítás a templaten
Javítás a templatéban
Föld lap elkészítése
Sablonból adott html elkészítése (A Föld a mi otthonunk)

A Dreamweaver oktatóvideók 6.része: Fotóalbum, galéria a weblapon
Fotóalbum készítése
Az előző html-hez galéria ablak készítése Fireworks-al
Galéria készítése CSS-el
A galéria elkészítése Div Tag, CSS stb. felhasználásával

A Dreamweaver oktatóvideók 7.része: Kapcsolattartás létrehozása
Kapcsolattartás, a form-lap
Kapcsolattartó oldal létrehozása az index.html-hez, form segítségével
Form ellenőrzése
Email cím ellenőrzésének megvalósítása

A Dreamweaver oktatóvideók 8.része: Szöveg formázása
Lista átrendezése
Linkek rendezése az index.html oldalon és az összes templatén
Szöveg tulajdonságainak módosítása
Szöveges rész tulajdonságainak megváltoztatása (Föld.html-en), különálló paragrafusok létrehozása, egymásba épülő Tag-ek használata
Szöveg igazítása
A szövegrészek igazításának lehetőségei (stíluslappal, html kóddal, paragrafussal)
A CSS stílusoknál fontos konklúzió
Táblázaton belüli új paragrafusokra vonatkozó szabályok áttekintése
Fejléc plusz szöveg alakításainak első lépése
Egy szöveges állomány fejlécének beállítása
Fejléc és szöveg alaprendezése
A fejléc és a szöveg balra igazítása, új osztály definiálásával
Fejléc keretezése
Fejlécek osztályokkal történő formázása, keretezése
Kapitális kiskapitális, kisbetűs fejlécek
A főcímek (1,2,3) átalakítása különböző betűtipusúvá
Szavak közti hely
Szavak közti helyek beállítása
Betűk közti hely
Betűtávolság meghatározása
Másfeles sorköz
Sortávolság beállítása
Bekezdések beljebbvitele
Bekezdések létrehozása
Iniciálé
Iniciálék létrehozása (díszes kezdőbetű)
Listajelek saját képeinkre cserélése első módszer
Az alaplista jeleinek a sajátomra történő megváltoztatása
Listajelek saját képeinkre cserélése második módszer
A listajelek ul taggal, li taggal történő megváltoztatása
Listaelőnyök
Az ul kép és li szöveg különálló kezelése lista esetén
Menü mint egy vízszintes lista
Linkek vízszintes listakénti létrehozása (CSS stílussal)

A Dreamweaver oktatóvideók 9.része: Táblázat kicsit keményebben
Táblázat készítése CSS-el
Táblázat létrehozása Css stílussal (a bolygók összehasonlításáról)
Alapbeállítások egy táblázatra
A táblázat méretének, kereteinek létrehozása
Táblázat elhelyezése a lapomon belül
Egy kitöltött táblázat rendezése, elhelyezése a margóhoz viszonyítva
Táblázat elrendezése és háttere
A táblázatban levő elemek rendezése, igazítása, háttérszínek létrehozása

A Dreamweaver oktatóvideók 10.része: Hasznos apróságok
A bolygók oldalainak felépítése
A Föld.html-ből kiindulva elkészítjük az összes többi bolygó oldalt is
A Földleírás html javítása
Elkészítjük az összes bolygóoldalhoz tartozó Leírás hivatkozást is
Bolygók leírásainak létrehozása
A megmaradt bolygók (Jupiter, Mars stb.) leírásainak elkészítése templatével
Linkek beállítása
A linkek elkészítése, módosítása

A Dreamweaver oktatóvideók 11.része: Form elemek
Szöveg kiemelése
Form elemek elkészítésének lehetőségei
Szöveg adása az állapotsorhoz
Az állapotsor szövegének módosítása
Görgetősáv színének változtatása
A görgetősáv szerkesztése (színének változtatása kódnézeti módban)

A Dreamweaver oktatóvideók 12.része: Képekből álló websablon elkészítése
Egy képekből álló weblapsablon elkészítése
Képek segítségével honlap készítése
A gördítősáv beállítása
Linkek és csuszka létrehozása CSS segítségével
Képekből álló weblap létrehozása fireworksal
Honlaphoz történő képszerkesztés Fireworksel

A Dreamweaver oktatóvideók 13.része: Képekből és táblázatokból álló profibb honlap elkészítése
Képekből és táblázatokból álló profibb weblap
Modern honlap készítése táblázatok és képek segítségével
Weblap tartalommal feltöltése
Az előző honlapba történő táblázatok beillesztése, rendezése, kezelése
weblap befejezése
Utolsó lépések a kész táblázat felé

A Dreamweaver oktatóvideók 14.része: Framekkel, div-tagakkel, layerekkel elkészíthető profibb weblapok
Framek és képek
Gyors weblapkészítés framek és képek segítségével
Rétegek plusz táblázat
Honlap létrehozása Div Tag-ekkel
Layerek által létrejött weblap
Layerekkel előállított honlap
Layerek befejezése
A színek, csuszka stb. beállításai

A Dreamweaver oktatóvideók 15.része: Egy mai modern weblap létrehozása
Div taggal a5ponthu
Profi honlapkészítés, a fejléc létrehozása (A5.HU alapján)
a5ponthu lábléce
A lábrész kialakítása
a5 linkek beállítása
A linkek kialakítása CSS stílussal
a5 közepének változtatásai
A főrész megformálása, táblázatok segítségével
a5 befejezése
A fejléc, középső rész, alsó rész egymáshoz igazítása
a5 közepe div tagekkel
Az előző műveletek létrehozása Div Tag-gel

Kosárba: Kosárba <-többször kattints, ha több darab kell belőle!

A megjelenített termék képek illusztrációként szerepelnek és eltérhetnek a valóságtól!

Kosárba: Kosárba <-többször kattints, ha több darab kell belőle!

A megjelenített termék képek illusztrációként szerepelnek és eltérhetnek a valóságtól!