muzruno.com

Какво е HTML, характеристиките на структурата

HTML без съмнение е основният език на Интернет, който произхожда от него. Както и да е, той участва в създаването и работата на всяка уеб страница на World Wide Web. Без да разбира какво е HTML и как работи, е невъзможно да превърнем непрекъснат поток от текст, който първоначално е всеки документ, в структуриран, красив и лесен за използване сайт.

HTML и World Wide Web

Съкращението произлиза от английската фраза HyperText Markup Language. Преводът напълно обяснява какво е HTML - езикът на хипертекстовото маркиране. Той се появи в зората на развитието на интернет и е предназначен за проектиране на уеб страници, съдържащи научна и техническа документация, която трябва да бъде специално проектирана правилно.

Тим Бърнърс-Лий, създателят на езика, приема, че с негова помощ би било лесно да се създадат прости, но разбираеми документи за обмен между учени от различни градове и държави. Той разработи набор от дескриптори - елементи, които форматират текста. Сега ги познаваме под името "тагове".

За да може HTML текстът да се показва правилно, е необходима обработката му. Това се извършва чрез специални програми - браузъри. Те получават страница за маркиране, интерпретират дескрипторите на маркерите и показват текста във формата, в която потребителят трябва да го види.

Много важна част от езика, който е разбираем дори от името му, е подкрепата на хипертекста. Това означава, че някои HTML страници могат да съдържат връзки към други. Особено важна система препратки имаше за научни статии, позволяващи да не се впуска в обяснението на сложен термин, а просто да изпрати читателя, ако е необходимо, в съответната глава.

Езиково развитие

С течение на времето, простият набор от тагове, които HTML беше в началото на своето съществуване, нарастваше и падеше. Имаше възможност да вградите мултимедийно съдържание в страницата, да създавате таблици, да управлявате подреждането на изображения.

Спонтанното разширяване на езика трябва да се ограничи и да се постави под контрол, бяха необходими определени стандарти.

Разнообразие от браузъри

1995 - времето на приемане на третата версия на спецификацията и повратна точка за съдбата на кодера. Съвременните по това време браузъри вече не можеха да осигурят прилагането на приетите стандарти, започнаха импровизацията и разслояването. Всеки интернет браузър имаше свое собствено мнение за това какво е HTML и как да се справя с конкретни дескриптори.

За щастие, в момента основните противоречия между браузърите се изглаждат, което спестява на разработчиците на фронтове много сила и нерви.

HTML5

Действителният за 2018 г. е петият стандарт HTML, чийто проект се появи в края на 2007 г. Бяха представени много нови елементи и атрибути, като специално внимание беше обърнато на семантиката на уеб страниците и тяхната достъпност за потребителите с увреждания.

Езикът продължава активно да се развива и подобрява.

Пети стандарт HTML

HTML Основи

Основните HTML структури са дескриптори, маркери и обекти. Текущият текст, обработен с тяхна помощ, се превръща в уеб документ.

Елементите на езика за маркиране на хипертекст са мнемонични кодове за специални символи на Unicode, които не се намират на конвенционалните клавиатури.

Примери за обекти:

LT-ъгъл на отваряне
GT-затваряща ъглова скоба
larr-тънка стрелка, сочеща наляво
uarr-тънка стрелка, насочена нагоре

HTML обектите започват с ampersand, завършват с точка и запетая и съдържат лесен за запомняне символ на кода за героя. Те са важни, защото ви позволяват да показвате знаци, които не могат да бъдат директно описани в HTML кода.

Такива знаци включват например ъглови скоби. На езика на хипертекстното маркиране те служат като идентификатори на маркери, които заобикалят името на описанието от двете страни.

HTML тагове

Етикетите са основните структурни компоненти на уеб документ. Те са контейнери от части за отваряне и затваряне и съдържанието между тях.

Пример за маркер:

текст в етикета

Това е HTML дескриптор аз, дефиниране на стиловия шрифт на курсив. Буквата i е първата буква на курсив. Той има:

  • отваряща част -
  • затваряща част , характеризираща се с наличието на наклонена черта;
  • съдържание, което след разглеждане от браузъра ще се покаже в курсив.
HTML тагове структура

Повечето дескриптори имат една и съща структура, но има малка група празни етикети.

Дългият текст, който следва
разбиват се на няколко реда
за подобряване на четивността.

свободен край
След анализа тя ще бъде заменена с прекъсване на линия. Няма съдържание, така че затварянето не е задължително.

Следните етикети също са празни:

  • , Тънка сива линия, разделяща блоковете текст един от друг;
  • , представляващо цялото семейство от интерактивни елементи на форми;
  • , файла с изображения, който се свързва;
  • редица сервизни маркери - , .

Дескрипторите могат да бъдат вложени на много нива. Единственото изключение са празните маркери, в които не може да се съдържа съдържание.

Маркери атрибути

Много голямо значение при създаването на уеб документи имат атрибути, които се поставят в елемента за отваряне на маркера. Дескрипторът може да има един или повече свойства или да не ги има изобщо.

В повечето случаи, с помощта на атрибути, са определени определени аспекти на поведението на елемента и понякога те могат да променят радикално визуалното представяне. Няколко свойства се използват за бизнес цели, което ви позволява да управлявате HTML маркери от CSS или jаvascript.

Настройка на атрибута

Изберете цвят: червен жълт зелен


Ето група от три интерактивни елемента. атрибут тип определя тяхното показване под формата на отметки, име съдържа името на конкретно поле и собствеността Проверих, без стойност, прави вторият извод, избран по подразбиране.

Входен маркер с атрибути

Има универсални атрибути, които могат да бъдат дефинирани за всеки дескриптор и специфични, специфични за конкретни маркери.

Универсалните свойства са: id, class, title.

За конкретни - горепосочените, проверени, както и src, href и още много други.

Синтаксис функции

Когато получите HTML страница, браузърът я анализира и изхвърля всичко, което е излишно. Например, в повечето случаи ще бъдат игнорирани множество пространства и прекъсвания на линиите.

Следните два кодови фрагмента са напълно идентични за браузъра, въпреки че един от тях съдържа много последователни интервали и е разделен на линии, а вторият не е такъв.

Lorem ipsum Долор седи  Амет.
doloribus sunt,реклама.
Lorem ipsum Долор седи Амет.
doloribus sunt, реклама.

Миграциите и разделите могат да се използват за визуално структуриране на кода, но те нямат значение за браузъра. В някои случаи, когато искате да запазите оригиналния текстов формат заедно с интервали и тирета, има етикети, които показват съдържанието им, без да се налага да бъдат предварително обработени от браузъра, например, 

.
HTML е нечувствителен към малки и малки букви. Това означава, че етикетите, имената и стойностите на атрибутите могат да бъдат написани с малки или главни букви, като и двете опции ще бъдат третирани еднакво правилно от браузъра. Ако желаете, можете дори да използвате комбинации от големи и малки букви, но това предотвратява нормалното възприемане на кода.
След като се запознаете с маркерите, техните свойства и синтаксис, можете да се преместите от основите на езика HTML в структурата на HTML документа като цяло.
Изграждане на HTML документ
Всяка уеб страница трябва да има определена рамка, която да се показва правилно от браузъра.
Задължителната структура на HTML документа включва:
  • декларацията за доктоп, осигуряваща правилна обработка от браузъра;
  • html-обвивка на цялата страница;
  • специално предназначена сервизна част глава.
Стандартът HTML5 не изисква задължителен маркер тяло в документа, но се препоръчва да го използвате, за да посочите областта на съдържанието.
Необходима HTML структура на документа
Важни, но по желание служебни дескриптори са:
  • заглавие, съдържащо заглавието на страницата;
  • мета маркери, които определят кодирането, SEO информация, http-headers и други важни настройки.
Заглавие на страницата
Останалата част от структурата на HTML страницата може да бъде всяка. Характеристиките му зависят от конкретния проект.
Основното правило, което трябва да се следва във всеки уеб документ, е правилното гнездене на етикети. Първо, дескрипторът на най-дълбокото ниво на гнездене е затворен, а после всички външни са последователно.
Текст на абзаца
Семантична структура
Тъй като спецификацията се разви и стана по-сложна и се появиха нови дескриптори, технологиите за създаване на уеб документи се промениха. Първоначално текстовете бяха непрекъснат поток, разделен само от параграфи. После дойде ерата на табличното оформление, което позволи да се поставят блокове на страницата във всяка конфигурация, например колони.
С развитието на CSS от използването на таблици постепенно изоставени, защото стилове позволи да формализира документа, както искате.
Хипертекстов маркиращ език за уеб страници
Новият HTML стандарт насърчава семантиката в структурата на HTML документа. Това се постига чрез използването на такива семантични маркери като удар с глава, долния, основен, статия, навигация, раздел и други.
Основният език на интернет е много прост. Всеки може да разбере какъв HTML е и да приложи успешно тези знания, като създаде свои собствени уеб страници.
 
Споделяне в социалните мрежи: 

  
сроден