Продвижение бизнеса в интернете

Итак, у вас есть бизнес. Его надо развивать для того, чтобы получать больше профита, расширяться или просто не отстать от конкурента. О том как выйти на рынок в сети эта статья. Еще >>

Рынок веб разработок

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

Бесплатный способ продвижения или региональная принадлежность сайта.

Что такое геозависимось, как присвоить сайту регион и зачем. Какая от этого польза в продвижении. Еще >>

Семантическое ядро сайта

Все слышали этот термин, но вот что это такое? Зачем это, и как конкретно это самое ядро использовать для своего проекта. Еще >>

Этапы разработки сайта.

Цикл статей о этапах заказа и разработки сайта. Каждая статья описывает отдельный этап. Этот цикл призван помочь Вам четко контролировать работу студии и понять производственные процессы, которые возникают при создании сайта. Еще >>

 

Этапы разработки сайта. Этап 2. Верстка макетов дизайна.

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

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

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

 1. Что такое верстка макета.

Как уже написано, упрощенно – верстка это перевод иллюстраций в язык понятный браузерам. На этом этапе верстальщик переводит изображение нарисованное дизайнером в язык гиппертекстовой разметки или просто в html. Прописывает все необходимые стили: цвет ссылок, цвет текста, виды заголовков и т.д.

Качественная верстка сейчас, как ни странно, это большая проблема. Верстка макетов считается самой простой работой, и самой низкооплачиваемой. Хотя от нее зависит очень много (вплоть до сложности продвижения!).

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

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

Это делается по всем тем же причинам.

Хороший верстальщик делает 1 макет средней сложности за 1 день. Обычно все макеты внутренних страниц сайта отличаются от главного макета в слабой степени. Структура размещения информации та же, меню, заголовок и подвал сайта остаются обычно неизменными. Поэтому “доверстка” остальных страниц занимает еще 1-2 дня при их количестве 5-10 штук.

На этапе верстки уже могут быть запрограммированы отдельные простые эффекты если они присутствуют – выпадающие меню,  изменение цвета ссылок, кнопок и т.д., в общем все то что делается силами CSS или простых JavaScript скриптов.

2. Требования к верстке.

Эти требования вы смело можете выдвигать студии на стадии верстки ваших макетов если вы их не прописали в договоре. Они являются стандартом в индустрии. Если же веб-студия отказывается их выполнять или просит за это отдельные деньги – они не честны с вами. Можно взять макеты, которые у вас на руках после прошлого этапа и смело искать другого исполнителя.

1. Кроссбраузерность.

Это слово обозначает, что во всех основных браузерах последних версий (Chrome, FireFox, Safari, Internet Explorer v7 и выше) макеты отображаются одинаково и соответствуют нарисованным дизайнерами.

Здесь обычно грамотные менеджеры задают такой вопрос: “Нужна ли поддержка устаревших браузеров” или “Поддержка Internet explorer 6”?

Здесь кроется такой подводный камень. Существует процент пользователей, которые до сих пор используют устаревшие браузеры (самый распространенный это IE6), которые не поддерживают современные стили разметки. Статистику по браузерам можно посмотреть здесь.

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

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

2. Максимальная валидность.

Это обозначает, что сайт сверстан с минимальным количество синтаксических ошибок в Html с точки зрения стандарта. Проверить верстку на соответствие стандарту можно здесь.

3. Соответствие макетам.

Пожалуй это самое простое требование, но нерадивые верстальщики могут его игнорировать и верстать не так как нарисовано, а так как им проще.

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

Но если студия спустит это на тормозах, вы легко сможете проверить сами, поиграв в игру “Найди 10 отличий”.

Это надо чтобы все страницы сайта действительно были выполнены в одном и том же стиле. Часто получается, что от страницы к странице почему-то начинает “прыгать шапка” сайта или “подвал”, изменяется ширина колонок и цвет основного шрифта. И получается, что хороший стиль, который разработал дизайнер полностью отсутствует у сайта. Помните, макеты дизайнера пользователь врят ли когда-то увидит – он всегда видит код созданный верстальщиком.

Так что к этому моменту необходимо отнестись максимально внимательно.

3. Как проверить качество верстки?

Не углубляясь в дебри веб-разметки и верстки, проверить можно так:

1. Откройте файлы макетов в самых популярных браузерах. Сейчас самые популярные  – это Internet Explorer версий 7,8; Google Chrome; FireFox; Safari (пользователи продуктов Apple).

Установить на свой компьютер все эти браузеры очень просто, достаточно их просто скачать и следовать инструкциям.

Во всех браузерах страницы должны выглядеть ОДИНАКОВО! Текст не должен съезжать, все элементы быть на своих местах. Внимательно это проверьте.

Зачем это?

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

Учитывая, что конверсия сайта и так обычно небольшая, таких вещей не должно быть!

2. Откройте в тех же браузерах (или хотя бы в каком-нибудь одном) макеты на других разрешениях монитора.

Например на ноутбуке, нетбуке, на большом экране, на среднем. Попросите подчиненных или знакомых попробовать это сделать. Можно просто на своем мониторе попытаться увеличить или уменьшить разрешение.

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

И если на таком разрешении не будет видно важного элемента (кнопка “купить”, поиск и т.д.) или дизайн просто “рассыпется”, то вы опять потеряете клиента.

Мобильная версия сайта – это тема отдельной статьи. Лучше заказывать дизайн и разработку мобильно версии отдельно, оценив ее реальную необходимость.

После того как все макеты сверстаны и утверждены собственно начинается разработка “движка”. Про CMS поговорим в следующей статье.

Leave a Reply

Your email address will not be published. Required fields are marked *