Отчёт по практике на тему Учебная практика: «Информационные системы и программирование»

Содержание:

ВВЕДЕНИЕ 3

1. Структура и прототип сайта 4

2. Применение стилей CSS. Дизайн страниц 8

2. Дизайн страниц сайта 12

ЗАКЛЮЧЕНИЕ 25

Введение:

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

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

Цель исследования: изучить на практики основы построения веб-страницы и веб-дизайна.

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

Использование языков программирования, таких как HTML, CSS и Javascript, для реализации задуманного дизайна называется фронтенд-разработкой. Эти языки позволяют пользователям взаимодействовать с кнопками, изображениями, текстом, контактными формами и меню навигации. И они являются неотъемлемой частью отзывчивого и адаптивного дизайна. Некоторые дизайнеры кодируют, а некоторые фронтенд-разработчики проектируют. Некоторые дизайнеры не трогают кусок кода. А некоторые фронтенд-разработчики ограничиваются кодированием и ничем другим. То, что пользователь не видит, происходит на сервере и включает в себя внутреннюю разработку.

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

Фрагмент текста работы:

В рамках производственной практики мною был разработан гибридный сайт интернет-магазина экзотических комнатных растений. До программной реализации была построена структура сайта и прототип. Структура сайта состоит из 6 главных частей:

1. Обложка — главная идея интернет-магазина Lukani.ru

2. Описание проекта, рассказ о продукте

3. Выгоды и преимущества

4. Доверие

5. Призыв к действию

6. Меню, подвал

Рассмотрим каждый блок отдельно.

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

Поэтому обложка – это самая важная часть лендинга. На обложке расположены:

• заголовок

• подзаголовок

• слайдер с прокруткой товаров по акции

• кнопки Купить, Перейти в корзину, в аккаунт и тд

• форма поиска по категориям

• панель меню

• сервис смены языка

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

Рассказ продукте, проекте, услуге. Рассказ о продукте — это группа блоков с презентацией продукта, проекта или услуги. Здесь мы должны ответить на вопросы:

— что это за продукт?

— для кого он подходит?

— как продукт поможет решить проблему?

— зачем это нужно пользователю?

В этой группе размещаются такие блоки:

О проекте/продукте — где указывается самая важная идея продукта в нескольких предложениях.

Галерея фото или видео — если это продукт, можно поместить несколько фотографий или видеообзор.

Для кого — подробнее о ЦА, с указанием болей и перечнем ценностей пользователя.

Расписание — даты, время, сроки акций и промо.