Paano Gumawa ng HTML Page

Kung gusto mong gumawa ng sarili mong web page, kailangan mong magkaroon ng pang-unawa sa HTML. This article explains how to create an HTML page. Gayundin, matututunan mo kung paano gumawa ng xml sitemap at kung paano magdagdag ng larawan at link. Mahalaga rin na lumikha ng isang xml sitemap, na makakatulong sa iyong ayusin ang iyong site at pataasin ang iyong trapiko. Ang susunod na hakbang ay ang pumili ng isang template.

Creating a html page

Ang HTML ay isang markup language. Ang bawat elemento ng isang web page ay kinakatawan ng isang tag. Nakikilala ang isang tag sa pamamagitan ng mga anggulong bracket, at bawat elemento ay may isa o higit pang mga tag. Ang ilang mga elemento ay nangangailangan lamang ng isang tag; ang iba ay maaaring mangailangan ng dalawa. Ang pambungad at pagsasara na mga tag ay may pasulong na slash (/). Halimbawa, ang elemento ng talata ay kinakatawan ng p tag. Ang text sa pagitan ng opening at closing tag ay ang paragraph text.

Upang lumikha ng isang HTML na dokumento, kakailanganin mong gumamit ng text editor. Karamihan sa mga computer ay may text editor bilang default. Ang mga gumagamit ng Windows ay gagamit ng Internet Explorer, habang ang mga gumagamit ng Mac ay maaaring gumamit ng TextEdit. Maaari kang mag-install ng magarbong text editor upang lumikha ng isang webpage na mukhang propesyonal, ngunit para sa iyong unang HTML na pahina, hindi ito kailangan. Maaari ka ring gumamit ng simpleng text editor at anumang web browser. Kung hindi ka sigurado kung aling program ang gagamitin, subukang mag-download ng libreng HTML editor.

Ang pahina ng html ay may dalawang pangunahing seksyon: ang katawan at ang ulo. Ang seksyon ng katawan ay naglalaman ng aktwal na nilalaman ng website, habang ang head section ay ginagamit para sa pamagat at meta information. Ang katawan ay naglalaman ng lahat ng iba pang mga elemento, kabilang ang mga larawan at iba pang mga graphic. Ang seksyon ng header ay ang lugar upang ilagay ang iyong mga link sa nabigasyon. Pagkatapos mong isulat ang katawan, handa ka nang ipasok ang nilalaman ng dokumento. Tiyaking gamitin ang mga elemento ng katawan at ulo upang matiyak na ang iyong website ay naa-access ng lahat.

Creating a xml sitemap

If you have an HTML page, maaaring gusto mong lumikha ng XML sitemap upang matulungan ang mga search engine na i-crawl ang iyong website. Bagama't hindi ito makakaapekto sa iyong mga ranggo sa paghahanap, makakatulong ito sa mga search engine na maunawaan ang iyong nilalaman at ayusin ang kanilang rate ng pag-crawl. Sa ganitong paraan, mas makikita ang iyong website sa mga resulta ng search engine. Narito ang ilang madaling hakbang upang makapagsimula:

Ang paglikha ng isang HTML sitemap ay madaling gawin. Ang kailangan mo lang gawin ay gumawa ng isang simpleng talahanayan ng mga pahina ng iyong site, na may mga link sa bawat pahina. Pagkatapos ay mag-link sa page ng sitemap na iyon sa header o footer. Sa ganitong paraan, gaano man karaming mga pahina ang mayroon ang iyong site, ang mga tao ay madaling mag-navigate sa kanila. At saka, hindi mo kailangang magsumite ng SEO para gumawa ng sitemap.

Kapag live na ang iyong HTML page, isumite ito sa Google Search Console. Maaari mong gamitin ang anumang extension ng file at pangalanan ang iyong XML sitemap. Maaari mong isumite ang XML sitemap sa Google, ngunit hindi ito kailangan. Ang mga crawler ng Google sa pangkalahatan ay medyo mahusay sa pagtuklas ng bagong nilalaman, at hindi mo kailangang magsumite ng sitemap sa kanila. Maaari mo ring isumite ito sa iba pang mga search engine, ngunit hindi nito ginagarantiya na matutuklasan ka ng Google.

Hindi kinakailangang magdagdag ng XML sitemap sa iyong web page, ngunit madaragdagan nito ang SEO ng iyong website. Ang mga sitemap ay ginagamit ng mga search engine upang matulungan silang mag-index ng mga pahina na hindi direktang naka-link sa isang web page. Nakakatulong din ang mga sitemap na pahusayin ang accessibility ng rich media content. Ang pagdaragdag ng sitemap sa iyong website ay maaaring makatulong na gawing mas naa-access ang iyong site sa mga bot ng search engine.

Adding a picture

In HTML, maaari kang magdagdag ng isang larawan sa isang pahina sa pamamagitan ng paggamit ng img tag. Ang tag na ito ay naglalaman lamang ng larawan at mga katangian nito; hindi ito nangangailangan ng closing tag. Ang tag ng larawang ito ay dapat na maipasok sa loob ng seksyon ng katawan ng HTML na dokumento. Bilang karagdagan sa lapad at taas ng larawan, dapat kang magsama ng alt attribute na naglalarawan sa larawan. Ang alt tag ay dapat na nakasulat na parang isinusulat mo ang paglalarawan para sa isang taong hindi ito nakikita.

Ang pagdaragdag ng larawan sa isang HTML na dokumento ay nangangailangan ng kaunting kaalaman sa CSS at HTML. Ang laki ng imahe at ang resolution ay dalawa sa pinakamahalagang salik na dapat isaalang-alang. Ang laki ng imahe ay tutukuyin kung paano ito magkasya sa nilalaman ng dokumento. Kung mas gusto mong gumamit ng ibang resolution o aspect ratio, maaari mo ring subukang baguhin ang laki ng imahe. Gayunpaman, tandaan na ang pag-scale ay hindi palaging gumagana gaya ng iyong inaasahan.

Ang isang mahusay na tuntunin ng hinlalaki para sa pagsasaayos ng laki ng isang imahe ay upang dagdagan ang lapad nito. Ang lapad ay dapat na hindi bababa sa isang pixel na mas maliit kaysa sa taas. Kung ang imahe ay masyadong maliit upang ipakita, maaari kang magdagdag ng hangganan, at pagkatapos ay ayusin ito upang magkasya sa laki ng larawan. Maaari mo ring isaayos ang hangganan ng isang larawan sa pamamagitan ng pagdaragdag nito sa katangian ng hangganan. Ang kapal ng hangganan ay ang default na halaga, ngunit maaari mo itong itakda sa anumang halaga. Tiyaking may src attribute ang larawan.

Adding a link

You can add a link in HTML to your document using an a> tag na may katangiang href. Gagawa ito ng bookmark para sa dokumento at bubuksan ito sa isang bagong tab. Maaari ka ring gumamit ng isang href attribute upang magpasok ng isang imahe sa dokumento. Maaari ka ring gumamit ng link na may JavaScript code upang i-convert ang HTML button sa isang link. Kapag nagawa mo na ito, maaari mong i-istilo ang iyong link gamit ang CSS o JavaScript code.

Ang isang link ay isang koneksyon mula sa isang mapagkukunan ng web patungo sa isa pa. Binubuo ito ng dalawang dulo, isang source anchor at isang destination anchor. Ang isang link ay maaaring maging anumang bagay mula sa isang imahe hanggang sa isang text file. Karamihan sa mga social networking site at website ay gumagamit ng mga link upang idirekta ang mga user sa isang partikular na URL. Magagamit din ang HTML upang tukuyin ang lokasyon ng isang link. Ito ay’ pinapayagan ka ng attribute na i-link ang mga elemento ng code sa isang URL.

Kapag nagdidisenyo ng isang link, tiyaking isaalang-alang kung paano gagamitin ng iyong mga bisita ang nilalaman. Ang teksto ng link ay dapat na naglalarawan, para malaman nila kung ano talaga ang dapat nilang asahan. Ang pag-uulit ng parehong URL ay pangit para sa mga screen reader, at hindi ito nagbibigay sa kanila ng anumang kapaki-pakinabang na impormasyon. Sinasabi rin ng mga screen reader sa mga user kung kailan umiiral ang mga link sa pamamagitan ng paggawa sa kanila ng ibang istilo o may salungguhit. Sa ganitong paraan, madali nilang mahanap ang impormasyong kailangan nila.

Adding a table

Adding a table to an HTML page is simple, ngunit may ilang bagay na dapat mong isaalang-alang bago mo gawin ito. Ang kulay ng background ng iyong mesa ay mahalaga para mapansin ang iyong bisita at maakit ang pansin sa mahalagang impormasyon. Maaari kang magtakda ng ibang kulay para sa elemento ng header ng talahanayan at elemento ng data sa pamamagitan ng paggamit ng mga hex na color code o mga pangalan ng kulay. Alinmang paraan, ang iyong mesa ay madaling makikita.

Maaari kang magdagdag ng header ng talahanayan at data ng talahanayan na may elementong td, na tumutukoy sa indibidwal “mga kahon” para sa nilalaman. Ang pagdaragdag ng table header ay ang unang hakbang sa pagpapakita ng data sa isang webpage, at dapat mong idagdag ang una kung gusto mo. Ang talahanayan ay dapat ding may tatlong row heading. Dapat walang laman ang isang header. Kung may mga column ang iyong table, dapat ka ring gumawa ng mga row header para sa bawat column.

Maaari ka ring magdagdag ng mga caption sa iyong talahanayan. Ang caption ay isang opsyonal na elemento na naglalarawan sa layunin ng talahanayan. Nakakatulong din ang mga caption para sa accessibility. Ang talahanayan ay maaari ding maglaman ng mga cell na naglalarawan sa mga pangkat ng data. Sa wakas, maaari mong idagdag ang elemento ng thead upang tukuyin ang isang hanay ng mga row at column. Maaari mong gamitin ang parehong mga elemento nang magkasama o hiwalay. Maaari mo ring gamitin ang mga ito sa kumbinasyon, pero ang caption ang pinakamahalaga.

Adding a div

Adding a div to an HTML file allows you to add a section of your webpage without re-writing the whole page. Ang elemento ng div ay isang espesyal na lalagyan para sa teksto, mga larawan, at iba pang elemento. Maaari mo itong pangalanan ang anumang gusto mo at baguhin ang mga katangian nito upang umangkop sa iyong mga pangangailangan. Maaari ka ring magdagdag ng isang klase o margin upang lumikha ng isang puwang sa pagitan ng div at iba pang mga elemento sa iyong pahina.

Maaari mo ring gamitin ang innerHTML attribute para magpasok ng code sa loob ng isang div. Ang pamamaraang ito ay tumatanggap ng code na nakapaloob sa isang string, at kung wala ito sa loob ng div, aalisin ang nilalaman. Dapat mong iwasan ang pagpasok ng code sa isang div sa ganitong paraan, dahil maaari nitong ilantad ang iyong website sa mga kahinaan sa cross-site scripting. Kung gumagamit ka ng scripting language gaya ng JavaScript, maaari mong gamitin ang innerHTML attribute.

Ang div ay isang pangunahing HTML na tag na ginagamit sa pagpapangkat ng code sa loob ng isang dokumento. Maaari itong maglaman ng isang talata, block quote, larawan, audio, o kahit isang header. Binibigyang-daan ka ng posisyon nito na maglapat ng pare-parehong istilo at wika sa iba't ibang seksyon ng isang pahina. Ang mga div ay pinakamahusay na ginagamit para sa pagmamarka ng mga semantika na karaniwan sa mga pangkat ng magkakasunod na elemento. Dapat gumamit ng div kapag gusto mong magdagdag ng istilo sa isang seksyon nang hindi kinakailangang muling isulat ang buong pahina.