Ганс-Кристиан Диршерл
Мы показываем бесплатные инструменты для веб-мастеров для проверки исходного кода, поисковой оптимизации и анализа трафика - незаменим, если вы хотите адаптировать сайт к успеху. Включает в себя дополнения для веб-мастеров Firefox.
увеличить Веб-страницы также могут быть оптимизированы для смартфонов с правильным набором инструментов
Если твой Готовый сайт, Вы должны начать с правильных инструментов для веб-мастеров, чтобы оптимизировать их. Во-первых, вы должны проверить исходный код, чтобы убедиться, что он максимально соответствует стандартам и содержит как можно меньше ошибок. Также проверьте, насколько быстро страница доставляется или загружается в браузере посетителя. Тогда пришло время для поисковой оптимизации (страница 2 этой статьи). Если ваша страница работает правильно, вам необходимо отслеживать трафик и оценивать поведение посетителей (страница 3 этой статьи). Мы показываем отличные инструменты для веб-мастеров для этих трех задач, которые все бесплатны. Многие из этих инструментов для веб-мастеров могут быть интегрированы в Firefox как умное дополнение.
Консорциум World Wide Web W3C является международным органом, который занимается дальнейшим развитием веб-стандартов. Помимо прочего, он отвечает за стандартизацию HTML и CSS (процесс, который занимает много времени для получения ощутимых результатов). W3C предоставляет некоторые веб-инструменты, которые позволяют вам проверять HTML и CSS-код вашего сайта на соответствие указанным веб-стандартам. По сути, вы должны стремиться максимально соответствовать требованиям. Потому что поисковые системы предпочитают страницы с чистым кодом. Хотя некоторые ошибки в исходном коде совершенно нормальны, слишком много сообщений об ошибках не должны генерировать ваш сайт, чтобы наказываться Google и другими поисковыми системами в Интернете.
увеличить Мы нашли некоторые ошибки на странице, проверенной службой проверки разметки W3C.Чтобы специально проверить HTML-код вашей страницы на соответствие стандарту, используйте средство проверки HTML. Для проверки кода CSS вам понадобится валидатор CSS. Например, проверьте текст HTML с помощью Служба проверки разметки W3C. Просто введите URL-адрес веб-сайта для просмотра здесь. Кроме того, вы можете загрузить файл с исходным кодом или скопировать фрагмент кода в окно ввода. Последние два подхода рекомендуются, если ваша страница еще не в сети. Так что для экзамена в процессе разработки. Когда процесс проверки завершен, инструмент предоставляет вам список сообщений об ошибках, которые различают истинные ошибки (белый крест на красном фоне) и предупреждения (желтый предупреждающий треугольник с восклицательным знаком).
Инструменты проверки для HTML, CSS & Co
Как упоминалось ранее, вы всегда найдете ошибки в своем коде. Если это мелочи, такие как теги без меток или неуместных тегов, или разрывы нескольких абзацев, их можно вызвать с помощью небольшого инструмента восстановления. HTML TIDY можно устранить (графический интерфейс пользователя называется HTML Tidy GUI. Этот инструмент, однако, не будет развиваться дальше).
WDG HTML Validator
WDG HTML Validator это онлайн-инструмент для просмотра HTML, XHTML, MATHML, SMIL, SVG, WAP / WML и DocBook / XML. Проверка страницы выполняется очень быстро. Перед обзором вы можете сделать некоторые критерии теста. Как файл, исходный код также можно загрузить, а затем проверить. Просто попробуйте этот валидатор и имейте в виду, что вы можете не только проверить готовую страницу, но и проверить исходный код на соответствие правилам во время разработки. Это позволяет избежать последующей трудоемкой переделки.
Как упоминалось выше, не только HTML-часть кода вашего сайта должна быть действительной. По крайней мере, так же важны каскадные таблицы стилей, для краткости называемые CSS, которые по сути определяют дизайн вашей страницы. И поэтому, по логике вещей, существуют также соответствующие механизмы проверки.
Также с CSS сторона W3C является первой остановкой. когда CSS Validator Перед тестированием вы можете указать, какие стандарты CSS проверять на соответствие правилам. Практически: служба проверки CSS также может быть бесплатной загруженный а затем используется непосредственно на вашем компьютере. Более всесторонние предложения по тестированию страниц Qualidator (Валидатор качества). Инструмент также проверяет юзабилити и успешность мер SEO (подробнее об этом позже), например, насколько хорошо читаются URL-адреса. Тем не менее, вы можете обсудить некоторые рейтинги Qualidator. Так что всплывающие окна вообще осуждаются - это незнакомо. Важно: без регистрации можно проверить только первые пять страниц сайта. Если вы хотите проверить больше страниц, вы должны зарегистрироваться.
увеличить Для Firefox существует ряд инструментов для веб-мастеров в виде дополнений.
Инструменты для веб-мастеров: аддоны Firefox для анализа исходного кода
Firefox можно использовать с правильными дополнениями к отличному инструменту анализа. Аддон Firefox HTML Validator например, содержит функциональность вышеупомянутого HTML TIDY. Двойным щелчком мыши по значку можно отобразить исходный текст страницы, включая сообщения об ошибках. Если вы нажмете на сообщения об ошибках, соответствующая точка в исходном тексте перейдет к. При этом вы можете проверить страницу, открытую в данный момент в браузере.
Профессиональные расширения для Firefox
Панель инструментов веб-разработчика
увеличить Панель инструментов веб-разработчика предоставляет обширную информацию о веб-сайте, который вы просматриваете в настоящее время.На скриншоте показаны варианты обработки формы.WebDeveloper панели инструментов это оригинальная надстройка Firefox для любого пользователя и разработчика веб-сайта, который хочет проанализировать страницу, открытую в данный момент в браузере. Кроме того, это также очень полезно для "нормальных" серферов. На самом деле, веб-разработчик предоставляет много ценной информации о поведении в Интернете и проблемах конфиденциальности. Таким образом, вы можете с комфортом просмотреть все файлы cookie одним щелчком мыши и сразу увидеть, какие веб-страницы вы можете распознать. Любой, кто придает особое значение защите данных, также может легко удалить историю браузера и содержимое кэша через Web Developer.
Вы также можете отключить кэш браузера, чтобы браузер не отображал старую версию веб-страницы. Вы можете специально отключить Java и Javascript (последний также очень хорош с расширением NoScript) и предотвратить всплывающие окна.
Особенности для разработчиков сайтов
Но теперь мы подошли к захватывающим функциям для разработчиков сайтов. Вы можете выделить отдельные элементы страницы. Например, все формы, которые вы можете ввести. Или все графики (которые вы также можете скрыть), для которых вы можете просмотреть подробную информацию; Например, их размер и альтернативный текст - оба являются важными аспектами для оптимизации SEO. Вы можете выборочно отображать Javascripts открытой страницы и редактировать их HTML-компоненты. Конечно, инструменты проверки для HTML и CSS, а также инспектор DOM также являются частью функциональности Web Developer.
Если вы хотите специально проанализировать CSS страницы, скрыть все стили одним щелчком мыши и увидеть страницу голой. Но с другой стороны, это работает также: вы можете ясно отображать определения CSS и редактировать их для целей тестирования.
Вывод: обязательно установите панель инструментов веб-разработчика
В общем, панель инструментов веб-разработчика является незаменимым инструментом, который должны устанавливать не только разработчики, но и все заинтересованные и амбициозные пользователи Интернета. Очень важно: рядом с веб-разработчиком стоит Firebug с Расстояние наиболее важное расширение среди инструментов для веб-мастеров для Firefox.
увеличить Инструменты разработчика встроены непосредственно в Google Chrome, поэтому дополнительный плагин / надстройка не требуется.
Тем не менее, Firefox уже поставляется со стандартными встроенными инструментами для веб-разработчиков. Вы можете найти их в разделе «Инструменты, веб-разработчики». Google Chrome и Internet Explorer также имеют встроенные инструменты разработчика, аналогичные дополнениям Firefox Web Developer и Firebug.
Профессионально исследуйте сайты с Firebug - вот как это работает
Colorzilla: определить значения цвета на веб-сайте
Аддон Firefox ColorZilla отображает значения цвета из того места, где находится курсор мыши. Вы можете скопировать и вставить определенные значения цвета.
MeasureIt: измерение расстояния в пикселях на веб-сайте
Если вы хотите измерить расстояния и длины на веб-странице, это все Firefox Addon Measureit Твой правитель. Активируйте Measurelt, нажав на значок линейки. Страница будет выделена серым цветом, и вы можете нарисовать прямоугольник нажатием левой кнопки мыши, на котором в пикселях будут отображаться как горизонтальная, так и вертикальная длины.
Руководства: дополнительные инструменты для анализа веб-сайтов
Page Speed Online тестирует производительность страницы
с Скорость страницы в Интернете ( Расширение для Google Chrome ) Попробуйте производительность бесплатно и получите предложения по улучшению, чтобы сократить время загрузки вашего сайта.
Инструменты поисковой оптимизации для веб-мастеров
Если вы проверили исходный код своего сайта и исправили его, начинается следующий шаг: поисковая оптимизация. Мы познакомим вас с инструментами для веб-мастеров на следующей странице.