Mentori:inxh. i dipl. Florina Mullafetahu

Kandidati:Dengiz Edreneli

Maj 2005,Prizren

LNDA: SISTEMET OPERATIVETEMA:HTML

PRMBAJTJA

1HYRJE N HTMLN lidhje me HTML, Sqarim ------------------------------------------------------------------------------- 1

ETIKETAT THEMELORE4

FORMATI I WEB FAQES2

Tiparet (Attributes) -------------------------------------------------------------------------------------------- 3

Etiketa Center, Bold, Italic, Underline; Ndarjet e Rreshtave (Line Breaks) -------------------- 4Etiketa Paragraph, Blockquote, Horizontal Rule ----------------------------------------------------- 5

FONTET (TEKSTI)6

GRAFIK9

Font Face (Stili i Fontit), Font Size (Madhsia e Fontit) -------------------------------------------- 6Font Color (Ngjyra e Fontit) -------------------------------------------------------------------------------- 7

Etiketa Image -------------------------------------------------------------------------------------------------- 9Madhsia e Fotografis (Image Size), Renditja e Fotografis (Image Alignment) ----------10Radhitja e Fotove s bashku me Tekstin -------------------------------------------------------------- 11Prmbledhje -------------------------------------------------------------------------------------------------- 13 Indeks ---------------------------------------------------------------------------------------------------------- 14

HTML sht shkurtesa e fjals Hyper Text Markup Language.sht nj gjuh programuese e cila prmban komanda (urdhra) pr ndrtimin e nj dokumenti hypertekst, i cili mund t prmbaj t dhna n formate t ndryshme, si: tekste, figura, muzik dhe video klipe.Duke e prdorur gjuhn programuese HTML mund t krijohen web faqe t ndryshme, varsisht nga dshira juaj. N gjuhn programuese HTML prdoren edhe teknologji t tjera t cilat luajn rolin e ndihmsit. Kto lehtsojn punn n dizajnimin e faqes. Shkruhen si nnprograme dhe pastaj thirren sa her q ka nevoj t prdoren. Kto teknologji jan: Java, JavaScript, CSS (Cascading Style Sheets), CGI (Common Gateway Interface), VBScript (Visual Basic Script), por mund t ket edhe teknologji t tjera. N lidhje me HTMLT gjitha etiketat (komandat) jan t mbyllura me kllapat < >, t cilat mundsojn q komanda e shkruar t mos shihet kur faqja sht n pun. Browser-i juaj i rrjetit e lexon komandn e shkruar dhe e prkthen at n gjuhn e kompjuterit prderisa kllapat jan t mbyllura.

Etiketa e fillimit (hapjes) sht ajo e cila gjeneron nj urdhr (komand) pr leximin e browser-it. Pr shembull, i gjith teksti q vijon duhet t duket i trash (bold), prderisa etiketa e mbarimit (mbylljes) sht e shkruar brenda n kodim. Etiketa e mbarimit prbhet me shtimin e shenjs / n etiket.Etiketat e HTML-s nuk jan gjra t ndijshme. Ashtu q sht krejtsisht i njejt sikurse . Megjithse pr shkak t ndryshimeve q mund t ndodhen m von sht e preferushme q t prdoren shkronjat e formatit t vogl. Por mbani n mend, emrat e figurave dhe url-t e web faqeve jan t ndijshme. Kshtu q kur prmbahen kto n ndonj etiket t HTML-s duhet t jeni t sigurt se ato jan t shkruara saktsisht ashtu si duken n shiritin e adresave.

Sqarim

T gjitha dokumentet e web faqeve e kan shtesn .html ose .htm!Nse krijoni nj dokument n HTML editorin tuaj, patjetr ai dokument duhet t ruhet me shtesat e lartprmendura!

1

T gjitha dokumentet e HTML-s (web faqet) duhet t prdorin kt format themelor si baz, n t ciln do t mbshtetet faqja. Ky format sht i prkryer me katr pal t etiketave, t cilt jan:

dhe dhe dhe dhe

Etiketa e HTML-s tregon browserit tuaj se faqja sht nj dokument HTML. Etiketa duhet t jet patjetr etiketa e par n dokumentin tuaj HTML. Dhe etiketa sht etiketa e fundit n dokumentin HTML.

Etiketat prmbajn etiketat e titullit t faqes, etiketat META t cilt jan makina t krkimit, q prdoren pr t hartuar treguesin e faqes suaj, ndonj etiket baz t HTML-s, dhe disa kode t javascript-it. Sa pr tani nuk duhet t koncentroheni n etiketat META, etiketat baz t HTML-s, dhe kodet e javascript-it, sepse kto do t diskutohen m von.Ju mund t ndrtoni web faqe edhe pa kto etiketa, dhe t shtoni ato m von kur ju bheni t rahatshm me gjuhn programuese HTML.Etiketat jan t vendosura ndrmjet etiketave , dhe prfshijn titullin e faqes ashtu si duket n shiritin e gjendjes (status bar), n ann e majt n kndin e lart t ekranit.Ky titull nuk shfaqet n web faqen tuaj. Ky titull do t jet prshkrues i faqes suaj, por jo m tepr se 64 simbole me gjatsi.Etiketat jan aty ku ju vendosni tr prmbajtjen (tekstet, fotografit, dhe lidhjet) q ju dshironi t shihen n faqen tuaj. Etiketa body e fillimit sht poashtu vendi ku ju mund t cilsoni ngjyrn e sfondit (background), ngjyrn e tekstit, lidhjeve (link) dhe ngjyrn e lidhjeve t vizituara (vlink).M posht do t shihni se si ato duhet t jen t rregulluar. Aty prfshihen nj pal e etiketave META n pjesn e etikets head, dhe vetit themelore prbrenda etikets body t fillimit.Ju mund t kopjoni dhe t ngjitni (copy & paste) kto kode n tekst editorin tuaj n momentin kur ndiheni t gatshm t filloni dizajnimin e web faqes suaj.

Titulli i Faqes Suaj Ktu

Tiparet (Attributes):Shum etiketa t fillimit t HTML-s lejojn t shtohen tiparet. Kto tipare n aspekte tjera e kan kuptimin e formatizimit t web faqes suaj. Tani t prdorim etiketat body nga kodi i msiprm, pr t shpjeguar kto tipare.

Kto faqe prmbajn shum nga etiketat q ju do t prdorni n krijimin e web faqes suaj. Shtimi i do etikete pr paraqitje, do t'ju tregoj juve se si kombinohen etiketa t ndryshme dhe tiparet pr efekte t tjera.Etiketa Center:Etiketa prdoret pr t vendosur tekstet, fotografit, dhe tabelat (ose ndonj kombinim i tyre) n qendr t web faqes suaj. Etiketa center krkon nj etiket pr mbarim (mbyllje) pra, .

Shembull i etikets center

Etiketa Bold:Etiketa shndron tekstin n nj pamje m t trash. Kjo etiket poashtu krkon nj etiket pr mbarim, .

Teksti i trash n qendr

Etiketa Italics:Etiketa shkakton q teksti t duket i pjerrt, dhe krkon etiket pr mbyllje, .

Teksti i trash dhe i pjerrt n qendr

Etiketa Underline:Etiketa e nnvizon tekstin, dhe krkon nj etiket pr mbyllje, .

Teksti i trash, i pjerrt dhe i nnvizuar n qendr

Vrejtje: Mbani n mend se etiketat jan t mbyllura me renditje nga etiketat e fillimit.Ndarjet e Rreshtave (Line Breaks):HTML nuk njef, nuk pranon ndarjet e rreshtave ose t kryereshtave ashtu si bjn procesort e fjalve t kompjuterit ose ashtu si bjn programet e e-mail'ave. Ju keni futur urdhra t HTML-s pr kto funksione. -sht dashur t shpjegohet njra q sht prbrenda, n kodin e mparshm, sepse ai ishte duke u zgjatur pr t treguar efektin e paraqitjes n qendr t faqes.-Etiketa t ciln e prdora sht etiketa . Kjo etiket do t filloj nj rresht t ri, dhe nuk krkon etiket pr mbyllje. Shikoni shembullin:

Teksti i trash, i pjerrt dhe i nnvizuar n qendr

ETIKETAT THEMELORE

4

5Etiketa Paragraph:Etiketa kaprcen nj rresht dhe fillon nj kryeresht t ri, poashtu edhe n kt etiket nuk ka nevoj pr mbyllje. Renditja e paplotsuar (default alignment) pr kt etiket sht n t majt. Por, me shtimin e tipareve n vijim, align="right" ose align="center", n etiket ju mund t ndroni radhitjen e paplotsuar.

Shembulli i align="right"

Etiketa Blockquote:Etiketa prdoret pr dhmbzimin e nj pjese t tekstit, dhe krkon nj etiket pr mbyllje, q sht .

Etiketa Horizontal Rule:Etiketa do t formon nj vij me hije sikurse ai i mparshm, dhe nuk krkon etiket pr mbyllje.

Ju mund t rregulloni gjrsin, madhsin, renditjen, dhe ngjyrn me an t karakteristikave t mposhtme. Width (gjersia) sht i specializuar m tepr pr pixela (me numr) ose me prqindje (%) t gjrsis s ekranit. Shikoni n shembujt e mposhtm.

Size sht i caktuar dendsisht n numrin e pixelave.

Align, n rastin kur nuk jan t plotsuar karakteristikat sht n qendr, por me shtimin e karakteristikave n vijim align="right" ose align="left" kjo mund t ndrohet.

Noshade, me shtimin e saj vija do t bhet i errt.

Teksti i prdorur n web faqen tuaj kontrollohet nga etiketa e fonteve, dhe krkon nj etiket pr mbyllje . T tre karakteristikat e fonteve jan:face="emri i fontit"size="numri"color="emri i ngjyrs ose numri heksadecimal"

Ne do t diskutojm etiketn e lartprmendur dhe shkurt tiparet e saj. Por s pari disa gjra t mbajm n mend..!Sikurse teksti (stili dhe ngjyra e fontit) q duket tek ndonjri, mbshtetet plotsisht n kompjuterin dhe browserin q e prdorin. Fonti i paprcaktuar (default font) n kompjutera sht Times New Roman, dhe ngjyra e paprcaktuar sht ngjyra e zez. Kshtu q nse ju prpunoni fontin dhe personi q viziton faqen tuaj nuk e ka at font n kompjuterin e vet...ka sypozoni! Faqja juaj do t duket me tekstin e paraqitur n font t paprcaktuar (default font). E njejta vlen edhe pr ngjyrn e fontit. T gjitha ngjyrat nuk duken njejt nga gjith browser-t. Pra, m mir sht t prdoret njra nga ngjyrat e sigurta, q ato t duken njejt nga t gjith browser-t.

Font Face (Stili i Fontit)Ky rresht paraqet fontin,ngjyrn dhe madhsin e paprcaktuar.

Mir, ktu sht struktura e etikets font.

Teksti juaj

Ju mund t ndrroni tekstin e web faqes suaj duke ndrruar njrn ose t gjitha nga kto karakteristika. Ju poashtu mund t shtoni fonte alternative (t ndryshme) n atributin face duke veuar emrin e fontit me nj presje. Ktu sht nj shembull:Teksti juaj

Tani browser-i do t paraqet fontin e par t ngarkuar n at kompjuter.Font Size (Madhsia e Fontit) Ekzistojn shtat madhsi t fonteve, dhe ato jan t caktuar me prdorimin e ndonj numri nga 1 deri 7. Font size="numri" n rastin kur numri i madhsis s fontit nuk sht i prcaktuar, sht 3. Ktu jan shembujt e t shtat madhsive:font size="1" font size="2"font size="3" (madhsia e paprcaktuar-default size)font size="4"font size="5

Ky rresht paraqet fontin face="Verdana", madhsin, size="2" dhe ngjyrn, color="blue.

Ky rresht paraqet fontin face="Helvetica" madhsin size=4" dhe ngjyrn color="red"., , ,

FONTET (TEKSTI)

6

font size="6"font size="7Ju poashtu mund t cilsoni nj madhsi relative t fontit. Kjo sht e bazuar n prdorimin e shenjs s nj minusi (-) apo t nj plusi (+) dhe nj numr fardo (prej 1 deri 7) t madhsis s paprcaktuar. Ktu jan shembujt: font size="-2"font size="-1"Default font size="3"font size="+2"font size="+3"font size="+4Font Color (Ngjyra e Fontit)Ngjyra e fontit mund t prcaktohet duke e prdorur emrin e ngjyrs ose kodin heksadecimal. Por, ktu browser-i i vjetr prap bie n loj..! T gjitha emrat e ngjyrave nuk jan t njohur nga t gjitha browsert, dhe kodet heksadecimale nuk shihen njejt nga t gjith browser-t. Ktu jan disa shembuj t emrave t ngjyrave dhe kodeve heksadecimale prkatse pr at emr t ngjyrs.

~

~

~

Black ~ #000000

Red #990033Green #008000

Blue #3333ff

N rregull..!

n .

Tani do t shohim se si etiketa e fontit (font tag) dhe karakteristikat e tij mund t kombinohen, dhe t prdoren veanrisht, pr t tekstin e web faqes suaj. Ne poashtu do t prdorim disa nga etiketat themelore nga faqja e mparshme.

t duket kshtu, por kjo sht mnyra pr t par efektet e do etikete dhe do karakteristike. Dhe tani n vazhdim do t shohim kodimin e HTML-s q sht prdorur pr t krijuar kt tekst.

Kjo pjes e tekstit q sht ndrmjet vijave sht i fiksuar pr t na treguar prdorimin e paprcaktimit pr stilin e fontit, Madhsin, dhe y Kshtu q, me shtimin e ktyre etiketave dhe karakteristikave t ndryshme ndryshimet do t jen

formatizuarJu me siguri nuk

dshironi q faqja juaj

r

m e shpejt dhe m e leht

gj n

krejtsisht t qarta, poashtu edhe t kqija.....!

7

Ktu sht kodimi q ne kemi prdorur pr t formuar paragrafin e mparshm.

N rregull..! Tani do t shohim se si etiketa e fontit (font tag) dhe karakteristikat e tij mund t kombinohen, dhe t prdoren veanrisht, pr t formatizuar tekstin e web faqes suaj. Ne poashtu do t prdorim disa nga etiketat themelore nga faqja e mparshme. Ju me siguri nuk dshironi q faqja juaj t duket kshtu, por kjo sht mnyra m e shpejt dhe m e leht pr t par efektet e do etikete dhe do karakteristike. Dhe tani n vazhdim do t shohim kodimin e HTML-s q sht prdorur pr t krijuar kt tekst. Kjo pjes e tekstit q sht ndrmjet vijave sht i fiksuar pr t na treguar prdorimin e paprcaktimit pr stilin e fontit, Madhsin, dhe ngjyrn. Kshtu q, me shtimin e ktyre etiketave dhe karakteristikave t ndryshme ndryshimet do t jen

krejtsisht t qarta, poashtu edhe t kqija.....!

8

GRAFIKFigurat grafike, me t vrtet mund t zmadhojn nj web sajt. Ekzistojn shum sajte q jan falas pr grafik ku ju mund t merrni figura pr sajtin tuaj, dhe disa q krkojn nj lidhje n sajtin e tyre. Ju mund t transferoni (upload) fotografit e juaja (me zgjatje .jpg), ose mund t krijoni fotografit e juaja me programe t ndryshme si p.sh.: PaintShop Pro, CorelDraw etj.Pr t prdorur nj fotografi n web sajtin tuaj ju duhet t transferoni at n udhzuesin e dosjeve n serverin e web sajtit tuaj. Shum prezentues t rrjetit (web hosts) siguron aftsin e transferimit t fotografive, apo ju mund t prdorni njrn nga shum ftp (File Transfer Protocol - Protokoli pr Transferimin e Dosjeve) programe q jan n dispozicion. Shfrytzuesit e WebTV duhet t transferojn dhe t ngarkojn (transload) fotografin n administratorin e dosjeve.Mos u lidhni drejtprdrejt tek fotografit n ndonj sajt tjetr..! Kjo mund t krijoj nj shirit t gjr t problemeve pr pronarin e atij sajti, dhe nse fotografia sht e lvizur ose e larguar nga vendi ajo m aspak m shum nuk do t shihet n web faqen tuaj.Vrejtje: Emrat e dosjeve t fotografive jan t ndijshme. Kjo do t thot se ju duhet t prdorni url-n dhe emrin e dosjes me saktsi q ajo t duket n web faqen tuaj.Etiketa Image:Ekzistojn shum tipare q mund t prdoren me etiketn image, por ktu sht nj etiket themelore e fotografis. Duket kshtu:

Etiketa image nuk krkon etiket pr mbyllje. Ktu sht analiza e etikets dhe tiparet e mparshme.

1.. img tregon browserit se ai sht duke e lexuar nj etiket pr fotografi (image tag).2.. src="" tregon browserit se ku t krkon fotografin. Kjo sht vendi ku url-ja

(Uniform Resource Locator) sht vendosur.3.. width="??" dhe height="??" pdoret pr t treguar browserit madhsin e

fotografis n pixela. Simbolet ? mund t zvendsohen me ndonj numr q tregon madhsin e fotografis n pixela. Kto tipare jan shum t rndsishm n ndihmesn e ngarkimit t shpejt t web faqes suaj. Browseri nuk duhet t pret derisa ai e gjen fotografin pr t par se sa e madhe sht ajo. Ai lexon tiparet, ruan hapsirn e shprndar n faqe, dhe vazhdon leximin e pjess tjetr t kodimit tuaj t html-s. Kto tipare poashtu mund t prdoren pr rindryshimin e fotografis n faqen tuaj. Do t diskutojm dhe do t japim shembuj m von pr kt.

4.. alt="emri ose prshkrimi i fotografis" - kjo karakteristik nuk sht i nevojshm pr fotografin t duket n faqe. Por sht ide e mir t bhet i zakonshm q t prmbahet edhe kjo n t gjitha etiketat pr shkaqet n vazhdim.Disa njerz e shfrytzojn internetin me browser-t q jan vetm pr tekst, ose grafikt e prishur, pr shfrytzimin m t shpejt. Karakteristika alt u tregon atyre se ekziston nj fotografi, dhe ka sht ajo. Nse ju prdorni nj fotografi si lidhje n nj faqe tjetr ju mund t prdorni atributin alt q vizitori ta ket nj prshkrim t shkurtr t faqes.

9

Madhsia e Fotografis (Image Size):

Kjo fotografi sht 264 pixela n gjrsi dhe 266 n gjatsi, dhe tiparet n etiket duken sikur n vijim...pra, width="264" height="266. Ktu sht nj fotografi me atributet width="" dhe height="" t cilt jan t ndruar n 427 dhe 431 pixela.

Ju mund t ndroni atributet width="" dhe height="" n fardo numri q ju dshironi. Por nse ju nuk e mbani t proporcionuar me madhsin origjinale fotografia do t bhet e shtrembruar.

width="216 height="325 width="847 height="276

Renditja e Fotografis (Image Alignment):Kur ju vendosni nj fotografi n web faqen tuaj renditja e paprcaktuar sht n t majt. Ju mund t ndroni vendin me prdorimin e etiketave pr t vendosur at n qendr t faqes, apo me shtimin e atributit align="" n vet etiketn e fotografis.

Kjo fotografi tregon paprcaktimin e renditjes n t majt. Ktu sht etiketa e fotos e prdorur pr t vendosur at n faqe,

10

Fotoja e vendosur n qendr t faqes

Ktu sht kodimi i HTML-s:

Fotoja e drejtuar n t djatht

Ktu sht nj trik i shkurtr..! Vendosni dy etiketa t fotove

s bashku prdoren atributet align="left" dhe align="right" t prcjellur nga teksti juaj. Ju do t fitoni efektin e treguar, "teksti shfaqet n mes t fotove".

Nse dshironi ende hapsir n mes t fotos dhe tekstit mund t shtoni atributet hspace dhe vspace n etiketn e fotografis,

Numri i prdorur sht hapsira n pixela n mes t fotografis dhe tekstit.

hspace = horizontal space (hapsira horizontale)vspace = vertical space (hapsira vertikale)

12

Megjithse ekziston shum pr HTML-n se sa q sht prmbajtur n kto faqe. HTML-ja e prfshir ktu sht shum i prshtatshm sa pr fillim. N t vrtet, ju mund t mos merrni parasysh faqet dhe t gjitha ato t cilat ju nevojiten q t filloni nj web faqe themelore.HTML sht verzioni teknologjik i "Simon Says". Ju po i jepni browserit nj komand, dhe po i tregoni atij se si t funsionon ajo komand. Dhe poashtu po i tregoni se kur t mbyllet.Meq sht leht t msohet, HTML mund t jet shum i pafalshm. Njejt edhe atyre q kan qen n te pr krejtsisht pak koh. Shum probleme vijn nga gjra t vogla t cilat jan t haruara apo t vendosura gabimisht. Pr shembull, mungesa e nj simboli (") apo

INDEKS

14

BBody -------------------------------- 2Bold --------------------------------- 4Br ------------------------------------ 4Blockquote ------------------------ 5

CCenter ------------------------------ 4

FFont --------------------------------- 6

HHead ------------------------------- 2Html -------------------------------- 2Hspace ---------------------------12Hr ----------------------------------- 5Height ---------------------------- 10

IItalics ------------------------------- 4Img --------------------------------- 9

NNoshade -------------------------- 5

PP ------------------------------------ 5

SSize -------------------------------- 5

TTitle -------------------------------- 2

UUnderline ------------------------- 4

VVspace ---------------------------12

AAlign -------------------------------- 5Alt ----------------------------------- 9

WWidth ----------------------------- 10

Literatura u morr nga: WebTutor v4.1

AUTORI: Professional Web Design - Joe Barta WEB FAQJA: http://junior.apk.net/~jbarta/ EMAIL: jbarta@apk.net

Page 1Page 2Page 3Page 4Page 5Page 6Page 7Page 8Page 9Page 10Page 11Page 12Page 13Page 14Page 15Page 16Page 17