Katika makala haya, utajifunza jinsi ya kutumia HTML kuandika tovuti yako ya kwanza! Nakala hiyo itatoa mifano ya kielelezo kwa ufahamu bora. Hebu tuweke nafasi mara moja kwamba makala yaliundwa awali kwa ajili ya wale wanaoanza kujifunza HTML. Aidha, tunaahidi kwamba kufikia mwisho wa kusoma makala haya, umehakikishiwa kuunda tovuti yako ya kwanza.
HTML inasimamia Lugha ya Kuweka Maandishi, yaani, lugha ya kupanga maandishi.
Tofauti na lugha za kupanga (JavaScript, PHP, n.k.) zinazotumia hati kutekeleza vitendo kwenye tovuti, lugha ya mpangilio (HTML) hutumia lebo kuashiria maudhui ya tovuti.
Hebu tuanze kujifunza HTML kuanzia mwanzo
Kama vile Kiingereza kinaundwa na herufi A, B, C, n.k., vivyo hivyo HTML inaundwa na "herufi" za kipekee:,,
n.k. "herufi" hizi za kipekee za lugha ya HTML huitwa tagi na wasimamizi wa tovuti.
Ufuatao ni mfano wa lebo ya HTML.
Lebo Tengeneza mstari chini kwenye kingo za maandishi haya.
Lebo za HTML zilizooanishwa na mitindo ya lugha ya CSS hukuruhusu kuunda tovuti kwa haraka na kwa ufanisi.
Mahali pa HTML kati ya lugha zingine
Kama unavyojua, tovuti nzuriimejengwa kwa angalau lugha 5.
Tovuti ya kisasa imeundwa katika lugha:
- HTML (muundo na kuagiza).
- CSS (maudhui ya mtindo).
- JavaScript (vitendo vya kivinjari).
- PHP (kitendo cha seva).
- SQL (hifadhi ya data).
HTML ndiyo lugha kuu ya msingi ambayo wengine wameegemea. Kwa hivyo, kujifunza HTML kunapaswa kuwa hatua ya kwanza kwa mtu yeyote anayejifunza jinsi ya kuunda tovuti kwenye wavuti.
Tag
Lugha ya HTML imebadilika kwa miaka mingi tangu kuanzishwa kwake. Kwa sasa, tovuti nyingi za mtandao zinahamia toleo jipya zaidi la lugha - HTML5. Lakini hata katika HTML5, misingi ya lugha bado haijabadilika.
Muundo wa ukurasa wa HTML ni kama sandwich. Kama vile sandwich ina vipande viwili vya mkate, hati ya HTML ina tagi ya HTML inayofungua na kufunga.
Lebo hizi, kama mkate kwenye sandwichi, huzunguka kila kitu ndani.
Tag
Unapoendelea kujifunza HTML, hakika unapaswa kuifahamu tagi. Moja kwa moja ndani ya lebo ya mzazi kuna maudhui yote ya tovuti, ikiwa ni pamoja na lebo. Lebo hii inahitajika na ina mipangilio yote ya ukurasa wa tovuti ambayo imeandikwa. Mipangilio hii haionekani kwa wanaotembelea tovuti, ni vivinjari pekee (Google Chrome, Mozilla Firefox, n.k.) huiona.
Kizuizi cha mipangilio ya ukurasa wa tovuti kina vipengee vyote "visivyotekelezwa" ambavyo husaidia kivinjari kuonyesha tovuti yako ipasavyo kwenye wavuti.
Chaguo zote ambazoinaweza kusanidiwa ndani ya lebo, tutaiangalia, lakini baadaye kidogo - wakati utakapofika.
Tag
Lebo, kama tagi, iko ndani ya lebo.
Lebo hii inahitajika ili kuonyesha kwenye tovuti yako taarifa zote ambazo ungependa kuonyesha.
Vichwa, aya, majedwali, picha na viungo ni sehemu ndogo tu ya vipengele vinavyoweza kuwekwa ndani ya lebo.
Muundo msingi wa hati ya HTML:
Tovuti yako ya kwanza
Sasa unajua kuwa unaweza kuunda tovuti kwa kutumia HTML na kwamba lebo za kimsingi hutumika kwa hili:
- . Inaonyesha mipaka ya ukurasa wa wavuti.
- . Ina mipangilio ya kuonyesha ukurasa wa wavuti kwenye kivinjari.
- . Ina vipengele vyote vya ukurasa wa wavuti (picha, video, maandishi, na kadhalika) ambavyo ungependa kuwaonyesha wanaotembelea tovuti.
Lebo zingine kama,,, tutazizungumzia hivi karibuni.
Itakuwa vyema ikiwa msomaji sio tu kwamba atasoma nakala hii, lakini pia alikimbia mara moja kuboresha ujuzi wao. Ili kuboresha ujuzi wako wa HTML, utahitaji kuunda tovuti yako ya kwanza, ambayo itatumika kama uwanja wa majaribio kwa ujuzi wako mpya.
Inajulikana kuwa watoa huduma za simu ("MTS", "MegaFon" na kadhalika) hutupatia huduma za simu. Kwa njia hiyo hiyo, huduma za uundaji na usimamizi wa tovuti hutolewa kwetu na waendeshaji wa kukaribisha. Ili kuunda tovuti yako, nenda kwenye tovuti ya opereta yoyote ya upangishaji bila malipo.
Watoa huduma za upangishaji walioidhinishwa ni pamoja na BEGET aureg, kwa mfano. Unaweza kuchagua mtu yeyote.
Baada ya usajili mfupi, baada ya saa 24, tovuti yako ya kwanza kwenye Mtandao itaundwa kiotomatiki, ambayo itaonekana kwa ulimwengu wote, na unaweza kuanza kufanya mazoezi!
Muundo wa kisasa wa tovuti
Kwa kuwa sasa una tovuti yako, angalia ni lebo gani ina lebo na jinsi zinavyopanga taarifa kwenye tovuti.
Picha iliyo hapo juu ni uwakilishi wa mpangilio wa muundo uliokuja na toleo jipya zaidi la lugha ya HTML - HTML5. Pamoja na HTML5 haikuja vitambulisho vipya tu, bali pia maana ya tovuti za ujenzi. Lebo zote unazoona kwenye picha zimo ndani ya lebo kuu. Lebo hizi hukusaidia "kuelezea" muundo wa tovuti yako na kuipa maana.
Kwa mfano, ndani ya lebo … ni rahisi kuweka jina la tovuti (lebo) na maelezo ya tovuti (lebo).
Inafaa kuweka menyu (viungo) ya tovuti (tagi) ndani ya lebo.
Inafaa kuweka safu yoyote kubwa ya maelezo yanayohusiana na maana ndani ya lebo. Inaweza kuwa makala kadhaa, ambayo kila moja "imefungwa" katika vitambulisho, au picha (lebo), au jedwali (lebo
) na zaidi.
Ni rahisi kuweka taarifa yoyote ndani ya lebo ambayo hailingani na maana ya.
Ndani ya lebo, ni desturi kuweka maelezo ya ziada kama vile maelezo ya mawasiliano, sehemu za ziada za tovuti, na kadhalika.
Kwa hivyo sasa wewe ni hodari zaidi katika mambo ambayo tovuti za kisasa zimeundwa. Hebu tuchukue mfanomsukosuko wa kichwa changu ulibadilishwa na hofu kutoka kwa ufahamu.
Kwa hivyo, unapofungua kidhibiti faili kwenye tovuti ya opereta mwenyeji wako na kupata hati inayoitwa index.php, jisikie huru kuandika humo, kana kwamba tangu mwanzo, muundo wa tovuti yako.
Tovuti yangu ya kwanza
Kichwa cha ukurasa
Maelezo ya ukurasa
Kiungo 1 | Kiungo 2 | Kiungo 3
Kichwa cha baadhi ya makala
Hiki ni kizuizi ambacho kina taarifa yoyote, na kwa usaidizi wa CSS unaweza kupaka rangi kizuizi hiki, na tovuti nzima na maudhui yake yote, jinsi unavyotaka. ©Haki zote zimehifadhiwa
Je, unakumbuka tulisema kwamba kuna mipangilio tofauti ya tovuti? Naam, hii hapa:
- Kwa kutumia tunaonyesha vivinjari kwamba tovuti inaweza kuwa na vibambo vya Kirusi na Kiingereza (vinginevyo, unapofungua tovuti, utaona krakozyabry ya kutisha).
- inatumika kuonyesha jina la ukurasa, litakaloonyeshwa kwenye kichupo cha kivinjari na katika injini ya utafutaji ("Yandex", Google na kadhalika).
Bila shaka, bila mtindo wa CSS, tovuti yako itaonekana ya ubahili (herufi nyeusi kwenye mandharinyuma nyeupe), lakini hakikisha kuwa umejaribu kuandika ukurasa wako wa kwanza katika HTML kwanza.
Hongera! Umeunda ukurasa wako wa kwanza wa wavuti kwenye tovuti yako mwenyewe! Itapendeza zaidi!