Автор

Создание сайта www.reefll.com

Создание сайта www.reefll.com


 

Это наверое самый интересный проект на сегодняшний день. Сайт создавался в двух версиях: английской и русской. Использовался американский хостинг, рассчитан в первую очередь на американских клиентов и английская версия основная! Это полноценный интернет магазин по продаже света для аквариумов. Дизайн полностью создан на цветах без использования изображений (кнопки, меню, футер и всё остальное), чистый CSS3. Единственной частью в изображениях является корзина заказов, в верхнем правом углу сайта. С самого начала создания данного сайта хотелось использовать новейшии технологии в веб дизайне, и я считаю что это удолось!

 

Вместе с заказчиком была выбрана идея о неком роботе, который будет фигурировать на сайте в качестве экскурса!

Сайт писался с нуля, не использовалось никаких шаблонов.

Начну по порядку какие скрипты и стили я применял:

1. JQuery

Слайдер на главной странице сайта сайта описан в статье «Слайдер с эффектом параллакса на jQuery».

 

 

Сворачивание и разворачивание текста в разделе FAQ.

 

 

Боковое меню описано в уроке «Вертикальное раздвижное меню с описанием».

 

 

Выпадающая панель персонального раздела пользователя на сайте.

 

Неавторизированый пользователь:

Авторизированый пользователь:

 

2. javascript

Сворачивание и разворачивание блока с информацией в корзине, описано в уроке «Java-скрипт открыть/скрыть область/текст».

 

 

3. CSS3

Верхнее меню без использования изображений и построен на цветах и градиентах, создание описано в статье «Меню только на CSS3».

 

 

Вертикальное меню в разделе «Магазин» так же как и верхнее описано в статье «Меню только на CSS3».

 

Подсказки на сайте так же на CSS без использования скриптов.

 

Круглые изображения на сайте, описаны в статье «8 эффектов для изображений CSS3».

 

Лейтбоксы без скриптов на чистом CSS3, описан в статье «Создание лайтбокс-галереи с помощью CSS3».

 

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

С уважением Целовальников Сергей!

Многие материалы на сайте взяты из блогов: "Все для веб-дизайнера Rudebox", "A free library of HTML, CSS, JS nuggets Codyhouse" - полностью переведен и представлен в ознакомительных целях!

vk.com/club.ssdru

Подписывайтесь на нашу группу в контакте vk.com/club.ssdru



Статьи по темеdiv верстка сайта

Создание сайта www.reefll.com

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


Создание сайта www.reefll.com

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


Создание сайта www.reefll.com

Эта ссылка «Back to top» позволяет пользователям плавно перемещаться вверх по странице. Это небольшая деталь, которая улучшает навигацию на веб-сайте с длинными страницами.


Создание сайта www.reefll.com

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


Раскрутка в соцсетях

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


Перейти в Блог

Надёжный хостинг

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

Бесплатный тестовый период, ежедневные бэкапы, неограниченный трафик, акции с бонусами... Конечно, у нас все это есть.


Перейти на хостинг

О КОМПАНИИ

Studio Design существует с 2001 года. Основной нашей деятельностью до 2007 года было видеопроизводство ( видеореклама и документальные фильмы, о чем подробно описано в нашем блоге ). С 2007 года, вот уже как лет, наша основная специфика - это создание сайтов для бизнеса или частной деятельности, веб дизайн, а также поддержка и администрирование готовых проектов. Каждая выполненная нами работа - это уникальный, а самое главное, адаптивный под все современные мобильные устройства дизайн сайта. Мы готовы создать сайт с нуля для каждого клиента с любого уголка России! Мы поможем Вам в создании, как одностраничных сайтов – визиток, так и крупных интернет магазинов или корпоративных сайтов. А все наши работы, большинство из которых действуют и по сей день!

Close

Целовальников Сергей


Веб-дизайн, HTML5, CSS3, jQuery, JavaScript, Верстка.

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

Close