Сравнительная характеристика інструментів для web-дизайна

Тип роботи:
Реферат
Предмет:
Інформатика, програмування


Дізнатися вартість нової

Детальна інформація про роботу

Витяг з роботи

ОДЕСЬКИЙ НАЦІОНАЛЬНИЙ ИНСТИТУТ

ДЕРЖАВНОГО УПРАВЛЕНИЯ

УКРАЇНСЬКА АКАДЕМИЯ

ДЕРЖАВНОГО УПРАВЛЕНИЯ

ПРИ ПРЕЗИДЕНТЕ

УКРАИНЫ

РЕФЕРАТ

ПО КОМП’ЮТЕРНИМ СЕТЯМ

Тема:

" Порівняльна характеристика інструментів для Web-дизайна"

Виконала: студентка 2-го курса

МО

21-А группы

Крюкова К.М.

Одеса — 2004 г.

Алгоритм поиска

Для пошуку реферату «Порівняльна характеристика інструментів для Web- дизайну «я скористалася наступним пошукових сервером internet Потім у вікно пошуку запровадила запит «Реферати» щоб отримати посилання пошук рефератів з цієї теме.

Вибрала одну заслання Bankreferatov. ru із запропонованих у зазначеній темі і вдихнула їх у іншому вікні. На його початковій сторінці перебувають поля введення запиту, і кнопка спершу пошуку рефератов.

Сформулювавши запит пошуку з цієї мені темі, запровадила на полі введення ключове слово «web-дизайн», далі натиснула кнопку пошуку. У кодексі вікні відобразилися теми реферату з мого заданому запиту. Вибравши найбільш підходящий реферат, знайшла ще кілька інформаційних додатків. Я відкрила попередній пошук запиту «Реферати» відкрила таку заслання Referats. ru. Тут й у вікні пошуку запровадила запит «Web-дизайн». У вікні відобразилося три посилання різні сайти по комп’ютерним системам і технологіям. Вибравши першу заслання і відкривши їх у новому вікні відобразився величезний список рефератів на цю тему. А, що полегшити собі пошук, у вікно введення запиту вводжу ключове слово «Web-дизайн», встановивши нижче вікна пошуку галочку шукати в знайденому. Скопіювала кілька рефератів на цю тему, та був відредагувавши попередній знайдений реферат доповнила його великої інформацією. У цьому припинила свій пошук реферату, т.к. вважаю, що необхідна кількість інформації з даній темі вже собрано.

«Порівняльна характеристика інструментів Web-дизайна»

План:

1. Вступ (4−5)

2. Що таке Web-дизайн? (5−6)

3. Створення Web-страниц з допомогою мови HTML (6)

4. Програми до створення Web-страниц (7−8)

5. Створення Web-страниц з допомогою Macromedia DreamWeaver (8−33)

6. Висновки (34)

7. Список сайтів інформація, із яким було використано під час написання курсової роботи (35)

1. Вступление

Internet — це найбільша світова комп’ютерна мережу. Тепер Internet має приблизно 150 мільйонів користувачів більш ніж 50 країнах. WWW доступний переважно через Internet; але кажучи WWW і Internet ми розуміємо не один і той ж. WWW можна зарахувати до внутрішньому змісту, тобто, це будь-якої абстрактний світ знань, тоді як Internet є зовнішнім боком глобальної мережі як величезної кількості кабелів і компьютеров.

World Wide Web — глобальна комп’ютерна мережу нині містить мільйони сайтів, у яких розміщена різноманітна інформація. Люди отримують доступом до цієї інформації з використання технології Internet. Для навігації в WWW використовуються спеціальні програми — Web- браузери, які полегшують мандрівку безкраїм просторам WWW. Уся інформація в Web-браузере відображається як Web-страниц, які є основний елемент сайтів WWW.

Webсторінки, підтримуючи технологію мультимедіа, об'єднують у собі різні види інформації: текст, графіку, звук, анімацію і відео. Від, чи добре і гарно зроблено та чи інша Web-сторінка, залежить багато в чому її успіх у Сети.

Користувачу приємно відвідувати ті Webсторінки, які мають стильне оформлення, не обтяжені надмірно графікою і анімацією, швидко завантажуються і відбиваються з вікна Web-браузера.

Створити Web-страницу непросто, але напевно кожна людина хотілося б спробувати себе ролі дизайнера. І, у разі, не є винятком, тому й вибрала таку тему для свого реферату, у якому зробила спробу з’ясувати, що треба знати і вміти для створення Webсторінки, яке програмне забезпечення є інструментарієм створення Web-страниц і його ефективно использовать.

То що таке World Wide Web, чи, як у просторіччі, WWW, the Web, або ще простіше — 3W? WWW — це розподілена інформаційна система коштує мультимедіа, джерело якої в гіпертексті. Давайте розберемо визначення по порядку.

Розподілена інформаційна система коштує: інформація зберігається на величезному великому безлічі про WWW-серверов (servers). Тобто комп’ютерів, куди встановлений спеціальне програмне забезпечення і яке об'єднані у мережу Internet. Користувачі, які мають доступом до мережі, отримують цю інформацію з допомогою программ-клиентов, програм перегляду WWW-документов. У цьому програма перегляду посилає по комп’ютерну мережу запит серверу, що зберігає файл із необхідним документом. У у відповідь запит сервер висилає програмі перегляду цей необхідний файл чи повідомлення про відмову від, якщо файл за тими або іншим суб'єктам причин недоступний. Взаємодія клієнт-сервер іде за рахунок певних правил, чи, кажуть інакше, протоколів. Протокол, прийнятий у WWW, називається HyperText Transfer Protocol, скорочено — HTTP.

мультимедіа: інформація включає у собі як текст, а й двох- і тривимірну графіку, відеота звук.

Гіпертекст: інформація в WWW представляється як документів, кожній із яких може містити як внутрішні перехресні посилання, і посилання інших документів, які зберігаються тому ж самому чи будь-якій іншій сервере.

Такі посилання називають гіперпосиланнями чи гиперсвязями. На екрані комп’ютера з вікна програми перегляду посилання виглядають як виділені яким- нибудь чином (наприклад, іншим кольором і/або підкресленням) ділянки тексту чи графіки. Обираючи гіперпосилання, користувач програми перегляду може швидко переміщатися від частині документа в іншу, або ж одного документа до іншого. За необхідності програма перегляду автоматично пов’язують із відповідним сервером у мережі і затребувана документ, який сделанна посилання. До речі, ідея гіпертекстового подання повинна вже бути добре відома користувачам різних версій системи Microsoft Windows. Саме з цього принципу построенна в Windows система підказок (Help), з тією різницею, що гіпертекстова система підказок Windows перестав бути распределенной.

Отже, Web-сторінка може містити стилізований і форматований текст, графіку і гіперзв'язку з різними ресурсами Internet. Щоб реалізувати все ці можливості так, був розроблений спеціальну мову, названа HyperText Markup Language (HTML), тобто, Мова Розмітки Гіпертексту. Документ, написаний на HTML, є текстовий файл, який містить власне текст, що має інформацію читачеві, і прапори розмітки. Останні є певні послідовності символів, які є інструкціями для програми перегляду; відповідно до цими інструкціями програма має текст на екрані, включає до нього малюнки, які зберігаються окремими графічних файлах, і формує гіперзв'язку коїться з іншими документами чи ресурсами Internet. Отже, файл мовою HTML набуває вигляду WWW-документа тільки тоді ми, що він інтерпретується програмою перегляду. Про мові HTML буде детально розказано наступного розділі, оскільки не повідомляючи основ цієї мови неможливо було створити Web-страницу для публікації у WWW.

2. Що таке web-дизайн ?

Web-дизайн — це передусім творчість, у якому тебе хто б обмежує. Тільки цій сфері ви можете повністю себе показати, не обмежуючись, ні з змісті, ні з обсязі. Якщо наприклад брати кореспондентів та журналістів. Вони написали матеріал, довго трудилися, і подали його редактору, а редактор взяв капелюх і викинув статтю, посилаючись на можливість то, що вони написали кілька слів про знаменитого «шахрая », який займає посаду у місцевій думі. А вам надаються всі можливості, для здобуття права писати, малювати тощо. Потім вивісити це все з сайту і нехай все любуются.

Но переважно web-дизайн означає вміння красиво оформити web-страничку на сайті. Якщо вже ви написали кілька слів, на звичайному default «ном тлі, це дизайн.

Зачем це потрібно ?

Причини, якими люди вирішують підготувати і опублікувати у Світовій мережі власний web-ресурс, можуть цілком різними. Якщо йдеться йдеться про домашньої сторінці, то основним рушійним фатором для web-мастера є прагнення в мережі інформацію, яку згодом можна використовувати у пошуку роботи, чи інтерактивному спілкуванні коїться з іншими людьми Інтернетом. Іноді домашня сторінка служить засобом для публікації, наприклад літературних творів, малюнків, музики, чи наукових досліджень про автора. У такий спосіб власник сторінки може знайти видавця на свої оповідань, організаторів виставки на свої картин, продюсера для музичного проекту чи спонсора, готового фінансувати його розробки. Нерідко у вигляді домашньої сторінки можна просто заробляти деньги.

3. Створення Webсторінки з допомогою мови HTML

Webсторінки можуть існувати у кожному форматі, але як стандарту прийнято Hyper Text Markup Language — мову розмітки гіпертекстів, готовий до створення форматированного тексту, насиченого зображеннями, звуком, анімацією, відеокліпами і гіпертекстовими посиланнями інші документи, розкидані як у всьому Web-пространству, і що перебувають у тому ж сервері чи які є складовою частиною отого ж Веб- проекта.

Можна працювати на Web не повідомляючи мови HTML, оскільки тексти HTML можна створювати різними спеціальними редакторами і конвертерами. Але писати безпосередньо на HTML неважко. Можливо, це навіть легше, ніж вивчати HTML-редактор чи конвертер, які найчастіше обмежені у можливостях, містять помилки чи проводять поганий HTML код, який дбає про різних платформах.

Мова HTML існує у кілька варіантів і продовжує розвиватися, але конструкції HTML швидше за все використовуватимуться й надалі. Вивчаючи HTML і пізнаючи його глибше, створюючи документ на початку вивчення HTML і розширюючи його наскільки може бути, ми маємо можливості створювати Web- сторінки, які можна переглянуто багатьма броузерами Web, як зараз, і у майбутньому. Не виключає можливості використання інших методів, наприклад, метод розширених можливостей, що дається Netscape Navigator, Internet Explorer чи деякими іншими программами.

Робота з HTML — це спосіб засвоїти особливості створення документів мають у стандартизованому мові, використовуючи розширення, лише це справді необходимо.

HTML ратифікувала World Wide Web Consortium. Він підтримується кількома широко поширеними броузерами, і, можливо, стане підставою майже всього програмного забезпечення, що має ставлення до Web.

4. Програми до створення Web-страниц

4.1 HTML-редакторы

Кожен обирає собі інструмент до створення Web-страниц. Це може бути MS FrontPage чи Macromedia DreamWeaver, Allaire HomeSite чи 1st Page 2000. А хтось користується простим текстовим редактором, наприклад Блокнотом (Notepad).

Текстові редактори можливо використовувати лише створення невеликих сторінок, тому що в нього є багато мінусів: не підтримуються проекти, відсутня «підсвічування «тексту…, загалом, працювати вкрай неудобно.

MS FrontPage

Основним недоліком MS FrontPage і те, що він генерує дуже великий HTML-код (занадто багато зайвого), тому сторінки виходять великими, що б'є по швидкості завантаження. Понад те, під час створення Web-страниц у тому редакторі бачиш одне, а вікні браузери — зовсім інше (особливо це ж стосується Netscape Navigator). Сторінки виходять якимись кривими, для створення якісних Web-страниц рекомендується використовувати пакети, які буде розглянуто ниже.

Macromedia DreamWeaver.

Почнемо ми з популярного Macromedia DreamWeaver. Компанія Macromedia вважається лідером за производсту програм до створення веб-сайтів, і навіть законодавцем моди у цій галузі. Последния версія HTML-редактора цієї компанії - DreamWeaver 3, яка ставиться до категорії WYSIWYG-редакторов, і це пакет має дуже чимало достоїнств: зручний інтерфейс, настроювання функцій, підтримка великих проектів і ShockWave технологій, можливість закачування файлів через FTP, підтримка SSI й багато іншого. Робота у цій програмі непотрібно досконально знати HTML (у цьому полягає перевагу технології WYSIWYG — що бачу, те й получаю).

Але DreamWeaver сталася на кілька кроків випереджає інші редактори, використовують технологію WYSIWYG, насамперед тим, що генерує дуже чистий HTML-код. DreamWeaver дозволяє вам позбутися однотипної роботи під час створення сторінок (наприклад, верстка тексту) з допомогою використання опції «запис послідовності команд «ви записуєте послідовність вироблених вами команд, потім натискаєте, наприклад, CTRL+P, і DreamWeaver відтворює в тій ж последовательности.

HomeSite 4

Наступний редактор — HomeSite 4 — до створення сторінок вручну, т. е. для знавців HTML. Ви отримуєте повний контроль над HTML-кодом, причому є можливість оптимізувати свою сторінку під одне із трьох популярних браузерів (MSIE, NN, Opera).

HomeSite містить дві основні режиму: Edit і Design. Режим Design — цю подобу WYSIWYG-редактора, котре видає HTML-код, причому, коли ви завантажте чужій HTML-код, то HomeSite все по-своєму. Режим Edit дозволяє здобути цілковитий контроль над сторінкою. Тут ви можете налаштувати майже всі, зможете прописати функції кожного тега (тоді ваша сторінка у кожному браузері виглядатиме одинаково).

Ще один відмінна риса HomeSite — це її «склейка» з Dreamweaver. HomeSite має кнопкою «Dreamweaver», і навіть входить у його стандартний пакет поставки. Втім, і DreamWeaver має можливість підключення HomeSite, як редактора для коректировки HTML-кода.

EVR Soft 1st Page 2000 v2

Однією з останніх HTML-редакторов є EVR Soft 1st Page 2000 v2.

Його гасло — «Create 1st class websites! «(«Створюйте першокласні веб-сайти! »). Редактор містить кілька режимів — Normal, Easy, Advanced/Expert і Hardcore, тобто ви можете вибрати свій рівень, а зі часом перейти більш високий. Ще один особливість — досить висока колекція скриптов на JavaScript і DHTML. Усе це досить зручно розбите по категориям.

5. Macromedia DreamWeaver

5.1. Інтерфейс даного пакета

Ідея даного описи проста — ми поступово будувати сайт (наприклад домашню сторінку). Причому постараюся пройтися за всі можливостям DreamWeaver. Розповім що й що краще всього пользоваться.

Почнемо ми з найпростішого — з інтерфейсу пакета.

[pic] Такий вигляд має зовнішній вигляд DreamWeaver 3 саме його встановлення і завантаження. Основні панелі я виділила і підписала. Почнемо розбір інтерфейсу з панелі «палітра об'єктів «- палітри, з допомогою якої ми поміщаємо майже всі зовнішню (яка стосується тексту) інформацію на форумі нашу сторінку. Ця палітра має низку різних варіантів, які можна відкриті з допомогою выпадающего меню у верхній частині «палітри об'єктів «. |[pic] |За умовчанням слід палітра common objects (основні об'єкти). У неї | | |включено майже всі що ви повинні (слева-навправо, зверху-вниз): | | |Image (картинка) — вставляє на сторінку графічний елемент | | |Rollover Image (перекатыш) — вставляє на сторінку конструкцію, яка | | |імітує анимированную кнопку (кнопку изменяющую свій вигляд при наведенні на | | |неї) | | |Table (таблиця) — вставляє на сторінку таблицю | | |Tabular data (табличні дані) — вставляє готову з таблицю з готовими | | |даними (приміром, із Exel) | | |Horizontal Rule (лінійка) — вставляє декоративний елемент — лінійку (зазвичай| | |використовують як роздільник абзаців) | | |Navifgation Bar — вставляє навігаційну панель що складається з кількох | | |кнопок | | |Draw Layer (намалювати шар) — вставляє на сторінку шар (як і PhotoShop)| | | | | |Line Break (м'який перенесення) — вставляє на сторінку (з тексту) м’який | | |перенесення | | |Е-mail Link (сслыка на електронної пошти) — вставляє на сторінку посилання| | |електронна адреса | | |Date (дата) — вставка до документа поточної дати (з автообновлением) | | |Flash — вставляє флеш-анимацию в сторінку | | |ShockWave — вставляє Shockwave-анимацию | | |Generator — вставляє заготівлю Generator | | |FireWorks — вставляє об'єкт FireWorks | | |Applet — вставляє ява-апплет | | |ActiveX — вставляє ActiveX | | |Plugin — вставляє об'єкт, проигрываемый плагином | | |SSI — вставляє инклюд (подключаемый зовнішній HTML файл) | |[pic] |Палітра Invisibles возволяет додавати в вихідний код сторінки: | | |закладання | | |коментарі | | |ява-скрипты | | |нерозривні прогалини | |[pic] |Палітра head допомагає нам додавати різні описи й поліпшуючи властивості сторінки,| | |такі як: | | |мета-теги | | |ключове слово | | |описи сторінки | | |встановлювати параметри відновлення сторінки | | |вказувати базову заслання (заслання за умовчанням) | | |вказувати посилання | |[pic] |Палітра Frames (фрейми) допоможе зробити одним натисканням на кнопку складну | | |фреймовую структуру. Докладніше про фреймах та їхньому застосуванні пізніше. | |[pic] |Палітра forms (форми) служить для візуального створення форм (те, що ви | | |частенько заповнюєте в різних сайтах). Воно складається з об'єктів: | | |form — сама форма | | |text field — текстове полі | | |button — кнопка | | |checkbox — чекбокс (це де ви галочку під час виборів ставите) | | |radio button — радиобаттон, забезпечує вибір однієї з варіантів | | |list/menu — робить выпадающий список чи меню | | |filefield — форма для закачування файлів | | |imagefield — полі картинки | | |hidden filed — приховане полі | | |jump menu — до переходу по кліку в іншу сторінку | |[pic] |Палітра спеціальних символів допоможе вам це й легко додати зважується на власну | | |сторінку знак копірайту, зареєстрованою торговельну марку, єни і багато | | |іншого. Досить просто натиснути потрібну кнопку. |

5.2. Діалогові вікна При натисканні кожну кнопку виникають різноманітних діалоги, виникаючі при додаванні об'єктів із «палітри об'єктів «на полі документа. Більшість цих діалогів, наприклад як-от: вставка картинки, горизонтальній лінійки, м’якого перенесення, флеш, shockwave, generator, plugin, activeX, java applet і server-side include взагалі вимагають пояснень, оскільки або містять ніяких діалогових вікон, або зводяться до вказування потрібного файла на жорсткому диске.

[pic] Почнемо з вставки rollover image (картинки-перекатыша). Здебільшого, такі об'єкти йдуть на різних навигационых елементів на сайті. У вікні діалогу є основних поля. Зверху-вниз это:

. image name — назва картинки (використовується java-скриптом, потреби ділити різних об'єктів такого типу на сторінці). Ніколи не робіть назви одинаковыми!

. original image — тут вказуєте розташування файла з картинкой

" по-умолчанию ", тобто такої картинкою яка відображатись в начале.

. rollover image — а тут вказується файл картинки, яка з’являтися при наведенні на наш об'єкт мишки (підпункт Preload

Rollover image рекомендую залишати включеним, бо ні що ні виглядає так моторошно, як поява при наведення мишки такий об'єкт порожній картинки)

. go to url — тут потрібно написати заслання, через яку піде користувач при натисканні на наш об'єкт. От і всі. Після натискання на кнопку OK ви отримаєте готову кнопку, не написавши жодного рядка кода.

[pic] Наступний об'єкт — Insert Table (вставити таблицю). Таблиці у будівництві сайтів використовуються як як і якомусь Word-е чи Excel-е, чи як модульні сітки (власне якийсь каркас, у якому як у павутинні тримаються всі об'єкти сторінки). Що треба вказати й у даному случае:

. Rows — кількість рядів таблицы

. Columns — кількість колонок

. Cell padding — відстань від кордону осередки до об'єктів всередині ее

. Cell Spacing — відстань між межами сусідніх ячеек

. Width — ширина таблиці (в пикселях чи процентах)

. Border — товщина бордюру між осередками таблиці Не складно. Усі заповнили, вказали й одержали готову таблицу.

[pic] Об'єкт Tabular Data з’явився у третій версії і являє дуже зручний інтерфейс для вставки зовнішніх табличных даних в Dreamweaver. Наприклад прайсів з Excel. Указываем:

. data file — вихідний файл

. delimiter — тип роздільника колонок (з кількома вариантами)

. Table width — ширину таблиці (по ширині даних чи указуємо своє значение)

. Cell padding — відстань від кордону осередки до об'єктів всередині ее

. Cell Spacing — відстань між межами сусідніх ячеек

. Format Top Row — виділення чи невиділення шапки таблицы

. Border — товщина бордюру між осередками таблиці Усі. Після цього ваш (заздалегідь підготовлений) файл з цими стане перед вами в DreamWeaver.

[pic] Navigation Bar — цей об'єкт побив всі рекорди з кількості полів які потрібно заповнити. Її треба розглядати, як певний дуже наворочений інструмент до створення навігаційних панелей на сайтах. Заполняем:

. з допомогою кнопок «+ «і «- «ми можемо додавати чи видаляти элементы

(кнопки) навігаційної панели

. element name — назва поточної кнопки, будь-коли робіть імена однаковими, найкраще давати їм імена самих кнопок (home, link, next, prev і т.д.)

. Up image — указуємо файл з картинкою для стану кнопки «по- вмовчанням «

. Over Image — указуємо файл з картинкою для стану кнопки при наведенні її у мышки

. Down Image — указуємо файл з картинкою для натиснутої кнопки

. Over While Down — указуємо файл з картинкою для стану кнопки натиснута + її у наведена мишка (важко уявити собі іншій ситуації) :)

. go to url — посилання яку зроблено перехід (у своїй зазначте де буде открыта)

. Preload Images — рекомендую залишити включенным

. Show «Down image «initialy — за умовчанням показувати кнопку нажатой

. Insert — вид панелі (горизонтальна чи вертикальная)

. Use tables — використовувати таблиці Якщо ви і усе це заповніть і зробите — то результаті в вас нормальна робоча навігаційна панель без написання навіть рядки кода.

[pic] Вставка посилання електронна адреса. Тим хто трішки знають HTML вже відомо, що з вставки як і посилання досить написати: e-mail. Вставка поточної дати — дуже зручний річ. Досить зазначити формат дати, часу й, якщо потрібно, вказати пункт Update Automatically on Save (автоматично оновлювати при сохранении).

5.3. Структура сайту Перш ніж узагалі починати виготовлення сайту, слід чітко уявити його структуру, розміщення основних матеріалів по каталогам. Щоб потім просто більше не заплутатися у тих матеріалах. У нашому випадку структура буде гранично проста:

[pic] У кореневому каталозі ми розмістимо наші веб-сторінки (. htm-файлы), в каталозі Images — картинки (фотографії, елементи дизайну й багато іншого) й у каталозі CSS — Cascading Style.

5.4. Початок створення сайту Потому, як більшість матеріалів готова, можна братися до створенню сайту в DreamWeaver. Треба лише зайти в меню edit і вибрати пункт preferences. Зверніть увагу до кнопку Define Sites (визначити сайти). Ось воно то нам та росіян потрібний. Сміливо натискайте її. Після натискання ви не побачите ось таке меню:

[pic] Вибираємо кнопочку New і починаємо заповнювати «анкету «нашого сайту. Анкета складається з п’ятьох разделов:

[pic] Почати з першої. Заполняем:

. Site name (назва сайту) — лобое зручний вас назва (я написал

— моя домашня страничка)

. Local Root Folder (локальний кореневої каталог) — власне наш каталог test (див. картинку на початку статьи).

. Залишаємо є пташку навпроти Refresh Local File List

Automatically

. Обов’язково включаємо пункт Cache [ ] Use Cache to Speed Link Updates — знадобиться коли ми почнемо змінювати посилання (швидше будет)

Тепер друга: [pic]

У ньому ми настроюємо параметри доступу до віддаленому серверу (місцеві, куди ми будемо наші файли выкладывать):

. Server Access — доступом до серверу (варіанти none — немає, FTP — по FTP,

Local/Network — на локальній сети

. FTP Host — адресу серверу, який будуть викладатися файли, наприклад ftp. cdrom. com

. Host Directory — каталог на сервері, будьмо уважні, коли заповнюєте цей пункт, якщо ваша каталог набрано ВЕЛИКИМИ літерами, то, вам теж потрібно за його назву великими літерами, ще шлях ви вказуєте від кореня, тобто рядок може бути отако: users/design/ace

. Login — ім'я користувача, під що ви заходите на сайт

. Password — пароль користувача, під що ви заходите на сайт. Пипку save вмикайте в тому разі, коли ви користуєтеся цим комп’ютером один. Інакше ваш пароль доступу легко дістається з registry

(він у вигляді хранится)

. Use Passive FTP і Use Firewall — настройки необхідних конкретних випадках. Наприклад Use Firewall необхідно вказувати, коли ви ходите через прокси-сервер. Якщо ви хоч працюєте по модему — ці настройки вас це не хвилюють. Перейдемо до третьої закладке:

[pic] Якщо ви хоч працюєте над проектом разом з іншими користувачами DreamWeaver, то доцільно налаштувати даний пункт (тобто. включити галочку поруч із Enable File Check In and Check Out і зазначити своє ім'я на полі Check Out Name). Просто при таких настроюваннях ваших колег завжди відчуватимуть зайнятий цей файл вами тепер (редагуєте ви його) і зможуть самі взяти його за редагування (і тим самим знищити плоди вашого праці). З цією хто працює один цей пункт не цікавий. Четверта закладка:

[pic] Вона налаштовує зовнішній вигляд панелі Site Map (саме зовнішній, фізично на структуру сайту або його файли ці настройки жодного впливу не надають). Настройки прості - указываем:

. Home Page — початкову сторінку сайта

. Numper of Columns, Column Width — кількість колонок та його размер

(ширину)

. Icon Labels — що використовувати як підписів під значками — назви файлів чи назви страниц

. Options — додаткові настройки — показувати чи ні приховані файли й наочно показувати чи ні залежні файли. І, нарешті, остання — п’ята закладка:

[pic] Вона також більшою мірою має значення при груповий роботі, аніж за роботі у одиночній тюремній камері. Настройки прості - зберігати так звані Design Notes (нотатки, які можна додавати в файл під час роботи з нею) і закачувати їх на віддалений сервер. З іншого боку, можна видалити ті ж робочі нотатки, натиснувши на кнопку Clean Up. Після всіх таких настройок можна натискати OK і реально отримувати готовий результат. Отже, коли ви все зробили правильно, ви не побачите таку картинку:

[pic] Це правда званий Site Manager, у якому зручне здійснювати самі різні дії. Він розділений на дві колонки — ліва для файлів, що є на такого далекого сервері - права для локальний файлів. З іншого боку, ви можете бачити кілька кнопок:

. Connect — підключення до віддаленому серверу

. Refresh — відновлення списку фалів на такого далекого і локальному серверах

. Get — закачування виділеного файла (каталогу, групи файлів) на локальний диск

. Put — протилежна операція — закачування файлів, каталогів чи груп фалів на віддалений сервер (зауважу, що з про закачування файла з підкаталогу CSS чи іншого, файл автоматично міститься у хоча б каталог на такого далекого сервері - тобто теж буде в каталоге

CSS. Ну-у-у. Сайт створено, і готові продолжать.

5.5. Створення першої сторінки Ну-у-у добралися до створення першої сторінки (все правильно, адже сайт це одна сторінка і навіть дві - сайт це ідея, концепція, якийсь цілісний проект).

. Logo — логотип нашої сторінки, якийсь помітний малюнок (візуал) і чи будь-який інший спосіб приваблення внимания

. Menu — головне меню сайта

. SubMenu — підменю поточного раздела

. Text — основне наповнення, контент

. Copyright — «підвальний «розділ для баннерів, кнопок, копірайтів й іншим мішури З іншого боку відразу зазначила основні розміри. Як бачите, вирішила зробити правий край нашої сторінки «гумовим «у тому, щоб користувачі з великими моніторами могли насолоджуватися своїми дозволами 1600×1200… Почнемо створення від цього в HTML. Спочатку зважте на свій сайт (просто виберіть його зі списку) і створіть новий файл обравши пункт New File. «Чому ж не New Window? «- спитаєте ви. Відповідаю — під час відкриття нового вікна файл відразу не створюється (він створюється лише за записи на диск), проте посилання зазвичай вказуються щодо становища файла. Вам сподобаються посилання виду — d: vasyaworkimageslogo. gif? Мені ще немає, та й відображатись така конструкція буде лише навашей локальної машині. Отож вибираємо New File і жодних гвоздей!

[pic] Після вибору пункту New File на панелі справа (локальні файли) з’явиться файл untitled. htm що стоїть відразу перейменувати в index. htm чи default. htm — так зазвичай вказується назва першої (головний) сторінки сайта

[pic] Подвійним клацанням відкриваємо створений файл і ми бачимо чистий білий лист (що то, можливо прекраснішого), у якому ми й створювати нашу сторінку. Але перед створенням таблиці і занесенням у ній наших елементів дизайну стоїть поставити основні властивості нашої сторінки (це!). Треба лише зайти в меню Modify і вибрати пункт Page Properties (чи навіть натиснути Ctrl + J).

[pic] Перед вами відкриється ось такий діалог. Що потрібно заполнить:

. Title — назва вашої сторінки (як воно відображатись в заголовку вікна браузера)

. Background Image — фоновий малюнок (у разі не используем)

. Background — колір фону (у разі белый)

. Text — колір тексту (черный)

. Links — колір посилань (темно-синий)

. Visited Links — колір відвіданих посилань (фиолетовый)

. Active Links — колір поточної активної посилання (темно-красный)

. Left Margin, Margin Width — відступ від краю сторінки на початок контенту зліва (у разі 0)

. Top Margin, Margin Height — те, але сверху

. Document Encoding — кодування документа (будьмо уважні, вказуйте правильну кодировку)

. Tracing image — кладе на фон напівпрозору картинку з дизайном — зручне точного суміщення дизайну в HTML з дизайном (начерком), зробленою в PhotoShop.

[pic]

5.6. Створення таблиць, А нині на часі зайнятися таблицями та інших. Спочатку зробіть таблицю з параметрами як показано малюнку зліва: 3 низки, 2 колонки, відступи і бордюр по нулях, ширина таблиці 100%. Зауважте, що дані цілком збігаються з тим, що ми планували на початку розробки модульної сетки.

[pic] Після натискання на OK ви отримаєте порожню таблицю, яку потрібно коригувати й заповнювати нашими графічними елементами. Насамперед виберіть першу осередок (просто клікніть всередину) і вставте картинку з логотипом (My homepage). Після цього виділіть колонку зліва (саму крайню). Після виділення зазначте ширину (Width) нашої колонки, що її визначили ще модульної сітці - 247 Pix. Проробіть таку ж операцію з іншою колонкою, тільки тепер зазначте ширину 100%. Тепер займемося рядами. Спочатку клікніть до будь-якої з осередків верхнього низки. Тепер подивіться в лівий нижній кут вікна DreamWeaver. Бачите список? Цей перелік демонструє все теги HTML, які є як «старшими «стосовно поточному тегу (поміткою це «команда «мови HTML, залежить від, може содежать відкриває і закриває поміткою). Тобто показують якусь ієрархію документа. Але нам до це ще не дуже важливо, для нас важлива те, що просто натиснувши на і ми отримуємо виділений ряд.

[pic] Давайте поставимо нашому верхньому ряду фон. І тому знову зверніть своє увагу до нижню панель — властивості. Там є пункт Bg (background). Натиснувши на значок папки ви можете вказати файл, який зайняти позицію фону. У нашому випадку це top_back. gif. З іншого боку той самий можна зробити натиснувши на перехресті поруч і потягнувши стрілочку зазначити панелі менеджменту сайту потрібний файл (такий собі drag «n «drop). Якщо ви хоч все зробили вірно, верхній ряд буде залитий за потрібне тлом. На последок давайте отформатируем ще нижній ряд. І тому виділіть його як розповідалося раніше і виберіть пункт Bg. Ну-у-у. Початок вже положено.

5.7. Виготовлення меню Виготовлення меню нашого сайта.

[pic] Спочатку виберіть осередок таблиці (верхню праву) на яку ми відвели місце під меню. У властивості зміните горизонтальне і вертикальне вирівнювання ліворуч кермо і вниз відповідно (див. малюнок слева).

[pic] Тепер напишіть текст що з назв основних розділів і заслань на них.

[pic] Після написання тексту зміните в властивості його форматування з none на paragraph. У HTML це висновок тексту в ярлик.

[pic] Так, тепер виділяємо наше меню натисканням на букву в нижньому лівому кутку вікна. У панелі стилів просто вибираємо наш стиль (menu). Ну-у-у, стиль на параграф тексту ми призначили. Можна перевірити як усе виглядає у браузері. Для цього лише варто натиснути F12.

[pic]

Для параграфа ми зазначимо конкретний шрифт (font), розмір (size) і колір (color). Решта залишимо як есть.

[pic] Крім параграфа ми ще й парочку тегов a: link і a: hover змінимо. Ці теги визначають зовнішній вигляд заслання стандартному стані й стані при наведеної її у мишки. Поставимо колір посилань (білий) і за наведенні зробимо зміна Decoration з none на underline.

[pic] Настав час вказати посилання основні сторінки нашого сайту. Робиться просто — виділяєте потрібний текст (якщо це один голос, можна просто пару раз клацнути у ній мишкою) і пишете в властивості сслылку.

[pic] Самих файлів в нас (реально претендує на диску) немає, по-цьому ми саме пишемо потрібні нам назви (а чи не шукаємо їх у диске).

[pic] Наша останнє завдання — полегшити встановлення та зміна (в разі потреби) нашого меню. Її можна вирішити з допомогою зручного інструмента DreamWeaver під назвою «бібліотека «(library). Де вона ви бачите на малюнку слева.

[pic] У який з’явився вікні вибираємо створити новий елемент (наше меню має бути повністю виділено!). Відразу ж вилітає попередження у тому, що ми застосовуємо до елементу меню особливі стилі, і може не відображатись коректно інших сторінках. Не лякайтеся, усе гаразд, просто натискайте OK.

[pic] Усі, залишився тільки назвати наш елемент зручніше й за необхідності вставляти їх у будь-який документ з допомогою кнопки Insert. До речі, зміни, які ми робитимемо у наше елемент будуть автоматично вноситися в усі сторінки у яких він используется.

5.8. Особливості форматування тексту в DreamWeaver Після вказівки імені вашого стилю (чи вибору стандартного стилю для перепризначення) ви опиняєтеся в «настроюваннях «стилю. Робиться тут усе досить просто, за змінами ви можете поспостерігати на режимі realtime (щоправда із деякими застереженнями). У першій закладанні ми визначаємо, як виглядатиме окрема літера нашого текста:

1. Указуємо шрифт, яким писатиметься текст. Зверніть увагу, що ви можете або вказати конкретний шрифт, хоч FreeSet, але немає шансів, що вона є у користувача машиною (а разів його немає - відображатись сторінка буде дуже). Отож рекомендую користуватися конструкціями, запропонованими самим DreamWeaver — наприклад, Verdana,

Arial, Helvetica, sans-serif. І тут спочатку шукатиметься шрифт Verdana — не знайшли, тоді Arial, немає такої? Тоді Helvetica, ну, а якщо і немає - тоді будь-який шрифт без зарубок — гротеск.

2. Указуємо розмір шрифту — проти можливостями HTML ми тут усе просто здорово. Розмір можна вказати практично тільки не обвинувачували, починаючи з % і до пікселями і пунктами

3. Тут налаштовується ступінь «ваги «літери чи, простіше, його товщина. Варіантів як бачите теж немало.

4. Стиль написання — похилий (италлик), стандартний (normal)

5. Варіації написання — наприклад, весь текст набрано лише рядковими або тільки заголовними буквами

6. Висота базової лінії шрифту в пунктах, поинтах чи будь-яких інших величинах

7. Якими літерами ми користуємося — великими, маленькими чи стандартно і тих і другими

8. Різний декор — підкреслення, миготіння і прочее

9. Колір тексту. Зверніть увагу до пункти позначені *. І на цій та інших панелях ця зірочка означає, що це варіант не відображається візуально в DreamWeaver (тобто. в браузері треба проверять)

[pic] На даної закладанні ми виробляємо настройки фону. Фону всієї сторінки чи лише заданого абзацу тексту — це вже як ви вже стиль вирішили создавать.

1. Колір фону (вибираєте варіант зі стандартних 256 квітів чи створюєте свій цвет)

2. Файл з фоновим изображением

3. Налаштування повторення (розмноження) фонового зображення сторінці, наприклад, можна поставити, щоб зображення копировалось лише з осі X

4. Тут вказується як поводиться фонове зображення при прокрутке сторінки — прокручується із нею чи варто на месте

5. Вказівка горизонтальній позиції початку фона

6. Вказівка вертикальної позиції початку фону Відразу зазначу, що пунктами 3 і 4 треба користуватися «озираючись «- тобто. перевіряти переважають у всіх необхідних версіях браузерів на сумісність — інакше, може й розбіжність у отображении…

[pic] Пункт block служить для настройок параметрів блоку тексту (тобто. тут вона триває вже не про окремих буквах як у пункті Type).

1. Налаштування відстані між словами

2. Налаштування межбуквенного відстані чи трекинг

3. Вертикальне вирівнювання рядки текста

4. Горизонтальне вирівнювання текста

5. Відступ першого рядка чудово текста

6. Налаштовує систему розстановки додаткових прогалин між словами і пропозиціями щодо (кілька варіантів) Тут усе не так важко, я зазвичай використовую лише Text Align і Text Indent. Інші пункти лише за необхідність створення елементів дизайну на основі стилів (під час створення текстовій версии).

[pic] Цей пункт управляє обмеженнями даного шматка тексту сторінка (обмежує його розташування у певному прямоугольнике)

1. Ширина прямоугольника

2. Висота прямоугольника

3. Налаштування выключки вліво чи вправо

4. Налаштування того, як поводиться текст під час використання елемента з выключкой вліво чи вправо (як текст обтікає такий объект)

5. Налаштування відступу від краю прямокутника до розташованих низку інших элементов

6. Налаштування відступу від країв прямокутника до текста.

[pic] Пішли різні декоративні настройки. Наприклад, це дозволить вам створити бордюр навколо вашого елемента, з усіма необходиымыми вам настройками.

1. Указуємо ширину бордюру зліва, справа, зверху і снизу

2. Це ж але для кольору бордюра

3. Стиль бордюру — різні варіанти поєднання крапок і рисочок :)

[pic] Настройки списків (нумерованного і списку з буллетами)

1. Тип оформлення буллета (кілька вариантов)

2. Використання як буллета картинки

3. Позиціонування буллета

[pic] Позиціонування — річ важлива і цікава. Вона допомагає «поставити «наш об'єкт у будь-яку довільну місце на сторінці. Итак:

1. Тип позиціонування (відносне, абсолютне і т.д.)

2. Розташування по Z-координате — що не шарі перебуватиме наш объект.

3. Видимий чи невидимий наш об'єкт (можна використовувати до створення порожніх полів в документе)

4. Чого робитимемо із переповненням (тобто. якщо текст весь не влез)

5. Розташування об'єкта — вказівку координат вершини + ширини і высоты

6. Відступи зусебіч в пикселях чи інших единицах.

[pic] І последнее…

1. Вказівка обриву сторінки (переважно для печати)

2. Візуальний ефект — при наведенні на об'єкт курсору може змінювати свою форму або за завантаженні об'єкта спрацьовує одне із стандартних фільтрів (останнє вірно лише Internet Explorer).

5.9. Фичи Те, що я іменую фичами ховається у двох розділах муню DreamWeaver — File і Commands. Почати з Commands, які розбиті сталася на кілька групп:

. створення автоматизованих скриптов

. отримання додаткових commands

. роботу з вихідним текстом HTML

. роботу з таблицами

. установка колірної гами сайту Всі ці розділи є справжнім скарбом як початківців, так професіоналів. Міркуйте самі: Цей розподіл допомагає робити щось дуже схожа на макроси в якомусь Word чи милі серцю Actions в PhotoShop. Робиться усе дуже просто:

1. запускаємо запис натиснувши на Start Recording

2. виконуємо потрібні дейтсвия

3. говоримо — Stop Recording

4. використовуємо, коли це потрібно Якщо до вас не ліниво — спробуйте записати повністю створення дизайну для сторінки. Цілком. У одну команду. Ну, а потім радуйте начальство своїм ледачим розваленим у міністерському кріслі виглядом. Машинка сама дедалі повторювати за вас. Коли хочете отримати кілька таких команд, то діяти потрібно кілька иначе:

1. викликаємо палітру history

2. виконуємо кілька дейтсвий

3. виділяємо их

4. жмемо на стрілочку у правому верхньому розі вікна history

5. вибираємо save as command У результаті отримуємо будь-яке у команд, які потрібні необходимы.

[pic] У цю команду допоможе тим, кому припадати виправляти многокилобайтные документи створені їх колегами в FP або й гірше в Word (крий боже в Word2000) Вона здатна видалити багато зайві теги, але, перш ніж із ній працювати — збережіть попередню версію документа — оскільки дана команда може трохи повбивати зроблене ваш колега — веб-программер (наприклад ASP коди повычистит).

[pic] Розділ Clean Up Word HTML з’явилася лише у третьої версії DreamWeaver (шкода що ні раніше). Ті хто бачив ЯКОЮ HTML (з дозволу сказати) видає Word2000 (та й 97 не краще) і якого розміру виходять файли від цього «HTML-а «- ті мене зрозуміють. Для інших проста статистика — обробка файлів, збережених як веб- сторінка в Word зменшує їх розмір у середньому 4−5 раз (або навіть все 10) не погіршуючи якість зовнішнього вигляду документа.

[pic] Ця команда «підправляє «неприємну особливість браузерів від Netscape іноді не оновлювати вміст сторінки при зміни розмірів вікна браузери. Працює все досить просто — натиснули ADD — потрібний скрипт додався — нашали Remove — скрипт убрался.

[pic] Ця команда робить акуратне форматування вихідного тексту (саме форматування). Але, користуйтеся їй акуратно, якщо DW виділяє частина тегов за вашої сторінці жовтим кольором (вважаючи їх невірними) — він при форматуванні їх благополучно вб'є. Його буває який завжди прав при визначенні «невірних «тегов…

[pic] Ну ця штучка взагалі сильна… Однією командою можна поставити оформлення всієї таблиці. Причому як вибрати зі стандартних видів оформлення, і вказати свої власні кольору та параметри. Дуже зручно при складному оформленні таблиць великого размера.

[pic] Команда Sort Table допоможе вам зробити сортування даної колонки (чи низки) по заданої формулі. Дуже зручне різних алфавітних списків і т.д.

[pic] У цю команду (Set Color Sheme) чимось справляє враження Format Table. З її допомогою ви можете вибрати і застосувати колірне оформлення (колір фону, тексту, посилань) до вашої сторінці. Безсумнівно цей пункт стане у пригоді початківцям, бо всі схеми складено двома західними професіоналами у сфері веб-дизайну і виявляють дуже якісні, підібрані, гармонійні, а головне, коректно отображающиеся у різноманітних браузерах поєднання цветов.

10. Створення анимаций

[pic] Усі анимаця в DreamWeaver ховається в меню Window під пунктом Timeline. Ледачі можуть просто натиснути Ctrl+F9, а чи не лазити по всяким менюшкам…

[pic] Коли ви виберете пункт в меню чи натиснете комбінацію клавіш перед вами стане ось така панель… Я спеціально виділила значна її частина щоб зазначити її основні составляющие:

. назва поточної TimeLine

. переміщення між кадрами

. вказівку кол-ва FPS і т. д…

[pic] Спочатку створіть шар. Робиться простим натисканням на кнопку. [pic]После цього поставте йому параметри як показано малюнку зліва. ОБОВ’ЯЗКОВО дайте своєму прошарку ИМЯ. !

[pic] Тепер давайте впихаем в шар картинку. Це потрібно як із вставці картинки в сторінку (кликнули всередину шару, натиснули кнопку вставки картинки і зазначили потрібну картинку).

[pic] Нині ж починається сама веселуха. Виділяємо об'єкт (шар), клікаємо правої кнопкою по палітрі TimeLine і вибираємо пункт AddObject (додавати можна лише картинки і слои)

[pic] Після цього переходите на потрібний кадр і створюєте у ньому ключовою кадр (див. малюнок). Ключові кадри — це якісь віхи по дорозі переміщення нашого об'єкта. Усі проміжні переміщення DreamWeaver зробить сам. Створіть кілька кадрів, поставте кожному за своє становище шару (простим переміщенням його з місця на место).

[pic] Залишилося поставити частоту кадрів (я поставила 20) і може включити галочки AutoPlay і Loop.

5. 11. Як оформляти в DreamWeaver-е форми. |[p|Начнем із дуже форми. Власне він відіграє роль нікого контейнера, у якому | |ic|находятся основні елементи форми (поля введення, чекбоксы та інші…). Під час створення| |] |форми обов’язково слід зазначити метод (method), використовуваний при відправлення | | |інформації, програму яка обробляти цю форму (action). Крім | | |того, коли ви бажаєте працювати з цією формою з допомогою JavaScript вам | | |необхідно вказати ім'я (name). JavaScript може застосовуватися для перевірки | | |коректності введення. | |[p|Первый об'єкт — текстове полі введення інформації. У HTML виглядає приблизно таке:| |ic| | |] |Початок форми | | |[pic] | | |[pic] | | |[pic] | | |Кінець форми | | |Є кілька типів даного поля. Як-от: | | |полі звичайне (див. вище) | | |полі типу password (відмінність у тому, що з введення замість літер відбиваються | | |зірочки. | | |многострочное полі - для любителів залишати цілі поеми себе :) | | |Де застосовуються дані поля: | | |для введення прізвищ, імен, адрес, явок тощо. | | |для введення паролів, секретних повідомлень тощо. | | |для написання поем, пунктів інше т.д. | |[p|Кнопочка. Без неї формах нікуди. Немає сенсу все писати якщо його чогось, на | |ic|что можна тикнути і збирається відправити ваші думки программе-обработчику :) | |] |Кнопки є різні - корисні й бридкі: | | |Початок форми | | |1. [pic]2. [pic] | | |Кінець форми | | |Корисна кнопка. Без неї ви зможете відправити вашу форму по-назначению | | |Нікому Не Потрібна кнопка (навіщо очищати всю форму, якщо просто поправити те, що ви| | |запровадили…) | |[p|CheckBox & Radiobutton — брати близнюки з різними батьками :) | |ic|Вот як вони виглядають: | |][|Початок форми | |pi|1. [pic]я — Вася [pic]я — не Вася, а Петя [pic]сам ти Вася | |c]|2. [pic]я — Вася [pic]я — не Вася, а Петя [pic]сам ти Вася | | |Кінець форми | | |І їх використовують: | | |за необхідності вказати кілька варіантів стосовно питання (темі) | | |за необхідності вказати лише одне варіант відповіді це запитання. | |[p|Список. Річ дуже корисна. Причому можна використовувати (і використовується) не | |ic|столько щоб одержати інформації від посетилеля, скільки для навігації сайтом. | |] |Виглядає вона тут так (2 варіанта): | | |Початок форми | | |1. [pic] 2. [pic] | | |Кінець форми | | |Де застосовуються: | | |або для навігації сайтом, або для вибрати з деякого обмеженого списку | | |(вказівку країни, дати народження) | | |переважно для навігації. хоча може розглядатися як альтернатива checkbox-у | |[p|Объект, з якого можна вказувати файл для заливання на сайт. Застосовуватися | |ic|на різноманітних галереях, баннерных мережах тощо. Виглядає отако: | |] |Початок форми | | |Кінець форми | |[p|Еще один варіант submit-кнопки. Для естетів. Просто замість кнопки підставляється | |ic|графическое зображення. Виглядає гарно, але у нетскейпе при наведенні мишки | |] |курсор свою форму не змінює :(Приклад як і кнопки, зроблений автором можна | | |побачити тут (автора ногами не штурхати — що замовник хотів, те й одержав…) | |[p|Последнее полі - hidden. Його не бачить, про нього ніхто не знає (крім вас). | |ic|Применяться може по-різному. Здебільшого використовується для зберігання певної | |] |проміжної інформації… |

Тепер трохи про дизайні форм.

1. якщо хочете отримати щось гарне — використовуйте таблиці. приклад — форумі даного сайту. без таблиць форми виглядають принаймні странно.

2. використовуйте стилі. більшість елементів форм піддається стилевому зміни. добре це в IE (можна поставити колірне та інші оформлення усього що ви бачите на елементах формы

3. часто-густо установка форми в таблицю призводить до разбуханию осередки у якій перебуває таблиця — подолати це можна зробити, якщо перепризначити стильове оформлення тега form — поставити всіх параметрів padding і spacing. Ну-у-у мабуть і все…

Выводы

У цьому рефераті я розкрила можливості мови HTML до створення Web- сторінок, дізналася, які HTML- і графічні редактори краще залучити до Web-дизайні, які переваги та недоліки тих чи інших програмних пакетів. І, нарешті, я з’ясувала, які є можливість до створення Web- сторінок на пакеті Macromedia DreamWeaver.

. Отже, зрозумівши принцип побудови Webсторінки, вивчивши можливості з'єднання перетворені на ній різних видів інформації, ми можемо сміливо сказати, що Webсторінки, зі своїми потенціалом можуть застосовується щодо різноманітних целей.

Web-сторінка — та людина тієї фірми, того установи, людини, який розмістив їх у WWW. Саме тому Web-дизайну приділяється таке величезна увага, бо від цього прямо залежить популярність тієї чи іншої інформаційного ресурсу Мережі. Недарма зараз робота Web-дизайнера є одним із самих высокооплачиваемых.

Людина, створює Web-страницу, з'єднує знання і навички зі своїм творчим потенціалом. Вміння творити — ось що відрізняє справжнього Web-дизайнера. Щоб створити Web-страницу, яка тішила очей, потрібно мати у собі якості митця і программиста.

Підсумовуючи всьому вище сказаного, хочеться відзначити, що HTML стала форматом передачі, який найповніше і здатні якісно задовольняє запити сучасного суспільства. Безсумнівним фактом є і те, що майбутнє за HTML.

Список сайтів інформація, із яким було використано під час написання реферата:

internet internet

Показати Згорнути
Заповнити форму поточною роботою