Utangulizi

HTML ni lugha ya msingi inayotumika kutengenezea kurasa za tovuti na blogu. Bila HTML hakuna website inayoonekana duniani. Unaweza kutengeneza tovuti kwa kutumia HTML pekee, kisha ukaboresha baadaye kwa kutumia CSS na JavaScript.

Katika somo hili, tunaanza kwa kukuweka tayari ili uweze kuandika code zako bila shida—iwe unatumia simu au kompyuta.


Sasa tuingie kwenye somo letu…


1. HTML ni nini?

HTML ni ufupisho wa:

Ni lugha ya kimataifa inayotumiwa kutengeneza kurasa za tovuti (website pages). HTML haihitaji umiliki wa vifaa ghali; unaweza kuanza hata kwa kutumia simu yako ya mkononi.

Ikiwa una ndoto za kuanzisha blog, tovuti ya biashara au portfolio, basi uko mahali sahihi. Mafunzo haya yatakufundisha kuanzia hatua ya mwanzo kabisa hadi kutengeneza tovuti inayoweza kwenda live.


2. Vigezo vya kuanza kujifunza

Ili uweze kufanikiwa kwenye kozi hii, unahitaji:

Kozi ya msingi (Basics) itachukua wiki moja, kisha tutaendelea na hatua ya pili.


3. Namna ya kuandaa kifaa chako (Simu)

Kwa watumiaji wa simu, utatumia app inayoitwa Acode (badala ya TrebEdit kwa sababu Acode ni nyepesi na ya kisasa).

Hatua za kuandaa Acode

  1. Pakua app ya Acode kwenye Play Store:
    https://play.google.com/store/apps/details?id=com.foxdebug.acodefree

  2. Fungua Acode

  3. Bofya icon ya “folder” kisha tengeneza folder jipya

  4. Lipe jina mfano: html-project

  5. Ndani ya hilo folder, tengeneza folder lingine liitwe images

  6. Rudi kwenye folder la html-project

  7. Bonyeza alama ya “+” kutengeneza faili jipya

  8. Lipe jina: index.html

  9. Lifungue faili hilo

  10. Andika au kopia code zifuatazo:

<!DOCTYPE html>
<html>
<head>
<title>Home Page</title>
<meta charset="UTF-8">
</head>

<body>

<h1>Mafunzo ya HTML</h1>

<h2><u>Jifunze bure</u></h2>

<p>Haya ni mafunzo ya HTML kwa kutumia simu.</p>

<br><br><br>

<i>From <br> Bongoclass</i>

</body>
</html>
  1. Bonyeza save

  2. Bofya preview kuona matokeo

Hongera! Huo ndio ukurasa wako wa kwanza wa HTML.


4. Namna ya kuandaa kifaa chako (Kompyuta)

Kwa watumiaji wa kompyuta tunashauri kutumia:

Unaweza pia kutumia Notepad++ au hata Notepad ya kawaida.

Hatua za kuandaa mazingira

  1. Tengeneza folder kwenye desktop, lipe jina: website2

  2. Ndani ya hilo folder tengeneza folder lingine: images

  3. Rudi kwenye folder la website2

  4. Tengeneza faili jipya (New File)

  5. Paste code hizi hapa chini

  6. Save kwa jina: index.html

  7. Fungua faili hilo kwa kutumia browser mfano: Chrome

Code ya mwanzo

<!DOCTYPE html>
<html>
<head>
<title>My First Webpage</title>
<meta charset="UTF-8">
<meta name="description" content="This is my first website">
</head>

<body>

<h1>Welcome to my webpage</h1>

<p>Welcome to my brand new website.</p>

<a href="http://www.google.com">Google</a>

</body>
</html>

Ukilifungua kwenye browser utaona ukurasa wako wa kwanza ukiwa tayari.


Hitimisho