Сайт Техническое обслуживание Советы для Front-End Developers

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

В самом деле, если веб-сайт или веб-приложение не постоянно предлагать своим пользователям постоянно развивается и растет опыта, что сайт или приложение скоро станет небезопасно, непригодные к использованию, и из date.

Вы украшает ваш код, подтверждено разметки, и сделал свой XHTML более семантическим?Вы осуществляются основные SEO передового опыта, орфографии проверил содержимое и удалить старого кода?Вы обеспечено наличие ненавязчивый, применен принцип изящные деградации, и свести к минимуму использование Flash?Если you’ наделал все эти вещи (и, возможно, более), что будет дальше?Есть вещи, которые вы можете сделать, чтобы улучшить свой site’ с общей effectiveness?, Помимо тех,

Wrenches

В этой статье мы рассмотрим способы, что веб-дизайнеры и интерфейсных кодеры могут держать свои веб-сайты актуальной, своевременной и доступной вскоре после site’ Запуск с.Это руководство выходит за рамки простого текстового и графического обновления, общие “ лучшие practices” для CSS и XHTML, или другие вещи, которые вы могли видеть в типичных сайт checklist.We’ будем расширяться на многих из основы, и представить некоторые эффективные советы для веб-сайта maintenance направлены на интерфейсном дизайнеров и coders.

1.Держите Содержимое Чистый и Updated

После вашего сайта накопилось десятки, может быть, даже сотни страниц, контента может стать старой и outdated.Поддержка сайта должна включать в себя текущие обзоры статического контента, которые могут потребовать обновления и исправления.Конечно, содержание, которое появляется на блоге или на страницах новостей станет устаревшей, но не может требовать изменения.В тех случаях, лучшим решением может быть создавать новые записи, обновления information.

Конечно, как и интерфейсные разработчиком для компании или учреждения, содержание технического обслуживания, скорее всего, не будет ваша ответственность, но если you’ повторно одним человеком агентство Интернете или другой тип фрилансер, содержание технического обслуживания будет важной частьюВашей routine.

Contract

Страницы, Условия & условия, условия Service
Юридические вопросы могут возникнуть, если политика и условия страницы недостаточно обновляются в соответствии с последними стандартами компании и процедуры.Рассмотрение этих типов документов, которые появляются на вашем сайте или в вашем веб-приложение должно быть неотъемлемой частью вашего обслуживанияroutine.

Программное обеспечение Documentation
Документация связанных с продуктом или услугой также могут устареть с новыми выпусками или исправляет ошибку.Если позволяет время, ваше текущее обслуживание может также включать регулярные дополнения и изменения в документацию, возникают ли они в Интернете или в загружаемой format.

Contracts
услуги предоставляет ваша компания может потребовать договор на услуги между обеими сторонами посредством правового договора.Это документ до даты, отражающие последние политики компании и стандартов

Держать Ваш блог Clean
Если вы занимаетесь Вашим читателям принять участие в дискуссиях на Вашем блоге, убедитесь, что ваши сообщения не содержат спам-комментариев.Например, по крайней мере, регулярно проходят популярные посты вручную удалять комментарии, которые приводят к подозрительным сайтам.It’ ы также необходимо проанализировать теги, которые you’ уже использовали.Некоторые теги могут быть изменены или изменены, чтобы лучше отражать тему, может быть, из-за оказания единственном или множественном числе, или из-за неправильно написанного слова.Вы также можете пересмотреть свои пометки системы и придумали стиль руководства, которое описывает процесс мечения сообщений, что позволит улучшить будущие теги и теги обслуживания.Вы также можете закрыть комментарии на популярных сообщений, чтобы избежать спам и ссылки dropping.

2.Ремонт, исправления и Upgrades

Наиболее распространенных задач, поддержка сайта, связаны с ошибками, ошибки, неработающие ссылки и несовместимость браузеров.Есть серверных задач обслуживания, которые могут быть выполнены как хорошо, но мы won’ T рассматривает любые тех, кто в этой статье.Let’ посмотрим на некоторые вещи интерфейсных разработчик может нести ответственность за в данной области при выполнении сайта maintenance.

Проверка Broken Links: Не только URLs

Проверка битых ссылок, как внутренних, так и внешних, является довольно простой задачей, так как есть ряд веб-интерфейсом и автономные инструменты, которые выполняют эту задачу.Но ссылка проверка может выйти за пределы URL-адресов, вы можете также проверить, чтобы убедиться, что все изображения и внешние файлы правильно ссылаться.Вот некоторые инструменты, чтобы помочь с этими задачами:

Мертвое Links является бесплатным веб-сломанных проверки ссылку, которая очень проста в использовании и имеет удобный для чтения странице результатов.Мертвые ссылки проверяет только ссылки из якоря теги в markup.

Dead Links

Xenu’ S Link Sleuth является свободной автономной ссылка корректор приложений с многочисленными функциями.Он проверяет битые ссылки, изображения путей, фоны, внешний CSS, JavaScript внешних и more.

Xenu's Link Sleuth

Обновление CMS & Plugins

Если you’ повторное использование популярной системы управления контентом, шансы очень высоки, что в какой-то момент you’ понадобится для обновления.Это будет необходимо для целого ряда причин — Может быть, предыдущая версия имеет проблемы с безопасностью, содержит неэффективный код, или просто doesn’ T правильной работы любого more.

WordPress является одним из наиболее широко используемых платформ блогов, и она используется преимущественно как многофункциональная система управления контентом.Так как существуют тысячи WordPress plugins в наличии, есть и обязана быть сотни плагинов, которые больше не поддерживается.Старые, без поддержки плагинов, которые имеют не были обновлены с помощью плагина author быть совместимы с последней версией WordPress может сделать ваш веб-сайт insecure.

WordPress Plugin Directory

К счастью, в последних версиях WordPress, обновления WP installation так просто, как несколько кликов.Кроме того, панели инструментов сообщим вам, когда плагин обновления доступны.Ваш плагин страницы также дает вам возможность просмотреть информацию о конкретном plugin’ с последними изменениями.Так что, если ваш сайт работает на WordPress, обновления WordPress и связанные с ними модули должны быть приоритетных вопросов на сайте технического обслуживания к делу list.

It’ Важно отметить, что обновленная версия вашей системы управления контентом won’ т обязательно поддерживать все настройки и плагинами, что вы тщательно установлены и настроены, когда сайт был запущен.Таким образом, как часть вашего технического обслуживания, убедитесь, что вы находите новых версий плагинов, либо заменить их на разумных альтернатив перед обновлением CMS.

3.Совместимости браузера Testing

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

Совместимость с малоиспользуемых Browsers

Обеспечение вашей site’ с совместимостью с IE6/7/8 и Firefox 2/3 на ПК является обычным делом в поддержку сайта.Но don’ забудьте проверить некоторые из последних релизах менее распространенных браузеров, таких как Opera, Chrome, Safari и.Firefox, Opera, Safari и также должны быть проверены, если это возможно, на Macintosh, потому что есть потенциал для изменениярендеринга.I’ нас лично видел CSS макета причуды, которые происходят в Safari на Mac, но не отображаются в Safari на PC.

Browsers

Автоматизированная приложений Testing

Селен Web Application Testing System
Селен представляет собой набор инструментов, специально для тестирования веб-приложений.Пакет включает в Selenium IDE (плагин Firefox), Selenium Remote Control (которая автоматизирует процесс), а Selenium Grid (что позволяет одновременно тесты на нескольких платформах)

Selenium Web Application Testing System

Интернет совместимости Testing

Browsershots
Browsershots является, вероятно, самым популярным инструментом для просмотра скриншоты вашего сайта в разных браузерах и на разных platforms.

Browsershots

Adobe BrowserLab
“ Предварительный просмотр и тестирование веб-страниц на ведущих браузеров и операционных систем — по требованию.Adobe BrowserLab делает это проще и быстрее, чем когда-либо прежде, чтобы посмотреть, как ваши проекты появляются для Ваших клиентов и аудитории.Получите ваши результаты в реальном времени, практически с любого компьютера, подключенного к web.”

Adobe BrowserLab

Дополнительная информация:

4.Помимо проверки и веб-Standards

Как правило, поддержка сайта может состоять из продолжения проверки страниц, как правило, после того, как добавляются новые функции или обновлении содержимого.Проверка может включать в себя как markup и styles.Есть вещи, которые, однако, что может быть сделано только после простой проверки страниц, так как “ valid” код не обязательно означает “ good” code.

Чище иXHTML

Есть ли компонент в разметке, которая может быть уменьшена в размерах?Когда вы впервые закодирован сайт, Вы, возможно, страдают от проблемы называется “ divitis “.В основном это означает, что есть <div> теги в коде, которые могут быть легко удалены, поскольку они don’ T служат цели.Прекрасным примером является <div> обернутый вокруг раздел навигации, например:

<div class="nav-holder">
	<ul class="nav">
		<li><a href="home">Home</a></li>
		<li><a href="about">About</a></li>
		<li><a href="services">Services</a></li>
		<li><a href="products">Products</a></li>
		<li><a href="contact">Contact</a></li>
	</ul>
<div>

В коде выше, в большинстве случаев, <div> элемент не является необходимым.Если повышение CSS необходимо на весь раздел навигации, это может быть сделано на <ul> элемента, так как это тоже элемент уровня блока.Конечно, не может быть причиной того, что внешняя <div> необходимости, но код будет в целом так же, как гибкий и без того element.

Что насчет слишком много attributes?Это не так плохо, как наличие слишком большого числа <div> элементов, но код может начать выглядеть чище и легче управлять, если вам избежать привычно положив классы и идентификаторы практически на каждый элемент.Использование наследования принципов в CSS, вместо прямого нападения на каждый отдельный элемент можно сократить код до более приемлемого уровня.Следует отметить, однако, что в некоторых случаях, в то время как удаление атрибутов может улучшить производительность вашего разметки, это может оказать негативное воздействие на производительность вашего CSS, хотя очень маленькие levels.

Дополнительная информация:

Улучшение качества ваших JavaScript

Если you’ нас создано много пользовательских JavaScript, возможно, совместно с библиотекой JavaScript, код может извлечь выгоду из улучшения.Вы можете Тест качества вашей наличие code использованием Дуглас Crockford’ S JSLint, который он называет “ качество кода tool.” I wouldn’ T классифицировать JSLint как “ validator”, потому чтодействует в наличие не всегда, что лучше.В самом деле, многие методы наличие в настоящее время понимается вызвать серьезные производительность issues.

JSLint

Итак, рассмотрим, можно ли включать контроль качества кода JavaScript, как часть вашего регулярного технического обслуживания сайта routine.

Дополнительная информация:

Очистка & Оптимизация CSS

После нескольких лет разработки, CSS файлы могут быть раздутым, трудно поддерживать, и нечитаемым.По пути, вы, возможно, научились производить сильное код, так что любойбудущие дополнения было бы приемлемо, но то, что о возвращении оптимизировать и реорганизовать старше CSS код?Многие файлы CSS, с течением времени, будет развиваться redundancies которые мешают speed.

Есть ряд инструменты доступны, чтобы помочь с этим task, все из которых должны быть использованы с осторожностью.Прежде чем делать какие-либо оптимизации, убедитесь, что резервные копии всех файлов CSS, потому что автоматизированный инструмент, при неправильном использовании могут оказать код unusable.

W3C CSS проверки Service
Прежде чем делать какие-либо оптимизации CSS, вы должны сначала проверить, чтобы обеспечить вашу CSS является действительным.Ошибки в коде CSS может вызвать проблемы при выполнении любой автоматизированной оптимизации или refactoring.

W3C CSS Validation Service

Чистая CSS
Этот онлайновый CSS оптимизатор предлагает множество различных вариантов и отображает сведения обо всех изменениях made.

Dust-Me Selectors (спасибо, jeyaONE)
Это полезный плагин Firefox покажет вам, какие CSS селекторы больше не используется, так что вы можете спокойно удалить them.

Dust-Me Selectors

Вы также имеете возможность делать все, оптимизации вручную, чтобы убедиться в отсутствии неполадок.Конечно, многие методы оптимизации не может быть автоматизирован.Один пример объединения нескольких файлов CSS, чтобы минимизировать HTTP запросов.Кроме того, вы можете решить изменить имена классов и ID имена, чтобы отразить более соответствующих конвенций.(Например, используя имя класса “ промо-box” бы более уместно, чем “ сине-box”, так как цвет окна может измениться).

Дополнительная информация:

5.Улучшение Accessibility

Если you’ ве подтверждено разметки и используются передовые методы кодировани …

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров

Comments are closed.