20
Nagy Mózes Elméleti Líceum Kézdivásárhely Informatika szakvizsga dolgozat Kézdivásárhelyi fúvószenekar Felkészítő tanár: Készítette: Budai István Dundler Zsuzsánna, XII. C

HTML Szakvizsga

Embed Size (px)

Citation preview

Page 1: HTML Szakvizsga

Nagy Mózes Elméleti LíceumKézdivásárhely

Informatika szakvizsga dolgozat

Kézdivásárhelyi fúvószenekar

Felkészítő tanár: Készítette:Budai István Dundler Zsuzsánna,

XII. C

2008

Page 2: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

Tartalomjegyzék

Bevezetés...........................................................................................................................3

A HTML-ről...........................................................................................................3

A dolgozatról.........................................................................................................4

A zenekarról és a mazsorettekről...........................................................................4

Hardware- és software igény.................................................................................5

Telepítési és kezelési útmutató..........................................................................................6

Telepítés.................................................................................................................6

Kezelési útmutató...................................................................................................7

Site Map.............................................................................................................................9

A program bemutatása.......................................................................................................10

Könyvészet.........................................................................................................................16

2

Page 3: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

Bevezetés

A HTML-ről

A HTML a HyperText Markup Language (hiperszöveg leírónyelv) rövidítése. A HTML

egy olyan jelölő nyelv, amely leírja (leírókódnyelvnek is nevezik), miként kell a fájlt

(dokumentumot) megformázni. Tulajdonképpen egy ASCII-szövegfájl beágyazott

jelölőkódokkal. A hiperszöveg (hypertext) elnevezés arra utal, hogy egy szöveg egyes

elemeihez (pl. szavakhoz) további szöveget lehet rendelni. Egy ilyen szöveget olvasva

tehát egyes szavak, mondatrészek stb. kiemelve jelennek meg, amelyeket kiválasztva a

hozzájuk kapcsolt további szöveg megjelenik. Ebben a szövegben is el lehet helyezni ilyen

kapcsolatokat (hiperhivatkozások, linkek), amelyek további tetszőleges szövegre

mutathatnak, így szinte pókhálószerű információhálót lehet létrehozni. Természetesen a

HTML fájlokban nem csak szöveghez rendelhetünk hivatkozásokat, hanem pl. képekhez

is. Fájl helyett a továbbiakban általánosan használjuk az objektum elnevezést.

Egy alap HTML oldal elkészítése

Pl.:

<html>

<head>

<title>Ez egy alap html</title>

</head>

<body>

Ez az első oldalam!

</body>

</html>

3

Page 4: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

A dolgozatról

Dolgozatom a Kézdivásárhelyi Tanulók Klubja Fúvószenekar és Mazsorettcsoport életéről,

eredményeiről, hétköznapjairól szól. Mivel én is tagja vagyok a zenekarnak, illetve tagja

voltam a mazsorettcsoportnak is, így személyes kapcsolat fűz az intézményhez, illetve a

benne dolgozó személyekhez is. Ez a honlap az intézmény, illetve a fúvószenekar kérésére

készült, melyet használni, és frissitenni szeretnénk, hogy mindenki számára aktuális

informácót biztosíthassunk. Ez indokolja a téma választásomat is. Segíteni szeretném az

intézményt csekély hozzájárulásommal. Célom, hogy egy kezelhető, mindenki számára

könnyen érthető weboldalt készítsek, amely aktuális információkat nyújt a honlap

látogatóinak.

Ez az oldal információkat tartalmaz a zenekarról, a mazsorettcsoportról, illetve ezek

tagjairól, és vezetőiről. Bárki megtekintheti a tagok adatlapját, illetve fotóikat is, melyet az

ők hozzájárulásával tettem közzé. Az érdeklődő figyellemmel kisérheti az éppen aktális

fellépéseinket, elért eredményeinket, illetve repertoarunk tartalmát is.

A dolgozat nyelvezete egyszerű, remélhetőleg mindenki számára érthető, viszont a

hangszerleírasoknál némi alapismeretet igényel, a zeneműveltség terén. A zene illetve a

képanyag általunk készített, melyet évek során gyüjtögettünk össze, illetve készítettünk el.

A zenekarról és a mazsorettekről:

A kézdivásárhelyi Ifjúsági fúvószenekar 1993- ban alakult meg a Tanulók Klubja

szabadidoközpont keretében. Tagjai a város és környéke általános és középiskolás

gyerekei,valamint az innen elkerült egyetemisták és zeneszereto dolgozók, az idoközben

zenemuvészeti egyetemet végzett tanárok. A tagok száma 35 fo, átlagéletkoruk 20 év. A

zenekar tanára és karmestere Gyergyai Barna. A zenekar az idén ünnepli 15 éves

évfordulóját. Repertoarunkon minden műjfaj megtalálható:

magyar történelmi indulók magyar népdalfeldolgozások filmzene és könnyuzenei feldolgozások klasszikus zenei átiratok.

Felléptünk már külfőldön: Mezohegyesen, Mezokövesden, Lengyeltótiban és sok más

helyen is. Rendszeresen fellépünk a környező falvak városok rendezvényein.

4

Page 5: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

A kézdivásárhelyi Tanulók Klubja mazsorettcsoportja 2005-ben ünnepelte

megalakulásának 10. évfordulóját amelyen résztvettek testvérvárosaink Mezokövesd,

Mezohegyes és Paks fúvószenekarai és mazsorettcsoportjai, valamint Uzon, Barátos,

Kovászna fúvószenekarai és mazsorettcsoportjai. Az 5 korcsoportban 110 kis- és

nagyiskolás lány mazsorettezik, kisebb-nagyobb sikerrel. Repertoárjukban minden stílus

megtalálható. A haladó csoport rendszeresen fellép a zenekar kíséretében különbözo

kúltúrális és sportrendezvényeken, produkciójukkal színesebbé téve számtalan város- és

falunapot. Több alkalommal vendészerepeltek Magyarországon, Moldva Köztársaságaban,

2003-ban a "Zenit"-en (Békéscsaba) 2. helyezést értek el. 2007-ben Mezokövesden

elnyerték ,,Mezokövesd város különdija''-t.

Hardware- és software igény:

A program müködtetéséhez szükség van egy <HTML> nyelvezetet dekodoló programra

(browser), amilyen például, hogy csak a legismertebbet említsem, a Microsoft Internet

Explorer. Így tehát szükség van egy kötelező háttérkörnyezetre, amely a Microsoft

Windows. A szakvizsga tartalma CD-n található ezért szükséges CD-ROM. A program

megfelelő futásához az optimális képernyőfelbontás az 1800x1440-as pixel. Egyéb

problémák elkerülése érdekében érdemes szemelőtt tartani a következő hardware és

software igényeket, mivel ezek hiányossága megjelenési hibákat, vagy más egyéb

problémákat is okozhat.

Minimális hardware igény:

Cd egység, a telepítéshez

Hangszoró, a zene hallgatásához

Minimális software igény:

Internet Explorer

Windows Media Player

5

Page 6: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

Telepítési és kezelési útmutató

Telepítés:

Helyezzük be a Cd-t a Cdmeghajtóegységbe, majd duplán kattintsunk a munkaasztalon található MyComputer, vagy Explorer ikonra. A megnyílt ablakban keressük meg a meghajtóegység ikonját, majd duplán kattintva azt is nyissuk meg.

A CD a következő fájlokat tartalmazza:

telepito-cache

telepito.aip

telepito.msi

A CD-n található telepitő ikont(telepito.msi) nyissuk meg dupla kattintással. Megjelenik

egy ablak rövid üdvözlő szöveggel, innen a Next gomb segítségével jutunk el a következő

oldalhoz, ahol lehetőségünk nyílik kiválasztani a program telepítési útvonalát, a browse

gomb segítségével. A továbblépéshez ismét a Next gombra kell kattintanunk. Itt

kiválasztható, hogy Shortcut jelenjen meg a Desktop-on de mivel a HTML nyelvezetben

nincsen .exe file így a telepítés után nem jelenik meg semmi. Újabb Next gomb

kattintásával már fizikailag is megkezdődik a telepítés, a program által használt

állományok a cd-ről a gép merevlemezére kerülnek, a kiválasztott könyvtárba. Ezután

kerresse meg a index nevű HTML-t, majd dupla kattintással nyissa meg. Innen már

könnyen el lehet igazodni.

6

Page 7: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

Eltávolítás: a Control Panel-ben található Add/Remove Programs alkalmazás

segítségével történik. Kiválasztjuk a telepített programot majd a Change/Remove gombra

kattintva egyszerűen eltávolítjuk a softwaret.

Kezelési útmutató:

A főoldalon található egy a zenéhez kapcsolodó idézet, valmint pár csoportkép a

zenekarról illetve a mazsorettcsoportról, és Kézdivásárhely címere. A főoldal két menüt

tartalmaz, az első vízszintesen talalható, a második baloldalt függőlegesen helyezkedik el.

A vízszintes menüben, hívjuk egyszerüen főmenünek, találhatók a zenekarhoz,

mazsorettekhez kapcsolodó menüpontok. A Történelmünk menüpntra rálépve ujjabb két

menüpont gördül le: Bemutatkozunk illetve Eredményeink. Ebben a két menüpontban

találhat a kedves érdeklődő információkat, a zenekar illetve a mazsorettcsoport

megalakulásáról, vezetőjéről, valamint elért eredményeiről. A kovetkező menüpont a

Tagok. Itt találhatunk bővebb információt(kép, status, e-mail cím, telefon) a zenekar

valamint a mazsorettcsoport tagjairól. Ami érdekes a böngésző számára az az, hogy a

zenekar tagjai hangszercsoportok szerint fel van osztva. Itt a nevekre kattintva egy ujjabb

ablak jelenik meg, a személy adatlapja. A menüpontokon tovább lépkedve megtaláljuk a

Galéria című menüpontot, ahonnan négy ujabb manü gördül le. Mint a neve is mutattja, itt

találhatunk fotókat a zenekarról, mazsorettekről fellépések szerint felosztva. Megmutatjuk,

hogyan töltjük szabadidőnket, amikor éppen nem a zenéléssel foglalatoskodunk. A

Fellépések menüpontban megtalálhatjuk az aktuális fellépéseket, időpontjukat, illetve azt,

hogy még milyen más zenekarok lépnek fel. Tovább lépkdve megtalálhatjuk

repertoarunkat. Az Érdekességek menüpont alatt találjuk a hangszerleírásokat, ahol bővebb

információt nyerhetünk egyes hangszrekről. A Zenehallgatás menüpontban saját készítésű

hanganyagunkat hallgathassa meg az éredeklődő. Ehhez viszont szükséges a gépen lennie

egy Windows Media Player programra, amely nélkül nem lehetséges a zenehallgatás.

A bal oldali függőleges menüben találhatjuk meg az oldal Site Map-ét, az oldalhoz tartozó

bibliográfiát, valamint a rólam szóló kis bemutatkozó szoveget illetve képet. Ez mind a

Névjegy menüpont alatt található. A következő menüpontra továbblépve, Köszönet,

találhatjuk a köszönetnyilvánitást, ahol is köszönetet szeretnék mondani minenkinek aki

segítette munkámat, valamint a honlap létrejöttét.

7

Page 8: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

A honlaphoz tartozó Site Map

8

Page 9: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

A program bemutatása

Könnyünek tünhet a html nyelvezet mégis akdtak olyan helyzetek amikor nem láttam a

megoldást, sőt azt hittem, hogy itt a vég. De szerencsére sikerült megoldani őket, túllépni

ezeken és elkészülni saját készítésű honlapommal.

A főmenü és az almenü bármely gombjára kattintva az adott információ a vízszintes menü

allatt fog megjelenni, vagyis a főmenü ablakában. Amit a fuggoleges_menu.js-ben

állítottam be:

mainMenuItem("fuggoleges_menu_b3",".gif",30,111,loc+"koszone

t.html","vizszintesmenu","Köszönet",2,2,"fuggoleges_menu_pla

in");

Ez alól kivételt képeznek a galériában,a hangszerleírásokban található linkek amelyekre

rákattintva egy uj ablak jelenik meg, a fotóalbummal, valamint a hangszerleírásokkal.

A galériában több almenü is található. Így sikerült felosztani, elválasztani a különböző

fellépések képeit egymástól. Ezek a menüpontok a Külföld, Belföld, Jeles események, ahol

megtalálhatók azok a fényképek, amelyek különlegs jelentéssel birnak a számunkra. A

negyedik menüpont pedig a Sabadidőnkben, ahil is megmutatjuk, hogy hogyan töltjük

együtt szabadidőnket. Ezeknek a képeknek a beillesztése is táblázat segítségével

valósulhatott meg. A képek saját készítésüek.

9

Page 10: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

A zenehallgatásban talalható oldalt táblázat segítségével oldottam meg. Minden kép alatt

egy link található, amelyre rákattintva egy ujjabb ablak tartalma tárul a szemünk elé. Itt

található az éppen kiválasztott hangszer teljes leírása, képekkel tarkitva, hogy az olvasó

számára még érdekesebb, izgalmasabb böngészést kínaljon. A hangszerleírások

sokszínüek, több forrásanyagot felhaszálva készültek el. A táblázat létrehozására szolgáló

kód pedig így néz ki:

<table align=center boreder=0 cellspacing=4 cellpadding=5

width="20%">

A táblázat kitöltőszínét illetve a szegélyét tetszés szerint változtathatjuk, attól függően,

hogy mileyen az éppen megfelelő szín számunkra.

Jobbról láthatók a megfelelőhangszerek, balról pedig a hozzá tartozó zenei

kulcsok(violinkulcs, basszuskulcs), amelyek szintén képként vannak beillesztve a

táblázatba. Ahhoz hogy a táblázat esztétikus legyen, fel kell, hogy osszuk oszlopokra és

cellákra. Ezt a kövtkező kódokkal oldhatjuk meg:

<tr>

<td align="center">

10

Page 11: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

<img src="fuvola.jpg" width="50%" title="Fuvola">

</td>

<td align="center">

<img src="oboa.jpg" width="40%"title="Oboa">

</td>

<td align="center">

<img src="klarinet.jpg"width="50%" title="Klarinet">

</td>

</tr>

Ebben a kódrészletben a <tr>...</tr> közé zárjuk amit a sorba szánunk írni, illetve

<td>...</td> közé amit az éppen aktuális sorban az oszlopokba szeretnénk írni. Ahhoz,

hogy hiperlinket illesszünk be a következő kódra van szükségünk:

<a href="fuvola.html" target="blank">

<font color="black" size=4>

Fuvola

</a>

A font szóval megadhatjuk a szöveg színét(color) illetve a szöveg méretét is(size). Ha

valamit középre szeretnénék igazitani a táblázatban akkor az align=”center” kódot kell

alkalmznunk, ahogyan a táblázatban is minden egyes kép és szöveg van. Itt lehetőségünk

adódik arra is, hogy különböző stílusokat alkalmazzunk.

11

Page 12: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

A táblázat segítségével oldottam meg több helyen is a képek illetve szövegek beillesztését.

Mivel többnyire saját készítésű képeket használtam a honlap készítése során, így méretezni

kellett ezeket. Ezt a width parancsal oldottam meg, ahol százalékban megadva a

tetszőleges méretre igazíthattam a képet:

<img src="szaxofon.jpg" width="50%" title="Szaxofon">

Itt megadhatjuk, hogy a kurzort a képre emelve milyen söveg jelenjen meg, ezt a title

sócska biztosítja.

Ugyanezeket a módszereket alkalmaztam a galéria készítésekor is.

Amikor készítettem a zenehallgatás című menüpontot akkor szükségem volt a zeneszámok

beiilesztéséhez a következő kódokra:

</center>

<font size=4>

Willy Hautvast - Grease

<br></br>

<center>

12

Page 13: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

<embed src="grease.mp3" autostart=false width="350"

height="45" hidden="false" ></embed>

</center>

Itt felmerült az a probléma, hogy az oldal indításával indult az összes zeneszám. Ezt a

problémát az autostart=false paranccsal oldottam meg. Itt megtehetjuk, hogy rejtetté

tegyük a képen látható lejátszót, de ez nem lett volna praktikus.

A főoldalon található fejlécbe a következő kóddal sikerült beillesztenem:

<right>

<p align="right">

<font size=6 color="#ffffff">Kézdivásárhelyi Tanulók Klubja

Fúvószenekar és Mazsorettcsoport

</p>

</right>

</BIG>

</strong>

13

Page 14: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

</marquee>

<body background="zenekar1.jpg">

</body>

Ahhoz, hogy mindig ne kelljen back-el visszamenni a főoldalra, így betettem egy plusz

menüpontot melynek neve: Főoldal.

14

Page 15: HTML Szakvizsga

Szakvizsga dolgozat - követelmények

Könyvészet

-King Palmer Zenérõl mindenkinek Akadémia Kiadó, Budapest, 1995 -Brockhaus Riemann Zenei lexikon Zenemûkiadó, Budapest, 1983 -Jhon van der Meer Hangszerek Zenemûkiadó, Budapest, 1988 -Tarnóczy Tamás Zenei akusztika Zenemûkiadó, Budapest, 1982 -Darvas Gábor Évezredek hangszerei Zenemûkiadó, Budapest, 1975

Hivatkozások:

- www.nmg.ro - www.wikipedia.org

15