Создание блога о Nintendo Wii. Часть 1

www.blogwii.ru — Создание сайта, верстка, поддержка.

Блог о Nintendo Wii и играх

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

Блог о Nintendo Wii — это авторский проект, который ведет один человек. Мы постарались максимально упростить ему работу по обновлению, как самого блога, так и внутренних модулей. Внедрили все самые новейшие технологии и сервисы.

Дизайн и верстка.
Дизайн выполнен в светлых тонах с минимумом элементов, это упрощает восприятие и поиск нужной информации, а еще гармонирует с современным дизайном консоли Wii, который так же выполнен в светлых тонах.

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

Кнопки навигации и поиск

Верстка блочная, резиновая, что очень не типично для блогов. Основная, контентовая часть, состоит из трех блоков. Левая часть тянется, правая всегда остается на месте. Мы постарались подобрать такое сочетание размера шрифта, интрельяжа и межстрочных интервалов, которое способствовало максимально простому восприятию информации. Проще говоря, читать текст просто и он легко усваивается.
Мы постарались учесть все возможные разрешения экрана, в том числе, для широкоформатных мониторов. Протестировали верстку во всех современных браузерах, а так же на соответствие стандартам W3C. Была оптимизирована графика и код страницы.

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

Вывод последних комментариев

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

Опрос

Комментарии выводятся единым списком, с возможностью ответить на любой комментарий. Уровень вложенности больше 5.

Комментарии

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

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

Читать вторую часть рассказа о создании блога blogwii.ru

Верстка сайта и движок, для компании «Драйв»

Сделали верстку сайта, для компании «Драйв», а так же запустили на нашем движке. Блочная верстка соответствует стандартам W3C и одинаково смотрится во всех современных браузерах. Обновлять сайт легко, с помощью нашего движка, все элементы сайта редактируются и изменяются. Редактор может добавить фото, видео, любые текстовые материалы.
Сайт наполняется сотрудниками компании «Драйв»

Вторая версия сайта doorstal.su

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

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

Интерфейс редактора стал более логичен и легок в управлении.

Появилась возможность вставки на сайт потокового видео, как со сторонних сервисов (например youtube), так и напрямую. Можно загрузить видео с компьютера и оно будет воспроизводиться. Первые видео уже выложены на сайте.

Для каждой двери составлено уникальное описание и просчитаны характеристики. Все основные вопросы, возникающие у покупателя, описаны на сайте.

Создание сайта doorstal.su. Часть 2

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

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

Приступаем к редактированию страниц. Встроенный редактор, напоминает, всем известный, Word и позволяет выделять текст любым цветом, подкрашивать его, выравнивать, вставлять изображения, рисовать таблицы, добавлять спецсимволы, специальные гиперссылки и многое другое. На скриншоте, показан пример редактирования страницы «Двери, с отделкой винилискожей». Таблицы выделены пунктирной линией, а все параметры и цену можно редактировать.

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

Конечно, можно загрузить не только фотографии, но и любой тип файлов, такой как flash, excel, word и т.д.

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

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

Модуль «Отзывы», имеет еще более продвинутую систему управления. Зайдя на страницу отзывов, мы видим, во первых сам отзыв, систему модерирования и редактирования. Рядом с отзывом показан IP адрес написавшего (в данном случае, адрес не настоящий, для сохранения конфиденциальности). Отзыв можно отредактировать, скрыть (например, на время, если пока неизвестно, что с ним делать в данный момент) и удалить. Можно отсортировать отзывы по датам, когда их будет много, для удобства, можно показывать, например, только опубликованные отзывы, или наоборот, только скрытые. Есть, также и защита от спама, с особым механизмом распознавания.

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

Создание сайта doorstal.su. Часть 1

www.doorstal.su — Создание сайта, верстка, движок.

Второй сайт для компании «Плазо плюс». Прежде всего, выражаю благодарность Валерию Процюк, за помощь в реализации проекта. Рассказ, о создании этого сайта я разделю на несколько частей и расскажу по порядку о каждом, наиболее интересном элементе.

1. Предыстория.
Дверных фирм, так же, как и сайтов дверной тематики, очень много. В большинстве, такие сайты являются безыдейными, делаются для галочки, «чтобы было». Руководство таких дверных фирм, не видит перспективы в продажах через Интернет, не хочет прилагать к этому усилий. Мы решили сделать такой сайт, который бы не просто выделялся среди остальных, но и приносил внушительную прибыль. Идея была в создании логичного, простого и, в тоже время, функционального сайта. С возможностью размещения множества информации таким образом, чтобы человек, заходя на сайт, не потерялся. Чтобы можно было выбрать и заказать то, что понравится.

2. Дизайн и верстка.
Было принято решение не перегружать сайт графикой, а показать товар «лицом». Сайт тянется на всю ширину экрана и одинаково хорошо выглядит на любом разрешении. Сверху, реализована специальная панель, в которую попадают фотографии дверей из всех разделов сайта, при наведении мыши, панель прокручивается, а при нажатии, можно посмотреть описание двери и цену. Конечно, эта панель автоматически подстраивается под размеры экрана и работает под любым браузером:

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

3. Функционал.
Выбирая дверь, с определенной отделкой, открывается страница, на которой видим фотографию двери, ее описание, цену, а так же цвет и варианты рисунка отделки:

Цвет можно выбрать из специального каталога на странице или подведя курсор мыши на квадрат с нужным цветом:


Черный цвет отделки


Красный цвет отделки


Голубой цвет отделки


Белый цвет отделки

В форме обратной связи появился секретный код, для предотвращения спама:

На странице «Отзывы», можно оставить отзыв о сайте или фирме и ее услугах. Для предотвращения спама, также используется секретный код:

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

В следующей части я расскажу о редактировании сайта, добавлении новой информации, внутренней структуре и дополнительных модулях.
Читать вторую часть рассказа о создании сайта dorstal.su

Сайт компании «Каскад»

Компания «Каскад», занимается продажей стальных дверей и прочих изделий из металла. Для их сайта www.dveri-kaskad.ru мы сделали HTML-верстку и запустили сайт на нашем движке.

Главная страница сайта в активном и не активном состоянии:


Не активное состояние

Активное состояние

Сайт для фотографа

www.dmitriy-golubev.ru — Создание сайта, верстка, движок.

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

На сайте можно создавать не ограниченное количество категорий и подкатегорий, сортировать как угодно фотографии. Посетители могут оставлять комментарии, а могут подписаться на сайт по RSS и всегда знать об обновлениях.


Главная страница сайта

Второстепенная страница
Страницы блога (3):1[2]3