Энэ нийтлэлээс та HTML хэлээр анхны вэбсайтаа хэрхэн бичих талаар сурах болно! Илүү сайн ойлгохын тулд нийтлэлд тайлбарласан жишээг өгөх болно. Энэхүү нийтлэлийг HTML хэлийг дөнгөж сурч эхэлж буй хүмүүст зориулан бүтээсэн гэдгийг шууд захиалъя. Нэмж хэлэхэд, бид энэ нийтлэлийг уншсаны эцэст та анхны вэбсайтаа үүсгэх баталгаатай болно гэдгийг амлаж байна.
HTML нь HyperText Markup Language буюу текстийг цэгцлэх хэл гэсэн үг.
Вэбсайт дээр үйлдэл хийхэд скрипт ашигладаг програмчлалын хэлээс (JavaScript, PHP гэх мэт) ялгаатай нь дарааллын хэл (HTML) нь вэб сайтын агуулгыг тэмдэглэхийн тулд шошгыг ашигладаг.
HTML хэлийг эхнээс нь сурч эхэлцгээе
Англи хэл нь A, B, C гэх мэт үсгүүдээс бүрддэг шиг HTML нь өвөрмөц "үсэг"-ээс бүрддэг:,,
гэх мэт. HTML хэлний эдгээр өвөрмөц "үсгийг" вэбмастерууд таг гэж нэрлэдэг.
Доорх нь HTML тагны жишээ юм.
Шошго Энэ текстийн ирмэгийн доогуур зураас үүсгэнэ үү.
HTML шошгуудыг CSS хэлний загвартай хослуулсан нь танд хурдан бөгөөд үр дүнтэй вэб сайт үүсгэх боломжийг олгоно.
HTML-ийн бусад хэлнүүдийн дундах байр
Сайн вэб сайт гэдгийг та мэднэхамгийн багадаа 5 хэлээр бүтээгдсэн.
Орчин үеийн вэб сайт нь дараах хэлээр бүтээгдсэн:
- HTML (бүтэц ба дараалал).
- CSS (загварын контент).
- JavaScript (хөтчийн үйлдэл).
- PHP (серверийн үйлдэл).
- SQL (мэдээлэл хадгалах).
HTML бол бусдын үндэслэдэг үндсэн суурь хэл юм. Тиймээс вэб дээр вэб сайт хийж сурч байгаа хэн бүхэнд HTML сурах нь эхний алхам байх ёстой.
Таг
HTML хэл нь үүссэн цагаасаа хойш олон жилийн туршид өөрчлөгдсөн. Одоогийн байдлаар ихэнх интернет сайтууд хэлний хамгийн сүүлийн хувилбар болох HTML5 руу шилжиж байна. Гэхдээ HTML5-д ч гэсэн хэлний үндэс өөрчлөгдөөгүй хэвээр байна.
HTML хуудасны бүтэц нь сэндвичтэй адил юм. Сэндвичэнд хоёр зүсэм талх байдаг шиг HTML баримт бичигт нээх, хаах HTML шошго байдаг.
Эдгээр шошгууд нь сэндвичэн дэх талх шиг бүх зүйлийг тойрон хүрээлдэг.
Таг
Та HTML хэлийг үргэлжлүүлэн сурах тусам шошгыг сайн мэддэг байх ёстой. Эцэг эхийн шошгон дотор сайтын бүх агуулга, тэр дундаа шошго нь шууд байдаг. Энэ шошго нь шаардлагатай бөгөөд үүнийг бичсэн сайтын хуудасны бүх тохиргоог агуулдаг. Эдгээр тохиргоо нь сайтын зочдод харагдахгүй бөгөөд зөвхөн хөтөч (Google Chrome, Mozilla Firefox гэх мэт) л харагдана.
Вэб хуудасны тохиргооны блок нь хөтөч таны сайтыг вэб дээр зөв харуулахад туслах "үзүүлээгүй" бүх элементүүдийг агуулдаг.
Бүх сонголтуудшошгон дотор тохируулж болно, бид үүнийг харах болно, гэхдээ хэсэг хугацааны дараа - цаг нь ирэхэд.
Таг
Таг нь шошготой адил шошгон дотор байна.
Таны харуулахыг хүссэн бүх мэдээллийг таны сайтад харуулахын тулд энэ шошго хэрэгтэй.
Гарчиг, догол мөр, хүснэгт, зураг болон холбоосууд нь шошгонд агуулагдах элементүүдийн зөвхөн өчүүхэн хэсэг юм.
HTML баримт бичгийн үндсэн бүтэц:
… …
Таны анхны сайт
Одоо та HTML ашиглан вэб сайт үүсгэх боломжтой гэдгээ мэдэж байгаа бөгөөд үүнд үндсэн шошгуудыг ашигладаг:
- . Вэб хуудасны хил хязгаарыг тоймлодог.
- . Хөтөч дээр вэб хуудсыг харуулах тохиргоог агуулна.
- . Таны сайтын зочдод харуулахыг хүссэн бүх вэб хуудасны элементүүдийг (зураг, видео, текст гэх мэт) агуулна.
,,, гэх мэт бусад шошгуудыг бид удахгүй ярих болно.
Уншигч зөвхөн энэ нийтлэлийг уншаад зогсохгүй ур чадвараа дээшлүүлэхээр гүйж очвол үнэхээр сайхан байх болно. HTML ур чадвараа сайжруулахын тулд та анхны вэбсайтаа үүсгэх хэрэгтэй бөгөөд энэ нь таны шинэ ур чадварыг шалгах талбар болох болно.
Үүрэн холбооны операторууд ("MTS", "MegaFon" гэх мэт) бидэнд үүрэн холбооны үйлчилгээ үзүүлдэг нь мэдэгдэж байна. Үүнтэй адилаар сайт үүсгэх, удирдах үйлчилгээг хостинг операторууд бидэнд үзүүлдэг. Вэбсайтаа үүсгэхийн тулд дурын үнэгүй хостинг операторын сайт руу очно уу.
Баталгаажсан хостинг үйлчилгээ үзүүлэгчид BEGET эсвэлreg, жишээ нь. Та хэнийг ч сонгох боломжтой.
Богино хугацаанд бүртгүүлсний дараа 24 цагийн дараа таны интернэт дэх анхны вэб сайт автоматаар үүсэж, дэлхий даяар харагдах бөгөөд та дадлага хийж эхлэх боломжтой!
Сайтын орчин үеийн бүтэц
Одоо та өөрийн сайттай болсон тул шошгонд ямар шошго агуулагдаж байгааг болон тэдгээр нь сайт дээрх мэдээллийг хэрхэн зохион байгуулдаг болохыг хараарай.
Дээрх зураг нь HTML хэлний хамгийн сүүлийн хувилбар болох HTML5-тэй хамт ирсэн бүтцийн бүдүүвч дүрслэл юм. HTML5-тай хамт зөвхөн шинэ хаягууд төдийгүй вэб сайт бүтээх утга учир гарч ирэв. Таны зурган дээр харагдаж буй бүх шошго нь үндсэн шошгон дотор байгаа. Эдгээр шошго нь таны сайтын бүтцийг "тодорхойлж", түүний утгыг өгөхөд тусална.
Жишээ нь, шошгон дотор … сайтын гарчиг (шошго) болон сайтын тайлбарыг (шошго) байрлуулахад тохиромжтой.
Сайтын цэсийг (холбоос) шошго дотор байрлуулахад тохиромжтой.
Утгатай холбоотой аливаа том блок мэдээллийг шошгон дотор байрлуулахад тохиромжтой. Энэ нь шошго, зураг (шошго) эсвэл хүснэгтэд (шошго) "боосон" хэд хэдэн нийтлэл байж болно.
) болон бусад.
. гэсэн утгатай тохирохгүй мэдээллийг шошгон дотор байрлуулахад тохиромжтой.
Ташгуудын дотор холбоо барих мэдээлэл, сайтын нэмэлт хэсэг гэх мэт нэмэлт мэдээллийг байршуулдаг заншилтай.
Тиймээс та орчин үеийн вэб сайтуудыг юунаас бүрдүүлдэгийг арай илүү мэддэг болсон. -д жишээ авъяМиний толгой дахь үймээн самууныг ухаарал бишрэлээр сольсон.
Тиймээс та хостинг операторынхоо сайтын файлын менежерийг нээгээд index.php гэсэн баримтыг олоод түүн дотор сайтынхаа бүтцийг эхнээс нь бичиж байгаарай.
Миний анхны вэбсайт
Хуудасны гарчиг
Хуудасны тайлбар
Холбоос 1 | Холбоос №2 | Холбоос 3
Зарим нийтлэлийн гарчиг
Энэ бол ямар ч мэдээлэл агуулсан блок бөгөөд CSS-ийн тусламжтайгаар та энэ блок болон сайтыг бүх агуулгаар нь өөрийн хүссэнээр будаж болно. © Бүх эрх хуулиар хамгаалагдсан
Бид сайтад өөр өөр тохиргоо байдаг гэж хэлж байсныг санаж байна уу? За энд байна:
- Бид вэб хөтчүүдийг ашигласнаар сайт нь орос болон англи тэмдэгтүүдийг агуулж болохыг харуулдаг (эсвэл та сайтыг нээхэд аймшигтай krakozyabry харагдах болно).
- нь хөтчийн таб болон хайлтын системд ("Yandex", Google гэх мэт) харагдах хуудасны нэрийг зааж өгөхөд хэрэглэгддэг.
Мэдээж CSS загварчлалгүй бол таны сайт харамч харагдах болно (цагаан дэвсгэр дээр хар үсэг) гэхдээ эхлээд HTML хэлээр эхний хуудсаа бичихээ мартуузай.
Баяр хүргэе! Та өөрийн вэбсайт дээр анхны вэб хуудсаа үүсгэлээ! Энэ нь илүү сонирхолтой байх болно!
