Използване на рамки в HTML. Създаване на рамки Атрибути на етикета Frame за персонализиране на външния вид на прозорците

Какво представляват рамките?

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

Казано на лаик, рамките са допълнителни ленти за превъртане в един прозорец. Стигайки до сайта, посетителят вижда два прозореца на една и съща страница наведнъж - единият, като правило, с елементи от менюто или друга важна информация, а другият със съдържание (текст, цени и др.). В този случай посетителят може по-удобно да разглежда доста обемисти страници и едновременно с това да има най-важната информация пред очите си.

Ако се задълбочим в детайлите, една страница с рамки се състои от поне три HTML страници наведнъж - две видими за потребителя и една услуга (координираща показването на рамки). Видимите страници са рамки, които могат да бъдат достъпни индивидуално или едновременно.

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

По едно време, преди 5-6 години, рамките придобиха популярност сред много уеб администратори. Днес те се използват само на онези сайтове, където е просто невъзможно да се направи без тях, тъй като, за съжаление, рамките имат значителни недостатъци по отношение на промоцията.

Рамките – добри или лоши?

Можете да разгледате полезността на фреймовете от три позиции – от позицията на потребителя, от позицията на SEO специалиста и уеб администратора.

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

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

От гледна точка на уеб администратора, използването на рамки улеснява съставянето на страници и полирането на интерфейса. В крайна сметка е много по-лесно да създадете една страница с цялото меню и друга важна информация, отколкото да поставите това съдържание на всяка страница от сайта. Тук обаче свършват опростяванията и започват усложненията, за които един неспециалист не е нужно да знае. Освен това сега почти никой не работи с чист html - CMS ви позволява да правите всичко автоматично.

Позицията на SEO специалист е много по-тежка. Рамките просто не позволяват на роботите за търсене да преминат отвъд главната страница. Разбира се, има някои трикове, които ви позволяват да индексирате вътрешните страници на даден сайт, но това все още са „трикове“, които не са одобрени от нито една търсачка.

Влиянието на рамките върху промоцията на уебсайта.

Без значение колко опитен е специалистът по промоция на уебсайт, той няма да може да даде никакви гаранции в промоцията, ако на ресурса се използват рамки. За съжаление, тази технология е включена в „черния списък“ на елементите, които усложняват промотирането в търсачките, заедно с флаш и откраднато съдържание. Но последното може все още да не се забелязва, но същото не може да се каже за рамките.

И така, как и какво влияе използването на рамки на промоцията?

Въздействието е сериозно. Факт е, че именно на рамките се намират всички важни връзки към вътрешните страници на сайта. И за да ги регистрира, дизайнерът на оформление не трябва да използва тагове …. А именно, чрез този етикет роботът за търсене определя, че пред него има връзка, чрез която можете да отидете на друга страница и да я индексирате (или да добавите още няколко „трошки“ към теглото на връзката).

Роботите за търсене индексират само първата - главна - страница, до която стигат от ресурси на трети страни. Други страници остават затворени за Yandex и Google - в крайна сметка дори от други сайтове е невъзможно да се свърже с тях поради факта, че рамките скриват истинските адреси на страниците.

Днес вече не е възможно ефективно да се популяризира една главна страница - невъзможно е да се посочат всички заявки на нея и PS ще бъде много по-подозрителен към такава „една страница“.

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

Здравейте, скъпи читатели на сайта на блога. Днес ще говорим за рамки в HTML. Ясно е, че ще започнем отначало, а именно с това какво животно е това. Ще говорим също за настоящето (Frame) и бъдещето (Iframe) на тези елементи в текущата версия на хипертекстовия език за маркиране и в новия стандарт Html 5 с .

В края на статията, след подробно описание на процеса на създаване на вградени рамки и тяхната класическа структура в Html код (вече рядко използван), ще се докоснем до уместността на изграждането на сайт върху тях и също така ще обсъдим възможните начини за използването им в настоящия период от време, използвайки примера на моя блог.

Какво е това и как се различава iframe от Frame?

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

Вероятно най-очевидният пример за тяхното използване, с който почти всички сте се сблъсквали, са така наречените помощни файлове, които имат много програми, инсталирани на вашия компютър.

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

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

Как се създава структура на рамка в езика за маркиране на хипертекст? Ако говорим за стандарта Html 4.01 (според класификацията), който е основният в момента, тогава за това се използват три елемента - Frame, Frameset и Noframes.

iframe - вградена рамка в стандарта Html 5

Ако говорим за стандарта Html 5 (нашето бъдеще, някои елементи от което вече се поддържат от много браузъри), тогава няма да има тагове Frame, Frameset и Noframes, както и класическата структура на рамката; вместо това ще има една single Iframe tag (embedded frame) , за който ще говорим в началото, а след това ще насочим вниманието си към класическата схема от версия 4.01, която реално се използва в момента.

iframe, за разлика от класиката, обсъдена по-долу, не изисква замяна на етикета Body с тагове Frameset. Тези. този таг може да бъде вмъкнат на обикновени страници, например в параграф или където и да е другаде. В основата си този елемент е много подобен на Img тага, който вече разгледахме.

Това е вграден елемент със заменяемо съдържание, защото се държи точно като вграден елемент, но се показва външно външно съдържание. В езика HTML има само четири такива елемента – Img, Iframe, Object и Embed. Следователно нашият герой предполага наличието на външен файл, който ще бъде зареден в област, чийто размер е зададен с помощта на атрибутите на този етикет.

Че. Вградената рамка е поглъщащ елемент, в който се зарежда външен обект (като видео). И за да посочите пътя до този файл, който трябва да бъде зареден на страницата, използвайте специалния атрибут Src. Но за разлика от Img, елементът Iframe е сдвоен, т.е. има и затварящ етикет:

Този пример показва изхода на страница с видео в Youtube с помощта на iframe. За да се ограничи областта на рамката (прозорец), където ще бъде зареден външният файл, са предоставени атрибути Ширина и Височина, чиито стойности са посочени в пиксели:

Тези. този таг създава област, в която се зарежда някакъв външен обект (няма значение дали е от вашия сайт или от друг ресурс). Ширината и височината на областта се определят с помощта на Width и Height, а атрибутът Src указва пътя до този обект.

Елементът на iframe наследи всички тези атрибути от подобни вградени тагове със заменено съдържание (като Img, вече споменат по-горе). Е, той също е взел атрибути от снимките Hspace и Vspace, които ви позволяват да зададете отстъпи от границите на рамката до текста, който се обвива около нея.

Важно е също така, че подравняването на вградената рамка се извършва точно по същия начин, както можехме да видим при изучаване на изображения в Html - . Все същото Подравнете, но за тага на iframe с възможни стойности Bottom, Top, Middle, Left и Right.

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

Също така в iframe атрибутът Frameborder мигрира от етикета Frame, който има само две стойности - или 0 (рамката около рамката не се показва) или 1 (рамката се вижда). Стойността по подразбиране е Frameborder=1, така че за да я премахнете, ще трябва да въведете Frameborder="0":

Атрибутът за превъртане също е прехвърлен от Frame към този елемент, който има стойност по подразбиране Auto - лентите за превъртане в рамката ще се показват според нуждите, когато съдържанието е по-голямо от размера на прозореца, предназначен да го покаже.

Е, атрибутите Marginwidth и Marginheight също са преместени от елемента Frame. Те ще бъдат разгледани подробно по-долу в текста, но накратко – те ви позволяват да зададете отстъпа по ширина и височина от краищата на рамката до съдържанието, което се поставя в нея.

Както вече споменах, ясен пример за използване на iframe е:

Като вмъкнете iframe директно в уеб страница, ще получите изходен видеоклип от YouTube. Заключаваме, че този елемент е кръстоска между вградени елементи с заменено съдържание и всъщност класически рамки, които сега ще обсъдим.

Рамки, базирани на тагове Frame и Frameset – тяхната структура

И така, създаването на класическа структура на рамка започва с това, което пишете в Html кода, вместо отварящия и затварящия етикет Body, който обикновено трябва да присъства във всеки документ, заменяйки го с контейнер, базиран на елементи Рамка.

Основният момент е, че елементът Body не може да се използва в този случай - нито Body (за обикновен документ), нито Frameset (когато се създава структура на рамка на документ):

Всеки кадър, който създаваме вътре в основния, се създава с помощта на отделен елемент Кадър. Този таг е единичен и в него задаваме пътя до документа, който ще бъде зареден в този прозорец.

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

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

Оказва се, че елементът Frameset, използван вместо тага Body, заема цялото пространство, разпределено за зоната за гледане, и рамки ще бъдат създадени вътре в тази област с помощта на отделни елементи Frame. В тази връзка възниква въпросът - как да разделим зрителната площ между отделни прозорци или, с други думи, как да зададем размера на всеки от тях.

Това става чрез добавяне на съответните атрибути към елемента Frameset. Има две от тях - Колове и редове. Cols задава разделянето на голям прозорец на вертикални рамки или колони, а Rows ви позволява да го разделите на хоризонтални прозорци или редове.

Създаване на структура, базирана на Frameset и неговите атрибути Cols и Rows

Стойностите за Cols и Rows на етикета Html Frameset са числа, разделени със запетаи (без интервали). Тези числа определят пропорциите на прозорците, които искаме да получим като резултат. Следователно, независимо колко числа, разделени със запетая, са записани в Cols или Rows, броят на кадрите, които имаме, ще бъде резултатът.

Например, използвайки тази нотация, ще получим три вертикални колони, чиято ширина ще съответства на пропорциите 2:5:3.

Тъй като сме задали пропорциите за три кадъра, ще трябва да включим три елемента Frame между отварящия и затварящия тагове Frameset, дори без да посочваме допълнителни атрибути:

В резултат на това нашата рамкова структура, състояща се от три празни прозореца, ще изглежда така:

В този пример задаваме размерите на прозореца (рамка), като използваме проценти, които се вземат от ширината на зоната за гледане (това е случаят, когато използвате Cols) или от нейната височина (редове). При промяна на прозореца за изглед ще се запази процентното съотношение между размерите на рамката. Но вместо проценти можете да използвате и просто числа, които ще означават. Мисля, че тук също не трябва да възникват трудности в разбирането.

Но има и доста необичайна опция в обозначенията на размера, която изглежда звездичка "*". Освен това може да бъде или просто „*“, или звездичка с цифра отпред, например „3*“. Умно нещо, което е много подобно на процентите и означава, че разделяме пространството за рамката пропорционално.

Нека разгледаме един пример. Сега нека изберем да разделим прозореца за изглед на хоризонтални редове с помощта на Редове:

Какво означава този запис? Цялата площ за гледане, достъпна за нас вертикално, ще бъде разделена на три реда. Височината на първия ще бъде взета на 200 пиксела, на втория - на 500, но третият ред ще заеме цялото останало пространство по височина, т.к. За негов размер е използвано „*“.

Трябва да се отбележи, че стойностите „*“ и „1*“ означават едно и също нещо - разделяме цялото останало пространство на едно и даваме тази част на този кадър (добре, т.е. цялото останало пространство).

Но вижте какво се случва, ако използвате стойността „*“ с число, за да разделите пропорционално:

Какви според вас ще бъдат размерите на рамката в този случай? Ясно е, че вторият ред със сигурност ще бъде с височина 100 пиксела. Но как ще се разпредели оставащото пространство по височина между третия и първия ред?

Изчисляването е доста лесно - просто добавете четири (4*) към две (2*) и разделете на този знаменател (помнете дроби от училищната програма) две и четири. Тези. получаваме, че първата колона с рамка ще заема една трета от оставащото пространство във височина, а третата колона ще заема две трети. Или, с други думи, третият ще бъде два пъти по-висок от първия:

Можете да използвате и трите начина за оразмеряване на рамкови прозорци в един атрибут, например:

В резултат на това ще получим първата колона Frame с ширина от десет процента от цялата налична площ, втората - 100 пиксела, а останалите три ще имат ширина в пропорции от четири, три и две девети от оставащо пространство по ширина. Така че всичко е просто и ясно.

Ако искате да разделите главния прозорец не само на хоризонтални и вертикални рамки, но, например, на техните комбинации, тогава можете да използвате вложената структура на Frameset елементи отделно за колони и отделно за редове. Например, за да получите структурата, показана на екранната снимка по-долу, е достатъчно да използвате следната конструкция:

Тези. първо използваме “frameset cols=”20%,80%"“, за да разделим цялото налично пространство на две вертикални колони и да зададем съдържанието на дясната колона с маркера “frame”, но вместо да добавим елемент “frame” за лявата колона отваряме нов „frameset rows=“10%,*”“.

И с помощта на него разделяме дясната колона на два реда с рамки, чието съдържание се задава с помощта на два маркера „frame“, след което затваряме и двата контейнера „frameset“. Всичко е просто и логично.

Посочете пътя в атрибута Src на елемента Frame

Но всички говорихме за елемента Frameset и неговите атрибути Cols и Rows, с помощта на които формираме структурата и задаваме размерите им. Сега нека да разберем как да покажем необходимите документи в необходимите рамки и как да конфигурираме взаимодействието между техните прозорци.

И така, как да контролираме външния вид на прозорците, които създаваме? Всичко това се съдържа в атрибутите на тага Frame. Първият, който си струва да се спомене е Src. Вече го видяхме в етикета Img, когато разглеждахме вмъкването на изображения в Html кода. Същността му не се е променила и все още ви позволява да посочите пътя до документа, който трябва да бъде зареден в рамката.

Пътят до документа в Src може да бъде указан като . Относителните пътища обикновено се използват за документ, който се намира на вашия собствен ресурс, но ще ви трябват абсолютни пътища, когато искате да заредите документ от друг сайт в прозорец с рамка.

Ако атрибутът Src, указващ пътя до желания документ, не е посочен, тогава в прозореца ще бъде зареден празен документ. Лично аз веднъж направих подобно нещо за моя блог (като допълнителен елемент за навигация) и в същото време създадох отделна папка за него на хостинг сървъра и поставих там не само Html файл със структура на рамка (която нарекох индекс .html), но също и всички заредени в различни прозорци на документи, както и файлове с изображения, които са използвани като фонове.

Затова за мен беше най-лесно да използвам относителни връзки в атрибута Src на етикета Frame:

Трябва да се отбележи, че ако замените всички връзки, дадени в този код, от относителни към абсолютни (като https://site/navigator/joomla.html) и отворите този файл в браузър, документите, посочени във Frame, ще бъдат заредени от моя сървър и ще видите подобно изображение във вашия браузър. Освен това няма значение къде ще се намира вашият файл със структурата на рамката (index.html) - на вашия компютър или на хостинга.

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

Ако направите това, тогава всичко ще се случи точно както трябва - документът ще се отвори в долния десен прозорец. Но за това трябваше да използвам един малък трик, тъй като във версията по подразбиране документът се отваряше до целия размер на прозореца, заменяйки структурата на рамката, която изобщо не ми трябваше, тъй като менюто за навигация в лявата и горната рамка изчезна.

Как да отваряте документи чрез връзка в рамка

И така, когато говорихме за хипервръзки, споменахме атрибута на етикета „A“ като Target=_blank. Помните ли за какво служи? Правилно е да отворите свързания документ в нов прозорец. По подразбиране трябва да се отвори в същия прозорец, което е еквивалентно на target="_self".

Но това са възможности Мишенане са ограничени. Оказва се, че можете да добавите стойност към него като име на рамка, който е предварително зададен в специалния атрибут Name на тага Frame. Тогава документът през тази връзка няма да се отвори в същия прозорец, заемайки цялото му пространство, а в рамката, която сте посочили. Ясно е? Ако не изцяло, то ще стане ясно сега, когато анализираме примера.

И така, нека се върнем към нашия пример, показан на фигурата точно по-горе. Трябва да отваряме страници с помощта на връзки от левия прозорец в долната дясна (голяма) рамка. Следователно, първо трябва да дадете име на този голям прозорец, като използвате атрибута Name в етикета Frame.

Направиха го и го нарекоха “ктона”. Сега можете безопасно да отворите файла, който е зареден като меню в левия прозорец и да добавите атрибута Target="ktona" към всички тагове A в него:

Историята на Joomla и компонента VirtueMart

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

Достатъчно е просто да поставите елемента base target="ktona" между отварящия и затварящия тагове Head и всички връзки в Html кода на този документ ще отварят нови страници в указаната рамка, наречена "ktona":

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

Е, първо, трябва да дадете име на лявата вертикална рамка:

И във файла, който се зарежда в горния прозорец (gor.html), трябва да добавите основния елемент target="gor":

Това е, сега направихме всичко както трябва. Всички документи, следващи връзки от горната рамка, се отварят в левия прозорец, а всички връзки от нея ще отварят документи в централната и най-голяма рамка. Според мен всичко е просто и логично.

Атрибути на таг на рамка за персонализиране на външния вид на прозорците

Нека сега да видим какви атрибути, различни от Src и Name, могат да се използват в етикета Frame за персонализиране на външния вид на рамките. Да започнем с Превъртане. С него можем да конфигурираме показването на ленти за превъртане за всеки прозорец от вашата рамкова структура поотделно.

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

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

В моя някога съществуващ инструмент използвах стойността по подразбиране на Auto и лентите за превъртане в рамките се появиха според нуждите:

Следният атрибут на етикета Frame е Noresize- е единичен (няма стойности). Регистрирайки го, вие по този начин ще забраните промяната на размера му, което по подразбиране става чрез просто плъзгане на границата на рамките с мишката.

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

Друг визуален атрибут е Граница на рамката. С него можете да зададете дали да рисувате рамка (граница) между рамките или да не рисувате. Frameborder може да има само две възможни стойности - или 0 (не рисувайте рамка), или 1 (показвайте рамка). Стойността по подразбиране, разбира се, е 1.

Има една тънкост. Ако искате да премахнете видимата граница, тогава ще трябва да добавите Frameborder=0 към всички тагове Frame на рамките, между които искате да премахнете видимите граници.

Е, все още трябва да разгледаме няколко атрибута на етикета Frame - Ширина на полето и Височина на полето, които задават подложката по ширина (отдясно и отляво) и височина (отгоре и отдолу) от границите на прозореца до зареденото в него съдържание (числото означава броя на пикселите на подложката):

Защо не можете да направите уебсайт на рамки?

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

Сложните структури могат да имат хиляди различни състояния (варианти на документи, отворени в различни рамкови прозорци), но Url адресът на самата тази структура не се променя. Поради това ще има Не могат да се използват отметки на браузъраили изпращайте връзки към любимите си страници на други потребители. Защо?

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

Въпреки че, разбира се, този проблем може да бъде решен, но не с HTML инструменти, а с помощта на сървър (например Php) или клиентски езици за програмиране (JavaScript), и тези решения няма да бъдат сто процента ефективни. Такива решения всъщност ви позволяват да добавите допълнителни данни за текущото му състояние към Url адреса на структурата на рамката, но това не е лесно да се направи и надеждността няма да бъде абсолютна.

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

Когато потребител премине от резултатите от търсенето на Yandex или Google към вашия уебсайт, изграден въз основа на структура на рамка, ще се отвори само документът, който е зареден в една от рамките, а не цялата структура. Разбирате ли за какво говоря?

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

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

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

Например създадох рамкова структура, която нарекох „Навигатор“ (сега тя е временно премахната) и която се превърна в нещо като разширено външно меню за моя блог, което, струва ми се, трябва да опрости работата с ресурса и следователно подобряването на „без глупости“ има много, много силно влияние върху популяризирането на сайта.

Но, за да избегна проблеми с търсачките, затворих цялата структура на рамката от изглед и също така, за всеки случай, добавих мета тага Rodots към всичките му Html файлове, забранявайки тяхното индексиране:

Но всички тези ограничения се прилагат само за структури на таговете Frame и Frameset и вградени рамки в етикети на iframeнямат видими недостатъци и могат и дори трябва да се използват във вашите проекти, поне за вмъкване на видеоклипове от YouTube.

Късмет! Ще се видим скоро на страниците на сайта на блога

Може да се интересувате

Директиви за коментари и Doctype в Html код, както и концепцията за блокови и вградени елементи (тагове)
Вграждане и обект - Html тагове за показване на медийно съдържание (видео, флаш, аудио) на уеб страници
Img - Html таг за вмъкване на картина (Src), подравняване и обвиване на текст около нея (align), както и задаване на фон (background)
Какво представлява езикът за маркиране на хипертекст Html и как да видите списък с всички тагове в W3C валидатора Select, Option, Textarea, Label, Fieldset, Legend - Html тагове за формата на падащи списъци и текстови полета
Списъци в Html код - UL, OL, LI и DL тагове
Шрифт (лице, размер и цвят), Blockquote и Pre тагове - наследено текстово форматиране в чист HTML (не се използва CSS)
Как се задават цветовете в Html и CSS кода, избор на RGB нюанси в таблици, изход на Yandex и други програми

Терминът „рамка“ идва от английския език. В превод тази дума означава „рамка“ и представлява отделна област на прозореца. По своята структура такъв раздел е напълно завършен HTML документ.

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

История на технологиите

Днес можем да кажем, че решението да се оттеглим от работата с рамкова технология е окончателно взето. Сайтът https://www.w3.org/TR/html5-diff/#obsolete-elements ясно посочва, че обичайните тагове frame, frameset и noframes за създаване на такава структура са отхвърлени. Като аргумент се посочват данни, че използването на подобна структура се отразява негативно върху използваемостта на сайтовете и тяхната достъпност в интернет.

Но съвременните технологии поддържат елемента IFRAME. Използването му ви позволява да вмъквате рамки в текстови блокове на страници. Освен това такива елементи могат да бъдат подравнени спрямо самия текст. Важен момент: по принцип не можете да промените размера на вградените рамки. Те нямат съответен атрибут за преоразмеряване.

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

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

Предимства на рамките

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

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

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

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

Възможни недостатъци

Проблемите с уебсайтове, използващи рамки, се натрупваха постепенно, но днес те достигнаха прагово ниво. Сред основните недостатъци са:

1. Незадоволителна използваемост. Днес делът на потребителите на мобилни устройства и таблети с малки разделителни способности на екрана нараства и вече надхвърля броя на тези, които посещават сайтове от настолни компютри и лаптопи. И тук използването на рамки създава сериозни проблеми с отзивчивостта на страниците, когато се показват на различни устройства. Този проблем днес няма практическо решение.
2. Влошаване на достъпността на сайта за различни програми. Увеличаването на броя на допълнителните програми (например екранни четци) разкрива много по-лоша достъпност на информацията за четене.
3. Страниците не се показват правилно. Често оформлението на страници с такава структура изглежда неправилно в браузърите от гледна точка на дизайна. И това се дължи на характеристиките на технологията. От гледна точка на SEO, използването на рамки в HTML оформлението на страницата е крайно нежелателно.
4. Наличие на един адрес за цялата структура. В резултат на това вътрешните страници на такъв сайт не могат да бъдат маркирани. Това води до неудобство за потребителите.
5. Неправилно индексиране от търсачките. Наличието на уебсайт на няколко пълноценни документа, от които се формира една страница, значително усложнява работата на търсачките. Това води до значителни грешки по време на индексирането. В резултат на това неправилното дефиниране на теми и адреси на страници води до загуба на критично съдържание от индексиране.
6. Неуважение. Това е доста необичаен недостатък за ресурсите в мрежата. И все пак трябва да се каже, че фактът, че оформлението на сайтове на рамки става остаряло, води до факта, че авторите и собствениците на такива ресурси се считат за ретроградни. Но има някои изключения. Дори съвременните сайтове, които хостват чат стаи, обикновено използват рамки.

Индексиране на кадри от търсачките

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

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

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

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

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

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

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

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

Опитът на много оптимизатори и уебмастъри също предполага, че страниците с рамки не получават високи позиции в резултатите от търсенето. Това се случва дори ако са включени в базата данни за индексиране.

Характеристики на промоцията на уебсайтове в рамки

Някои търсачки индексират рамкираните файлове неправилно или много неправилно. В резултат базата данни на индекса се попълва не с адресите на родителските ресурси (както трябва да бъде), а с връзки към дъщерни сайтове.

За да се сведат до минимум проблемите при индексиране на сайтове въз основа на рамки, при описанието им се използват специални тагове и параметри. Основният елемент на структурата на контейнера е рамката. Той е този, който замества стандартното тяло; в изходния код. Всеки отделен контейнер в структурата е описан с рамка. Количеството му в кода на страницата съответства на броя на отделните секции, показвани в прозореца на браузъра при преглед.

Тези етикети трябва да бъдат поставени на главната страница на сайта и след това да дублират съдържанието във всеки от тях.