Mutassa be a lokális és a WEB-es multimédia fejlődésének állomásait! Ismertesse a HTML, nyelv főbb jellemzőit! Hogyan készítene el egy HTML alapú honlapot,

Az előadások a következő témára: "Mutassa be a lokális és a WEB-es multimédia fejlődésének állomásait! Ismertesse a HTML, nyelv főbb jellemzőit! Hogyan készítene el egy HTML alapú honlapot,"— Előadás másolata:

1 Mutassa be a lokális és a WEB-es multimédia fejlődésének állomásait! Ismertesse a HTML, nyelv főbb jellemzőit! Hogyan készítene el egy HTML alapú honlapot, amely egy képet, egy címer és három hiperlinket tartalmaz! A kép és a cím legyen középre igazított! Írja le az adott algoritmust! Mutassa be az ön által megismert egyéb WEB-lap szerkesztő rendszereket! 10 tétel Készítette: Somogyi Márton (H3P5LL) E-mail: marci_somogyi@freemail.humarci_somogyi@freemail.hu

2 Tartalomjegyzék A lokális és WEB-es multimédia fejlődésének állomásai A HTML nyelv főbb jellemzői Egy HTML dokumentum elkészítése és algoritmusa, amely középre igazított képet és címet és három hiperlinket tartalmaz Az adott feladat algoritmusa Dreamweaver 8. WEB-lap szerkesztő főbb tulajdonságai Felhasznált irodalom

3 A lokális és WEB-es multimédia fejlődésének állomásai

4 Súgó Első dia Előző dia Kezdő dia Súgó Utoljára megtekintett dia Következő dia Utolsó dia Odaugrik a kiválasztott tartalomhoz

5 A számítógép: Olyan elektronikus berendezés, amely képes adatok fogadására, tárolására, az adatok egy csoportja (program utasításai) által meghatározott módon az adatok egy másik csoportjának feldolgozására (műveletek), illetve az eredmény kivitelére. A vezérlés alapadatai (program utasításai) és a szükséges egyéb adatok működés közben a számítógép belső tárában vannak, azaz belső vezérelt. A multimédia: A multimédia olyan technológia amely a számítógéppel segített kommunikációt, interakciót összetett médiarendszerrel valósítja meg (auditív, vizuális). Számítógépes szoftver által vezérelt független információk együttese, melyek legalább egy időfüggő és egy időfüggetlen médiumból állnak. (Ralf Steinmetz, 1995)

6 A számítógépek és műholdak ( 1957 október 4. – Oroszország fellövi az első műholdat –Szputnyik) megjelenése egy új korszakot indított el a fejlődés és a kommunikáció terén egyaránt. Az első számítógépek kezdetben csak egy érzékszervre voltak képesek hatni, amely később a fejlődéseknek köszönhetően kibővült. A személyi számítógépek fejlődésének főbb állomásai: 1976. APPLE I. – az első PC Steven Jobs, Steve Wozniak készítette el az első, személyes használatra szánt számítógépet. 1977 – Commodore háziszámítógép 1978 – Atari háziszámítógép 1978 – INTEL 8086, INTEL 8088 processzorok megjelenése, az első IBM PC-hez 1981 – az első IBM PC: INTEL 8088 processzor, MS-DOS operációs rendszer

7 A multimédiás anyagok elterjedéséhez hozzájárult a technikai fejlődés is. Megjelentek a lejátszásához szükséges feltételek a személyi számítógépekben is. A hangkártyák elterjedésével a Floppy lemezeket leváltó CD lemezes adatbevitel lehetővé tette elterjedését. CD-ROM (Compact Disc Read Only Memory) kb. az 1980-as évek végén piacra dobott univerzális adathordozó, illetve médialemez. Csak olvasható (véglegesített) adathordozó. Két technológiával készülhet:Gyári préselt lemez: Általában nagy sorozatban készült lemezek (pl. műsoros audió CD). Az adathordozó rétegbe sablonnal préselik a jeleket. Otthon készített: Számítógépes, illetve asztali CD- vagy DVD-íróval készül. Az adathordozó rétegbe lézerrel égetik a jeleket. Kapacitása:Az első lemezek esetében 650 MB adat, illetve 74 perc zenei anyag tárolására volt elegendő. Mostanában pedig 700 MB adat és 80 perc muzsika tárolására elég a mai lemezek kapacitása. (Léteznek még 90 és 99 perces CD-k is, de ezeket a CD-írók és -olvasók nagy része fel sem ismeri.)

8 CD-ROM-olvasó Adattárolási elve: Mindenemű adat, amelyet CD-n rögzítenek, digitálisan lesz tárolva típusától függetlenül. A digitális adattárolás alapegysége a bit melynek értéke 0 vagy 1 lehet. A DVD-technológia megjelenése óta a CD-ket már nem fejlesztik tovább.

9 Az internet kialakulásával, már az országok közötti multimédia áramlás is lehetővé vált. Főbb állomások az internet létrejöttének történelmében: 1960-as évek Hagyományos kapcsolatteremtő eszközök 1969 ARPANet Advenced Research Project Agency USA Védelmi Hivatala (Pentagon) Telefonkapcsolat, 4 gép Levelezés, párbeszéd 1971 – ARPANET (15 nagyszámítógép) 1972 – Kialakul a gerinchálózat (37 gép) Európában elõször,1993 február utolsó napjaiban valósult meg két lokális számítógéphálózat közötti multimédia (kép, hang, adat) információátvitel mûhold közbeiktatásával, a KFKI Részecske- és Magfizikai Kutatóintézet és a grazi Mûszaki Egyetem hálózata között. Az adatátvitelt a Deutsche Post Telekom biztosította az Európai Ûrügynökség Olympus mûholdjának segítségével. A sikeres kísérletre a COST (európai együttmûködés a tudományos és mûszaki kutatás területén) program keretében került sor.

10 A COST-nak ma 23 európai ország a tagja, Magyarországot 1991 õszén vették fel teljes jogú tagként az 1971-ben létrehozott szervezetbe. A COST lehetõséget ad a különbözõ országokban futó, hasonló problémával foglalkozó kutatások kölcsönösen elõnyös öszehangolására, a kutatásért felelõs kormányzati szervezetek munkájának a koordinálására. Az internet elterjedésével a lokális hálózatok fejlődése is szükségessé vált. Hagyományos és megnövelt teljesítőképességű lokális hálózatok Ethernet: 10Base5 ez régi busztechnológia, 1 szegmens hossza maximálisan 500m lehet. A kábelezést vastag merev koax kábellel oldják meg, megadják, hogy mekkora lehet a maximális hajlítási sugár. A szegmensek végén a kábelvégeket hullámimpedanciájú lezárásokkal zárják le, a reflexiók elkerülése végett. 10Base2, vékonyabb átmérőjű kábelt használnak, mint

11 50W 50W ábra. Kábellezárás 10Base5 esetén, a csatlakozásokat BNC csatlakozókkal valósítják meg. Egy szegmens hossza maximálisan 200m lehet. Token Ring: Főbb tulajdonságai: pont-pont közötti kapcsolatok fizikailag gyűrű interfészek ütközés nincs digitális adatátvitel (nem kell ütközésérzékelés, így nincs analóg művelet) vezérjel, egy speciális keret (Token) Átviteli közege: árnyékolt csavart érpár (Shilded Twisted Pair - STP)

12 Adatsebessége: szabvány 1 vagy 4Mbit/s IBM-nél (4) vagy 16Mbit/s Adat adás folyamata: a vezérjel megszerzése – vezérjel felismerése – kivonása a gyűrűből adás (maximális kerethossz nincs, csak a THT szabja meg az idejét) vezérjel továbbadása Token Ring (vezérjeles gyűrű)

13 Nagysebességű lokális hálózatok: FDDI = üvegszálas elosztott adatinterfész (ami nem teljesen igaz, mert működik réz érpárakon, a menedzsment lehet centralizált is és nem csupán adatot, hanem hangot és képet is átvihet) Az interfész tervezésénél a cél az volt, hogy az akkor használatos LAN-oknál egy nagyságrenddel erősebb szabványt hozzanak létre. 10Mbit/s helyett 100Mbit/s és <10km helyett 100km- es hatótávolság. Topológiája alapvetően kettős gyűrű fa szerkezetekkel kiegészítve (58. ábra). Főbb paraméterek: max. 200km lehet az üvegszál =) max. 100km üveg kábel (összesen) max. 1000 darab MAC entitás =) max. 500 Dual Attachment állomás

14 Ismertesse a HTML nyelv főbb jellemzőit! A HTML nyelv: Az Internet publikálás és alkalmazásfejlesztés nyelve. A HTML összes lehetőségét felhasználva jól szerkesztett weboldalakat hozhatunk létre. A HTML ( Hypertext Markup Language, 1989 ) az SMGL (Standard Generalized Markup Language, 1986) nyelvből ered. Eredetileg szövegalapú dokumentumok kezelésére fejlesztették ki. Idők folyamán multimédiás tartalommal dinamikusan fejlődött tovább.

15 A HTML alap tag-eket használ: A HTML dokumentum egy olyan szövegfájlt, amely tartalmaz ún. „HTML tag”-ket – formázóutasításokat. Ezeket az utasításokat a böngészőprogram értelmezi és végrehajtja. A HTML dokumentum elemekből áll, minden elemnek van nyitó és záró tag-je, amelyek szöveget fognak közre. A megjegyzéseket amik csak a programban láthatóak a következő jel közé kell tenni: A HTML tag egy kisebb jel „ ” azonosításból áll. Pl.: Nyitó tag: záró tag: Megjegyzés: A HTML tag-nél nem különböztetjük meg a kis- és nagybetűket!

16 A HTML dokumentum szerkezeti felépítése: Keretes szerkezetű minden egyes HTML dokumentum a nyitó és a záró rész között tevődik össze. Egy HTML dokumentum három szerkezeti egységre bontható: 1.Első rész arról ad információt, hogy a dokumentumunk a HTML nyelv melyik verziójában íródott: Pl: 2.Második rész a fejléc elem: ….. Amely olyan információkat tartalmaz, amelyek az egész dokumentumra vonatkoznak. A és fejléc tag-ek között helyezzük el a: ….. Melynek tartalma a böngésző címsorában jelenik meg. Pl.: Füzesabony Város

17 3.A harmadik rész a dokumentum törzse a –test elem. Pl.: Ide kerül az a tartalom amit meg szeretnénk jeleníteni a böngészőben. Példa néhány tag-ra: - a betűre vonatkozó tulajdonságokat állíthatunk be vele paragrafus ( bekezdés) létrehozása, a zárótag használata nem kötelező sortörés –enter a címszintet jelöli, x =1-6 vonalakat tudunk vele létrehozni Szövegek, image-ek igazítása: szöveg, image

18 Egy HTML dokumentum elkészítése és algoritmusa, amely középre igazított képet és címet és három hiperlinket tartalmaz! Megnyitom a HTML szerkesztő programot.(Pl.: MS. Front Page, Dreamwever), majd létrehozok egy munkamappát amibe a képeket, szövegeket, és maga a kész HTML dokumentumok menteni fogom. A szerkesztő programban a code (kód) vagy a design( grafikus) is nézetben dolgozhatok. Code nézetben a fentiekben ismertetett módon kell eljárnom, a grafikus (design) nézetben mintegy szövegszerkesztőként használhatom a HTML szerkesztőt. Képre kattintva kinagyítható

19 Code nézet

20 Az adott feladat algoritmusa <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> A feladat megoldása align=„center”>cím Eszterházy Károly Főiskola Füzesabony Város Önkormányzata Füzesabonyi VTS Kht.

21 Design nézet

22 Dreamweaver 8. WEB-lap szerkesztő főbb tulajdonságai Cross-browser kód: A Dremweaver automatikusan ellenőrzi a HTML és CSS tag-ek kompatibilitását a felhasználó által megjelölt böngészők esetében, biztosítja az azonos kinézetet. Bővített CSS támogatás: A CSS ala-pú oldalelrendezések és szövegformázá-sok szerkesztését új, könnyen használha-tó paletták segítik. A Tag inspector palet-tán érhető el az új CSS Rule Inspector. Dream Templates: Sablonokat készíthetünk a több azonos keretre (navigáció, fejléc,..) épülő oldalak gyors és könnyű módosítása érdekében. Továbbfejlesztett sablon funkciók. CSS Code Hints: gyorsabb a CSS kód gépelése, felkínálja a rendelkezésre álló stílusokat Code nézetben. Beépített kép editálás: kisebb módosításokat immár Dreamweaveren belül is elvégezhetünk a beágyazott képeken. (crop, brightness-contrast, sharpen). Secure FTP támogatás: biztonságosabb kódolt adatátvitel és kapcsolat a szerverrel.

23 Excel és Word támogatás: Microsoft Excel-ből és Word-ből copy- paste művelettel helyezhető át a tartalom a táblázatok, színek, stílus és ékezetek megőrzésével (Unicode támogatás) Legújabb technológiák: ColdFusion MX 6.1 tag-ek, ASP.NET 1.1, XML namespace támogatás, ASP.NET form objektumok, PHP server behaviors. Aktualizált referenciák: HTML, CSS, JavaScript, PHP és SQL referenciák. Javított és új kódszerkesztés funkciók. Továbbfejlesztett 'find and replace' Enhanced Table Editing: még könnyebb a táblázatok szerkesztése és módosítása, kijelzi a táblázat és a cellák szélességét Unicode support: a 2004-es termék-vonal teljeskörű Unicode támogatással bővült, a Dreamweaver sem kivétel. Vége az ékezetes karakter gondoknak. Siteless File Editing: Dreamweaver site definiálása nélkül is dolgozhatunk távoli ftp szerveren lévő oldalakon.

24 Felhasznált irodalom Számítógépes hálózatok- Győr, SZE Villamosmérnöki szak órajegyzet Multimédia az oktatásban –Eger, EKTF Dr. Forgó Sándor www.macromedia.hu HTML nyelv alapjai- Győr, SZE Villamosmérnöki szak órajegyzet Informatikai alapismeretek 2005 Eger, EKTF Bóta László