HTML5 Hap Pas Hapi: Fillimi i programimit

Autor: Skender Mustafi

Ju mund të e shfrytëzoni softuerin Notepad që gjendet në secilin version të Windows-it, por unë u sugjeroj të instaloni softuerin falas Notepad++ i cili jep pamje më të mirë të punës që do të bëjmë në vazhdim.

Pra, nëse keni vendosur të provoni Notepad++, kaloni tek faqja e zhvilluesve të programit http://notepad-plus-plus.org/ dhe shkarkoni nga nyja “download”. Tani që po shkruaj këtë artikull është në dispozicioni versioni 6.3.3 i këtij softuer e që mund të e shkarkoni këtu: http://notepad-plus-plus.org/download/v6.3.3.html.

Pasi të keni instaluar softuerin gjeni në desktop ikonën për të hapur atë.

Fillimisht para se të vazhdojmë më tej le të fillojmë me një ambient të organizuar pune. Hapeni një dosje (anglisht: folder) pune kudo që e shihni të arsyeshme në kompjuterin tuaj. Gjatë gjithë kohës do të hidhni skedat (anglish: files) në këtë dosje. Emëroni këtë dosje me emrin HTML5 Hap Pas Hapi.

Tani hapeni softuerin dhe do tu paraqitet në ekran një pamje sikur në figurën majtas. Kjo është fusha në të cilën do të veproni në vazhdim.

Tek vija e parë shkruani <DOCTYPE! HTML>.

Vini Re: DOCTYPE! është etiketë e ndjeshme ndaj shkronjave kështu që gjithmonë duhet shkruar me të mëdha, pra DOCTYPE.

Kjo ishte vija e parë e juaja e programimit në HTML5. Tani ruani këtë që keni programuar në dosjen që sapo hapëm për këto mësime. Emëroni këtë skedë si index.htm ose index.html. Pasi të keni ruajtur skedën kaloni tek dosja dhe klikoni dy herë mbi index.html. Kjo skedë do tu hapet tek shfletuesi i juaj i preferuar (IE, Firefox, Chrome etj).

Ajo që tani shihni në këtë faqe është gjithçka e zbrazët. Kjo vije si rezultat i asaj që etiketa <DOCTYPE! HTML> është etiketë e cila në të vërtetë nuk ka asnjë rol tjetër veç “realizimit të një marrëveshjeje” me shfletuesin duke i bërë me dije se në vazhdim ka të bëj me kod i cili u mbështetet rregullave të HTML5. Këtë etiketë mund të e lini edhe pa shkruar, por që shfletuesi nuk do e trajtoj kodin në mënyrë specifike siç e trajton HTML5.
Në vijat në vazhdim shroani kodin në vijim:
<DOCTYPE! HTML>

<html> <head> <title>HTML5 Hap Pas Hapi</title> </head>

<body> Mirë se vini tek faqja ime. </body> </html>

Këtë e paraqisni në mënyrë shumë më të organizuar në Notepad++ duke futur në brendi pjesët përbërëse të një tërësie siç mund të shihni në figurën më poshtë.

<html>është etiketë dy-anëshe e cila mbyllet me </html> e që nënkupton që në brendi përmban html kod.

<head> dhe <body> që janë gjithashtu etiketa dy-anësore, janë pjesët kryesore të një faqeje të programuar në html. Këto dy kode hapin fushat tek të cilat mund të thirren dhe programohen të gjitha pjesët e një faqeje, qofshin ato të brendshme apo të jashtme.

Një element i tillë i kokës së faqes është dhe etiketa <title> </title> e cila i shton një titull faqes i cili paraqitet tek fleta e shfletuesit. Paraqitja e këtij titulli bëhet varësisht nga shfletuesi. Chrome, për shembull e shfaq në kokë të fletës, siç mund të shihni në figurën në vijim. Këtë rezultat do të duhej të e kishit fituar dhe ju në faqen tuaj pas shkrimit të kodit të mësipërm.

Ajo që duhet të keni parasyshë është se nëse dëshironi që faqen tuaj të e vendosni në server ku mund të e shohin të gjith, atëherë dosja kryesore në vete duhet të përmbaj një skedë me emrin index.htm, index.html ose default.html. Këtu fjala është vetëm për html përndryshe ekzistojnë dhe formate tjera të cilat fillimisht kërkohen nga serveri.