Валидация, несомненно, является одним из наиболее важных аспектов хорошего веб-дизайна. А в системе управления контентом, такой как WordPress, вы должны быть осторожны с HTML и CSS как в своей теме, так и в контенте. В этом уроке мы поговорим о проверке веб-сайта WordPress.
Зачем проверять сайт?
Или, возможно, лучший вопрос в том, что означает проверка?
Проще говоря, проверка веб-страницы означает соответствие кода страницы стандартам World Wide Web Consortium (W3C). Обычно это делается путем проверки вывода HTML и CSS ваших веб-страниц с помощью инструмента проверки. Так же, как существуют грамматические правила на разных языках, также существуют правила в компьютерном программировании. Валидация проверяет вашу веб-страницу, чтобы увидеть, соответствует ли страница этим правилам.
Кроме того, мы также должны поддерживать код нашей темы в соответствии со стандартами кодирования WordPress . Это можно сделать вручную (имея здравый смысл при кодировании темы WordPress) или используя такие инструменты, как знаменитый плагин Theme Check .
А зачем нам проверять, спросите вы? Там более одного ответа. Давайте посмотрим:
Проверка позволяет вам отлаживать ваши страницы
Когда я впервые начал играть с HTML в 2005 году, я закодировал эти ужасные веб-страницы, полные ошибок, таких как неправильное вложение элементов или забыв закрывать открытые мной теги. CSS был еще хуже: простая ошибка с точкой с запятой или необнаружимая опечатка означала, что мне нужно все больше и больше времени для моих экспериментов и проектов.
Но даже после девяти лет напряженной работы я могу ошибаться, несмотря на то, что я почти эксперт в HTML и CSS. К счастью, такие инструменты, как валидатор HTML W3C, могут помочь нам отладить почти каждую ошибку в вашем HTML-коде. Будь то вставка кода напрямую, загрузка файла HTML или отправка URI веб-страницы, вы можете увидеть, что вы сделали неправильно в коде, где проблема, и предложения о том, как ее исправить. Исправление этих ошибок может даже предотвратить большие проблемы.
Результаты валидации в лучшем SEO
Никогда не забывайте этот факт: пауки поисковых систем любят семантические веб-страницы . Это помогает этим сканерам лучше понимать страницы, а в списках SERP вы, естественно, получаете преимущество перед страницами, которые не проверяются.
Кроме того, это показывает, что вы заботитесь о своем сайте. Проверка вашей веб-страницы означает, что вы попытались создать структурную семантическую веб-страницу (или у вас уже есть инструменты или знания для создания этой страницы). Это огромный плюс для поисковых систем, и этот «огромный плюс» может поднять ваш рейтинг.
Проверка делает ваш сайт более доступным и совместимым
Вы когда-нибудь задумывались о том, как браузер читает веб-страницу? У них есть «движки» для анализа кода и преобразования его в визуальный опыт для людей. К сожалению, разные веб-браузеры имеют разные движки, и это может привести к разной обработке ваших страниц.
На действительной веб-странице большинство различий действительно крошечные и приемлемы почти для всех, но недопустимая веб-страница может читаться настолько по-разному, что люди могут даже не иметь возможности правильно видеть ваши страницы в своих iPhone, Kindles или любом другом браузере, каким бы они ни были. с помощью. Валидация устраняет практически все важные различия и делает вашу веб-страницу доступной для чтения практически всеми веб-браузерами.
Инструменты проверки для вашего сайта WordPress
Теперь мы знаем, почему мы должны проверять наши веб-страницы, давайте посмотрим, как это сделать. Чтобы пропустить двойной разговор, я не собираюсь упоминать, что вам нужно проверить содержание вашего сообщения; но имейте в виду, что большинство вещей, которые я скажу, касается и контента, который вы пишете в постах и страницах WordPress.
Проверка кода HTML
Служба проверки разметки HTML W3C, вероятно, является самым простым и самым популярным инструментом для проверки и проверки вашей веб-страницы. Используя этот инструмент, вы можете обнаружить почти каждую ошибку проверки, начиная от отсутствующих атрибутов ALT для ваших тегов IMG и заканчивая размещением элемента уровня блока внутри встроенного элемента.
Вы можете оценить свой HTML-код, указав адрес своей веб-страницы, загрузив HTML-файл или непосредственно вставив HTML-код.
Проверка стилей CSS
W3C CSS Validation Service, как и инструмент проверки HTML, является самым популярным инструментом проверки CSS в Интернете. Как и в HTML-валидаторе, вы можете проверить свой CSS, вставив URI, загрузив файл CSS или вставив свой код напрямую.
Обратите внимание, что этот инструмент будет обнаруживать «хаки CSS» как ошибки, и чтобы оставаться действительным, вам нужно найти другой способ поддержки старых браузеров.
Проверка WordPress каналов
Хотя это не очень популярно, «проверка фида» является еще одним важным аспектом проверки вашего сайта. И вы можете проверить свой канал WordPress на наличие ошибок с помощью службы проверки каналов W3C для Atom и RSS . К счастью (и, естественно,) каналы WordPress по умолчанию проверяются идеально, поэтому ваши каналы, вероятно, уже действительны, если вы не используете плагин для изменения каналов.
Кроме того, есть заслуживающий внимания инструмент под названием Unicorn от W3C , который по сути является унифицированным валидатором. Хотя это выглядит как прекращенное приложение с открытым исходным кодом , оно все же дает удовлетворительные результаты в отношении проверки HTML, CSS, подачи и i18n. Страница результатов немного сбивает с толку, но если вам когда-нибудь понадобится получить результаты нескольких проверочных тестов, вам понравится этот инструмент.
Проверка вашей темы WordPress с проверкой тем
Наряду со стандартами W3C, WordPress также имеет свои стандарты:
- Стандарты кодирования PHP включают правильное использование одинарных и двойных кавычек, постоянное использование полных тегов PHP, правильное использование пробелов, использование условий Yoda и так далее.
- Стандарты кодирования HTML относятся к написанию действительного кода HTML; использование значений атрибутов со строчными символами, перенос значений атрибутов в кавычки, использование пробелов с логическими отступами и т. д.
- Стандарты кодирования CSS включают правильное структурирование таблицы стилей, использование строчных имен (с дефисами для разделения слов) в селекторах, упорядочивание свойств, правильное комментирование и тому подобное.
- Стандарты кодирования JavaScript вызывают правильное использование фигурных скобок, именования функций и переменных с помощью camelCase , определения анонимной функции, если будет использоваться jQuery, и так далее.
- Стандарты рецензирования тем включают в себя написание качественного кода (естественно), разделение функциональности с помощью плагинов, правильное использование тегов и ловушек шаблонов, поддержку классов CSS, созданных WordPress, защиту темы, надлежащее лицензирование, правильную организацию файлов темы, написание достаточной документации. Слишком много!
Плагин Theme Check проверяет вашу тему на предмет этих стандартов, особенно стандартов «обзора тем». Результат может быть как удручающим, так и мотивирующим, поэтому не теряйте надежду и постарайтесь устранить ошибки, чтобы создать фантастическую тему WordPress.
Как только я начал писать эту статью, вышел новый веб-сайт под названием ThemeCheck.org, который делает именно то, что делает плагин Theme Check. Вам не нужно устанавливать плагин Theme Check; вместо этого вы можете загрузить свою тему на веб-сайт и получить свой счет вместе с рекомендациями по улучшению вашей темы (если она понадобится). Кроме того, вы можете поделиться оценкой вашей темы, разместив предоставленный ими значок. Аккуратно, не правда ли?
Завершение
Проверка вашего сайта очень важна, никаких вопросов по этому поводу. Пока вы проверяете свои веб-страницы и сохраняете их, чтобы они оставались действительными, вы будете только выигрывать от этого.
Что вы думаете о важности проверки? Поспособствуйте этой статье со своими комментариями! И если вам понравился этот урок, не забудьте поделиться им с друзьями!