Создание интернет магазина
Введение.
Так сложилось, что мы
живем в Информационном веке. Информация
везде торговля, производство, транспорт,
наука, финансовая деятельность. Чего
стоит только один день какой-нибудь биржи:
сотни людей ежеминутно обрабатывают
горы свежей информации, и только для того,
чтобы предсказать развитие событий на
ближайшие дни или хотя бы часы. Информация
- это их хлеб.
С появлением глобальной сети
Интернет, информационные потоки стали
расти просто в геометрической прогрессии,
вследствие этого количество пользователей
тоже стало увеличиваться.
Интернет становится не
просто электронным средством массовой
информации, но и своего рода глобальной
библиотекой, средой обитания, источником
дохода. Формируется рынок, формируется
спрос. И Россия не исключение.
Интернет-коммерция все больше
входит в нашу жизнь. Она открывает новые
возможности ведения бизнеса, и все больше
компаний переносят значительную часть
делового общения в Интернет.
Среди отличительных особенностей
онлайн - коммерции перед традиционной
коммерцией можно отметить:
1-е отсутствие географических и временных барьеров, что позволяет продвигать товары и услуги на новые рынки сбыта.
2-е более низкий уровень
издержек производства, что достигается
путем внедрения новых технологий во все
сферы деятельности компаний: начиная
от закупок сырья и материалов и заканчивая
дистрибуцией готовой продукции и пост
- продажным обслуживанием.
3-е более высокий уровень
конкуренции, когда магазин от магазина
находится на расстоянии нескольких секунд,
требуемых для загрузки соответствующего
сайта.
Потенциальная емкость
интернет - магазина значительно превышает
емкость традиционных магазинов по причине
отсутствия физических ограничений на
складские помещения и торговые площади.
Интернет среда без границ,
она с лёгкостью соединяет продавца и
покупателя, находящихся на разных континентах.
Новые потребители и партнеры, новые возможности,
новые составляющие новых доходов. Ради
этого фирмы выносят свои товары и предложения
на интернет - прилавки. Ради такого создаются
новые компании, цель которых ведение
бизнеса в Интернет. В наш век информационных
технологий уже не только акулы капитализма
понимают всю выгоду продвижения товаров
или услуг в Интернете, но и мелкие компании
локального характера, которые не прочь
опробовать новые технологии в захвате
местного рынка.
В большинстве Интернет - магазинов
основу интерфейса, составляет каталог,
основанный на базе данных, которые в свою
очередь дают возможность выбирать и заказывать
товары в Сети.
Уже не для кого, не секрет, что
для того чтобы получить возможность пользоваться
всеми преимуществами сети Интернет, главные
из которых интерактивность и доступность.
Это означает, что клиенты, которые общаются
с вами при помощи Интернет, должны получать
такой же спектр услуг, как если бы они
посетили Ваш офис или торговый зал вашей
фирмы.
Для фирмы, которая занимается
розничной или оптовой торговлей, лучшим
решением является создание своего Интернет-магазина
(торговой точки в Интернет).
Целью данной курсовой работой
является разработка и создание Интернет
- магазина.
1.Предметная область
1.1 Описание предметной области и функции решаемой задачи
Рассмотрим аспекты решаемой задачи.
Прежде всего, надо знать, что мы будем продавать.
согласно многим исследованиям наиболее популярными сетевыми товарами являются: информация, книги, аудио продукция и компьютерные программы…
если Вы определили, что именно будете продавать, встают следующие вопросы, а будет ли, этот товар, продаваться через Сеть? И если будет, то, в каких примерно объемах?
Интернет накладывает на торговлю специфический отпечаток. Самые первые и самые распространенные магазины в сети – это магазины компьютерных фирм.
Но сейчас все больше людей, далеких от компьютерных технологий (простых пользователей), открывают для себя интернет, все больше компьютеров появляется дома, все больше людей активно используют сеть. А это, в свою очередь, сказывается на ассортименте продаваемых товаров.
Допустим, у вас есть товар, который подходит под категорию продаваемых через интернет, следующий этап – оценка конкурентов. Посмотрите другие сайты, предлагающие такие же или аналогичные товары.
1.Чем ваше предложение будет лучше?
2.Чем Ваш сайт будет удобнее?
3.Какие дополнительные услуги вы сможете предложить своим клиентам?
Здесь есть над, чем задуматься...
Рассмотрим функции решаемой задачи.
В работе интернет магазина выделим следующие пункты:
1) Приём заказа клиента
Приём заказа клиента должен осуществляться оперативно, для этого потребуется удобный интерфейс и простота использования интернет - магазина.
2) Высокий уровень сервиса
Высокий уровень сервиса предполагает:
a) Оперативность предоставление услуг
b) Учет потенциальных клиентов (ведение статистики по посещаемости).
c) Некоторые другие возможности по обработке информации для удобного поиска нужной информации и т.д.
3) Предоставление клиенту необходимых товаров (выполнение заказа). Если товар, необходимо доставлять быстро, например пиццу или обеды в офис, то надо позаботиться о собственной оперативной службе доставки. Кому нужен горячий обед с доставкой на дом через сутки? Доставка крупных, хрупких или очень дорогих товаров тоже должна производиться с учетом специфики.
2.формулировка постановки задачи.
Предположим, что вы полностью готовы для входа со своим предложением на просторы Интернета.
После того, как вы определились с товаром, Вам необходимо решить – какую форму приобретет ваш будущий интернет–магазин. Форма, которую приобретет, полностью зависит от продаваемого товара. Вы можете просто создать веб–страницу, разместить на ней прайс–лист и адрес электронной почты, выложить все это на сервере своего провайдера и гордо назвать ЭТО «интернет – магазином». Для этого понадобиться элементарный текстовый редактор, и знания основ HTML.
Возможно, для некоторых
видов деятельности подобной
конструкции будет достаточно, но
для создания полноценного и
удобного для пользователей
3.обоснование выбора
Главным плюсом этой программы
является бесплатное распространение,
дружелюбный интерфейс для
4.реализация задачи.
Когда вы будете четко представлять себе, как должен выглядеть ваш интернет–магазин, нарисуйте его строение на бумаге. Обозначьте основные разделы, наметьте стрелками связи между страницами, опишите, какая информация будет находиться на главной странице. После этого, вы готовы к осуществлению своего проекта.
Для начало, займёмся выбором хостинга. При выборе компании, предоставляющей хостинг, нужно учитывать следующие факторы:
– можно ли запускать на сервере скрипты (обычно программное обеспечение интернет–магазина – это некий скрипт);
– предоставляется ли вам почтовый ящик (если да, то сколько);
– пропускная возможность канала (выдержит ли сервер, наплыв посетителей, который вы запланировали, а в случае если их будет больше, возьмут ли с вас плату за перенос на другой сервер).
Лучше размещать свой интернет–магазин на таком сервере, где будет запас по количеству посетителей в день (час, минуту). Потому, что сервер может, не выдержит потока потенциальных клиентов, и вы потеряете своих потенциальных покупателей, а значит и Ваши деньги.
Следующий шаг
5.разработка инструкции для конечного пользователя.
И так приступим, для создания интернет магазина нам потребуется:
1 знание основ HTML
2 редактор HTML кода
3 графический редактор
Я предлагаю использовать редактор HTML кода «NeonHTML 4.5.1»
Основное рабочее окно NeonHTML состоит из следующих элементов:
Главное меню - самое верхнее меню с наиболее общими
функциями.
Панель инструментов - под главным меню панель с
закладками и множеством инструментов.
Докеры - левая панель редактора на
всю его высоту с закладками, может быть
скрыта.
Панель быстрых действий - вертикальная узкая панель с кнопками
на всю высоту редактора, левее меток и
номеров строк основного поля, но правее
докеров.
Всплывающее меню - меню при правом клике мышью по полю
редактирования.
Список сообщений - поле строк внизу от поля редактирования.
Строка состояния - горизонтальная узкая панель в виде
полоски в самом низу редактора.
Многие возможности NeonHTML стандартны,
как и в других редакторах кода или текста,
поэтому мы не будем их рассматривать.
Главное меню
Файл
Окно приветствия - вызывает окно приветствия.
Недавние документы
- содержит список недавно открытых и сохраненных
страниц.
Новый - создание нового
пустого документа или web-страницы через
диалог.
Импорт - при импорте текстового
файла, он перестроится в простую web-страницу.
Если импортировать веб-архив mht, то из
него выделится html-код, доступный для редактирования
(сохранение обратно в архив не предусмотрено).
Экспорт - сохраняет документ
в сжатом виде, при этом документ сохраняет
полную функциональность и вид. Возможность
сжатия документа можно посмотреть в окне
"Свойства документа".
Резервные копии - редактор
сохраняет в специальной папке все несохраненные
страницы на случай вашего "автоматизма",
т.е. если вы по ошибке не сохранили изменения
и закрыли редактор. Можно создать резервную
копию вашего документа, если вы не уверены
в правильности будущих изменений. Отключить
функции резервного копирования можно
в настройках: закладка «Файл», снимите
флажок с «Резервное копирование».
Кодировка - список возможных
кодировок. Кодировка автоматически читается
с метатега при открытии или определяется
статистически (utf-8). Для изменения кодировки
файла перед сохранением выберите необходимую
кодировку из списка. При открытии файла
без метатега кодировка может не определиться
автоматически, в этом случае редактор
покажет непонятные символы вместо русского
текста, однако не испортит документ. Но
в этом случае работать с документом не
рекомендуется.
Свойства документа
- показывает информацию о документе, его
формат, путь к файлу, URL для просмотра
в браузере, размер в килобайтах, количество
строк, возможность сжатия при экспорте,
вес ресурсов на которые ссылается страница
и которые доступны на вашем жестком диске,
примерное время загрузки страницы с ресурсами
через 56kb модем, а также выдает список
всех ресурсов страницы - при двойном
клике по ресурсу открывается его папка.
Заготовки
Меню для быстрой вставки в документ заготовок кода.
Добавить - добавляет в
редактор вашу заготовку.
Создать из выделенного
- быстро создает заготовку из выделенного
кода.
Управление заготовками
- служит для сортировки списка заготовок
и их редактирования.
Обработка
Содержит инструменты
Упорядочить HTML - делает
код веб страницы более наглядным, похожим
на ручное редактирование. Особенно полезен
при открытии сжатого кода, когда нет отступов
и переходов на новую строку. * Нельзя использовать
при наличии скриптов и каких-либо сложных
конструкций.
Упорядочить CSS - делает
код CSS таблицы стилей более наглядным
и структурированным. Инструмент схож
с "Упорядочить HTML".
Преобразовать в формат
HTML - преобразовывает выделенные строки
в формат HTML - обычное форматирование заменяется
тегами. Может применяться при вставке
из текстового файла, когда много строк,
и выставлять везде <br> долго. Избавляет
от некоторых глюков с символами, т.к. выборочно
заменяет символы на html аналог. Это позволяет
например написать код ссылки в текстовом
(для показа пользователю) виде.
Преобразовать текст в
одну строку - сжимает код, убирая переносы
строк и делая его более компактным. Но
при этом код становится визуально трудным
для редактирования. Поможет в том случае,
если Вы больше не будете редактировать
определенный фрагмент кода, и хотите
его немного сжать.
Удалить строки без значимых
символов - удаляет строки, в которых
вообще нет символов кода или состоящие
только из пробелов и таб-отступов.
Пробелы и отступы -
подменю для обработки строк, содержащих
пробелы и таб-отступы. Каждый из имеющихся
в нем инструментов может применяться
как ко всему коду, так и отдельно к выделенному
фрагменту.
Настройки
Основные - вызывает диалог основных настроек редактора. Обратите внимание, что этот диалог содержит важную и полезную информацию, и пренебрегать им не следует, полагая что редактор уже хорошо настроен для работы. В частности, в настройках можно изменить цвета подсветки кода, фон редактора, размер шрифта, настроить проверку кода, выбрать между стандартами HTML иди XHTML и многое другое.
Интерфейс - вызывает диалог
настроек интерфейса. В нем можно изменить
верхнюю панель инструментов и левую панель быстрых действий: добавить новую вкладку инструментов,
изменить порядок вкладок, удалить или
переименовать вкладку, создать новую
кнопку или разделитель.
Ссылки
Этот раздел меню служит для хранения Ваших ссылок и открытия их в браузере системы. В процессе создания сайта и редактирования страниц вебмастер часто пользуется разными веб-сервисами или заходит на редактируемый сайт в интернете. Поэтому, чтобы не отрываться от работы, ссылки удобно хранить прямо в редакторе. Добавлять или изменять ссылку легко - кликните на пункт "Добавить / изменить ссылку". С удалением ссылки дело обстоит иначе, хотя также просто, - кликните на пункт "Удалить ссылку", это активирует режим удаления и закроет меню, нужно опять его открыть и кликнуть по ссылке, которую хотите удалить. После удаления ссылки нужно опять зайти в меню и отменить режим удаления.
Программа
Помощь по работе с редактором и данные о программе.
Панель инструментов
Это верхняя горизонтальная панель с вкладками и инструментами. При выборе вкладки и подведении к кнопкам панели, возникает подсказка с их названием и функцией, так же их название возникает в строке состояния в самом низу редактора слева. Правым кликом в пустой области панели (где кнопки) можно вызвать диалог настроек интерфейса [Вызвать]. В нем можно изменить верхнюю панель инструментов и левую панель быстрых действий: добавить новую вкладку инструментов, изменить порядок вкладок, удалить или переименовать вкладку, создать новую кнопку или разделитель. Более того, дополнительные функции настройки каждой кнопки появляются при клике по ней правой кнопкой.
Докеры
Докеры - это
вертикальная широкая панель слева с вкладками,
может быть скрыта. Для открытия или скрытия
докеров подведите курсор к левой кромке
редактора и кликните.
Файловый докер состоит
из трех элементов - дерева папок, списка
файлов и фильтра форматов. Дерево папок
позволяет перемещаться между папками,
при этом список файлов отображает файлы
выбранной папки. У списка файлов есть
специальное меню, вызывается правым кликом
мыши. Оно позволяет открыть выбранный
файл (то же самое происходит при двойном
клике по файлу в списке) и удалить выбранный
файл. Между деревом папок и списком файлов
находится фильтр форматов. Фильтр позволяет
показывать в списке файлов только определенные
форматы или категории файлов - веб документы,
html, css и т.д. Вверху докера справа есть
кнопка, которая позволяет переместиться
в папку текущего проекта (папка открывается
по умолчанию при открытии документа).
Докер цвета служит для
создания и редактирования кода цвета
визуально. Кликом по радужной растяжке
справа можно задать тон квадрата палитры,
выбрав в нем необходимый цвет. Каждый
клик сопровождается созданием или изменением
кода цвета в документе, что экономит время.
Докер классов (селекторов)
предоставляет список всех классов документа
и связанных с ним CSS таблиц. Через него
можно вставлять имя класса или быстро
переходить к редактированию класса, освобождаясь
от необходимости искать класс (селектор)
по документу или внешним таблицам.
* Примечание: Редактирование класса в
докере (поиск класса) работает верно только
в том случае, если открыт документ (страница),
из которого было произведено построение
списка классов. При повторном поиске
в докере, и если открыта CSS-таблица, вернитесь
сначала на страницу, а потом производите
поиск.
Панель быстрых действий
Это меню появляется при правом клике мыши и имеет большее отношение к редактированию кода документа.
Отмена (Ctrl+Z), Вернуть (Ctrl+R)
Как в любом редакторе эти функции отменяют или возвращают последние действия.
Закладки
Возможность поставить закладку в определенное место документа, и при желании быстро перейти к ней. Закладки можно ставить просты по номеру строки.
В верхний регистр, В нижний регистр
Переводит выделенный текст в большие или малые буквы. Служит только для кода, а не для изменения стиля шрифта страницы. Для изменения стиля шрифта удобно использовать инструмент "Выбрать и вставить стиль шрифта" на панели инструментов.
Транслит на латинский, Транслит на русский
Переводит символы кода, если вы случайно не переключили язык и ввели белиберду.
Стиль и класс
Преобразовать стиль в
класс - вызывает диалог выбора класса
и заносит описание класса в буфер обмена.
Например, если в тексте кликнуть внутри
любого описания стиля, предположим style="margin:10;"
, потом воспользоваться этой функцией
и прописать название класса в появившемся
диалоге, то в буфере будет строка ".имя_класса{margin:10;}"
для создания соответствующей строки
в заголовке или CSS-таблице, а сам стиль
в теге заменится на класс. Можно заменить
стиль на описанный в заголовке страницы
класс или на класс из внешних CSS, выбрав
его из списка в диалоге.
Выбрать имя класса - вызывает
диалог выбора имени класса, который предоставляет
список всех описанных в заголовке страницы
классов и классов внешних CSS-таблиц, которые
использует страница. Вместо этого инструмента
можно пользоваться докером классов (инструмент
остался от прошлых версий редактора).
Время и дата
Вставляет в документ различные вариации текущего времени и даты. Например "9 Декабря 2008 г."
Выбрать путь на диске
Функция позволяет выбрать
<br>
При редактировании кода важна функция быстрой вставки тега перехода на новую строку <br> (Ctrl+B).
Список сообщений
Поле строк внизу от поля редактирования. Сообщает о разных возможностях редактора в процессе создания страницы, об ошибках и результатах произведенных операций. Если Вы закрыли список, то его можно открыть в настройках программы - поставьте галочку "Отображать список сообщений".
Строка состояния
Горизонтальная узкая панель в виде полоски в самом низу редактора. Служит для отображения общей динамической информации: дублирования подсказок редактора, показа размера документа, положения каретки (курсора) в тексте, текущего символа и его цифрового кода в кодировке Ansi (Windows-1251), и отображения времени (на случай скрытой панели задач Windows). Также, при клике по строке состояния появляется командная строка редактора, с помощью которой можно выполнить одну из основных команд NeonHTML.
После обзора редактора можно приступить к написанию HTML кода и CSS стиля.
Для начала создадим шаблон нашего сайта, в последствии, который будем использовать для упрощения создания дополнительных страниц. Создаём текстовый документ, пишем стандартный код:
<html>
<head>
<title>Название страницы</title>
</head>
<body>
</body>
</html>
После чего переименовываем его в index.html. У нас получилась чистая HTML страница, теперь перейдем к созданию CSS стиля. Cоздаем новый текстовый документ и вписываем туда следующий код:
body
{background-color:#ddd;font-
h1 {font-size:19pt;}
h2 {font-size:15pt;}
div#wrap
{margin:auto;width:80%;
div#header
{background-color:#356aa0;
div#header h1 {margin:0;padding:0;}
div#header h2 {margin:0;padding:0;}
div#nav
{background-color:#333;color:#
div#nav ul
{margin:0;padding:0;float:
div#nav li
{display:inline;margin:0;
div#nav li a
{padding:5px;text-decoration:
div#nav li a:hover
{color:#eee;background-color:#
div#content {padding:2em 1em;}
div#content h2 {border-bottom:1px solid #ddd;margin-bottom:.5em;}
div#content img.fancy {border:1px solid #ddd;padding:.5em;}
div#content img.left {float:left;margin-right:1em;}
div#content img.right {float:right;margin-left:1em;}
div#footer
{text-align:center;margin-top:
Сохраняем изменения и переименовываем полученный файл в still.css, стиль для нашего сайта готов. Теперь нам надо объединить этот файл с заготовкой шаблона, для этого создаем папку «интернет-магазин» и копируем туда файл index.html, в этой же папки создаём ещё одну папку называем её «still». В папку стиль копируем файл still.css . В споюочередь
Базовый синтаксис CSS - стилевые правила CSS записываются в своем формате, отличном от HTML. Основным понятием выступает селектор — это некоторое имя стиля, для которого добавляются параметры форматирования. В качестве селектора выступают теги, классы и идентификаторы. Общий способ записи имеет следующий вид:
Вначале пишется имя селектора, например, body, это означает, что все стилевые параметры будут применяться к тегу <body>, затем идут фигурные скобки, в которых записывается стилевое свойство, а его значение указывается после двоеточия. Стилевые свойства разделяются между собой точкой с запятой.
Рассмотрим используемые теги
<html></html> - Указывает программе просмотра страниц, что это HTML документ.
<head></head> - Определяет место, где помещается различная информация, не отображаемая в теле документа. Здесь располагается тег названия документа, тег ссылки на таблицу стилей и теги для поисковых машин.
<title></title> - Помещает название документа в оглавление программы просмотра страниц.
<body></body> - это тег тела вашего документа, всё что будет написано между этими тегами будет отображаться в Вашем документе
Заключение
Расходы на создание интернет – магазина не должны рассматриваться Вами и бухгалтерией в частности, как расходы на один из способов рекламы. Интернет–магазин это ваш новый прилавок, ваш новый филиал, ваша новая торговая точка, которая может и должна приносить доход, иногда даже больший чем офф – лайн торговля.
Библиографический список
Приложения
1.Подбор материала и
описание предметной области:
[1:23:30] Валерия:
[1:23:52] Валерия:
[1:24:39] Валерия:
[1:25:27] Валерия: тема: Разработка интернет магазина, особенности его создания.
[1:26:54] Валерия: Я отблагадарю за ранее спасибо.
[1:28:03] Валерия: Оформление разделов курсовой работы.
[1:28:20] RemiZ RakFeleR: и ещё одно расчёты через какую платежную систему должен осуществляться???
[1:30:47] Валерия: Коммерческая оплата, всё самое простое.как сделаете.
[1:31:15] Валерия:
[1:31:45] Валерия: 1.Предметная область автоматизации
[1:32:07] Валерия: 2.Постановка задачи
[1:32:27] Валерия: 2.1 сущность задачи
[1:33:01] Валерия: 2.2 описание входной информации
[1:33:28] Валерия: 2.3описание выходной информации
[1:33:49] Валерия: 3.выбор программного обеспечения
[1:34:20] Валерия:
[1:34:31] Валерия:
[1:34:47] Валерия:
[1:48:02] Валерия: я подумаю, что ещё завтра напишу