ВУЗ: Не указан
Категория: Не указан
Дисциплина: Не указана
Добавлен: 15.06.2024
Просмотров: 11
Скачиваний: 0
Лекція 2
Тема: web-технології| та web-дизайн|. Етапи проектування сайту.
План
-
Основні веб-технології.
-
Головне про веб-дизайн.
-
Етапи проектування сайту та дизайну.
-
Основні веб-технології.
web| технології – це процес розробки і вдосконалення сторінок, у тому числі і їх функціонування.
Одній серед важливих Інтернет-технологій, яка стає набагато поширеною, считаетя| технологія розробки «каскадних сторінок». Розроблена навіть мова, назва якої походить від американського Cascading| Style| Sheets| (CSS|). Завдяки такій спеціальній мові розробляються сотні сторінок, які мають єдине по стилістиці оформлення, що дуже спрощує роботу в цій області, як веб-дизайн. З даною мовою дизайнер підбирає оригінальні шрифти для тексту, кольори, стилі, він робить web-сторінку логічнішою, розділивши її на певні розміри зони.
З вдосконаленням Інтернету і Інтернет-технологій дуже поширеним виявляється питання: яким чином розробити комплексне забезпечення безпеки для користувача? Також гостро коштує проблема уразливості самих web-сайтів| і їх ризик поразки вірусами. Серед важливих хранителів вірусів називають реклама або спам, соціальні мережі, ресурси, з яких можна завантажувати якісь файли.
Інші web-технології|
JAVA|
Мова програмування Java|, розроблена близько восьми років тому компанією Sun| Microsystems| і що нагадує по структурі і синтаксису добре знайомий багатьом програмістам З, існує сьогодні в Інтернеті в двох варіантах: JavaScript| і власне Java|. Перший варіант мови є всього лише надбудовою стандарту HTML| і значно розширює можливості документа, створеного в цьому форматі. Модуль, написаний на JavaScript|, інтегрується у файл HTML| як підпрограма і викликається на виконання з відповідного рядка HTML-кода| стандартною командою. Вбудований в браузер| інтерпретатор мови сприймає і скрипт, і сам код гіпертексту як єдиний документ, обробляючи ті та інші дані одночасно.
За допомогою технології Java| можна додати своїй сторінці елементи інтерактивності, формувати, компонувати і повністю контролювати формат спливаючих вікон і вбудованих фреймів, організовувати такі активні елементи, як «годинник», рядки», що «біжать, і іншу анімацію, створити чат. Більшість web-камер|, передавальних на сайт «живе» зображення, також працюють на базі відповідних додатків Java|.
Серед достоїнств цієї технології слід зазначити відсутність необхідності встановлювати і настроювати на сервері які-небудь додаткові модулі, що забезпечують роботу Java-програм|. Головний недолік Java| полягає в тому, що користувачі браузерів| старих версій, що не підтримують компіляцію даної мови, сприймати об'єкти, створені за допомогою Java| і JavaScript|, не зможуть.
CGI|
Технологія CGI| (Common| Gateway| Interface|) має на увазі використання у складі ресурсу Інтернет інтерактивних елементів на базі додатків, що забезпечують передачу потоку даних від об'єкту до об'єкту. Саме так організована в Усесвітній мережі більшість чатів, конференцій, дощок оголошень, гостьових книг, пошукових машин і систем підрахунку рейтингу. У загальному випадку принцип роботи CGI| виглядає таким чином: користувач заповнює на web-страничке| ту або іншу форму і натискає на кнопку, після чого вбудована в код HTML| рядок виклику CGI-скрипта| запускає відповідну програму CGI| і передає їй управління процесом обробки інформації. Введені користувачем дані відсилаються цій програмі, а вона, у свою чергу, «вбудовує» їх в іншу сторінку, відправляє поштою або трансформує яким-небудь іншим способом.
SSI|
SSI| (Server| Side| Includes|) — технологія, тісно переплетена із згаданою вище CGI|. На основі макромови, що дуже нагадує З, SSI| дозволяє реалізувати такі можливості, як вивід в документі того або іншого тексту залежно від певних умов або згідно заданому алгоритму, формувати файл HTML| з фрагментів, що динамічно змінюються, або вбудовувати результат роботи CGI| в який-небудь його ділянка.
CSS|
Часто у web-дизайнера| виникає необхідність застосувати в процесі створення html-документа| складне форматування — від абзацу до абзацу міняти шрифт, розташування тексту, його колір, формувати різні таблиці даних.
Файл CSS| виконує роль якогось шаблону, вживаного для форматування тексту, таблиць і інших елементів в документі HTML|. Є можливість підключати один і той же фізичний файл CSS| до різних web-страницам| сайту. CSS| можна використовувати практично на будь-якому сервері без яких-небудь обмежень.
РНР
РНР (Personal| Home| Page| tools|) — це ще одна мова, що інтерпретується, PERL|, що нагадує, призначений для додання web-страницам| елементів інтерактивності. Код, написаний на мові РНР, вбудовується в документ HTML| подібно до підпрограми: у ту ділянку документа, де необхідно розмістити інтерактивний елемент, просто вставляється сценарій РНР.
Технологія РНР дозволяє організувати на web-странице| лічильник відвідин, підраховувати статистику звернень до тих або інших розділів сайту, захистити доступ до якого-небудь html-документу| паролем і багато що інше. Серед недоліків РНР слід зазначити те, що дана технологія підтримується далеко не всіма серверами Інтернету.
-
Головне про веб-дизайн.
Щоб вивчити основи веб-дизайну необхідно знати етапи розробки сайту, від тематики сайту, до реалізації графічної ідеї і розміщення готового сайту в інтернет. Для цього, вивчимо що таке веб-дизайн, етапи створення сайту, види сайтів.
Веб-дизайн - графічне оформлення сайту, яке сприяє позитивному сприйняттю сайту відвідувачем.
Якісний веб-дизайн, це не тільки вдале поєднання кольорів, правильно підібрані зображення, але і спосіб наочного представлення інформації: зручна навігація, швидкий пошук, просте меню доступність популярних розділів.
Перед розробкою дизайну сайту, замовник розповідає про діяльність фірми, цільовій аудиторії і призначенні проекту, також обговорюється структура сайту і малюється схема навігації. Складається попередній план роботи.
-
Проектування навігації| на сайті.
Один з важливих етапів підготовки до роботи - навігація сайту, яка включає опрацьовування всіляких переходів між сторінками відвідувачів. Найбільш зручні, короткі переходи між сторінками, зручність користувача.
Грамотно розташовані інформаційні блоки і проста, зрозуміла, навігація запорука успіху майбутнього сайту.
-
Елементни дизайну сайту.
Особлива увага приділяється елементам веб-дизайну, які повинні гармонійно поєднуватися між собою і бути єдиний цілим з дизайном сайту.
На етапі створення веб-дизайну важливу роль грає злагоджена робота представників обох сторін, замовника і виконавця. Терпіння і взаєморозуміння дозволяє розробити правильну концепцію сайту і грамотно утілити задумку в життя, з урахуванням всіх побажань клієнта.
Правильно розроблений сайт включає такі важливі моменти як: - зручна навігація
- впорядковані інформаційні блоки
- всі матеріали сайту повинні мати тематичну спрямованість сайту (для певного круга користувачів)
Кожен відвідувач сайту шукає свіжу і корисну інформацію, красиве графічне оформлення доповнює зміст сторінок. Нова повна інформація по цікавих темах буде гарантією популярності ресурсу.
Стильний і оригінально оформлений сайт не тільки привертає увагу відвідувачів, на нього хочеться повернутися ще і ще.... Яскрава картинка або цікава фотографія на сайті може привернути відвідувачів кілька разів, але якщо тексти не оновлюються регулярно, інтерес переходить до іншого, ресурсу, що динамічно розвивається.
-
Елементи веб-дизайну сайту.
Елементи дизайну сайту грають важливу роль в сприйнятті відвідувачами. Відомо, що людина здатна одночасно сприйняти 5-9 однотипних елементів. Відповідно, найбільш зрозумілим стане меню, що складається з оптимальних 5-7 елементів. Можна збільшити до 9, але це максимум, рекомендувати який, ми б не стали. Саме така кількість пунктів меню дасть відвідувачеві можливість швидко запам'ятати їх назви, адаптуватися до графіки, і в цьому випадку стати постійним користувачем вашого сайту.
Які елементи веб-сервера-дизайну впливають на перше враження і встановлення довірчих відносин між відвідувачем і сайтом?
Логотип
Логотип є віддзеркаленням діяльності компанії, організації. Це обов'язковий елемент, який розміщується на всіх сторінках сайту. Колір логотипу повинен відповідати профілю діяльності і гармонійно поєднуватися із загальним дизайном сайту. Окрема увага приділяється написанню назві компанії, якщо відсутній єдиний фірмовий стиль.
Навігація
Важливим моментом в створенні сайту є розробка і позиціонування панелей навігації. Зазвичай буває 2-3 види навігації: основна і додаткові, які застосовуються для внутрішніх розділів. Правильно розміщені навігаційні панелі, допомагають знаходженню інформації.
Шрифт
Вибір правильного виду шрифту, його зображення, колір і розмір (кегль) також грає важливу роль в сприйнятті сайту відвідувачем. Розмір краще задавати у відсотках, щоб була можливість його збільшити при необхідності в браузері|. Не бажано використовувати в дизайні сайтів чітко фіксований розмір кегля. Вибір колірного рішення повинен відповідати профілю діяльності компанії. Білий, світлий колір - основний в оформленні сайту. Графічний заголовок дозволяє використовувати незалежні від встановлених на клієнтському комп'ютері шрифти. У інтернет існує безліч думок по даному пункту, але білий колір - найбільш відповідний для читання текстів. Погоджуся, що наприклад, сайт фотографа, може мати основним кольором фону - чорний, оскільки фотографії краще є видимими. Але читати білий текст на темному фоні - це не професійно!
Фотографії.
Доведено, погляд людини притягується до малюнка менше, ніж фотографії, яку хочеться роздивлятися.
Фотографії використовуються зазвичай в дизайні для надання доброзичливішому зовнішньому вигляду сторінці. Погляд відвідувачів природним чином притягується до фотозображень.
