Привіт, друзі! Ті з вас, хто неодноразово читав мій блог, знають, що я багато разів говорив: не потрібно мати спеціальних навичок в програмуванні, щоб в Інтернеті.

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

Хочете знати, які мови потрібні для створення сайту? Тоді читайте!

Деякі основні положення

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

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

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

Основою абсолютно будь-якого сайту є. Цей синтаксис відповідає за гіпертекстову розмітку. Всі веб-розробники зобов'язані знати його також добре, як і таблицю множення.

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

Основні мови програмування

В першу чергу варто виділити JavaScript, адже він є основою всього програмування, яку необхідно знати при створенні веб-ресурсу. Серед програмних платформ базовими є Silver Light і Adobe Flash. Причому останній досить поширений і порівняно давно використовується веб-розробниками.

Ці мови використовуються при створенні інтерактивних сайтів. За прогнозами Silver Light скоро повністю замінить Adobe Flash. У рідкісних випадках цих двох програмних продуктівцілком достатньо для створення інтернет-сайту, але використання тільки їх одних вкрай небажано.

Вибір відповідного синтаксису залежить і від операційної системи, Якою користується розробник. Щоб створити веб-ресурс на ОС Windows, часто використовується технологія, яка була розроблена компанією Microsoft - ASP.NET. Вона дозволяє створити абсолютно будь-який веб-ресурс, як найпростіший, так і здатний обробити чимала кількість запитів. Щоб скористатися ASP.NET, слід мати знання не на рівні користувача, а трохи глибше.

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

Починаючи розбиратися в веб-програмуванні, багато хто вибирає Java, він найбільш зрозумілий і легко засвоюється. Для створення контенту використовуються Java Server Pages.

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

підсумки

Вибирати відповідний синтаксис необхідно за кількома параметрами, а саме:

• Типу операційної системи;
• Складнощі і динамічності створюваного сайту;
• Наявного арсеналу власних знань.

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

Сподіваюся, даний матеріал був вам корисний, і ви з задоволенням поділіться цією статтею зі своїми друзями в соціальних мережах. Не забудьте підписатися на оновлення блогу. До скорої зустрічі!

З повагою! Абдуллін Руслан

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

HTML

HTML- це один з найстаріших мов web-програмування, що з'явився ще на зорі розвитку Інтернету, і зарекомендував себе як один з найпростіших і надійних способів web-програмування. HTML розшифровується як Hyper Text Markup Language - Мова Розмітки Гіпертексту. Сайти, створені за технологією HTML в більшості своїй є набором статичних сторінок, які не потребують наявності бази даних.

Технологія HTML може підійти для створення невеликих, легких сайтів в кілька сторінок, функціонал яких не вимагає інтерактивності і динаміки.

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

PHP

PHPє серверним мовою програмування і здійснює зв'язок сайту з сервером і його базою даних. Сам по собі мова PHP за створення сайту не відповідає, і якщо поглянути на код сторінки такого ресурсу, ми побачимо все той же HTML, тільки з вкрапленнями PHP коду.

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

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

FLASH

По суті, сама технологія флешне є мовою web-програмування, але використовується для візуалізації елементів, написані на мові XML.

Створення сайту за технологією flash складний і трудомісткий процес, але результат вартий, витрачених на нього сил і засобів. Flash-елементи, дозволяють зробити ваш сайт яскравим та інтерактивним. Живі, динамічні сторінки залишать незабутнє враження про ваш ресурс у відвідувачів, і позитивний образ про вашому сайті надовго залишиться в умах зачарованих користувачів. Імідж ж компанії від використання в на своєму ресурсі технології flash, тільки виграє, так як елементи зроблені на flash не з дешевих і вважаються люксовим.

Але в усьому так би мовити потрібно, знати міру, і створення flash-сайтів не виняток. Flash-блоки значно важче стандартних web-елементів і тому на їх подгрузгу потрібно більше часу. А користувачі мережі, як правило, чекати не люблять. Тому, довіряйте створення свого flash сайту професіоналам, які оптимізують його для максимально продуктивної роботи.

WAP

WAP (Wireless Application Protocol) - це технологія дозволяє отримувати доступ до ресурсів Інтернету прямо з мобільного пристрою.

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

Сайти, які перебувають під WAP мають свою мову розмітки, адаптована саме під обмін інформацією з WAP-браузером. І якщо звичайні сайт, призначені для перегляду з комп'ютера в більшості своїй написані на мовах html, php, Perl, або xml, То для створення WAP-сайтів використовується стандарт WML ( Wireless Markup Language). Крім усього іншого при розробці WAP-ресурсів використовується свій формат зображень - WBMP, що дозволяє максимально полегшити WAP-сторінку.

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

ASP

ASP (Active Server Pages) - це відкрите середовище розробки web-додатків, яка дозволяє комбінувати мову HTML, скрипти, і ActiveX серверні компоненти, з метою створити динамічні і потужні web-рішення для бізнесу. ASP-сторінки це сторінки, що містять в собі скрипти, що виконуються на стороні сервера.

Perl

Perl (Practical Extraction and Report Languge) - універсальний, інтерпретована мова web-програмування, що використовується для написання cgi-скриптів і cgi-програм, які виконуються на стороні сервера і дозволяють автоматизувати роботу сайту. Perl - це одна з найбільш зручних і поширених середовищ для створення динамічних web-сторінок, хоча і витісняється останнім часом більш новими Інтернет-технологіями. Формат Perl є прекрасним засобом для взаємодії з web-серверами через CGI ( загальний інтерфейс взаємодії). В даний час мова Perl втрачає позиції по відношенню до своїм функціональним аналогом - PHP.

C +

С, С ++- широко поширені мови веб-програмування, які використовуються для написання cgi-скриптів. В даний час підтримуються більшістю серверів. Скрипти, написані на C + необхідно компілювати на стороні сервера.

SSI

SSI (Server Side Include) - технологія дозволяє збирати web-сторінку з декількох скриптів або файлів в єдине, функціональне ціле. SSI дозволяє включити в web-сторінку інформацію на сервері, недоступну засобами HTML. По суті SSI - це своєрідний аналог інклуд в PHP. Дозволяє впроваджувати в код сайту загальні для кожної, або групи сторінок елементи, що дозволяють здійснювати редагування кожної сторінки через один тільки файл. SSI директиви підтримуються .shtml, .htmі .htmlі прописуються в файле.htaccess.

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

Ескізи або прототипи сайту зазвичай створюються в програмах для графічного дизайну. З професійних програм виділимо три найбільш поширені - це, Adobe Illustrator, і CorelDRAW. Є, звичайно, маса інших менш професійних але не менше цікавих програм, однак на них ми поки не будемо загострювати свою увагу.

Наступний етап- це втомлива низка численних виправлень і тверджень цих самих ескізів замовником.

Ну ось дизайн сайту створений, відкоректований і затверджений замовником, тепер його потрібно зверстати, а що ж таке верстка?

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

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

Отже, щоб написати сайт, вам буде потрібно знати такі мови програмування як: HTML, CSS, JavaScript, PHP, MYSQL. Існують і інші мови, але це найбільш популярні, на сьогоднішній день. І я розповім вам про кожній мові детальніше.

HTML(HyperText Markup Language) - це мова розмітки, що описує форму відображення інформації. Ця мова використовують для створення підстави сайту, іншими словами для каркаса сайту.

CSS(Cascading Style Sheets) - це мова за допомогою якого можна контролювати зовнішній вигляд Web-сторінки. За допомогою CSS можна задавати точні характеристики практично всіх елементів Web-сторінки.

JavaScript- це мова так би мовити для "пожвавлення" Web-сторінки, за допомогою цієї мови можна зробити Web-сторінку інтерактивною, або іншими словами, змусити взаємодіяти з користувачем. З його допомогою можна зробити спливаючі вікна або підказки, а також багато іншого. Ця мова служить не тільки для застосування в Web-розробці.

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

MYSQL- це база даних. За допомогою цієї мови можна додавати, змінювати або видаляти дані, отримувати інформацію за запитом. Якщо знати MYSQL то можна легко вивчити і інші мови баз даних.

Перед тим, як ми почнемо нашу подорож по урокам створення сайтів на HTML і CSS, важливо розуміти відмінності між двома мовами, синтаксис кожної мови і деяку основну термінологію.

Що таке HTML і CSS?

HTML (HyperText Markup Language, мова розмітки гіпертексту) задає структуру вмісту і його сенс, визначаючи такий контент як, наприклад, заголовки, абзаци або зображення. CSS (Cascading Style Sheets) або каскадні таблиці стилів - це мова презентацій створений для оформлення зовнішнього виглядуконтенту, який використовує, наприклад, шрифти або кольори.

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

При такому розумінні різниці між HTML і CSS давайте зануримося в HTML більш докладно.

Основні терміни HTML

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

елементи

Елементи вказують, як визначати структуру і вміст об'єктів на сторінці. Деякі з часто використовуваних елементів включають в себе кілька рівнів заголовків (визначені як елементи з

до

) І абзаців (визначені як

); в список можна включити елементи ,

, , і і багато інших.

Елементи ідентифікуються за допомогою кутових дужок<>, Що оточують ім'я елемента. Таким чином, елемент буде виглядати так:

Теги

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

Хто відкриває тег відзначає початок елемента. Він складається з символу<, затем идёт имя элемента и завершается символом >; наприклад,

.

Закриває тег відзначає кінець елемента. Він складається з символу< с последующей косой чертой и именем элемента и завершается символом >; наприклад,

.

Вміст, яке знаходиться між відкриває і закриває тегами, є вмістом цього елементу. Посилання, наприклад, буде мати відкриває тег і закриває тег. Що знаходиться між цими двома тегами буде вмістом посилання.

Так, теги посилань будуть виглядати приблизно так:

...

атрибути

Атрибути є властивостями, що застосовуються для надання додаткової інформаціїпро елемент. Найбільш поширені атрибути включають в себе атрибут id, який ідентифікує елемент; атрибут class, який класифікує елемент; атрибут src, який визначає джерело вбудованого вмісту; і атрибут href, який вказує посилання на пов'язаний ресурс.

Атрибути визначаються в відкриваючому тезі після імені елемента. Загалом, атрибути включають в себе ім'я та значення. Формат для цих атрибутів складається з імені атрибута зі знаком рівності за ним, а потім в лапках йде значення атрибута. Наприклад, елемент з атрибутом href буде виглядати наступним чином:

Shay Howe

Демонстрація основних термінів HTML

Даний код буде відображати текст «Shay Howe» на веб-сторінці і при натисканні на цей текст веде користувача на http://shayhowe.com. Елемент посилання оголошений за допомогою відкриваючого тега і закриває тегаохоплюють текст, а також атрибута і значення адреси посилання оголошеної через href = "http://shayhowe.com" в відкриваючому тезі.

Мал. 1.01. Синтаксис HTML у вигляді схеми включає елемент, атрибут і тег

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

Налаштування структури документа HTML

HTML-документи являють собою прості текстові документи, Збережені з расшіреніем.html, а не.txt. Щоб почати писати HTML спочатку потрібен текстовий редактор, який вам зручний у використанні. На жаль, сюди не входить Microsoft Wordабо Pages, оскільки це складні редактори. Двома найбільш популярними текстовими редакторами для написання HTML і CSS є Dreamweaver і Sublime Text. Безкоштовні альтернативи також Notepad ++ для Windows і TextWrangler для Mac.

Всі HTML-документи містять обов'язкову структуру, яка включає наступні декларації та елементи: , , і .

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

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

Все видиме вміст веб-сторінки буде знаходитися в елементі . Структура типового HTML-документа виглядає наступним чином:

Привіт світ!

Це веб-сторінка.

Демонстрація структури HTML-документа

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

Час для перевірки нашої роботи і перегляду, як уживаються разом наші HTML і CSS. Відкриття файлу index.html (або оновлення сторінки, якщо вона вже відкрита) в браузері має показати трохи інший результат, ніж раніше.

Мал. 1.04. Наш сайт Styles Conference зі скиданням CSS

Демонстрація і вихідний код

Нижче ви можете переглянути сайт Styles Conference в його нинішньому стані, а також завантажити вихідний кодсайту на даний момент.

резюме

Отже, все добре! Ми зробили кілька великих кроків в цьому уроці.

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

Нагадаємо, що ми розглянули наступне:

• Різниця між HTML і CSS.
• Знайомство з елементами HTML, тегами і атрибутами.
• Налаштування структури вашим першим веб-сторінки.
• Знайомство з селекторами CSS, властивостями і значеннями.
• Робота з селекторами CSS.
• Покажчик на CSS з HTML.
• Важливість CSS скидання.

Тепер давайте ближче розглянемо HTML і познайомимося трохи з семантикою.

Ресурси і посилання

• Common HTML terms via Scripting Master
• CSS Terms & Definitions via Impressive Webs
• CSS Tools: Reset CSS via Eric Meyer

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.