Одиннадцать советов для простого создания приличного сайта

в 19:46, , рубрики: веб-дизайн, Веб-разработка, дизайн сайта, сайтостроение

Одиннадцать советов для простого создания приличного сайта

На мысль записать эти советы навела вот эта статья.

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

Итак,

1. О бедной таблице замолвите слово

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

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

А кругленькое и плавное… Оно и в таблице может быть — border-radius и border-radius.htc вам в помощь!

2. CMS — не нужен?

Прежде, чем нестись ставить WP, Joomla или Drupal — задумайтесь, а так ли вам нужна CMS? Нет, никто не спорит — это отличная вещь, если вам надо регулярно обновлять новости, работать с галереями или созданным пользователями контентом.

Но если вы делайте сайт на пять страниц без всего этого великолепия, куда быстрее, чем трахаться с настройкой CMS (скажем, для нормальной дружбы с поисковиками) и разработкой шаблона — сделать html, а нужную вам одну функцию добавить jquery-скриптом.

Обратное — тоже верно. Удобнее поставить CMS, чем сначала создавать, а потом регулярно редактировать пятьдесят страниц.

3. Скрипты — это сложно?

Обычно так считают многие освоившие с html и css непрограммисты. Однако это миф, причем на удивление популярный. Благодаря jQuery сделать нужный эффект довольно просто — обширные мануалы позволяют это сделать без особых проблем, если речь не идет о чем-то сверхнавороченном.

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

4. «Дизайн должен рисовать художник», «Надо уметь рисовать, чтобы сделать дизайн».

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

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

5. «Дизайн рисуют в фотошопе».

Если вы умеете рисовать — пожалуйста. Но следует учесть и то, что из фотошопа это потом придется выдирать и воплощать в код. Если он вам ближе — не тратьте силы, сразу занимайтесь версткой, а потом доводите до ума «скелет» сайта.

6. CSS и стили

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

7. Не заморачивайтесь из-за ненужной или слишком небольшой аудитории

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

Предположим, вам предстоит создать мобильную версию сайта, продающего люксовые товары. У вас перед глазами есть четкая статистика — из зашедших на сайт 40% — зашли с айфона, а из купивших что-либо «мобильных» посетителей — 90% пользователи айфона.

В таком случае, имеет смысл задуматься о том, чтобы четко заточить мобильную версию под i-устройства. Остальные — постольку-поскольку, лишь бы открывался.

Итого — если надо сэкономить силы, наплюйте на пользователей IE6. Пусть страдают — их не такое количество, чтобы тратить серьезное время.

Да, это совсем некрасиво — но иногда необходимо. Действительно. Расстановка костылей для совместимости иногда может отнять больше времени, чем сам сайт.

8 (условный пункт). Прокрастинации — бой

Не пишите статьи на хабр, когда работы еще до фига. Как я сейчас. Не надо.

8 (настоящий). Прикиньте перспективы работы «на вырост»

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

Заранее предусмотрите выпадающие меню и места для дополнительных меню в дизайне.

9. CMS и поисковики

Несмотря на то, что сейчас — эпоха CMS, тот же Яндекс далеко не всегда «дружит» с ними. Впрочем, это взаимно.

Проверьте, настроен ли вывод мета-тегов (description, keywords).

Хорошей идеей будет воспользоваться SEF. Большинство популярных движков это умеют. По той же причине актуальна будет приписка к страницам расширения ",html".

10. Покупные шаблоны для CMS — в лес

Многие вроде бы адекватные в остальном люди считают создание шаблона какой-то магией. Их денежки пополняют собой копилки продавцов шаблонов.

Не скрою, среди готовых шаблонов есть очень удачно выглядящие. Но готового шаблона, который прошел бы проверку W3C, я еще не видел. Может, конечно, такие где-то есть. В том же измерении, где живет девушка, которую я не доведу до ручки за час общения. А еще там водятся драконы… Мда. Отвлекся.

И беда не только в кривом коде. Обычно такие шаблоны (хорошие, по крайней мере) имеют массу настроек для персонализации. Проблема в том, что когда надо настроить что-то, выходящее за очерченные разработчиком пределы, это превращается в проклятье. Однажды мне пришлось на сайте, принадлежащем товарищу править пять CSS и один php-файл, чтобы изменить стиль шрифта в меню. Делать что-то более сложное там… Бррр. Вспомню — вздрогну.

Создать шаблон, на самом деле, несложно. Скажем, Drupal и Joomla (в ссылках — неплохие мануалы, дающие представление о вопросе) — любой, владеющий html, справится. Да, скорее всего не удастся сделать с ходу настроек для персонализации. А оно вам надо, если вы для себя делаете и сразу как надо?

11. Use the repository, Luke

Перед тем как с выпученными глазами нестись разрабатывать свое расширение/скрипт/еще что-то, поищите в нете. Если вы используете CMS — прямо на ее официальном каталоге расширений. Хорошие идеи приходят во многие головы… А голов на планете у нас немало. Вероятность того, что нужный код уже кто-то написал и выложил стремиться к ста процентам.

То же относиться и к непоняткам с обычным HTML и CSS — перед тем, как городить костыли, не забудьте проверить гугл. Вполне возможно, что изящное решение такой же проблемы уже найдено.

***

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

Автор: Los_Pochtovyi

Источник


* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js