Створення сайту - це трудомісткий і тривалий процес, який відбувається в кілька етапів, в міру проходження яких ідеї перетворюються в реальний функціонуючий сайт.
Для того, щоб розробник відчував себе максимально комфортно при розробці нового проекту, окрім робочого місця і персонального комп'ютера йому необхідно мати певний набір програмного забезпечення, базовий інструментарій, без якого розробнику сайту просто не обійтися.
Досвідчені розробники користуються професійними програмами, що розроблено відомими компаніями і за їх використання доводиться платити чималу ціну. Для початківців популярною альтернативою є безкоштовні редактори, які, можливо, і мають меншу функціональність, але є цілком придатними для роботи над веб-проектом.
Розробнику-початківцю слід орієнтуватися у різноманітті найменувань та призначень існуючих програм, і встановити необхідний набір інструментів.
- Встановити на комп'ютері відповідні програми – базовий інструментарій веб-розробника:
- Редактори для написання коду або інтегровані середовища розробки IDE.
- Поширені браузери для наочного перегляду результатів кодування.
- Програми з FTP-клієнтом для перенесення документів сайту на хостинг.
- Програми для віддаленого управління та колективної роботи.
- Зареєструвати хостинговий майданчик, для фізичного розміщення сайту в Інтернеті.
- Зареєструвати доменну адресу, за якої сайт буде відомий для користувачів та пошукових систем.
Програми для кодингу
Текстові HTML-редактори
Створення сайту в текстових редакторах є доцільним, якщо розробник знайомий з мовою HTML і володіє нею на належному рівні. Є достатньо велика кількість текстових HTML-редакторів, що використовуються розробниками різного рівня фаховості, втім, написати код можна і в звичайному блокноті, який є на кожному комп'ютері.
До позитивних особливостей текстових редакторів потрібно віднести те, що розробник власноруч пише код всіх сторінок майбутнього сайту. Зазвичай, в багатьох текстових редакторах є і підсвічування синтаксису, і уставляння стандартних фрагментів коду, і багато інших корисних функцій, але редактор не додасть жодного рядка без відома розробника, на відміну від візуальних редакторів. Тому, код сайту буде зрозумілим і позбавлений надлишковості. Розробник точно буде знати призначення того чи іншого фрагмента html-коду і за потреби, може легко внести зміни.
Інтегровані середовища розробки IDE
Інтегроване середовище розробки — комплексне програмне рішення для розробки програмного додатку. Зазвичай, складається з редактора початкового коду, інструментів для автоматизації складання та відлагодження програм. Більшість сучасних середовищ розробки мають можливість автодоповнення коду.
Сучасні інтегровані середовища розробки пропонують значно більше можливостей, ніж описаний вище необхідний мінімум. Наприклад, багато сучасних IDE є візуальними - вони дозволяють створювати інтерфейс програми за допомогою мишки, точно в такому вигляді, в якому він постане потім користувачеві.
Браузери
Основним призначенням браузера є відображення веб-ресурсів. За виведення вмісту сторінки у вікно браузера відповідає важливий елемент - модуль відображення. За замовченням модуль відображення здатний відображати HTML-документи, зображення, а також багато об'єктів в різних форматах: PDF-файли, мультимедійні файли, динамічні об'єкти.
Значна частина відмінностей браузерів випливає з відмінностей у модулі відображення сторінок. Ці відмінності приводять до того, що сторінки в різних браузерах виглядають дещо по-різному.
Модулі відображення постійно вдосконалюються, але старші версії браузерів працюють на попередніх версіях движків. Тому, розробнику слід тестувати сторінки в кількох браузерах, а також в кількох версіях цих браузерів.
Веб-хостинг
Веб-хостинг - це фізичне розміщення веб-сторінок на сервері. Це віртуальний аналог оренди приміщення, але орендується місце на диску, яке обчислюється мегабайтами. Від того, де буде розміщено сайт, залежить багато якісних характеристик, тому важливо вибрати оптимальний майданчик для сайту, що відповідає критеріям надійності та стабільності.
Хостинг умовно можна поділити на безкоштовний і платний. Для початківців, які починають перші кроки в області веб-розробки вірним рішенням буде реєстрація майданчика на безкоштовному хостингу.
Плюси безкоштовного хостингу
- Не потрібно платити. Розробник початківець тільки починає робити перші кроки і мало обізнаний в нюансах розміщення, показниках якості хостинга, налаштуваннях панелі та акаунту. Тому, варто, безкоштовно опанувати прийоми і зауважити ті критерії, які важливі для ефективної роботи: простота налаштувань, зручність адміністративної панелі, наявність вбудованих редакторів та файлових менеджерів.
- Безкоштовний тариф пропонує послуги аналогічні до платних. Надаються всі основні можливості (з певними функціональними обмеженнями), що потрібні для розміщення сайту: дисковий простір, підтримка мов програмування, під'єднання до баз даних, встановлення поширеної CMS - системи управління контентом, створення поштового акаунту та інше.
- Технічна підтримка. Користувачам надаються конструктори та інші інструменти, що полегшують створення, підтримку та просування сайту. Повсюдно присутня довідкова система, яка охоплює багато загальних та специфічних проблем, з якими стикаються початківці. Наявність спільнот так само містить багато форумів та обговорень, де можна завжди з'ясувати шляхи вирішення най поширених проблем.
- Можливість отримання безкоштовної доменної адреси 3 рівня. Безкоштовні хостинги надають можливості для вибору будь якого під домену до основного домену хостингу. Початківець позбувається проблеми щодо реєстрації, оплати та підтримки доменної адреси.
Обмеження безкоштовного хостингу
- Обмежений дисковий простір, але цілком достатній для розміщення нескладного сайту. На сьогодні цей показник складає від 1Гб і більше.
- Немає гарантій щодо захисту та доступності сайту. На таких площадках не роблять резервні копії сайтів і тому, у разі збоїв серверів сайт може бути пошкоджений або знищений без можливості відновлення. Створення резервних копій є турботою власника сайту.
- Деякі безкоштовні хостинги мають дохід за рахунок реклами. Де, скільки і за якою тематикою буде реклама на сайті користувача вирішують власники сервісу. Як правило, заборонено розміщувати власну рекламу і будь-яку іншу комерційну інформацію.
- Можуть бути присутні обмеження на тримання файлів певного формату (аудіо, відео, скрипти), а також на просте складування документів.
- При явній популярності сайту власники хостингу можуть висунути умови перенесення ресурсу на платний тариф, погрожуючи знищенням сайту. Прикрий випадок, коли вкласти багато часу, сил і фінансових коштів в створення сайту, в його наповнення контентом і просування. Закрити сайт, коли він вже став популярним і має чималу аудиторію відвідувачів не завжди просто.
Поради для вибору безкоштовного хостингу
- Віддавати перевагу більш популярним сервісам, бажано з давньою історією та хорошою репутацією.
- Заздалегідь почитати відгуки про даний хостингу в Інтернеті: чи достатньо там функціональних можливостей, наскільки зручно користуватися цим сервісом (способи редагування файлів і завантаження на сервер, кількість і різноманітність готових шаблонів дизайну).
На сьогодні розробникам початківцям надається великий вибір безкоштовних майданчиків, як українських так і іноземних. Вони дещо різняться за своїми показниками та умовами розміщення, але в загальному мають приблизно однаковий набір функціоналу.
-
000webhost.com -
freehostingeu.com -
byet.host -
www.zzz.com.ua -
ho.ua -
hyperhost.ua -
hostkoss.com -
awardspace.com
Вибір доменного імені (адреси)
Перше, з чим знайомиться потенційний відвідувач ще до відвідування сайту – це доменне ім'я. Нижче наведено чинники, які потрібно враховувати при виборі доменного імені сайту, що впливають як на сприйняття людиною, так і на сприйняття пошуковими системами.
- Легко запам'ятовується. Користувачі все рідше вводять в адресний рядок назву сайту, частіше переходять просто по посиланнях або вводять назву сайту в рядок пошукової системи. Тому, добре дотримуватися і правила «чим коротше назва, тим його легше запам'ятати».
- Легко вимовляється. Доменне ім'я має легко вимовлятися, так відвідувачам буде легше його запам'ятати. Варто уникати використання в імені дефісів та вживання неоднозначної транслітерації: х (h, kh), ц (ts, z), в (w, v), до (c, k, ck), ф (f, ph). Наприклад, доменні імена foto.ua і photo.ua звучать абсолютно однаково – фото, але написання літер є різним.
- Має зрозумілий сенс. Ідеально, коли за назвою зрозуміло, яка тематика сайту. Якщо просувається бренд, то домен варто називати так само, якщо це особистий блог - то можна назвати сайт за іменем чи прізвищем автора.
- Просте написання. Чим довше і складніше доменне ім'я - тим важче буде відвідувачам правильно його написати. Коректне введення довгого доменного імені може виявитися занадто складним. Наприклад, багаторазовий повтор складів як blablablablablabla, в якому кількість повторень запам'ятати просто нереально.
Клієнт-серверна архітектура
Браузер надсилає до сервера запит, щоб отримати певну сторінку веб-сайту і відобразити на екрані користувача. Веб-сервер приймає запит, шукає запитану сторінку і надсилає до клієнта її вміст або повідомлення про помилку, якщо такої сторінки не знайдено чи доступ до неї є забороненим. Веб-сервер не аналізує вміст сторінки, яку передає. Всю роботу зі структуризації і відображення отриманої інформації виконує браузер.
Клієнт-серверна архітектура
Пошук потрібної сторінки здійснюється в певній директорії, яку відведено на сервері для сайту. Зазвичай, назва директорії збігається з назвою доменної адреси сайту. У разі звернення до сайту в цілому (наприклад, site.ua), веб-сервер автоматично надсилає «стартову сторінку» з назвою index.* (index.html, index.php) або в деяких випадках — default.* (default.html).
Фізична структура сайту eom.lp.edu.ua
Цей документ повинен розташовуватися в кореневій директорії, яку відведено для розміщення сайту. Решта файлів можна розміщувати або в цій же директорії, або у вкладених директоріях, що іноді буває зручним, особливо у разі, коли сайт містить кілька тематичних розділів або рубрик.
- Деякі веб-сервери на відміну від комп'ютерів користувачів є чутливими до регістру літер, в якому представлено імена директорій і файлів, тому назви «documents», «DOCUMENTS» або «Documents» будуть позначати різні директорії. Варто назви всіх об'єктів сайту писати рядковими (маленькими) літерами.
- Щоб уникнути помилок, які пов'язані з відмінностями в обробці кодувань кириличної мови різними серверами, назви варто зазначати латиницею.
Для безпомилкового отримання потрібної інформації і в потрібному форматі використовується універсальний покажчик ресурсу URL (Universal Resource Locator), який однозначно ідентифікує будь-який ресурс в мережі Інтернет. Саме такий рядок відображається в адресному полі браузера.
http://www.site.lviv.ua/documents/page.html
http://213.82.46.1/documents/page.html
Універсальний покажчик ресурсу відображає:
- Протокол відповідної служби. В даному прикладі використано протокол http:// – протокол передачі гіпертексту.
- Назву служби. В даному прикладі це служба Веб - www
- Доменну або IP-адресу, яка однозначно ідентифікує веб-сервер в мережі Інтернет, на якому розміщено потрібний сайт чи інший ресурс.
- Шлях, що складається з імен директорій, розділених символом «/» (слеш), послідовно відкриваючи які, можна «дістатися» до потрібної інформації. У даному прикладі інформація знаходиться в директорії «documents».
- Ім'я файлу, який містить потрібну інформацію. В цьому прикладі інформація знаходиться у файлі page.html.
Якщо браузер використовують для служби Веб, то в адресному полі можна не вказувати назву протоколу і назву служби. Хоча іноді, залежно від налаштувань, веб-сервер скеровує запити www.site.lviv.ua та site.lviv.ua в різні директорії.
Отже, для доступу до створеної сторінки за доменною адресою сайту, потрібно, щоб її назва була index.*, в противному випадку для доступу буде потрібно вказувати повний шлях до файлу http://yourdomenadress/page.*.
FTP-клієнти
Сьогодні FTP-сервер - невід'ємна частина хостингу. Після отримання акаунту на хостингу, тобто послуги зі зберігання файлів його сайту, доступ до сервера здійснюється, зазвичай, за протоколом FTP. Для здійснення віддаленого управління власними ресурсами існує два типи доступу до хостингу:
- Доступ через адміністративну панель хостингу, яка надається хостинг-компанією для розробників.
- Доступ за допомогою програм з вбудованим FTP-клієнтом.
FTP-клієнт - це утиліта, яка спрощує доступ користувача до FTP-серверів. FTP-клієнтом може бути файловий менеджер, браузер або спеціалізований додаток. Вибір засобу залежить від завдань і уподобань користувача.
Незалежно від того, як відбувається зв'язок з FTP-сервером потрібно авторизуватися і ввести ті ідентифікатори, що надає хостинг: адресу FTP-сервера, назву протоколу, ім'я користувача і пароль. Ці дані хостер висилає на пошту після активації акаунту.
Практично у всіх файлових менеджерах реалізовано підтримку FTP. Всі операції з файлами та папками на віддалених серверах здійснюються аналогічно, як на локальному комп'ютері. Функціональності менеджерів цілком достатньо для вивантаження файлів з сервера та завантаження їх на сервер, а також для віддаленого перейменування, видалення або редагування файлів/папок.
Функціональність спеціалізованих FTP-клієнтів, зазвичай, є значно ширшою - вони забезпечують вивантаження/завантаження файлів в більш безпечному режимі (за рахунок підтримки відповідних протоколів, різних варіантів шифрування тощо) з набагато більшою швидкістю. Застосовується багатопотоковість завантаження і одночасного стиснення файлів.
Процес вивантаження/завантаження файлів є зручнішим, оскільки в них реалізовані засоби швидкого доступу до часто відвідуваних FTP-серверів, можливе під'єднання до кількох серверів одночасно, передбачено роботу за розкладом тощо.
Програми для віддаленого управління
Програми віддаленого управління - це засоби, що з'єднують комп’ютер користувача (адміністратора) з різними віддаленими комп'ютерними пристроями по всьому світу. За допомогою цих програм можна вирішувати технічні проблеми та використовувати ресурси комп'ютерів на відстані.
Після отримання доступу до віддаленого пристрою, ним можна керувати, як ніби він знаходиться поруч: змінювати налаштування, запускати встановлені додатки, доступатися до вмісту дисків, переглядати, редагувати і копіювати файли, бачити дії користувача та багато іншого.
Завдяки програмам віддаленого доступу учасники робочої групи можуть ефективно працювати в команді, перебуваючи на відстані один від одного. Розробники мають можливість взаємодіяти в будь-який час, за допомогою будь-яких пристроїв і на значній відстані.
Відео лабораторної роботи
Порядок роботи
- Ознайомитися з інформацією стосовно базового інструментарію та початкових знань розробника. Встановити потрібні для роботи програми.
- Створити папку, в якій буде розміщуватися сторінка. Створити код простої сторінки.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Юрчак Ірина</title>
</head>
<body>
<h1>Моя перша сторінка</h1>
</body>
</html> - Перевірити її відображення в популярних браузерах, за необхідності внести зміни та доповнення.
- Обрати відповідну безкоштовну хостингову площадку, зареєструвати хостинг та доменне ім'я. Отримати ідентифікатори для FTP-доступу. Встановити та налаштувати програму FTP-клієнт.
- Відкрити FTP-доступ до сервера в різний спосіб: через спеціалізований FTP-клієнт або файловий менеджер від хостингу. Завантажити тестову сторінку на сервер та відкрити її через браузер. Передивитися завантажену на сервер сторінку в різних браузерах і відмітити можливу різницю у відображенні.
- На іншому комп’ютері (власному чи колеги) встановити клієнт для віддаленої роботи. Встановити тестовий зв’язок і здійснити певні дії на віддаленому комп’ютері (пересилання файлів, кодування у редакторі тощо).
Зміст звіту
- Назва та мета виконання лабораторної роботи.
- Зазначити обраний хостинг та зареєстровану доменну адресу.
- Скріншоти послідовності роботи з коротким описом кожного з етапів.
- У висновку оцінити зручність обраного хостингу, адміністративної панелі і наявних сервісів. Оцінити зручність використання та можливості різних FTP-клієнтів. Зазначити відмінності у різних браузерах. Зазначити можливості використаних редакторів для макетування та кодування сторінки.
Контрольні запитання
- Назвіть мінімальний набір програмного забезпечення для веб-розробника?
- Які види хостинга пропонують для розміщення сайтів?
- З яких причин хостингові компанії надають безкоштовний тариф?
- Які причини сприяють вибору безкоштовного хостингу? Які існують застереження щодо використання безкоштовного хостингу?
- Наведіть коротку характеристику хостингу, який було відкрито для виконання даної лабораторної роботи.
- Яким чином можна доступитися до віддаленого сервера, де зберігаються файли сайту?
- Провести порівняльний аналіз популярних програм, які містять утиліту для FTP-доступу.
- Який модуль у структурі браузерів є визначальним, його основне призначення?
- Назвіть популярні програми, які надають можливості віддаленого доступу до іншого комп'ютера, їх можливості та особливості.
- Назвіть основні складові у написанні URL ресурсу.