Najua kuna maelezo mengi sana kuhusu hivi vitu ila naomba kuchukua muda wangu na kuweza kuelezea kwa wale ambao wanataka kuanza kuvijua hivi vitu.(beginners)
Html ni nini?
Html ni Hypertext Markup Language. Ukitaka kuandika maneno ambayo pindi ukifungua Website yako unataka kuyaona basi utatumia Html kwa mfano Kichwa cha habari, paragraph,maandishi mengine n.k.
Html sio programming language.
Tutahitaji vitu gani ili tuweze kuandika Html code?
Kuna tools nyingi ambazo unaweza kutumia kuandikia html.Mfano Notepad++, Visual Studio Code,Sublime Text n.k.
Napendelea tutumia Visual Studio Code kwasababu ina support Emmet (tutaelezea vizuri baadae)
Je naweza kuziona html code katika Firefox, Internet Explorer, Safari, Chrome and Opera?
Ndio,unaweza kuziona code zote za html katika website yoyote,unatakiwa kubonyeza ctrl+u katika web browser nilizotaja hapo juu mfano Chrome , Internet Explorer.
View attachment 1272402
Hizi ni baadhi ya JF html code.Usijali tutazielewa baadhi ya code zilizoandikwa humu. Inahitaji muda kwa wale Beginners.
Vitu ambavyo tutaanza navyo
- Structure
- Text
- Links
- Images
- Tables
- Forms nk.
1. Tuanze na Structure
Fikiria katika habari ambazo umewahi kuzisoma katika magazeti. Katika magazeti utakutana na:
-Kichwa cha habari
-utakutana na subheading
-utakutana na picha
-utakutana na maandishi(text)
Vyote huvu hutumika pia pindi unapotaka kutengeneza web page katika website yako.
Simple structure ya Html.
<html>
<head>
</head>
<body>
</body>
</html>
Hivi ni vitu vya msingi ambavyo tutakuwa tunaandika mara kwa mara. Pindi tukiwa tunaandika Html code.
ANGALIZO: Hizo structure za html hazijakamalika .Tutakuwa tunaongezea vitu pindi tutakavyoendelea.
-->katika html cha kuzingatia tutakuwa tunafungua na kufunga element muhimu sana.Mfano <html> </html>,
<body> </body>, <head> </head> n.k. kumaanisha mwanzo wa hicho kitu na mwisho wake.
Ni jinsi gani naweza kusave Html code?
-Tunatakiwa tusave file zetu zote jinalafilelolote.html
View attachment 1272422
Mfano wa output ambapo code zake ni
View attachment 1272424
Maelezo:
Ukitaka kuandika heading , tunatumia <h1> </h1> ndani ya element h1 ndipo heading yako inapoandikwa.refer html code above.
Kama kutakuwa kuna heading (sub heading) zingine basi utatumia
<h2> </h2> au
<h3> </h3> au
<h4> </h4> au <h5> </h5> au <h6> </h6>
Ukitaka kuandika maelezo ya kichwa cha habari basi tunatumia
<p> hapa ndani tunaandika maelezo ya kichwa cha habari
</p>
Ukitaka kuanza mstari mwingine browser itautambua kwa
<br> .lakini sio wewe mwenyewe kuanza mstari mwingine hiyo haitambuliki.
Nitaendelea muda sio mrefu, likes zenu muhimu jamani.