Програмування web-сторінок мовою HTML
Доброго дня, шановні голодні програмісти, що хочуть навчитися програмувати сайти. Насправді весь сайт складається з багатьох дуже простих елементів, комбінації цих елементів дають змогу робити надзвичайні речі.
Дам одну корисну пораду, перед тим як почати: НАМАЛЮЙТЕ СПЕРШУ НА ПАПЕРІ, так, саме на папері розмітку сторінки, продумайте як вона повинна виглядати, і лише тоді і тільки тоді приступайте до її програмування. Насправді багато з вас проігнорує цю пораду, почне писати код зразу. Колись і я був такий розумник, думав що все знаю... та як показує практика, всерівно потім береш ручку і папір, малюєш і потім переробляєш зроблене... Тому спершу перед тим, як щось робити, РОЗПЛАНУЙТЕ!
Такс, досить розумних порад, не буду тягти, отже почнемо:
Спочатку скажу, що html-мова опису сторінок виконується на любому комп'ютері, який має броузер(браузер) і не потребує якогось додаткового програмного забезпечення.
Для підготовки html-файлу можна використати текстовий редактор Notepad чи будь-який інший, що дає змогу готувати файли у текстовому форматі. Після написання, html-файл потрібно зберегти на диску з деякою назвою з розширенням назви htm чи html.
<HTML>
<HEAD>
<TITLE> Назва вікна web-сторінки</TITLE>
</HEAD>
<BODY параметри>
<!--Далі йде текст,наприклад, такий--> Мене звати Орест. Мені 28 років. Я хочу стати web-дизайнером. Це моя перша web-сторінка. Тут я можу писати будь-який текст, наприклад, про себе і мої інтереси. Пізніше я навчуся вставляти фотографії, картинки, звук, відеозображення шляхом посилання на відповідні графічні, звукові чи відеофайли. Я збережу цей файл на диску і відкрию його у броузері. Моя сторінка ще не красива і не цікава. Але скоро я навчуся робити цікаві web-сторінки. Я розташую файл на сервері, і мою сторінку зможуть побачити в різних кінцях світу.
</BODY>
</HTML>
Відкривши такий файл у броузері, побачимо web-сторінку, де відомості про цю особу будуть розміщені дещо інакше, ніж у файлі: увесь текст розміщений в одному абзаці вирівняний до лівого краю, немає абзацного відступу.
Тільки не думайте,що вашу сторінку(якщо ви робили її на домашньому комп'ютері) зразу ж можуть побачити користувачі інтернету! Цю сторінку зможете бачити тільки ви.
Створення сторінок з допомогою HTML виконується з допомогою так званих "тегів".
Більшість тегів парні, як, наприклад, тег означення html-файлу: <HTML> ... </HTML>. Такі теги називаються інакше контейнерами. Контейнер може містити текст та інші теги.
У середині пари тегів <HEAD>...</HEAD> описують заголовок документа. Головна частина заголовка документа заголовок Windows-вікна, який пишуть у середині пари тегів <TITLE>...</TITLE>.
Тег <!-- текст --> позначає коментар. Текст у середині цього тега виводитися на екран не буде. Коментар можна писати також у середині парного тега <COMMENT> текст-коментар </COMMENT>.
У середині пари тегів <BODY>...</BODY> записують увесь текст сторінки. Цей текст відображатиметься у вікні броузера.
Поекспериментуйте, змінюючи текст в поданому вище коді, щоб краще зрозуміти структуру html-файлу.
В наступних уроках ми розглянемо інші теги, які розширять наші можливості у створенні сайтів.