Создание веб-сайта с нуля — это трудоемкий и достаточно долгий процесс, объединяющий в себе целый комплекс различных, но зависящих друг от друга процессов: разработка дизайна, верстка, программинг, внедрение, тестирование, информационное и текстовое наполнение. Необходимо также решать маркетинговые задачи, отвечающие за положительные отклики пользователей.
Во время разработки многие начинающие верстальщики довольно часто допускают повторяющиеся ошибки. Все проблемы и недочёты обычно становятся видны после запуска проекта. И дабы этого избежать стоит разобрать классические погрешности.
1. Назад в будущее
Возможно, вы удивитесь, но некоторые специалисты до сих пор используют таблицы при верстке сайта. На дворе 21 век и все давно уже перешли на блоки, либо на списки или теги с определениями
<dl>
Таблицы, конечно же, не полностью изжили себя. Они имеют место быть лишь для табличных данных, связанных с контентом сайта.
2. Называйте вещи своими именами
Некоторые верстальщики именуют собственные классы сокращённо, либо вовсе pishut translitom, чего точно не стоит делать, так же, как и начинать строку с цифры или дефиса. Подытожим: используем английские слова, несущие за собой суть написанного, латиницей
.header-top-block
3. Высокое разрешение - низкие скорости
Большое количество изображений, да и ещё в высоком качестве замедляют работу сайта, что приводит к угасанию интереса у пользователей. Плюс ко всему, загрузка данной странички с сотового устройства отнимет больше трафика, чем следовало бы. Сейчас все хотят получать информацию быстро и качественно, поэтому необходимо было бы оптимизировать изображения под данный сайт. Например, уменьшить вес картинки при помощи графического редактора, или, как говорят в народе, просто сжать файл.
4. Начинаем жизнь с чистого листа
Такие ошибки называют банальными. Допустить их может каждый, не только начинающий верстальщик, но и профессионал своего дела из-за невнимательности. Каждый браузер имеет свой собственный стиль в основных элементах HTML. Поэтому, первым делом стоит сбросить настройки отступа, установленные по умолчанию, чтобы избежать тех случаев, в которых один и тот же сайт, открытый с разных браузеров, выглядит совершенно по-другому.
Достигается это при помощи кода-CSS:
* {
margin:0;
padding:0;
}
либо целого файла, такого как Normalize.css.
5. Первым делом доберись до сути
Необходимо всегда указывать тип страницы. Для этого нужно использовать тег DOCTYPE - эта деталь передаёт браузеру информацию о том, какая версия HTML-метки имеется на данном сайте. В ином случае, при ее отсутствии, страница выдаёт ошибки. Например, сбивается оформление шапки сайта или размещение информации. Не забывайте всегда вставлять тег в первую строку страницы, для упрощения своей работы, можете даже создать шаблон с заранее указанными тегами.
6. Блоки и строки
Эти два элемента являются основами HTML. Блоковые части представляют собой выстраиваемую структуру страницы, например:
<div> - универсальный элемент
<table> - создание таблицы
<h1> - создание заголовков различных уровней
<menu> - отображение списка меню и т.д.
Также имеются строчные элементы, находящиеся внутри блоков:
<span> - универсальный строчный элемент
<small> - уменьшение размера шрифта и т.д.
Другими словами блочные элементы создают структуру веб-страницы, а вот строчные форматируют текстовые фрагменты.
7. Знай своё место
Каждый элемент играет свою роль, в частности речь идёт о тегах, отвечающих за заголовки. Тег <h1> должен использоваться единожды, за ним следует <h2>, затем <h3> и так далее. Здесь присутствует четкая иерархия без каких-либо повторений или пропусков. Одно за другим. Это просто и очень удобно.
8. Давние устои
Случаются иногда непредвиденные ситуации, и данная функция как раз выручает в таких ситуациях. ALT атрибуты нужны для IMG тегов. Например, если не открылось изображение, то пользователь увидит надпись, отражающую смысл контекста.
А если изображение не несёт большой смысловой нагрузки, то есть вариант использования пустого тега alt=””
Этот нюанс не только прямой помощник для SEO-оптимизации, но и уникальный вспомогательный элемент, который стоит принять во внимание.
Необходимо уделять внимание малейшим деталям. Чем тщательнее идёт проработка всех аспектов верстки сайта, тем лучше будет отображаться Ваша веб-страничка в различных браузерах. Как вы уже успели понять, без определенных навыков выполнить верстку или править верстку для устранения ошибок достаточно проблематично. Человек, не имеющий опыта в верстке страниц, может не исправить, а наоборот, усугубить ситуацию. Поэтому, лучше не рисковать «лицом» компании, а точнее корпоративным веб-сайтом, и отдать решение проблемы в руки профессионалов. Студия интернет-решений GuruLabs оказывает услуги по разработке сайтов, доработке имеющихся сайтов, а также дальнейшей техподдержке ресурса. Данная услуга облегчит Вам жизнь, и впредь не придется ломать голову в поисках решения проблемных ситуаций.