Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
ЯК СТВОРИТИ WEB.docx
Скачиваний:
2
Добавлен:
18.08.2019
Размер:
125.2 Кб
Скачать

Створення гіперпосилань

У презентації можна створити гіперпосилання, які пов'язують об'єкти на слайді, наприклад, з іншими слайдами. Тим самим можна створити структуру гіпермедіа, яка природним чином буде відповідати ідеології Інтернету. Пояснимо цей прийом на прикладі.

Нехай у нас є кілька заготовлених слайдів на тему рослинного світу Байкалу, складених з колекції фотографій. Створимо новий слайд - зміст колекції.

Якщо новий слайд вийшов не перший в послідовності, то потрібно вийти в режим сортувальника слайдів (з головного меню за допомогою операцій Вид - Сортувальник слайдів) і перетягнути новий слайд в початок колекції.

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

Перейдемо в звичайний режим перегляду слайдів (команди Вид і далі Звичайний). На слайді-змісті виділимо фотографію і виконаємо команду Вставка - Гіперпосилання. У вікні, задамо перехід за гіперпосиланням - номер слайда з великою фотографією, з якою був скопійований менший зразок для змісту.

Аналогічно зв'яжемо інші картинки на слайді-змісті з відповідними слайдами за оригіналами фотографій.

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

Залишилося зовсім трохи вдосконалити нашу структуру. Додамо на кожен слайд з фотографією в його верхню ліву частину стрілку (Автофігура на панелі інструментів Малювання), і зробимо з цієї стрілки гіперпосилання, виконує перехід на слайд-зміст. Тепер рух по створеній нами структурі гіпермедіа стане "двостороннім": зі змісту можна перейти на слайди з фотографіями, і з будь-якого слайду повернутися на зміст.

Після виконання перетворення презентації у веб-формат наша перша сторінка буде мати вигляд:

Клацання по картинці з меню викличе перехід до слайда з великою фотографією, а щиглик по стрілці (у лівій верхній частині слайда) забезпечить перехід на сторінку зі змістом колекції.

Огляд редакторів для верстки веб-сторінок

Існує багато інструментів для верстки веб-сторінок, з яким з них будете працювати ви - вибирати вам же. Я рекомендую вам випробувати різні редактори, і тільки тоді вже вирішувати, з яким вам краще працювати.

У цій статті я дам короткий огляд по найбільш популярним редакторам, щоб допомогти вам зорієнтуватися. Крім того я наведу корисні посилання по кожній програмі: сайт розробника, де можна придбати / завантажити в інтернет цей редактор, посилання на навчальні програми та інструкції по роботі з редактором.

Редактори для верстки веб-сторінок буваю двох типів: візуальні і текстові.

Візуальні редактори не вимагають від вас знань html, css та інших технологій для розмітки сторінок. У візуальному редакторі ви маєте в своєму розпорядженні різні елементи вашого сайту, як ніби на аркуші паперу, а редактор пише за вас код самостійно. Саме тому візуальні редактори ще називають WYSIWYG-редакторами. Абревіатура WYSIWYG розшифровується як What You See Is What You Get - що бачиш, те й отримуєш.

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

Якого ж типу вам слід заводити редактор? Якщо ви вивчаєте html, css або інші технології для розмітки сторінок, якщо ви хочете вміти створювати якісні сторінки і бути професійним кодером, то безумовно вам потрібен текстовий редактор. Якщо ж у вас немає часу на вивчення html, css та інших технологій, якщо перед вами не варто дуже складних завдань у виконанні сторінки, то сміливо заводите собі візуальний редактор і користуйтесь ним, він дуже економить час і сили. А краще всього мати у себе на комп'ютері і візуальний, і текстової редактори для різних потреб.

Візуальні редактори

Macromedia Dreamweaver MX

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

Розробники стверджують, що Macromedia Dreamweaver MX призначена для проектування, розробки та адміністрування професійних web-сайтів і додатків. Крім того Dreamweaver легко інтегрується з іншими програмами від Macromedia, наприклад, такими, як Flash. ТобтоDreamweaver набагато більше, ніж просто візуальний редактор, це досить потужний і складний інструмент, а кожен складний інструмент вимагає, щоб на його освоєння було витрачено якийсь час, перш, ніж користувач зможе працювати в ньому. Однак, я вважаю, що вас не повинно бентежити, що доведеться вивчати, як користуватися програмою, Dreamweaver варто того.

Adobe GoLive і LiveMotion

Можливо, Adobe GoLive сподобається тим, хто любить програми від Adobe, і багато з ними працював: знайома середа, досить легко розібратися, що до чого. Крім того, ще один плюс для любителів Adobe - всі програми від Adobe чудово взаємодіють один з одним і доповнюють один одного, GoLive не виняток, він чудово дружить з побратимами. Однак, GoLive не більше, ніж візуальний редактор для верстки веб-сторінок, більше ніж підтримки таких технологій, як Html, Dhtml, CSS, XML і декількох готових Javascript `ів не варто чекати від цієї програми. Однак, слід зазначити, що вбудований редактор коду (текстової) у цій програмі дуже хороший. Тобто можливо, GoLive оптимальне поєднання візуального і текстового редактора (два в одному).

Хочу також додати, що, ймовірно, варто використовувати з GoLive таку програму, як Adobe LiveMotion (у попередніх версіях вона називалося Image Styler). Хоча, за ідеєю, LiveMotion є графічним редактором, в якому ви можете створювати невигадливу, але якісну графіку для своїх веб-сайтів, ця програма також вміє верстати веб-сторінки, на основі того, що ви намалювали (не кращим чином, але досить пристойно , плюсом є те, що LiveMotion сам ріже готовий макет на багато картинок, які ви потім можете використовувати при верстці сайту в GoLive).

Microsoft FrontPage

Якщо вірити розробникам, то програма FrontPage дозволяє створювати веб-вузли, що володіють широкими можливостями, а також надає засоби управління ними. На ділі, FrontPage дружить з Html, Css, Dhtml, Javascript. Дає досить широкі можливості по управлінню зображеннями і flash-роллікамі. Крім того FrontPage дружить з такими технологіями, як ASP, XML, VBScript, XSL. Також розробники стверджувала, що в останній версії FrontPage тепер бореться за чистоту коду, що ж, залишається сподіватися, що це так, тому що раніше даний пункт був не на висоті (раніше FrontPage вставляв у код дуже багато непотрібних коментарів та іншої зайвої інформації, так що правильністю і чистотою коду сторінки, зроблені в цьому редакторі похвалитися не могли).

Hotdog

Програма має простий і зрозумілий користувачеві інтерфейс. Крім того, що Hotdog дружить з користувачем, ця програма дружить також з Flash, SQL, PHP, ASP, має працювати з GIF-зображеннями (оптимізація, анімація), включає в себе Html-компресор, може створювати файли довідки (CHM).

ТЕКСТОВІ РЕДАКТОРИ

Homesite

Цей редактор, мабуть, самий популярний і потужний серед текстових, і не дарма. Крім того, що в ньому досить легко працювати не тільки з Html-кодом (є все, від списку всіляких атрибутів до всіх тегам аж до перевірки коду (правильність перевіряється з точки зору W3C.org)), але також є підтримка XHTML, CSS- редактор, і так далі.

HTML Pad

Ця програма теж користується великою любов'ю користувачів. Крім усього стандартного HTMLPad підтримує JavaScript, VBScript, SSI, ASP і Perl, вміє створювати макроси (нападобіе Word `a і Excel'я), включає в себе купу різних довідкових матеріалів по CSS і Html, і багато іншого.

Notepad

Notepad він же Блокнот. У цій програмі немає ніяких функцій, які облечат ваше життя: ні підсвічування коду, ні вставки готових конструкція коду, нічого, але зате ця програма є в Стандартних на комп'ютері у кожного користувача. З неї ви можете почати свої перші кроки у написанні коду, а потім вже змінити на більш сподобався редактор. Всі ми колись починали з Блокнота:)

За сим все. Якщо у вас не дуже хороша і швидка зв'язок з інтернет, щоб завантажити редактори, то ви можете купити їх у магазині, де продаються програми для комп'ютера.

Якщо ви вважаєте, що якийсь редактор для верстки веб-сторінок був несправедливо упущений у цій статті, якщо ви знаєте цінний підручникабо статтю по якому-небудь редактору, якщо ви вважаєте, що ми незаслужено насварили або похвалили той чи інший редактор, то повідомте нам про це на Форумі, або по Е-майл (admin@postroika.ru), ми обов'язково прислухаємося до вашої думки і постараємося виправитися.

Додати в блог або на сайт

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]