Створення web-сторінки - інформатика, програмування

ЯК СТВОРИТИ WEB-СТОРІНКУ

Найпростіший спосіб створити сторінку для розміщення в Інтернеті - скористатися інструментами пакета Microsoft Office. Останні версії цього пакета надають можливість перетворити звичайний документ в HTML-формат з гарною якістю коду.

Візьмемо деякий текст.

Перетворимо документ в web-сторінку за допомогою операції Зберегти як web-сторінку ... (викликається з головного меню - позиція Файл). Тоді html-уявлення документа матиме вигляд:

Перше, що кидається в очі - текст займає весь екранний простір. Довжина рядка занадто велика. Для комфортного читання на екрані число символів в рядку повинно бути в діапазоні 50-65.

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

Можна піти далі - наприклад, змінити колір і фактуру фону, вигляд гіперпосилань, оформлення списків. Для зміни загального дизайну сторінки можна скористатися командою Тема з розділу головного меню Формат.

Бажано вибрати не надто яскравий фон, щоб на ньому добре читався текст. Таким фоном в запропонованому списку є, наприклад, Рисова папір. Вигляд сторінки помітно змінився на краще:

У документ можна додати картинку, взявши її, наприклад, з колекції кліпів.

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

Якщо ви вставляєте картинку всередину абзацу, то краще змінити властивості картинки, задавши обтікання тексту навколо картинки (потрібно вибрати позицію головного меню Формат і далі Малюнок):

У документі при цьому не буде створюватися зайвого порожнього простору.

Нарешті, можна додати зображенні рамку і тінь за допомогою кнопок на панелі Малювання - Тип лінії і Стиль тіні. Подібні нюанси помітно додають виразності сторінці.

Якщо панелі Малювання немає на сторінці, то потрібно встановити її, вибравши позицію головного меню Вид і далі Панелі інструментів і Малювання.

Word дозволяє внести на web-сторінку і інші оформлювальні елементи, наприклад "біжучий рядок". Щоб скористатися цією можливістю потрібно відкрити на екрані панель web-компонентів (з головного меню - позиція Вид, далі Панелі інструментів і Веб-компоненти). Клацання по кнопці операції Та, що біжить рядок відкриває додаткове вікно для завдання тексту параметрів рядка, що біжить.

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

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

Використання шаблонів оформлення

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

Далі у пропонованій заготівлі документа ви повинні ввести тексти та картинки:

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

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

Останнє питання, яке ми плануємо розглянути в даному розділі - створення гіперпосилань в документі.

Тоді при створенні гіперпосилання потрібно вказати цю закладку (кнопка Закладка ... розташована в правій частині форми), вибравши, наприклад, її зі списку в формі:

Веб-презентація в PowerPoint

Програма PowerPoint орієнтована на створення презентацій на комп'ютері. Однак у неї є функція перетворення підготовленої презентації в веб-формат.

Ви можете відкрити підготовлену презентацію і виконати операції (з головного меню) Файл - Зберегти як веб-сторінку. Як завжди потрібно задати ім'я веб-презентації у вікні. В результаті виконання перетворення презентації буде створений файл з заданим ім'ям і розширенням .htm і однойменна папка з додатковими матеріалами.

Якщо тепер з браузера викликати веб-презентацію, то на екрані можна побачити результат перетворення.

Презентацію можна переглядати з показом структури слайдів. Але якщо ця інформацію не представляє інтересу, то зарезервоване для показу структури поле на екрані можна прибрати (операція розгорнути / згорнути структуру в нижньому рядку).

За допомогою кнопки Показ слад можна переглядати слайди на повному екрані.

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

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

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

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

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

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

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

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

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

Macromedia Dreamweaver MX

Adobe GoLive і LiveMotion

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

Інформація про роботу «Створення web-сторінки»

Створення web-сторінки - інформатика, програмування
Створення web-сторінки - інформатика, програмування
Створення web-сторінки - інформатика, програмування
Створення web-сторінки - інформатика, програмування
Створення web-сторінки - інформатика, програмування

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

Схожі статті