сайт більш зручним для перегляду на планшетах і мобільних пристроях;
- використання HTML5 та CSS3 з їх розширеними можливостями з оформлення веб-сторінок;
Використання мінімалістичного дизайну для сайту увазі використання мінімуму виразних засобів для досягнення максимуму інформативності. В даний час цей напрям є одним з лідируючих в галузі створення веб-ресурсів. В останні два-три роки такі інтернет-гіганти як Google, YouTube, Ebayі інші прагнуть спрощувати дизайн своїх сайтів, при цьому збільшуючи зручність використання для своїх користувачів.
З все більшим поширенням смартфонів і планшетів, як пристрій для виходу в Інтернет, веб-розробникам доводиться замислюватися над адаптацією дизайну для цих пристроїв. У зв'язку з цим з'явилася тенденція робити на сайтах горизонтальне меню, тому вертикальне не зовсім зручно, і не підходить для мобільних пристроїв.
В оновленій версії вертикальне меню з оригінального сайту було повністю перероблено. Хаотично розташовані посилання з оригінального сайту були розсортовані і отримали виразну логічну структуру. Це має зробити навігацію по сайту більш зручною і приємною для користувачів. Тепер сайт буде більш зручним для використання на смартфонах і планшетах.
. 3 Технічна реалізація сайту
сайт дизайн інтернет
Як і було сказано вище, сайт філії ВГУЕС встиг застаріти в технічному плані. Для його поновлення і підгонки під сучасні стандарти було вирішено використовувати інструментарій WebSite X5.X5 це програма для створення сучасних, крос-браузерних і стандартизованих інтерфейсів. Продумана структура коду HTML, JavaScript і CSS дає можливість створювати безліч найрізноманітніших елементів інтерфейсу і сітку сайту.
Свідченням того, що WebSite X5 це дуже вдала розробка, є його безперервно зростаюча популярність. Нинішній рівень розвитку цього WebSite вже дозволяє повністю створити будь web-інтерфейс. З його допомогою розробники можуть створювати змінні, вкладені колонки, управляти квітами і т.д. Так само програмою WebSite x5 дуже легко користуватися. Бібліотека WebSite x5 містить безліч готових класів для різних елементів сайту, будь то кнопки, посилання, форми або що-небудь ще.
Основні інструменти WebSite x5:
- сітки - заздалегідь задані розміри колонок, які можна відразу ж використовувати, наприклад ширина колонки 140px відноситься до класу .span2, який можна використовувати в CSS описі документа.
- шаблони - фіксований або гумовий шаблон документа.
- типографіка - опису шрифтів, визначення деяких класів для шрифтів, таких як код, цитати і т. п.
- медіа - представляє деякий управління зображеннями, аудіо та відео.
- таблиці - засоби оформлення таблиць, аж до додавання функціональності сортування.
- форми - класи для оформлення не тільки форм, а й деяких подій відбуваються з ними.
- Алерт - формленія діалогових вікон, підказок і спливаючих вікон.
Завдяки Bootstrap структура сайту була повністю перероблена. У новій версії головна сторінка поділена на три основні частини. З боку коду вони являють собою div-контейнери з призначеним css-класом, який визначає функціонал і наповнення самого контейнера.
Центральна частина станиці являє собою порожній контейнер, в який при натисканні на посилання подгружается потрібний документ. Для подгрузки сторінок використовувалася технологія AJAX., Або, більш довго, Asynchronous Javascript And Xml - технологія для взаємодії з сервером без перезавантаження страніц.За рахунок цього зменшується час відгуку і веб-додаток по інтерактивності більше нагадує десктоп.
Технологія AJAX, як вказує перша буква A в її назві - асинхронна, тобто браузер, відіславши запит, може робити що завгодно, наприклад, показати повідомлення про очікування відповіді, прокручувати сторінку, і т.п. Для обміну даними з сервером використовується спеціальний об'єкт XmlHttpRequest, який уміє відправляти запит і отримувати відповідь з сервера.
Типове AJAX-додаток складається як мінімум з двох частин. Перша виконується в браузері і написана, як правило, на JavaScript, а друга - знаходиться на сервері і написана, наприклад, на Ruby, Java або PHP. Сенс AJAX - в інтерактивності і швидкому часу відгуку.
Так як подгрузка скоюється за допомогою ajax-скрипта, це дає кілька переваг:
- Економія трафіку, використання AJAX дозволяє значно скоротити трафік при роботі з веб-додатком завдяки тому, що замість завантаження всієї сторінки достатньо завантажити тільки змінилася частина;
