##HTML

Hypertext Markup Language, e njohur shkurtimisht si HTML, është një sistem i standardizuar për të etikuar tekste nëpër uebfaqe me qëllimin e caktimit të fonteve, ngjyrave, linqeve, etj. Ky definicion është një sqarim i rëndë për tu kuptuar. HTML është diçka shumë e thjeshtë për tu përdorur, prandaj do mundohemi që edhe sqarimin ta bëjmë të lehtë për tu kuptuar. HTML është një mënyrë shum e lehtë për të krijuar një uebfaqe të thjeshtë dhe statike. HTML në asnjë mënyrë NUK duhet shikuar si një gjuhë programore.

###Telekomanda e TV-së

Një shembull për funksionalitetin e HTML-së mund të jepet nëpërmjet telekomandës së televizorit. HTML mund të shihet si shkronjat, fjalët, numrat e paraqitur tek telekomanda. Ato fjalë nuk kanë asnjë funksion, nuk kryejnë asnjë veprim direkt në televizor, por thjeshtë na ndihmojn neve që ta kuptojm se cili buton çfarë veprimi luan. Edhe HTML përdoret për t’ja sqaruar shfletuesit (anglisht: browser) se cilat fjali duhet të shfaqen si “titull”, cilat fjali i përkasin një “paragrafi” të caktuar, cilat fjalë duhet të shkruhen me të “zezë” (anglisht: bold), etj. Shfletuesit e Internetit si psh Google Chrome, Opera, Mozilla Firefox, etj, e marrin këtë sqarim dhe e interpretojnë si një faqe të cilën do ta lexojnë vizitorët e ndryshëm.

Gjuhët programore siç janë PHP, Java, Javascript, etj, përdorin logjikë të cilën shfletuesit e analizojnë dhe e paraqesin rezultatin. Nëse vazhdojmë me shembullin e telekomandës, atëher duhet të themi se gjuhët programore caktojnë funksionet e butonave. Përderisa HTML sqaron se buttoni ON do të “ndez” televizorin, gjuha programore e ka detyrën që ta kryej tërësisht procedurën e ndezjes së televizorit, duke filluar me dhënien e kontaktit deri tek televizori.

###Disa elemente të HTML-së

Për tu njohur më mirë me vlerën e HTML-së do të cekim disa elemente që përdoren më së shumti. Më poshtë do të merremi me strukturën e tërësishme të HTML-së. Në foton e 3-të djathtas mund të shohim një shembull tipik të përdorimit të HTML-së. Në fillim është përdorur elementi <p> që tregon fillimin e paragrafit, prandaj edhe shkronja “p” është shkurtesë për “paragraf” (anglisht: paragraph). Pastaj kemi fjalinë, ose fjalitë që do të qëndrojnë brenda paragrafit. Në fund duhet të mbyllet elementi i përdorur, në rastin tonë duhet </p>. Por, ajo që do e shohin përdoruesit do jetë vetëm fjalia “Ky është një paragraf“. Pjesën <p> dhe </p> nuk do e shohim, por ajo do përdoret nga shfletuesi për ta kuptuar se kjo fjali është pjesë e një paragrafi të veçantë.

Në foton e 4-të mund të shohim një krahasim direkt të asaj që e sheh shfletuesi në krahasim me atë që e shohim ne si përdorues. Përveç elementit <p> kemi edhe disa elemente tjerë si psh <h1> (anglisht: heading) që përdoret për të paraqitur fjali të theksuara më tepër se fjalitë e tjera. Gjithashtu kemi <h3> që është një formë tjetër për të theksuar një fjali, por theksimi bëhet më i dobët duke e rritur numrin, si psh <h1>, <h2>, <h3>, <h4>, <h5>, <h6>. Për të përdorur linqe që do na lidhin me video, foto, postime, ose ueb faqe tjera, duhet të përdorim elementin <a href></a>. Pas barazimit “href=…” e caktojmë se ku do lidhemi, ndërsa fjala ndërmjet <a href> dhe </a> tregon se cila fjalë do ta paraqesë këtë lidhje. Në shembullin tonë, nëse klikojmë në fjalën Lucky Media atëherë do të lidhemi me uebfaqen e tyre.

Ky është një paragraf

Fjali e theksuar

Me pak e theksuar

Lucky Media

Këtë e shohim ne si përdorues

##HTML5

Por, e gjitha që sqaruam deri tani ka të bëjë me HTML-në në tërësi. Verzioni më i ri i HTML-së quhet HTML5 dhe ka sjellur me vete plot risi që po revolucionizojnë programimin në ueb. Disa nga këto risi kanë të bëjnë direkt me shfletuesit e ueb-it, por ajo që po trondit të gjithë është në fushën e telefonave smart (anglisht: smartphone). Më poshtë do të sqarojm disa funksionalitete të HTML5:

#####Audio dhe Video Tani nuk është e nevojshme që të instalojmë plugin-sa për të dëgjuar muzikë apo për të shiquar inçizime të ndryshme. HTML5 e ka zgjidhur këtë problem duke krijuar elemente të cilët ndihmojnë në përdorimin e Audio/Video fajllave. Ajo që nevojitet është vetëm përdorimi i elementit <video> …. </video> ose <audio> … </audio>.

#####Scalable Vector Graphics (SVG) Me këtë element kemi mundësi të vizatojmë grafikë me kualitet të lartë. Për të vizatuar një rreth është tepër e thjeshtë, si psh <svg> <circle cx=”50″ cy=”50″ r=”40″ /> </svg>. Në këtë shembull fillojmë dhe mbarojmë me elementin <svg>…</svg>, ndërsa në brendi kemi elementin <circle> (shqip: rreth) ku i caktojmë koordinatat e pozicionimit të rrethit, dhe madhësisë së tij.

#####Plotësimi i formulareve Ne kemi parë shumë formularë të ndryshëm ku duhet të plotësojmë “Emrin, Mbiemrin, Adresën, Numrin…”. Për të kontrolluar nëse përdoruesi ka plotsuar të gjitha informatat e nevojshme, ne duhej të përdornim një gjuhë programore (siç është Javascript). Tani, me elementet e reja të HTML5 ne mund ta kontrollojmë edhe më lehtë. Për të kërkuar që patjetër të shënohet emri i përdoruesit mjafton që të vendoset fjala “required” në fund të elementit, si psh. “Emri: <input type=“text” name=“emriPërdoruesit” required>“.

#####Canvas Ky element gjithashtu zgjidhën shumë probleme për programuesit. Ne mund të krijojm lojra, animacione, diagrame me ndihmën e këtij elementi. Ajo që vlen të theksohet është se për krijimin e atyre që i përmendëm ne duhet të përdorim edhe Javascript si gjuhë programore që do të ndihmojë këtë element. Për të filluar përdorimin e këtij elementi ne duhet të përdorim <canvas id=“myCanvas” width=“200” height=“100”></canvas>. Elementi <canvas>…</canvas> nevojitet për të filluar dhe mbyllur përdorimin e elementit, ndërsa tipari “id” përdoret për të identifikuar elementin, përderisa “width” dhe “height” përdoren për të caktuar gjërësinë dhe lartësinë e elementit.

#####Smartphone Ajo ku HTML5 mund të përdoret më së miri është në botën e telefonave smart. Me elementet e reja ne kemi qasje drejt shumë pjesëve të telefonit siç është kamera, galeria, dosjet e ndryshme, gjeolokacioni, etj.

##Hello World

Si sinonim për fjalën “Hello World” e cila përdoret si titull për shembullin më të lehtë të mundshëm do të përdorim fjalën “Përshëndetje mëmëdheu”. Arsyeja për përdorimin e kësaj fjale është sepse tingllon më bukur në gjuhën shqipe, në krahasim me përkthimin direkt “Përshëndetje botë”. Ky shembull mund të realizohet nëse jeni në llaptop ose kompjuter. Hapat që duhet të ndiqni janë këto:

1. Sigurohuni se ndodheni në desktop
2. Klikoni miun (anglisht: mouse) në anën e djathtë
3. Pastaj zgjidhni New – > Text Document
4. Hapeni dokumentin
5. Shkruani fjalët "Hello World" ose "Përshëndetje mëmëdheu"
6. Tani ruajeni dokumentin duke zgjedhur File - > Save As
7. Emri mund të jetë sipas dëshirës, por në fund të emrit duhet të fshihet fjala “.txt” dhe të shënohet “.html“, psh “pershendetje.html“
8. Klikoni “Save” dhe hapeni dokumentin.
9. Ajo që duhet të shihni është e dhënë në foton e mëposhtme: