Блок новости разметка Вконтакте что это

Содержание

Вконтакте использует собственный формат разметки — VK Markdown. Она включает в себя следующие теги и синтаксические конструкции:

2. Жирный и курсивный текст:
**Текст** — для жирного
*Текст* — для курсивного

3. Ссылки:
[Текст ссылки](адрес ссылки)

4. Изображения:
![](адрес изображения)

5. Цитаты:
> Текст цитаты

7. Списки:
* Элемент списка
* Подэлемент списка
1. Нумерованный список

8. Горизонтальная линия:
—

9. Смайлики:
и т. д.

* Элемент списка 1
* Элемент списка 2
* Подэлемент списка

1. Нумерованный список 1
2. Нумерованный список 2

Три главных слова

Некоторые теги не могут использоваться без атрибутов.

Простейшая страница

Страница сложнее

Спецификация HTML

Категории содержания

Metadata content — метаданные для браузеров, поисковиков и так далее (всё, что в ).
Flow content — потоковый контент (всё, что в ).
Sectioning content — крупные смысловые разделы документа.
Heading content – заголовки.
Phrasing content — фразовый контент, сам текст документа и мелкие текстовые элементы, которые мельче абзаца.
Embedded content — встраиваемый контент (изображения, видео, аудио и так далее).
Interactive content — интерактивные элементы, то, с чем взаимодействует пользователь.

Валидатор

Обзор тегов

Крупные смысловые разделы

Значение: независимая, отделяемая смысловая единица, например комментарий, твит, статья, виджет ВК и так далее.
Особенности: желателен заголовок внутри. – Типовые ошибки: путают с тегами и .

Значение: смысловой раздел документа. Неотделяемый, в отличие от .
Особенности: желателен заголовок внутри. – Типовые ошибки: путают с тегами и .

Значение: смысловой раздел документа. Неотделяемый, в отличие от .
Особенности: желателен заголовок внутри. – Типовые ошибки: путают с тегами и .

Еще по теме: Как сделать интерфейс в ВК меньше

Заголовки

Значение: заголовки смысловых разделов.
Особенности:
Желателен один на странице.
Не желательны пропуски в уровнях заголовков на странице. Внутри заголовков можно начинать с .
На главных страницах не всегда рисуют заголовок первого уровня.
Типовые ошибки:
Определение уровня заголовка по размеру текста на макете.
Не весь крупный текст – заголовки

1.3 — Вводный блок — Wiki страницы для продвижения в ВК (Онлайн wiki-разметка бесплатно)

Поток

Значение: вводная часть смыслового раздела или всего сайта, обычно содержит подсказки и навигацию.
Особенности: этих элементов может быть несколько на странице.
Типовые ошибки: использовать только как шапку сайта.

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

Значение: неупорядоченный и упорядоченный списки.
Особенности:
Если существует набор однородных элементов, порядок которых не важен (пункты меню), то используем

Типовые ошибки
Объединять в список неоднородные элементы.
Использовать что-то, кроме
в качестве дочерних элементов списка.
Неправильная разметка вложенных списков.

Параграф в HTML – это структурный элемент, а не смысловой.
Параграфы можно явно выделять с помощью тега
. Если не выделите явно, они всё равно будут существовать неявно.
– универсальный контейнер для группировки мелких фразовых элементов, отделения их друг от друга, особенно, когда нужна стилизация.
Значение: параграф (как структурный элемент, а не как смысловой).
Типовые ошибки: использовать внутри параграфов не фразовые элементы, например, списки.

Значение: многомерные связанные данные (табличные данные).
Особенности:
Простейший, двумерный, вид связанных данных – «параметр-значение». Его можно описать как таблицей, так и списком определений (тег ).
Когда измерений больше (параметр-значение1-значение2-…), подходят только таблицы. Пример: тарифы сотового оператора, расписание поездов.
Типовые ошибки:
Использовать таблицы для сеток (так уже не делают).
Не использовать таблицы там, где они нужны.

Значение: многомерные связанные данные (табличные данные).
Особенности:
Простейший, двумерный, вид связанных данных – «параметр-значение». Его можно описать как таблицей, так и списком определений (тег ).
Когда измерений больше (параметр-значение1-значение2-…), подходят только таблицы. Пример: тарифы сотового оператора, расписание поездов.
Типовые ошибки:
Использовать таблицы для сеток (так уже не делают).
Не использовать таблицы там, где они нужны.

Еще по теме: Массфолловинг Вконтакте что это

Различия , ,

Можете дать имя разделу и вынести этот раздел на другой сайт?
Можете дать имя разделу, но вынести на другой сайт не можете?
Не можете дать имя? Вменяемое имя, а не «новости и фотогалерея» или «правая колонка».

Фразовые

Значение: ссылка.
Особенности: если атрибута href нет, то это заглушка («здесь будет ссылка при других обстоятельствах»). Ссылка без href используется, чтобы не делать ссылку на саму себя.
Типовые ошибки: использовать вместо ссылок другие элементы, например, кнопки.

Значение: кнопка.
Особенности:
Лучше явно указывать атрибут type. Его значение по умолчанию — submit, но часто нужно значение button.
Кнопка не обязательно должна находиться в пределах формы. Часто это просто интерактивный элемент, который «оживляется» с помощью JavaScript. Например, кнопка закрытия всплывающего окна.
Типовые ошибки: использовать вместо кнопок другие элементы, например, ссылки или спаны.

Значение: текст, который выделяется для привлечения внимания, но без придания значимости.
Типовые ошибки: слишком частое неуместное использование.
Подробнее про теги , , , :
http://html5doctor.com/i-b-em-strong-element

Значение: перенос строки.
Типовые ошибки:
Слишком частое использование.
Использование вместо параграфов.

Значение: универсальный фразовый элемент без собственного значения.
Особенности: смысл этому элементу придаётся с помощью атрибута class.

Глобальные атрибуты

Атрибуты, которые могут быть у любого тега. – class – accesskey – contenteditable – contextmenu – dir – draggable – dropzone – hidden – id – lang – spellcheck – style – tabindex – title – translate – атрибуты для обработки событий – data-атрибуты

Атрибут class

Описывает один или несколько классов (группа предметов или явлений, обладающих общими признаками), к которым принадлежит элемент.
Помогает уточнить смысл и предназначение каждого тега.
Множественные классы перечисляются через пробел.
Наш лучший друг при разметке!

Как делать разметку

Что такое разметка

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

Подходы к разметке

Страница как документ
Страница как интерфейс
Дивянка

Страница как документ

Задача — восстановить из макета первоначальную логическую структуру документа.
Можно добавлять то, чего не видно на макете.
В разметку попадает не всё, что есть на макете.

Алгоритм разметки

Как называть классы?

Имя класса должно отражать назначение элемента, а не рассказывать о его внешнем виде.
Воздержитесь от транслита.

Еще по теме: Vk капсула мини что умеет

Типовые имена классов

Пространства имён

Упрощают именование классов.
Разбивают код на относительно независимые блоки.
Предотвращают нежелательное перемешивание стилей.
Ускоряют разработку и упрощают поддержку.

Признаки хорошей разметки

Простота

Использовано минимально необходимое количество тегов.
Имена классов рассказывают о назначении элементов.
Есть чёткие границы смысловых блоков, легко понять к какому блоку принадлежит тег.

Соблюдение стиля кодирования

Ориентируемся на Кодгайды

Отсутствие лишних элементов

Декоративные элементы отсутствуют в разметке

Работоспособность

Доступность всего контента
Содержательный текст (вспомните шапку Седоны, где есть декоративный текст) должен быть в HTML-разметке, содержательные изображения должны быть размечены с помощью .

Корректный сбор данных от пользователей
Формы работоспособны, у полей форм есть подходящие имена и значения.

Связность документов
Всё, что должно быть ссылками сделано ссылками.

О разметке

Спецификация HTML
Спецификация HTML, перевод
Зачем нужны заголовки
Секции в футере
Ссылки вокруг блоков
W3C или WHATWG
Обсуждения о правильном использовании тегов в комментариях
Видеозапись доклада «Семантика или смерть»
Слова, часто используемые в CSS-классах
Как отличить контентное изображение от декоративного

Статьи о стилях кодирования

Ставить или не ставить закрывающий слеш в одиночных тегах
Кодгайд: почему, зачем и как?

Кодгайды

Кодгайд от HTML Academy
Кодгайд от MDO
Кодгайд от GOOGLE

Источник: www.andrewblog.ru

Что случилось с Wiki разметкой ВКОНТАКТЕ?

Разрабатывал меню для своей группы! В один прекрасный день все стало показываться по другому. Что случилось? При этом это изменение затронуло меню всех групп вконтакте.

текст при наведении

бонус за лучший ответ (выдан): 10 кредитов
комментировать
в избранное
КСАНК А84 [61.9K]
9 лет назад

Вконтакте регулярно что-то меняет в принципах своей разметки. Я с самого начала занимаюсь группами в данной социальной сети, пережила немало изменений. Так что бывает. Лучше всего написать письмо в поддержку, чтобы они дали точный ответ, какие именно изменения были внесены в недавнем времени.

автор вопроса выбрал этот ответ лучшим
комментировать
в избранное ссылка отблагодарить
9 лет назад

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

Источник: www.bolshoyvopros.ru

Похожие записи: