➢ ,izak;

• ,izak; vd;gJ cyfshtpa uPjpapYs;s ,ilj;njhlu;G gLj;jg;gl;l fzpdp

tiyaikg;Gfspd; Nrfupg;nghd;whFk;.
• ,izakhdJ tpahghuq;fs;> epWtdq;fs;> murhq;fk; kw;Wk; jdpahs; Nghd;wtu;fs;
njhlu;G nfhs;sf;$bag; gy;NtWtifapyhd trjpfis toq;FfpwJ.
• tiyg; gf;fq;fis ntspapl;L mtw;wpDlhf ,iltpid GuptJ> ,izaj;jpy;;
gadu;fs; njhlu;G nfhs;Sk; kpfTk; gpugykhd Kiwahff; fhzg;gLfpwJ.

➢ tiy NkNyhbfs; / ,iza cyhtpfs;

• tiyg; gf;fq;fisg; ghu;g;gjw;Fk; ,iltpid Guptjw;Fk; trjpaspf;fpd;w xU
nkd;nghUshFk;. cjhuzk;: Internet Explorer, Google Chrome, Mozilla Firefox, Apple Safari
Nghd;wit.
• tiy NkNyhbfspy; ,uz;L gpujhd nraw;ghLfs; fhzg;gLfpd;wd.
▪ tiyg; gf;fq;fis cUthf;Ftjw;Fg; gad;gLj;jg;gLk; kPthrfr; Rl;L nkhopapid
thrpj;J tpsq;fp> mjid tiyg; gf;fj;jpy; fhl;rpg;gLj;jf; $ba tbtj;jpw;F
khw;wpaikf;fpd;wJ.
▪ tiyg; gf;fq;fSf;F nry;yf;$ba trjpiag; gadu;fSf;F toq;FfpwJ.
• Nkw;Fwpg;gpl;l xt;nthU nkd;nghUSk; gy gjpg;Gfspy; tpUj;jp nra;ag;gl;Ls;sd.
Gjpa gjpg;Gfs;> kpf mz;kpj;j tiy trjpfisr; nraw;gLj;jf; $ba jd;ikfisf;
nfhz;bUf;fpd;wd.

➢ tiyg; gf;fk;:
• ,J tiyj; jsj;jpy; ,Uf;Fk; jdp kPthrfr; Rl;L nkhopf; Nfhg;nghd;whFk;.
• tiyj; jsj;jpy; mjw;Fj; jdpj;Jtkhd nganuhd;W ,Uf;Fk;.
• ,jpy; thrfk;> gbkq;;fs;> tiutpay;fs;> mirT+l;lq;fs;> xypfs;> fhnzhspfs; kw;Wk;
kP,izg;Gfs; Nghd;w gy;Y}lfq;fis cs;slq;fpapUf;Fk;.

➢ Kfg;Gg; gf;fk;
• ve;j xU tiyj; jsj;jpdJk; gpujhd gf;fk; Kfg;Gg; gf;fk; vdg;gLk;.
• tiyj; jsnkhd;wpw;Fg; gpuNtrpf;Fk; NghJ gadu; fhz;fpd;w KjyhtJ gf;fk;
,JthFk;.
• ,q;F nghJthf tiyj;jsj;ijg; gw;wpa jfty;fisAk; njhlu;Gila
,izg;GfisAk; nfhz;bUf;Fk;.

➢ ,izg;Gg; gf;fq;fs;:
• tiyg; gf;fj;jpy; rpy ,izg;Gfs; fhzg;gLk;. ,it ,Nj tiyj;jsj;jpy;; my;yJ
NtW tiyj;jsq;fspypUf;Fk; gf;fq;fisj; jpwg;gjw;Fg; gad;gLfpd;wd. ,g;gf;fq;fis
,izg;Gg; gf;fq;fs; vdg;gLk;.

➢ tiyj;jsk;:
• ,J Fwpj;j Ms;fsg; ngaupw;Ff; fPo; fhzg;gLfpd;w njhlu;Gila tiyg;gf;fq;fspd;
njhFg;;nghd;whFk;.
cjhuzk;: Njrpa fy;tp epWtfk;: www.nie.lk> fy;tp mikr;R: www.moe.gov.lk
$Fy; tiyj;jsk;: www.google.com
➢ tiyg; gf;fnkhd;wpd; fl;likg;Gj; njhFjpfs;
• tiyg; gf;fq;fs; gy;NtW $Wfisf; nfhz;bUf;fpd;wd.
• ,f;$Wfs; xt;nthd;Wk; gy;NtW topfspy; jftiyg; gupkhWtjw;Fg; gad;gLfpd;wd.
• nghJthd $Wfshtd:
▪ thrfk; : ,jpy; nrhw;fs;> vOj;Jf;fs;> ,yf;fq;fs;> Vida FwpaPLfs; vd;gd
mlq;fpapUf;Fk;.
▪ tiutpay;fs; : tiujy;fs;> ml;ltizfs;> tiuglq;fs;> Xtpaq;fs;> xspg;glq;fs;>
topr;nry;Yk; nghj;jhd;fs; Nghd;wit ,jpy; mlq;Fk.;
▪ xyp : ,J Neuiyahd my;yJ gjpT nra;j xypahf ,Uf;Fk;.
▪ fhnzhsp : ,J Neuiyahd my;yJ gjpT nra;j fhnzhspahf ,Uf;Fk.
▪ mirT+l;lq;fs; : thrfq;fs; my;yJ tiutpay; fspd; mirTfisf; Fwpf;fpd;wJ.
▪ kP,izg;Gfs; : ,it ,Nj tiyj;jsj;jpy;; NtnwhU gf;fj;jpid> mNj gf;fj;jpd;
NtnwhU gFjp my;yJ NtW tiyj;jsq;fs; Nghd;wtw;iwj;
njhlu;G gLj;Jtjw;Fg; gad;gLfpd;wd.

➢ cs;slf;fq;fspd; xOq;ikg;G:
• tiyg;gf;fnkhd;wpd; jstikg;G gy;NtW $Wfs; gFjpfs; vd;gtw;wpd; xOq;fikg;ig
jPu;khdpf;fpd;wJ.
• tiyg;gf;fnkhd;wpd; xOq;fikg;gpw;fhd rpy cjhuzq;fs;
▪ rl;lfq;fs; : rl;lfq;fs; tiyg;gf;fnkhd;iwg; gFjpfshfg; gpupj;J gy;NtW
gf;fq;fisAk; jsq;fisAk; mZf mDkjpf;fpd;wJ.
▪ gl;bay;fs; : ,it njhFjp tbtpyike;j fl;likg;G tiuaiuf; $Wfs;.
▪ ml;ltizfs; : ngupa mstpyhd juTfis nraw;wpwDs;s tifapy; epuy; kw;Wk;
epiufspy; toq;Ftjw;F HTML ml;ltizfs; gadu;fSf;F
mDkjpf;fpd;wd.

➢ tiyj;jsj; Njitg; gFg;gha;T

• tiyj;jsj; Njitg; gFg;gha;T vd;gJ tiyj;jsj;jpd; tzpf khjpupAld;
njhlu;Gilar; rthy;fisAk; re;ju;g;gq;fisAk; gFg;gha;T nra;tjw;F cjTfpd;w
Kiwtopnahd;whFk;.
• ,g;gzpapd; tUtpisthdJ gadu; Njitfisj; jpUg;jpg;gLj;jf;$ba tplaq;fisf;
nfhz;l MtzkhFk;.
• ,t;Mtzj;jpy; cs;slf;fg;gl Ntz;ba Kf;fpa $Wfshtd:
▪ tiyj;jsj;jpd; Nehf;fk;
▪ gadu; ,ilKf tbtikg;G
▪ gq;fspg;G kw;Wk; gjpthf;fy; Kiwtop
▪ gadu; tiuaiw fUtpfSk; gf;fq;fSk;
▪ ghJfhg;Gj; Njitfs;
▪ vjpu;fhy Nkk;ghLiffs;
▪ njhopDl;gj; njupTfs; fpilf;ff;$baik (c+k;: Java script, PHP, ASP etc)
kP thrf Rl;L nkhop (HTML)

➢ mwpKfk;:
• HTML gad;gLj;jp tiyj;jsj;ij cUthf;fyhk;.
• ikaj; njhopDl;gkhd HTML If; nfhz;Nl midj;J tiyj; jsq;fSk;
vOjg;gl;Ls;sd.

➢ HTML vd;gJ ahJ?

• HTML vd;gJ tiyg; gf;fq;fis tpgupg;gjw;fhd xU nkhopahFk;.
• HTML vd;gJ Hyper Text Markup Language vd;gjd; FWf;fkhFk;.
• ,J xU Rl;L nkhopahFk;. epuyhf;fy; nkhopnahd;wy;y.
• Rl;L nkhop vd;gJ Rl;L xl;Lfspd; njhFg;nghd;whFk;.
• ,J Mq;fpy vOj;J tbTzu;tw;wJ.

➢ xl;Lfs; vd;gJ ahJ?

• HTML xl;Lfshtd Nfhz milg;Gf; Fwpf;Fs; Fwpf;fg;gLfpd;w <html> Nghd;w Kf;fpa
gjq;fshFk;.
• xl;Lfs; ,Utifg;gLk;
• nfhs;fyd; $Wfs;: ,it Muk;g xl;ilAk; KbT xl;ilAk; nfhz;bUf;Fk;.
ck;: <HTML>… </HTML>
• ntw;Wf; $Wfs;: ,it Muk;g xl;il khj;jpuk; nfhz;bUf;Fk;. ck;: <BR>

➢ HTML njhFg;gp
• HTML Mtzq;fs; vd;gJ vspa thrf Mtzq;fshFk;. MfNt> ve;j xU Mtzj;
njhFg;gp nra;epuiyf; nfhz;Lk; HTML FwpKiwfis njhFj;J tiyg;gf;fnkhd;iw
cUthf;fyhk;. cjhuzk;: Notepad++, Notepad, PSPad
• mNjNghd;W> tiy tiuaiw FwpKiwr; #oy;fisAk; gad;gLj;jyhk;. cjhuzk;:
Brackets, Microsoft FrontPage, Microsoft DreamViewer
• %yf; FwpaPLfisr; Nrkpj;jy;
▪ HTML Nfhg;nghd;iwr; Nrkpf;Fk;NghJ mjd; “.htm” my;yJ “.html” ePlr ; pahfg;
ghtpf;fyhk;.
▪ Muk;g fhy nkd;nghUl;fs; ePlr ; pahf %d;W vOj;Jfis khj;jpuk; mDkjpj;jjhy;
me;j gof;fj;jpd; mbg;gilapy; ,d;Wk; “.htm” ,idg; gad;gLj;Jfpd;Nwhk;.
▪ mNefkhd re;ju;g;gq;fspy; “.html” vd;gijg; gad;gLj;JtJ kpfTk; ghJfhg;ghdjhf
mikAk;.
• tiyg; gf;fq;fs; mtw;wpd; cs;slf;fq;fisAk; jsmikg;igAk; nfhz;L gue;jstpy;
tpj;jpahrg;glyhk;. midj;J gf;fq;fSk; mbg;gilf; fl;likg;Gf;Fj; Njitahd rpy
HTML xl;Lfisf; nfhz;Ls;sd.

➢ HTML fl;likg;G

Name of HTML Component Meaning Example

msTr;Rl;b (Delimiters) Xl;Lfisr; #oTs;s <,>,/
tuk;Gf;Fwpf;Fs; cs;s jftiy xU
HTML $Whf thrpf;FkhW
mwptpf;fpd;wJ
Xl;Lfs; (Tags) jfty; vt;thW Kiwtopg; <html>
gLj;jg;gl my;yJ fhl;rpg;gLj;jg;gl .
Ntz;Lk; vDk; mwpTWj;jy;fis .
toq;Ffpd;w $Wfis Xl;Lfs; </html>
nfhz;Ls;sd

$Wfs; (Elements) HTML Mtzj;jpd; xU mbg;gil <HR> - ,e;j Xl;L

myF. $w;wpd; ngau; Xl;bd; fpilahd
ngaUf;Fs; nfhLf;fg;gl;Ls;sJ tiuNfhYf;fhd $iwf;
nfhz;Ls;sJ
gz;G (Attribute) HTML $W xd;wpd; tpNrl <IMG SRC="image.jpg">
,ay;nghd;iw tiuaWf;fpwJ ‘IMG’vDk; $W
‘SRC’vDk; gz;igf;
nfhz;Ls;sJ. ,J
cUtg;glf; Nfhg;gpd;
ngaiuf; Fwpf;fpd;wJ.
Nfhg;gpd; ngau;
“image.jpg” MFk;

➢ HTML Xl;Lfs;
• tiy NkNyhbfs; ,t;nthl;Lfisr; re;jpf;Fk;NghJ> ,t;nthl;Lr; NrhbfSf;F
,ilapy; fhzg;gLtJ tiyg; gf;fk; vd tiuaWj;Jf;nfhs;Sk;
• gioa tiy NkNyhbfSf;F HTML xl;Lfs; mtrpakhFk;. vdpDk;> Gjpa HTML
gjpg;Gfs; kw;Wk; Gjpa tiy NkNyhbg; gjpg;GfSf;F xl;Lfs; vy;yhr; re;ju;g;gq;fspYk;
Njitg;gl khl;lhJ> vdpDk; mtw;iwr; Nru;g;gJ rpwe;jjhFk;.

➢ jiyg;Gg; gFjp (<head> and </head>):

• ,t;nthl;L; tpguq;fisAk; mtrpakhd mZfy; jftiyAk; tiyg; gf;fj;jpw;Fr;
Nru;f;fpd;wJ.
• jiyg;Gg; gFjpapy; fhzg;gLk; jfty; tiyNkNyhbr; rhsuj;jpy; njd;glhJ.
• ,J jiyg;Gj; jfty; Nghd;wtw;iwf; nfhz;bUf;Fk;.

➢ cly;; gFjp (<body> and </body>):

• ckJ tiyg;gf;fj;ij cUthf;Fk; ge;jpfs;> gl;bay;fs;> ml;ltizfs;> cUtg;glq;fs;
Nghd;w tiyg;gf;fj;jpy; fhl;rpg;gLj;jg;gLk; cs;slf;fq;fis ,g;gFjpf; nfhz;bUf;Fk;.
cjhuzk;: HTML Nfhg;G xd;wpd; mbg;gilf; fl;likg;G

html>
<head>
……..
</head>
<body>
……..
……..
</body>
</html>

➢ Fwpg;Gfis Nru;j;jy;:
• HTML Mtznkhd;wpy; Fwpg;Gfis vOJtjw;Fg; gad;gLfpd;wJ. tiyNkNyhb
tiyg;gf;fj;ijf; fhl;rpg;gLj;Jk; NghJ mjpy; Fwpg;Gfs; njd;gLtjpy;iy.
cjhuzk;: <! --Enter the comments -->
➢ gpd;dzp tz;zk;;
• ‘bgcolor’ vd;w cly; xl;Lg; gz;G> Mtzj;jpd; gpd;dzp epwj;ijf; Fwpf;fpd;wJ.
cjhuzk;: :-<body bgcolor=”Red”>, my;yJ epwj;jpw;Fupa Fwpiag; ngWkhdkhff;
fhl;;lyhk;.

➢ HEAD $W:
• <TITLE>...</TITLE> : ,t;nthl;L Mtzj;jpd; jiyg;igf; Fwpg;gJld; ,J
tiyNkNyhbapd; Gj;jff;Fwpg;Gf; Nfhg;gpYk; Njhd;Wk;.

➢ BODY $Wfs;:
1. thrf tbtikg;G
$Wfs; ,J vd;d? vg;gbg; gad;gLj;JtJ?
jiyg;G xl;L MW jiyg;G xl;Lfs; cs;sd <h1> This is a heading </h1>
(<H1>,<H2>,<H3>,<H4>, <H5>,<H6>).
,e;j MW $WfSk; nfhs;fyd;
xl;Lfshifahy; ,tw;wpw;F %Lk;
xl;Lfs; mtrpakhFk;.
<h1> jiyg;ig kpfg;ngupa vOj;jpy;
fhl;rpg;gLj;Jk;;.
<h6> jiyg;ig kpfr;rpwpa vOj;jpy;
fhl;rpg;gLj;Jk;
ge;jp xl;L HTML Mtzq;fis ge;jpfshf <p> This is the tag for paragraph
tbtikf;fyhk;;. ge;jpfs; <p> xl;L %yk; </p>
Fwpf;fg;gLfpd;wd. <p align= “right”>National Institute
ge;jpfspd; fpil epiy kw;Wk; of Education, Magaragama</p>
Neu;gLj;jy;fis “align” gz;igf;
nfhz;L fl;Lg;gLj;jyhk;.
ge;jpfis left, right, center, or justify
Nghd;wthW Neu;g;gLj;j KbAk;.
tup KwpT kw;Wk; Gjpa ge;jpahf ,y;yhky; tup KwpT National Institute of Education
fpilf;NfhL xl;L my;yJ Gjpa tupapy; Muk;gpg;gjw;F <hr> National <br> of Education.
<br>
Xl;ilg; gad;gLj;jyhk;. fpilf; NfhL
xd;iw mikf;f
<hr> Xl;il gad;gLj;jyhk;
<br>,<hr> Mfpa ,U Xl;LfSk; ntw;W
HTML $WfshFk;. vdNt> ,tw;wpw;F
KbT xl;Lfs; gad;gLj;jg;gLtjpy;iy.
jbg;G xl;L jbg;G tbtpy; thrfq;fisf; fhl;l <b> <b> This is BOLD Area </b>
Bold Tag xl;L gad;gLj;jg;gLfpd;wJ.
thrfq;fspd; Muk;gj;jpy; <b> xl;Lk;
Kbtpy; </b> xl;Lk; gad;gLj;jg;gly;
Ntz;Lk;.
,J mNefkhf thrf tbtikg;gpw;Nf
gad;gLj;jg;gLfpwJ.
rha;T xl;L thrfq;fisr; rha;thd tbtpy; <i> This is Italic Area </
Italic Tag fhl;Ltjw;F <i> xl;L
gad;gLj;jg;gLfpwJ. thrfq;fspd;
Muk;gj;jpy; <i> xl;Lk; Kbtpy; </i>
xl;Lk; gad;gLj;jg;gly; Ntz;Lk;.
mbf;NfhL xl;L thrfq;fisf; fPo;Nfhbl;Lf; <u> This is underline</u>
Underline Tag fhl;lg;gad;gLj;Jk; <u>.. </u> vd;w
xl;Lk; Nkw;Fwpg;gpl;lthNw
gad;gLj;jg;gLfpwJ
vOj;JU xl;L ,e;j xl;L thrfq;fspd; vOj;JU <font face= “Arial”>This text font
Font Tag tbtk;> gUkd;> epwk; vd;gtw;iw
is ARIAL</font>
tbtikg;gjw;F gad;gLj;jg;gLfpwJ.
cjhuzk;: <font face= ‘Times New Roman’> <font size=5>This text font size is
vd;w xl;L Muk;gj;jpYk; </font> xl;L 5</font>
KbtpYk; gad;gLj;jg;gly; Ntz;Lk;.
<font color= “red”>This text font
1. thrfq;fspd; Njhw;wj;ij <font> color is red</font>
xl;ilAk; ‘FACE’ gz;igAk; gad;gLj;jp <font color=“green" size="3"
khw;wyhk;.
face="Times New
2. thrfq;fspd; gUkid ‘size’ vDk; Roman">National Institute of
gz;igg; gad;gLj;jp khw;wyhk;. 1 Kjy; Education</font>
7 tiuahd gUkd;fs; cs;sd. 1
vd;gJ kpfr;rpwpa msthFk;.

3. thrfq;fspd; epwj;ij <font> xl;bd;

‘color’ vDk; gz;igg; gad;gLj;jp
,ay;GepiyapYs;s fUik epwj;ij
NtW epwq;fSf;F khw;wyhk;.
xl;nlhd;wpd; gz;Gfs; gytw;iw
khw;wyhk;

2. gl;bay;fs;
Mtznkhd;wpd; cs;slf;fq;fisj; njhlu; mikg;gpy; fhl;Ltjw;F gad;gLfpd;wJ.
%d;W gpujhd gl;bay; tiffs; cs;sd:
• tupirg; gl;bay;
• tupirahf;fg;glhjg; gl;bay;
• tiuaiwg; gl;bay;
gl;bay; ngau; ,J vd;d? cjhuzk;
tupirg; gl;bay; tiyg;gf;fj;jpy; tupirg; gLj;jpf;fhl;l Ntz;ba <ol type=“a”>
$Wfs; midj;ijAk; ,yf;f tupirg; gl;bay; %yk; <li>Apple</li>
fhl;rpg;gLj;jyhk;. <li>Orange</li>
,yf;f tupirg;gl;bayplypy; ,Utiff; $Wfisg; <li>Banana</li>
<li>Mango</li>
ghtpf;fyhk;.
</ol>
1. tupirg;gl;bay; <ol> ,J ,yf;f
tupirg;gl;baiyf; Fwpf;Fk;.
2. gl;bay; $Wfs; xt;nthU cUg;gbiaAk; <li>
%yk; fhl;ly; Ntz;Lk;
tupirg;gl;baypd; Njhw;wj;ij
,uz;L gz;Gfs; %yk; fl;Lg;gLj;jyhk;.
1. Start: gl;baypd; Kjy; ,yf;fj;ij
tiuaWf;fpd;wJ.
2. Type: gl;baypd; ,yf;f tbtj;ij
tiuaWf;fpd;wJ.
cjhuzk;: 1, A, a, i, I Nghd;wit tbtpw;Fupa
gz;Gg; ngWkhdq;fshFk;
tupirahf;fg;glhj tiyg;gf;fj;jpy; Vida ge;jp;apd; thrfq;fspypUe;J <ul type=
gl;bay; jdpahf tupirg;gLj;jpf;fhl;l Ntz;batw;iw “square”>
Fz;Lf;Fwp %yk;; gl;bayhff; fhl;rpg;gLj;jyhk;. <li>Apple</li>
Fz;Lf;Fwp gl;banyhd;W fPo;tUk; $Wfisf; <li>Orange</li>
nfhz;bUf;f Ntz;Lk;.
<li>Banana</li>
1. tupirahf;fg;glhj gl;bay; $W <ul> . ,J
<li>Mango</li>
Fz;Lf;Fwp gl;banyhd;W cUthf;fg;gLfpwJ
vd;gijf; Fwpf;fpd;wJ. </ul>
2. gl;baypd; cUg;gb xt;nthd;Wk; <li> %yk;
Fwpf;fg;gLfpd;wJ.

gz;ghdJ (attribute) gl;baypd; Fz;Lf;Fwp

tbtj;ijf; Fwpf;fpd;wJ.
cjhuzk;:- disc, square, circle

3. gy;Y}lfg; nghUl;fs;
HTML ypy; fhzg;gLfpd;w gy;Y}lf trjpfs;> gadu;fs; jq;fsJ tiyg;gf;fq;fspy;
gbkq;;fs;> fhnzhspj; Jz;lq;fs;> Nfl;nghypfs; kw;Wk; Vida HTML Mtzq;fs;
vd;gtw;iw cs;slf;Ftjw;F trjpaspf;fpd;wJ.
Xl;L ,J vd;d? vt;thW gad; gLj;JtJ?
gbk xl;L HTML ypy; <img> xl;bd; %yk; gbkq;;fs; <img src=
tiuaWf;fg;gLfpd;wd. gbk xl;L %L xl;L ,y;yhj “C:\New_folder\img1.jpg”>
xl;lhFk;.
gbk xl;Lg; gz;Gfs;: <img src= “img1.jpg”>
1. Src: tiyg; gf;fj;jpy; gbknkhd;iw
<img src= “img1.jpg”
fhl;rpg;gLj;Jtjw;F gad;gLfpwJ. ‘src’ vd;gJ “source” height=150 width=175>
vd;gjd; FWf;fkhFk;.
src gz;Gf;Fwpa ngWkhdkhdJ> Fwpj;j gbkj;jpw;;fhd
ngWtopahFk;.
Fwpj;j gbk Nfhg;G Nrkpf;fg;gl;Ls;s mNj
Nfhg;Giwf;Fs; Nrkpf;fg; gl;bUf;Fkhapd; Nfhg;gpw;fhd
ngaiu khj;jpuk; Fwpf;fyhk;.
2. Width: gbkj;jpd; mfyj;ij gl%yj;jpy; my;yJ
rjtPjj;jpy; fhl;lyhk;.
3. Height: gbkj;jpd;; ePsj;ij gl%yj;jpy; (pixels)
my;yJ rjtPjj;jpy; fhl;lyhk;.

Nfl;nghyp HTML5 Clhf tiyg; gf;fq;fspy; Nfl;nghypf; <audio src="audio/test-

xl;L audio.ogg" controls
Nfhg;Gfis cs;slf;ff;$ba tifapy; <audio> xl;L
mwpKfg;gLj;jg;;gl;lJ autoplay></audio>
Nfl;nghyp xl;Lf;Fupa gz;Gfs;:
1. Src: Nfl;nghyp Nfhg;Gf;Fwpa ngWtopiaf;
Fwpf;fpwJ.
2. Controls: Nfl;nghyp ,af;ffpf; fl;Lg;gLj;jpfisf;
fhl;rpg;gLj;jy; Njitah vd;gijf; Fwpf;fpd;wJ.
fl;Lg;gLj;jpfs; ,y;iy vd;gJ epiy kjpg;ghff;
fhl;lg;gLk;.
3. Autoplay: Nfl;nghyp jhdpaq;fpahfr; nray;gl
Muk;gpf;Fk;; vd;gijf;; Fwpf;fpwJ.
 fhnzhsp fhnzhsp nray;epiyfisf; fl;Lg;gLj;jf;$ba gy <video
xl;L gz;Gfis <video>$W nfhz;Ls;sJ: src="video/puppy.mp4"
1. Src: fhnzhsp Nfhg;Gf; Fwpa ngWtopiaf; width="400" height="300"
Fwpf;fpwJ. controls></video
2. Width, Height: fhnzhsp; ,af;fpapd; mstpid
gl%yj;jpy; tiuaWf;fpwJ.

3. Controls: tiyNkNyhb jdJ fhnzhsp

,aq;Fepiyf; fl;Lg;gLj;jpfis toq;f Ntz;Lk;
vd;gijf; Fwpf;fpd;wJ.

4. Autoplay: fhnzhsp jhdpaq;fpahf nray;gl

Muk;gpf;Fk; vd;gijf;; Fwpf;fpwJ.

tiyg; gf;fq;fis cUthf;Ftjw;fhd gilg;ghw;wy; fUtpfs;

;
➢ “tiyg; gf;fg; gilg;ghw;wy; fUtpfs;” njhopw;wpwDs;s tiyg; gf;fq;fs;> tiyj;
jsq;fs; kw;Wk; tiyg; gpuNahf nkd;nghUl;fs; Nghd;wtw;iw tbtikj;jy;>
FwpKiwaply;> cUthf;fy; vd;gtw;wpw;Fg; gad;gLj;jg; gLfpwJ.
➢ gilg;ghw;wy; fUtpfspd; fl;Gyj; njhFj;jy; mk;rkhdJ> xU tupNaDk; Fwpaply;
nra;ahky; tiyg; gf;fq;fis cUthf;f mDkjpf;fpwJ.
➢ HTML njhFg;gpfshd Notepad, Notepad++ Nghd;wtw;iw tplTk; ,tw;wpy; ,yFthf
tiyg; gf;fq;fis cUthf;fyhk;.
➢ HTML njhFg;gpfisg; gad;gLj;jp tiyg; gf;fq;fis vOJtJ tYkpf;fjhf ,Ug;gpDk;>
gilg;ghw;wy; fUtpfis tplTk; Ntfk; Fiwe;jjhff; fhzg;LfpwJ.
➢ tiyg; gf;fg; gilg;ghw;wy; fUtpfspd; xUq;fpize;j tpUj;jpr; #oy; (IDE) toolbars,
windows, objects, panels, inspectors, tools Nghd;wtw;iwf; nfhz;Ls;sJ. ,it tiyg;
gf;fq;fisf; ftu;r;rpfukhf cUthf;Ftjw;Fk;; tiyj; jsj;ij nraw;wpwDs;s tifapy;
nray;gLj;Jtjw;Fk; gad;gLfpd;wd.
➢ xUq;fpize;j tpUj;jp #oypy; (IDE) Mtz rhsuKk; gyfq;fSk; ngupa rhsuj;jpy;
,izf;fg;gl;Ls;sd.
➢ Ntisapilntsp (workspace) apd; rpy Mf;ff;$Wfs;
Mf;ff;$W tpguk;
Document Tab tiyg; gf;fj;jpd; ngaiuf; fhl;rpg;gLj;Jk;. epiyg; ngau;
Untitled-1 Mf ,Uf;Fk;
Document Window jw;Nghija Mtzj;ij my;yJ tiyg; gf;fj;ij thrfq;fs;>
ml;ltizfs;> tiutpay; fs; Nghd;wtw;Wld; fhl;rpg;gLj;Jk;
Design view tiyg; gf;fj;ij tbtikg;gjw;fhd $Wfis xd;Wjpul;l
gad;gLfpwJ.
Code view FwpKiwfis vOJtjw;Fk; gjpg;gp;;g;gjw;Fkhd ifKiw
Fwpaply; #oy;
Split view xNujpiuapy; FwpKiw Nehf;fpiaAk; tbtikg;G Nehf;fpiaAk;
ghu;itapLtjw;F trjaspf;fpd;wJ.
Panel groups ,it gue;jstpyhd rhu;GfisAk; fl;lisfisAk; fl;Lg;gLj;Jk;
xNu jiyg;gpd; fPo; xd;whf mLf;fg;gl;l gyfq;fspd;;
njhFjpahFk;
Insert Bar gbkq;fs;> ml;ltizfs;> ,izg;Gfs; kw;Wk; jpfjpfs; Nghd;w
gy;NtW nghUl;fis cs;sL P nra;jiyAk; cUthf;FjiyAk;
Nkw;nfhs;tjw;F> mbf;fb gad;gLj;Jk; fl;lisfis tpiuthf
mZFtjw;F trjpaspf;fpd;wJ.
Status Bar cUthf;fg;gLfpd;w Mtzk; njhlu;ghd Nkyjpf jftiy
toq;FfpwJ.

➢ Gjpa tiyg; gf;fnkhd;iw cUthf;fy;

• Mtz rhsu Nkw;gFjpapy;

,Uf;Fk; vDk; fUtpg;ngl;bapy;
jiyg;G xd;iw cs;sL P
nra;aTk;. ,J kf;fs; ckJ
gf;fj;ij ghu;itapLk; NghJ
tiyNkNyhb rhsuj;jpd;
jiyg;Gg; gl;bapy; njd;gLk;
jiyg;ghFk;. ckJ gf;fj;jpw;F
ahuhapDk; xUtu;
Gj;jff;Fwpg;ig cUthf;Fk;;NghJ
mjw;fhfg; gad;gLk;
thrfkhfTk; ,J gad;gLfpwJ.

• Mtzj;ij Nrkpj;jy;: jiyg;Gg;

gf;fj;ij Nrkpf;Fk;NghJ ( gpujhd Nfhg;Giwapy; my;yJ cg Nfhg;Giwnahd;wpy;)
mjid ‘index.htm’ my;yJ ‘index.html’ vd Nfhg;igg; ngaupLtij cWjp nra;J
nfhs;sTk

➢ gf;fj;jpd; gz;Gfs;
Kog; gf;fj;jpw;Fk; nry;YgbahFk; gz;Gfis khw;wpaikg;gjw;F Modify vDk; gl;bay;
gl;ilapy; Page Properties vd;gijj; njupT nra;aTk;.
• Title: tiyg;gf;fj;jpd; ngau;
• Background Image: Xt;nthU gf;fj;jpd; gpd;dzpapYk; njd;glf;$ba gbkj;jpw;fhd
rhu;G my;yJ rhu;gpyh ngWtop Fwpf;fg;gly; Ntz;Lk;. mNjNghd;W> gbknkhd;iw
NkNyhb njupT nra;aTk; KbAk;.
• Background: gf;fj;jpw;fhd gpd;dzp epwj;ijj; njupT nra;ayhk;
• Text: thrfq;fspd; epwj;ij mikf;fyhk;
 • Links, Visited Links, Active Links: ,izg;G> ghu;itapl;l ,izg;G> nraY}f;f
,izg;G vd;gtw;wpd; tz;zq;fisAk; khw;wyhk;
➢ thrfk;

• thrfkhdJ jl;lr;Rr; nra;a my;yJ NtnwhU %yj;jpypUe;J gpujpnaLf;f KbAk;.

• jl;lr;R nra;ag;gl;l thrfj;ij tbtikg;gjw;F ,ay;Gg; gyfk; (Properties panel)
trjpaspf;fpd;wJ. thrfg; gl;baypy; (Text menu) thrfj; njupTfSk; fhzg;gLfpd;wd.

▪ Format: jiyg;G tiffisAk; Vida tbtikg;G ghq;FfisAk; njupT

nra;tjw;fhFk;.
▪ Size: vOj;JUg; gUkd;fisj; njupTr; nra;tjw;fhFk;. (1, 2, 3, Nghd;wit.) my;yJ
(+) kw;Wk; (-) gUkd;fs; (+1, +2, +3, Nghd;wit.), epiy kjpg;Gg; gUkd; 3 MFk;.
▪ Color: njupTr; nra;ag;gl;l thrfj;jpw;fhd tz;zj;ijj; njupT nra;tjw;fhFk;.
▪ Ordered and Unordered Lists: nghUj;jkhd nghj;jhidg; gad;gLj;jp
xOq;Fg;gLj;jg;gl;l gl;bay;fisAk; (,yf;fkplg;gl;l) xOq;Fg;gLj;jg;glhj
gl;bay;fisAk; (Fz;Lf;Fwpaplg;gl;l) cUthf;Ftjw;fhFk;.
▪ Increase or Decrease Indent Buttons: njupT nra;ag;gl;l ge;jpapd; cl;jy;yiy
mjpfupg;gjw;Fk; Fiwg;gjw;FkhFk;.

➢ nghJthd nghUl;fis cl;GFj;jy;

• gbkk;
▪ gbkj;ij tpsf;Ftjw;fhd khw;W thrfj;ijr; Nru;g;gjw;F Alt vd;w $wpidg;
gad;gLj;j KbAk;.
▪ gbkj;jpd; Neu;gLj;jiy khw;wKbtJld; gbkj;ij ,izg;nghd;whfTk; gad;gLj;j
KbAk;. mj;Jld; gbkj;jpw;fhd epiyf;Fj;J kw;Wk; fpil ,ilntspiar; rPu;r;nra;a
KbtJld; gbkj;ijr; Rw;;wp Xuf; Nfhl;bidAk; Nru;f;f KbAk;.