Автор

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

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


 

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

 

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

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

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

1. JQuery

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

 

 

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

 

 

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

 

 

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

 

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

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

 

2. javascript

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

 

 

3. CSS3

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

 

 

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

 

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

 

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

 

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

 

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

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


vk.com/club.ssdru

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


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

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

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


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

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


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

Простой, отзывчивый слайдер с радиальным эффектом перехода на основе SVG clipPath и элементов маски.


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

Здравствуйте, уважаемые читатели! Есть много способов, показать информацию о продукте. В этом уроке я собираюсь рассказать Вам, как можно сделать куб с информацией на гранях. Будет применен эффект, который основан на CSS3 Transform 3D. Эффект корректно работает в FF, Chrome и Safari, Opera и IE пока не поддерживают CSS Transform 3D.


105 Публикаций

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

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


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

О КОМПАНИИ

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

Close

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


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

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

Close