- PVSM.RU - https://www.pvsm.ru -
На мысль записать эти советы навела вот эта статья [1].
Ниже я поделюсь некоторыми соображениями, возникшими в процессе создания многих сайтов. Текст ориентирован, в первую очередь, на тех, кто не является профессионалом в этой области и только осваивается.
Итак,
Сейчас популярно мнение, что таблицы — прошлый век веб-дизайна. Теперь все вокруг кругленькое, плавное и на дивах. Мнение ошибочно. По большей части сайты все равно представляют из себя банальные таблицы. Колонки, ряды — все это вокруг вас.
Так что не тратьте силы и время на расстановку дивов — где это возможно и соответствует замыслу, не стесняйтесь делать табличную верстку.
А кругленькое и плавное… Оно и в таблице может быть — border-radius [2] и border-radius.htc вам в помощь!
Прежде, чем нестись ставить WP, Joomla или Drupal — задумайтесь, а так ли вам нужна CMS? Нет, никто не спорит — это отличная вещь, если вам надо регулярно обновлять новости, работать с галереями или созданным пользователями контентом.
Но если вы делайте сайт на пять страниц без всего этого великолепия, куда быстрее, чем трахаться с настройкой CMS (скажем, для нормальной дружбы с поисковиками) и разработкой шаблона — сделать html, а нужную вам одну функцию добавить jquery-скриптом.
Обратное — тоже верно. Удобнее поставить CMS, чем сначала создавать, а потом регулярно редактировать пятьдесят страниц.
Обычно так считают многие освоившие с html и css непрограммисты. Однако это миф, причем на удивление популярный. Благодаря jQuery сделать нужный эффект довольно просто — обширные мануалы [3] позволяют это сделать без особых проблем, если речь не идет о чем-то сверхнавороченном.
Для создания простенького эффекта вроде убирающегося за край экрана и достающегося обратно элемента вам потребуется, скорей всего, не больше часа-двух — даже если до этого вы вообще никакого представления о скриптах не имели.
Нет, нет, и еще раз нет. Да, профессиональные дизайнеры имеют преимущество. Но вдохновение и умение рисовать тут ни при чем. Они нужны, чтобы нарисовать картинку, которую вы используете на сайте — такие графические элементы можно купить или бесплатно скачать на многих стоковых сайтах.
В остальном, главное осознать, что дизайн сайта — не рисунок, а коллаж, состоящий из стандартных элементов. Плашки, кнопки, разделители, границы, слайдеры, картинки, фоны и так далее… Ваша задача — скомбинировать их. Как именно это делать — можно узнать из множества статей и книг — не будем на этом тут зацикливаться, тем более что в этой области каждый считает правым себя, а не соседа.
Если вы умеете рисовать — пожалуйста. Но следует учесть и то, что из фотошопа это потом придется выдирать и воплощать в код. Если он вам ближе — не тратьте силы, сразу занимайтесь версткой, а потом доводите до ума «скелет» сайта.
Основная ошибка новичков — использование множества графических элементов там, где они не слишком нужны. Вы улучшите отображение сайта на нестандартных разрешениях и сэкономите себе много нервов при добавлении материалов, если будете пользоваться стилями. Ах да, опять же 3g не везде, а люди ходят на сайты с мобильных и оттуда.
Этот совет довольно неоднозначен и может быть воспринят негативно, однако может сэкономить силы в условиях цейтнота.
Предположим, вам предстоит создать мобильную версию сайта, продающего люксовые товары. У вас перед глазами есть четкая статистика — из зашедших на сайт 40% — зашли с айфона, а из купивших что-либо «мобильных» посетителей — 90% пользователи айфона.
В таком случае, имеет смысл задуматься о том, чтобы четко заточить мобильную версию под i-устройства. Остальные — постольку-поскольку, лишь бы открывался.
Итого — если надо сэкономить силы, наплюйте на пользователей IE6. Пусть страдают — их не такое количество, чтобы тратить серьезное время.
Да, это совсем некрасиво — но иногда необходимо. Действительно. Расстановка костылей для совместимости иногда может отнять больше времени, чем сам сайт.
Не пишите статьи на хабр, когда работы еще до фига. Как я сейчас. Не надо.
Очень обидно переделывать или доделывать шаблон в срочном порядке, когда меню перестает помещаться в аккуратную строчку, отведенную для него, или становиться длиннее собственно материалов страницы во много раз при его вертикальной ориентации.
Заранее предусмотрите выпадающие меню и места для дополнительных меню в дизайне.
Несмотря на то, что сейчас — эпоха CMS, тот же Яндекс далеко не всегда «дружит» с ними. Впрочем, это взаимно.
Проверьте, настроен ли вывод мета-тегов (description, keywords).
Хорошей идеей будет воспользоваться SEF [4]. Большинство популярных движков это умеют. По той же причине актуальна будет приписка к страницам расширения ",html".
Многие вроде бы адекватные в остальном люди считают создание шаблона какой-то магией. Их денежки пополняют собой копилки продавцов шаблонов.
Не скрою, среди готовых шаблонов есть очень удачно выглядящие. Но готового шаблона, который прошел бы проверку W3C, я еще не видел. Может, конечно, такие где-то есть. В том же измерении, где живет девушка, которую я не доведу до ручки за час общения. А еще там водятся драконы… Мда. Отвлекся.
И беда не только в кривом коде. Обычно такие шаблоны (хорошие, по крайней мере) имеют массу настроек для персонализации. Проблема в том, что когда надо настроить что-то, выходящее за очерченные разработчиком пределы, это превращается в проклятье. Однажды мне пришлось на сайте, принадлежащем товарищу править пять CSS и один php-файл, чтобы изменить стиль шрифта в меню. Делать что-то более сложное там… Бррр. Вспомню — вздрогну.
Создать шаблон, на самом деле, несложно. Скажем, Drupal [5] и Joomla [6] (в ссылках — неплохие мануалы, дающие представление о вопросе) — любой, владеющий html, справится. Да, скорее всего не удастся сделать с ходу настроек для персонализации. А оно вам надо, если вы для себя делаете и сразу как надо?
Перед тем как с выпученными глазами нестись разрабатывать свое расширение/скрипт/еще что-то, поищите в нете. Если вы используете CMS — прямо на ее официальном каталоге расширений. Хорошие идеи приходят во многие головы… А голов на планете у нас немало. Вероятность того, что нужный код уже кто-то написал и выложил стремиться к ста процентам.
То же относиться и к непоняткам с обычным HTML и CSS — перед тем, как городить костыли, не забудьте проверить гугл. Вполне возможно, что изящное решение такой же проблемы уже найдено.
На этом, пожалуй, закончу. Надеюсь, кому-то эти советы помогут или покажутся любопытными.
Автор: Los_Pochtovyi
Источник [7]
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/veb-dizajn/66263
Ссылки в тексте:
[1] вот эта статья: http://habrahabr.ru/post/231329/
[2] border-radius: http://htmlbook.ru/css/border-radius
[3] обширные мануалы: http://api.jquery.com/
[4] SEF: http://en.wikipedia.org/wiki/Rewrite_engine
[5] Drupal: http://habrahabr.ru/post/86453/
[6] Joomla: http://ruseller.com/lessons.php?rub=41&id=1140
[7] Источник: http://habrahabr.ru/post/231553/
Нажмите здесь для печати.