Връщане към Курс по уеб програмиране (2015)

Курсова задача за курс по уеб програмиране (2015)

Публикуваме условието на курсовата задача за курса по уеб програмиране (2015).

Срокът за предаване на задачата е 6.9.2015 г.. Решенията си изпращайте като архив на електронния адрес на академията. За да бъде приета за успешно изпълнена курсовата задача, решението ви трябва да покрива всички изисквания. Изпълнението на допълнителните задачи не е задължително.

В случай, че решението не удовлетворява всички задължителни условия, задачата ще бъде връщана за доработка до 20.9.2015 г.. Ако до тогава не бъде получено решение, задачата ще бъде приета за неизпълнена.

 

Корпоративен сайт на фирма за бързи кредити

Цел

Да се направи корпоративен сайт на фирма за отпускане на бързи кредити.

Описание

Сайтът трябва да отговаря на следните общи изисквания:

Съдържание

Съдържанието трябва да отговаря на следните изисквания:

  • Всяка страница трябва да е отделена в отделен валиден HTML5 документ;
  • Съдържанието трябва да е разпределено в подходящите семантични елементи;
  • Съдържанието трябва да е на български език;
  • Съдържанието да е оформено в следните части:
    • Заглавна част – еднаква за всички страници част включваща:
      • изображение представляващо лого на фирмата;
      • голямо заглавие с името на фирмата;
      • по-малко заглавие с рекламен слоган на фирмата.
    • Навигационна част – еднаква за всички страници част включваща:
      • меню с връзки към всяка страница.
    • Основна част – различна за всяка страница част включваща:
      • по-малко заглавие съответстващо на заглавието на страницата;
      • специфично съдържание на съответната страница.
    • Опашна част – еднаква за всички страници част включваща:
      • информация за права върху съдържанието и връзки към страници за „Условия за използване“ и „Политика за поверителност“.

Страниците на сайта трябва да бъдат следните:

  • Страница „Начало“ – съдържа следните секции:
    • Информация – съдържа кратки въвеждащи думи за фирмата;
    • Новини – съдържа няколко новини със заглавие, текст и дата/час;
  • Страница „За нас“ – съдържа информация за фирмата и нейната история (всяка част от които е отделена в секция със собствено вътрешно заглавие и по едно изображение вляво от текста);
  • Страница „Предложения“ – съдържа следните секции:
    • Секция съдържаща таблица с предложенията (най-малко две) – има заглавие „Предложения“ и съдържа колони „Наименование“, „Минимална сума“, „Максимална сума“, „Минимален срок“, „Максимален срок“, „Годишен лихвен процент“, „Гаранция“ (поръчител, ипотека или без гаранция), „Срок на одобрение“ и „Подробно“. Последната колонка трябва да съдържа хипервръзка с текст „Виж“ препращаща към публикацията на съответната оферта в рамките на същата страница;
    • Секция съдържаща публикация за всяко едно предложение с по-подробна информация.
  • Страница „Кандидатстване за кредит“ – съдържа форма изчисляваща месечните вноски по кредит с посочени параметри (вж. точка „Поведение“ на настоящото задание);
  • Страница „Контакт“ – съдържа информация за контакт с фирмата (телефони, адрес и по желание вградена карта от Google Maps, Bing Maps или др.).

Оформление

Оформлението трябва да отговаря на следните изисквания:

  • Външният вид и организацията на страниците трябва да е едно и също;
  • Оформлението трябва да е обособено като валиден външен CSS файл с наименование „styles.css”;
  • Използваните мерни единици трябва да бъдат „pt” и „em“;
  • За всички елементи трябва да се използва единен шрифт и единен размер на основния текст;
  • Хипервръзките да бъдат визуализирани без да бъдат подчертавани;
  • Различните хипервръзки (обикновени, посетени и такива, над които се намира мишката) трябва да имат различен цвят;
  • Таблиците трябва да бъдат със слети, солидни рамки около клетките;
  • Таблиците трябва да имат заглавни клетки с различен цвят от този на останалите клетки;
  • Входните полета на формите да бъдат с тънка, солидна рамка;
  • Бутоните във формите да бъдат с тънка, солидна рамка;
  • Бутоните за изпращане на форма да бъдат с нормална, солидна рамка;
  • Съдържанието да е обособено в елемент с фиксирана широчина, центриран на екрана;
  • Отделните части на съдържанието да бъдат разпределени една под друга;
  • Заглавната част и навигационната част да остават с фиксирана позиция при вертикално скролиране на съдържанието;
  • В навигационната част хипервръзките да бъдат блокови елементи, разположени хоризонтално и всяка от тях да има забележим отстъп;
  • В навигационната част хипервръзките, над които се намира мишката, да придобиват различен фон;
  • В навигационната част посетените хипервръзки да имат различен цвят на текста от обикновените;
  • В опашната част текстът да бъде с намален размер.
Поведение

Поведението на страниците трябва да отговаря на следните изисквания:

  • Общото поведение на всички страници трябва да бъде обособено под формата на функции в отделен файл “functions.js”;
  • Специфичното поведение на всяка страница (ако има такова) трябва да бъде оформено в отделен файл с наименованието на съответната HTML страница и разширение „.js”;
  • Страницата „Кредитен калкулатор“ трябва да съдържа форма със следните елементи:
    • Поле с надпис „Имена“ – текстово поле за въвеждане на името;
    • Поле с надпис „Телефонен номер“ – поле за въвеждане на телефонен номер;
    • Поле с надпис „Имейл“ – поле за въвеждане на имейл адрес;
    • Поле с надпис „Размер на кредита“ – цяло положително число;
    • Поле с надпис „Срок“ – цяло число по-голямо от 1;
    • Поле с надпис „Гаранция“ – падащо меню с избор между „Гарант“, „Ипотека“ и „Без гаранция“;
    • Поле с надпис „Предложение“ – падащо меню с избор на предложение от страницата „Предложения“;
    • При промяна на някое от полетата „Размер на кредита“, „Срок“ или „Гаранция“ в полето „Предложение“ се изключват онези предложения, на които условията на кредита не отговарят;
    • Бутон „Изчисти“, който изчиства формата;
    • Бутон „Изчисли“, който:
      • Определя годишния лихвен процент според избраното предложение;
      • Изчислява общата сума, която трябва да бъде върнат;
      • Извежда скрита секция „Параметри на кредита“ съдържаща въведените и изчислени данни под формата на дефиниращ списък, както и бутон „Изпрати“;
      • Бутонът „Изпрати“ изпраща формата.

Насоки

Във разработката могат да бъдат използвани следните насоки:

  • За текстовете в съдържанието – текста „Lorem ipsum”;
  • Хипервръзките към лисващите страници нека сочат към „#“;
  • Изключването на възможност от падащо меню става с добавянето на атрибут „disabled” без стойност;
  • За проверка на валидността на HTML документи – http://validator.w3.org/;
  • За проверка на валидността на CSS файлове – https://jigsaw.w3.org/css-validator/.

Постоянен линк към тази тема: https://acad.david.bg/kursove/2015-kurs-po-ueb-programirane/kursova-zadacha/