Download presentation
Presentation is loading. Please wait.
1
Perdorimi i Multimedias ne Web
Leksion 6
2
Imazhet dhe Multimedia ne Web
Aftesia per te perfshire imazhet dhe forma te tjera te multimedias ka ndihmuar ne rritjen e popullaritetit te Web-it. Skedaret e imazheve dhe te multimedias jane shume me te medhenj se skedaret HTML dhe kerkojne me teper kohe per t’u download-uar ne browser. Perpara se te shtohen imazhe dhe skedare te tjere te multimedias ne nje website, duhet te dini cila eshte audienca e sitit dhe se si e aksesojne ata internetin. Per shembull, nje site qe aksesohet nga perdorues te pajisjeve wireless, si psh telefona celulare, nuk duhet te permbajne shume skedare grafike per arsye te shpejtesise se ulet te lidhjes dhe hapesires se vogel te pamjes ne ekran.
3
Elementi <img> Elementi <img> ne HTML perdoret per te shtuar imazhe ne dokumentet HTML Elementi <img> eshte nje tag bosh. Dy atribute qe kerkohen te perdoren jane: src – Percakton pathin e skedarit te imazhit – ky path mund te jete absolut ose relativ. alt – Percakton nje tekst qe do te shfaqet ne vend te imazhit, nese browseri nuk mund t’i shfaqe imazhet. <img src="myimage.gif" alt="Alternate text for my image" />
4
Krijimi i linqeve me imazhe
Per te perdorur elementin <img> si nje link: Vendoseni tagun <img> brenda nje tagu <a> <a href=”newpage.html”> <img src=”myimage.gif” alt=”Click on this image” /> </a> Web browser-at vendosin vete nje kornize blu rreth imazhit per ta identifikuar ate si nje objekt te klikueshem. Per ta hequr kete kornize blu, mund te perdorni elementin <style>: <style type="text/css"> img { border: none; } </style>
5
Shembull <html> <head>
<title>Sample Image as a Link</title> </head> <body> <p> This Web page contains a linked image file: </p> <a href="newpage.html"> <img src="rose.bmp" alt="Click here" width="96" height="96"/> </a> <p>Isn't this fun?</p> </body> </html>
6
Shembull – Web Browser
7
Puna me Multimedian Bandwidth (gjeresia e kanalit) eshte nje mase e sasise se te dhenave qe mund te dergohen permes nje kanali komunikimi ne çdo sekonde. Gjeresia e kanalit duhet te merret ne konsiderate kur punojme me multimedia ne nje Web site. Multimedia mund te shtohet ne nje faqe Web ne dy menyra te ndryshme: Media e jashtme (External media) eshte nje file audio ose video qe mund te aksesohet nepermjet nje linku. Kjo menyre eshte e pershtatshme per nje gjeresi kanali te vogel Media e brendeshme (Inline media) vendoset brenda nje faqeje Web si nje objekt i ngulitur (embedded object)
8
Puna me Multimedian Inline media External media
9
Lidhja me nje klip Audio
Shtimi i linqeve per klipe audio
10
Ngulitja (embedding) i nje klipi Audio
Nje objekt i ngulitur (embedded object) eshte nje klip media, skedar, program, ose objekt tjeter qe mund te ekzekutohet ose te shihet nga brenda nje faqeje web. Browserat kane nevoje per plug-in-et e pershtatshem ne menyre qe te ekzekutojne objektet e ngulitura.
11
Ngulitja e nje klipi Audio
Per te ngulitur nje klip audio ose video, perdorni elementin embed: <embed src=“url” width=“value” height=“value” autostart=“type” /> Ku url eshte vendndodhja e objektit, atributet width dhe height percaktojne gjeresine dhe gjatesine e objektit ne pixel, dhe type eshte ose true (per te filluar te luhet nje klip automatikisht kur ngarkohet faqja) ose false (per te filluar klipin manualisht).
12
Lidhja me nje klip Video
Ndiqet e njejta procedure si ajo per t’u lidhur me nje klip audio. Kujdes: Duhet te perfshini informacion rreth madhesise se secilit skedar video, ne menyre qe perdoruesit te mund te vendosin nese duan ta marrin klipin apo jo.
13
Ngulitja e nje klipi Video
Perdorni te njejtin element embed siç e perdoret per te ngulitur nje klip audio. Ketu duhet te percaktoni nje burim per nje klip video me ane te atributit src dhe permasat e klipit me atributet height dhe width
14
Mos-Suportimi i elementeve te ngulitur
Nese deshironi te suportoni browsera me te vjeter mund te perdorni elementin noembed Ky element siguron nje menyre per te suportuar browsera te vjeter qe nuk njohin elementet e ngulitur.
15
Mos-Suportimi i elementeve te ngulitur
Per te siguruar nje permbajtje tjeter ne vend te objekteve te ngulitur, per browserat qe nuk i suportojne ato, perdorni kodin: <embed attributes /> <noembed> alternate content </noembed> ku alternate content eshte permbajtja qe shfaqet nga browsera qe nuk i suportojne objektet e ngulitur.
16
Krijimi i nje Marquee (tende) me Internet Explorer
Per te krijuar nje kuti me tekst qe leviz, mund te perdorni elementin marquee <marquee attributes>content</marquee> Ku attributes eshte nje ose disa nga atributet e elementit marquee dhe content eshte permbajtja e faqes, teksti qe shfaqet ne kutine marquee.
17
Puna me elementin Object
Elementi object eshte elementi i pergjithshem per çdo objekt, permbajtja e te cilit ruhet ne nje skedar te veçuar nga faqja Web aktuale: Imazhe te brendshme Klipe audio Klipe video Aplete programi Dokumente te tjere HTML
18
HTML5: Video Deri tani, nuk ka pasur nje standart per shfaqjen e videove ne nje faqe web. Sot, shumica e videove shfaqen nepermjet nje plugin-i (si Flash). Megjithate, jo te gjithe browserat kane te njejtet plugine. HTML5 percakton nje menyre standarte per te perfshire videot, duke perdorur elementin video.
19
Aktualisht, ka 3 formate video qe suportohen per elementin video:
HTML5: Video Aktualisht, ka 3 formate video qe suportohen per elementin video:
20
HTML5: Video <!DOCTYPE HTML> <html> <body>
<video src="movie.ogg" width="320" height="240" controls="controls"> Your browser does not support the video tag. </video> </body> </html>
21
HTML5: Video Shembulli perdor nje skedar Ogg, dhe do te punoje ne Firefox, Opera dhe Chrome. Per te bere qe video te punoje ne Safari dhe versione te ardheshme te Chrome, duhet te shtojme nje skedar MPEG4 dhe WebM. Elementi video lejon qe te vendosen disa skedare video te ndryshem si source, me ane te elementit source. Browseri do te perdore formatin e pare qe njeh:
22
HTML5: Video <video width="320" height="240" controls="controls"> <source src="movie.ogg" type="video/ogg" /> <source src="movie.mp4" type="video/mp4" /> <source src="movie.webm" type="video/webm" /> Your browser does not support the video tag. </video>
23
HTML5: Video
24
HTML5: Audio Deri tani, nuk ka pasur nje standart per te luajtur audio ne nje faqe web. Sot, shumica e audiove luhen nepermjet nje plugin-i (si Flash), ashtu si videot. HTML5 percakton nje menyre standarte per te perfshire audiot, duke perdorur elementin audio. Elementi audio mund te luaje skedare me tinguj, si muzika ose rrjedha te tjera audio.
25
Aktualisht, ka 3 formate qe suportohen per elementin audio:
HTML5: Audio Aktualisht, ka 3 formate qe suportohen per elementin audio:
26
HTML5: Audio <!DOCTYPE HTML> <html> <body>
<audio src="song.ogg" controls="controls"> Your browser does not support the audio element. </audio> </body> </html>
27
HTML5: Audio Shembulli perdor nje skedar Ogg, dhe do te punoje ne Firefox, Opera dhe Chrome. Per te bere qe audio te punoje ne Safari, duhet te shtojme nje skedar MP3 ose Wav. Elementi audio lejon qe te vendosen disa skedare audio te ndryshem si source, me ane te elementit source. Browseri do te perdore formatin e pare qe njeh.
28
HTML5: Audio <audio controls="controls">
<source src="song.ogg" type="audio/ogg" /> <source src="song.mp3" type="audio/mpeg" /> Your browser does not support the audio element. </audio>
29
HTML5: Audio
30
Keshilla te perdorimit te Multimedias
Kur shtoni multimedia, perdorni nje shumellojshmeri formatesh media, ne menyre qe te gjithe perdoruesit te mund te aksesojne formatet qe ata mund te perdorin. Vendosni madhesine e skedarit ne linqet per ne skedare te medhenj, ne menyre qe t’i njoftoni perdoruesit qe perdorin lidhje me gjeresi kanali te vogel.
31
Keshilla te perdorimit te Multimedias
Mos perdorni klipe multimedia ne faqet tuaja Web derisa te siguroheni qe perdoruesit do t’i aksesojne faqet permes nje lidhjeje me shpejtesi te larte. Mos shtoni klipe media derisa te siguroni nje metode qe perdoruesit te mund ta ndalojne luajtjen e klipeve, ose nese nje klip luhet automatikisht, duhet te luhet vetem nje here, ne menyre qe te mos bezdisen perdoruesit.
32
Keshilla te perdorimit te Multimedias
Eshte praktike e mire qe te specifikohen dy atributet height dhe width per nje imazh, audio ose video, sepse nese vendosen ato paraprakisht, hapesira qe kerkohet per nje imazh rezervohet kur ngarkohet faqja. Po te mos vendosen keto atribute, browser nuk do dije madhesine e imazhit (apo audios ose videos) dhe ne kete menyre do te ndryshoje layout i faqes gjate ngarkimi.
33
Pyetje???
Similar presentations
