[Помогите] Какие теги HTML5 и как правильно нужно их использовать, чтобы сделать оздать нужную структуру сайта

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем Владислав1983, 27 янв 2016.

  1. Владислав1983

    Владислав1983

    Регистрация:
    27 янв 2016
    Сообщения:
    5
    Симпатии:
    0
    Я читал про новые теги HTML5, но до конца так и не смог разобраться. На разных сайтах по-разному пишут.
    1) Нужно ли создавать слой который будет содержать весь сайт? И если да, то как он будет называться section или article или еще как-то?
    2) Меню сайта nav должно быть внутри шапки сайта header или отдельным слоем?
    3) Для меню сайта лучше использовать тег nav или menu?
    4) Если рассмотреть на примере сайта. Сайт имеет фиксированную ширину.
    а) вверху идет блок шапки и он будет сделан тегом header.
    б) далее, блок главного и единственного меню на сайте, только будет это отдельный блок или в тег header его нужно вставить?
    в) на главной странице далее идет блок с меняющимися картинками (баннер) во всю ширину страницы. Какой у него будет тег — section и, в каком теге он должен находится — header или отдельным блоком?
    г) следующим блоком идет полоска с вопросом и кнопкой. Какой нужен для нее тег и будет ли она находится в отдельном блоке или внутри другого?
    д) после идет описание страницы main. В нем будет, только заголовок, текст абзацами и ссылки. Нужно ли создавать внутренний тег section, в котором все это будет находится? Где-то в интернете я такое видел.
    е) после идет подвал страницы footer.
    ж) могут ли в HTML 5 использоваться теги div? Бывает, что сайт сложен и подключаются какие-то скрипты вроде jquery и у них бывает большая слоевая структура, например внешний div, внутренний div, другой div во внешнем div’е. Что с ними делать? Так и оставлять или нужно заменять на section, article, aside или еще какие?
     
  2. iga

    iga

    Регистрация:
    6 фев 2014
    Сообщения:
    145
    Симпатии:
    20
    Как по мне, так html5 тэги - они больше логические, а не структурные. Вместо каждого из них можно легко использовать div, в разметке, естественно, можно(и нужно) использовать обычные дивы и прочие стандартные тэги. Остальное используйте там, где вам подсказывает здравый смысл.
    head - он и в африке head. И это не обязательно шапка сайта - это может быть и шапка перед статьёй или шапка рекламного блока. С футером та же картина. Вторичная инфа в aside - сайдбар, например. Ну и т.д., следуя здравому смыслу - это как разметка литературного произведения - главы, заголовки, подразделы, абзацы, предложения, слова и, блин, морфемы:Acute:.
     
  3. Владислав1983

    Владислав1983

    Регистрация:
    27 янв 2016
    Сообщения:
    5
    Симпатии:
    0
    Работать будет. Я знаю. Правда поисковики могут неправильно понять, если что не так написано и рейтинг понизить. Но все-таки как правильно писать. Ели уж переходить на HTMl 5, то нужно правильно писать. По поводу главного меню. Видел в одном месте внутри тега header, в другом - отдельно. Как понимать? Неужели в 5-ой как хочешь так и делай. Возможно, в теории все должно быть по стандарту, а на практике многие разработчики как хотят, так и пишут раз уж технически ошибок не выдает. Мне просто интересно понять на моем примере как.
     
  4. AnOcToJI

    AnOcToJI

    Регистрация:
    28 дек 2012
    Сообщения:
    293
    Симпатии:
    186
    воу вы полегче xD head именно что и в африке head он может быть только один! А вот header уже может быть в n-ом количестве
     
    iga нравится это.
  5. Владислав1983

    Владислав1983

    Регистрация:
    27 янв 2016
    Сообщения:
    5
    Симпатии:
    0
    А на моем примере, какая будет структура и название тегов?
     
  6. iga

    iga

    Регистрация:
    6 фев 2014
    Сообщения:
    145
    Симпатии:
    20
    Ой, согрешил, в запаре...
    У вас есть дизайн-макет? Скиньте хоть картинку того, что должно быть, раз уж вам так хочется нтмл5 видеть.
     
  7. Владислав1983

    Владислав1983

    Регистрация:
    27 янв 2016
    Сообщения:
    5
    Симпатии:
    0
    http://vlad11183.wix.com/technika
     
  8. iga

    iga

    Регистрация:
    6 фев 2014
    Сообщения:
    145
    Симпатии:
    20
    Мне кажется, если сейчас разложить вам, как кто-то из нас видит структуру этого макета в html5, толку много не будет.
    Скачайте с этого же сайта какой-нибудь премиум шаблон интернет магазина и начните его разбирать по кусочкам. Думаю осознание того, что там к чему, придёт к вам достаточно быстро. Просто внимательно изучите код готового проекта и спроецируйте полученную инфу на свой.
     
  9. Владислав1983

    Владислав1983

    Регистрация:
    27 янв 2016
    Сообщения:
    5
    Симпатии:
    0
    В каком смысле премиум. Покупать его. У данного сайта нет структуры. Там все спрятано. Wix код не предоставляет в открытом виде. В Wix я начал делать сайт, т.к. планировался интернет-магазин, но потом было решено, что нужно сделать простой сайт типа сайта-визитки с прайсом и обратным звонком и прочими текстовыми страницами без интернет-магазина, т.к. у них очень дорого.
     
  10. iga

    iga

    Регистрация:
    6 фев 2014
    Сообщения:
    145
    Симпатии:
    20
    Пишу же - скачать
    Под структурой не имелся в виду код.
    Мой совет - найдите готовый шаблон лэндинга. Купите себе книжку по html. Раз вы начали делать сайт на викс, подозреваю, знания ваши в сфере разметки не глубоки. И постепенно допиливайте шаблон под свои нужды.