Веб-дизайн

  

Веб-дизайн | Технологии Интернета

Технологии веб-дизайна. Создание сайта. HTML

Ничего лишнего. Только нужная информация, изложенная самым простым языком.

Веб-термины

      Аa      Бб      Вв       Гг       Дд       Ее       Жж       Зз       Ии       Кк      Лл      Мм      Нн       Оо      Пп       Рр       Сс     Тт       Уу      Фф     Хх    Чч      Яя sp




Веб-дизайн. Связь

СВЯЗЬ




МЕНЮ САЙТА   


 


вд Интернет, Сеть и сетевые ресурсы

вд Терминология веб-дизайна

вд Термин «веб-дизайн»

вд Термин «технологии веб-дизайна»

вд Термин «веб-проект»

вд Термин «веб-страница»

вд Термин «сетевые ресурсы»

вд Термин «веб-архитектура»

вд Термин «имя»

вд Структура Интернета. Домен

вд Термин «домен»

вд Домены первого уровня. Перечень

вд Создание сайта. Общие сведения

вд Сайт. Подготовка к публикации

вд Сайт. Регистрация домена

вд Выбор имени домена

вд Сайт. Сервер и хостинг, их выбор

вд DNS - «прописка» домена

вд Публикация сайта

вд HTML. Гипертекстовая разметка

вд HTML. Что такое тег (дескриптор)

вд HTML. Гиперссылка и гипертекст

вд HTML. Метатеги (теги МЕТА)

вд Метатеги группы «http-equiv»

вд Метатеги группы «name»


вд Алгоритмы поисковых систем

вд Дизайн-макет

вд Веб-термины: ГС и СДЛ

вд Сео-оптимизация

вд Веб-термин: сервер

вд Перелинковка

вд Семантическое ядро

вд Термин: гипертекст

вд Приложение

вд Курсы веб-дизайна

вд Требования к сайту

вд Компоненты форм

вд Создание форм

вд Иерархия вложенных тегов

вд Вложенность тегов

вд Создание сайтов и CSS

вд Синтаксис тегов

вд Создание сайтов и сложные теги

вд Веб-шпаргалка

вд Комментарии

вд Подборка авторских сайтов

вд Креатив

 

space  

sp

Тема

Технологии веб-дизайна. Создание сайта. Иерархия вложенных тегов sp



Создание сайта. Иерархия вложенных тегов

Начнём с того, на чём закончен предыдущий материал: таким образом, внутри первого тега самостоятельно существует другой тег. В технологиях веб-дизайна ситуация не просто обыденная, а обязательная, так как на сих банальных, но исключительно полезных приёмах веб-конструирования выстроены все корректные принципы создания сайтов.

Особый интерес в ситуации, когда теги вложены друг в друга, вызывает возникающая иерархическая зависимость вложенных дескрипторов — относительность младших тегов (их ещё зовут "дочерние", "ведОмые" или "подчинённые"). Выражается это в том, что:

Куда бы ни перемещался старший тег, младший будет СЧИТАТЬ СВОЁ РАСПОЛОЖЕНИЕ лишь относительно своего родителя (старшего тега). Если, например, переместить нашу "старшую" таблицу вправо, то ОТНОСИТЕЛЬНОЕ ПОЛОЖЕНИЕ младшей таблицы НЕ изменится — она по-прежнему будет считать своё положение по центру родителя.

Делаем? — меняем только первую строку:

<div align="right">
<table border="1" cellpadding="0" cellspacing="0" width="200" height="100">
<tr>
<td>
<div align="center">
<table border="1" cellpadding="0" cellspacing="0" width="100" height="50">
<tr>
<td></td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>

Догадываетесь, какие мощнейшие возможности для создания сайтов скрываются за таким поведением вложенных тегов? Очень, очень эффективный инструмент в технологиях веб-дизайна...

Но теперь обратим внимание на другую, весьма серьёзную проблему: чтение листинга кода.

Как видите, в таблицах ещё нет никаких данных, — а теперь представьте, что случится, когда эти данные там окажутся?

Листинг кода

Продвижение сайтов с гарантиями maxi-top.ru

Поэтому СПЛОШНОЙ листинг практически не применяется, а код пишут и ЧИТАЮТ, сдвигая подчинённые разряды через функцию tab (браузеры делают это автоматически). Выглядит подготовленный к листингу код вот так:

<div align="center">
  <table border="1" cellpadding="0" cellspacing="0" width="200" height="100">
     <tr>
         <td>
             <div align="center">
<table border="1" cellpadding="0" cellspacing="0" width="100" height="50">
                  <tr>
                 <td></td>
                  </tr>
               </table>
           </div>
      </td>
   </tr>
</table>
</div>

Иерархический уровень вложенности тегов

- как видите, это чрезвычайно облегчает восприятие кода. Пары соответствующих тегов (открывающий / закрывающий) отслеживаются СОГЛАСНО ИЕРАРХИЧЕСКИМ УРОВНЯМ — я пометил парные теги одинаковыми цветами.

Точно так же отслеживаются все вложенности тегов в любых страницах. А как это выглядит на практике, увидим в соответствующих материалах.



Статья:

Создание сайта. Иерархия вложенных тегов

Опорные темы:

Веб-дизайн, технологии и термины (терминология)



указатель

Назад

указатель

К началу

указатель

Далее

 

 




Веб-дизайн. Лого  

Веб-дизайн | Технологии  На главную


 


 

«Интернет без ошибок». Художественная мастерская С. Добрынина © 2008-2017. Все права защищены



 

 

 

 

Последнее обновление 20.06.2017