краткое описание HTML, JavaScript и других технологий

Почему так популярен HTML язык?

Для того, что бы ответить на этот вопрос, мы, во первых, должны понимать принцип работы веб-браузера. Веб-браузер – это приложение для возможности доступа во всемирную паутину (например, Chrome, Internet Explorer, Firefox и т.д.). Принцип работы с интернет-страницами у любого веб-браузера состоит из трех основных этапа:

1. Поиск и получение пути к нужному веб-документу.
2. Отображение веб-документа.
3. Перемещение в рамках веб-документа.

Когда браузер получает доступ к веб-документу, расположенному во Всемирной Паутине, то движок браузера считывает HTML кодирование документов для интерактивной презентации страниц пользователю.

HTML язык используется только для разработки макета документа. Если вы хотите написать HTML-страницу или хотите создать сайт, то вам нужно знание HTML языка. Если вы хотите, чтобы ваши страницы были стильным и читабельными, вам нужно хорошее знание HTML языка с использованием каскадных таблиц стилей (CSS). Сегодня сочетание HTML и CSS делает веб-страницы яркими и привлекательными.

Введение в CSS спрайты для чайников

К самым действенным методам оптимизации сайта относятся CSS спрайты. О том, что такое CSS спрайты и как ими пользоваться рассказывается в публикации Введение CSS спрайты для чайников. Часть текста выделена под информацию об основных принципах работы с использованием CSS спрайтов. Также в статье рассказывается о том, какие есть преимущества и возможности от применения CSS спрайтов.

История HTML

Язык HTML (Hyper Text Markup Language – дословно «язык разметки гипертекста») придуман для разметки веб-документов. HTML существует и активно используется уже довольно давно. Сама идея создания общего языка, способного связать между собой всевозможную документальную информацию в «некоем» пространстве, существовала… с 50-х годов уже прошлого века.

В 1954 году доктор Ванневар Буш, бывший советник по научному развитию при президенте Ф. Рузвельте, опубликовал статью, предлагающую создание концепции под названием «Memex». Центральной темой данной концепции было утверждение о том, что текстовая и графическая информация может быть произвольно связана друг с другом. Сама идея завоевала популярность среди узкой группы исследователей-разработчиков, но лишь спустя почти 20 лет появились практические наработки — социолог Тед Нельсон создал «Проект Xanadu», который представлял собой первую попытку, подтверждающую жизнеспособность концепцию Memex. Нельсон же придумал термин «гипертекст». Другие известные пионеры вычислений, такие как Дуг Энгельбарт, который изобрел компьютерную мышь, были вдохновлены идеями гипертекстовки Нельсона. Однако, несмотря на работу этих вычислительных провидцев, активное применение и развитие теория получила начиная с середины 80-х.

В 1985 году «Symbolics Document Examiner» (разработка Джанета Уолкера) стал первой гипертекстовой системой, призванной добиться признания. Он использовался наряду с LISP для продуктов компании Xerox. Но это было только начало. Как только на рынке появились продукты Macintosh для них была написана собственная операционная гипертекстовая система система «OWL-Guide». В 1987 году Apple Computer дебютировал с «HyperCard» – первая гиппертекстовка, готовая для массового внедрения. И несмотря на то, что компания Apple больше не поддерживает HyperCard, она до сих пор используется многими пользователями по всему миру.

Гипертекст и Всемирная Паутина

Как мы знаем, Днем рождения интернета официально считается 5-е сентября 1990 года. А вот Тим Бернерс-Ли, исследователь, работающий в CERN (Европейская организация по ядерным исследованиям), предложил аналогичный гипертекстовый протокол еще в 1980 году. Программа «Esquire» стала основой его более поздних работ по веб-серверам «HTTPD» и его первый гипертекстовой клиент назывался «WorldWideWeb». Тим Горелки-Ли написал первый гипертекстовый веб-файл 25 сентября 1990 года. HTML был частично основан на SGML, который тогда используется в CERN. В 1991 и 1992 годах, HTML начал поддаватся некоторой стандартизации, став общим языком между вычислительными платформами.

В 1995 году HTML получить новые теги, в том числе элементы «BODY» и «FONT FACE». Уже использовались коды для создания таблиц, вкладок, сносок и форм атрибутов и стилей. В 1995 также дебютировал первый релиз Microsoft Explorer с ActiveX и продавцы призывают к единому стандарту HTML. В 1995 и 1996, Internet Explorer стал использоватся Макинтошами и стартовала разработка следующей версией HTML. HTML 4.0 был выпущен незадолго до начала нового века.

История HTML в новом тысячелетии

С новым веком пришли и новые стандарты, и новые приложения. Активно используется XHTML — являющийся подмножеством XML, в котором HTML 4.01 используются в качестве словаря. XHTML представляет собой совершенно новую отрасль HTML, с идеями и концепцией, заимствованой из XML. HTML 4.01, с его Extensible Markup, использованием стилей и расширения, наряду с современными браузерами, позволяет программистам и разработчикам создавать многофункциональные веб-дизайны и реализовывать задачи, которые были бы невыполнимы всего несколько лет назад.

Сегодня элементы HTML-языка используются для написания HTML-кода, состоящего из «меток» (таких, как <body>, <html>, <p>), ограниченных угловыми кавычками (<>).

Важно понимать, что HTML-язык — это язык разметки веб-страниц, а не язык программирования.

---

Использование HTML

Язык HTML – является языком гипертекста, заключается в том что, в обычном тексте добавляются специальные команды HTML. Описывает не формат документа, а его структуру. Формат документа выполняется при просмотре его, при помощи браузера. Браузер использует команды заданные автором Web-страницы и форматирует их на экране документа в соответствии со своими настройками и свойствами со свойствами ПК.

Автор Web-страницы — html верстальщик, используя язык html, описывает структуру текста, отдельными фрагментами. Можно задать такие свойства «быть заголовком»; «быть выделенным»; «быть гиперссылкой»; «быть альтернативным текстом» и др.

Альтернативный текст – связывается с объектами Web-страницы и отображается вместо них, если Web-страница содержит ресурсы, а браузер не отображает их, то вместо рисунков выдается альтернативный текст.

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

Тэги HTML

По HTML можно проводить простые документы. Как это делать?

<TITLE> это самый простой документ HTML </TITLE>, <TITLE> — это тэг, используется для определения заголовка.
<H1> — является тэгом заголовка.
<P> — это тэг параграфа.

Все тэги парные. И не все они совместимы с браузерами. Если браузер не распознает тэг, он его просто-напросто пропускает. В HTML прописные символы ничем не отличаются от строчных.

Все документы HTML имеют свое название. Для него предназначено отведенное место – вверху экрана, и не с содержимым.

Форматирование HTML

Оно может быть как авторским, так и непосредственным. При использовании тэга <pre> значит форматирование авторское; а если <br>, <hr>, <p> — это непосредственное.

Подзаголовки и заголовки HTML

Использование HTML дает нам возможность работать с уровнями заголовков. Их существует шесть. Первый заголовок является самым главным, и обозначают его тэгом <H1>, так же он может быть и названием документа, а другие могут быть напечатаны прописными или жирными буквами.

Списки подразделяются на вложенные, ненумерованные, нумерованные, с описаниями.

Нумерованные: <ol>, <li>, </ol>;
Ненумерованные: <ul>, <li>, </ul>;
С описанием: <DL> , <DT> ,<DD>, </DL>;
Вложенные: <UL>, <LI>, <OL>, <LI>.

Выделенный текст HTML

Выделить текст можно таким методом:
<code> — код для программы </code>
<samp> — компьютерное сообщение </samp>
<em> — логический акцент </em>
<kbd> — ввод с клавиатуры </kbd>
<cite> — цитата </cite>
<dfn> — определение </dfn>
<strong> — акцент сильный </strong>
<var> — переменные </var>.

В HTML строки можно разбить в любом месте.

Ссылки HTML

HTML дает возможность связать картинку или текст с другим документом. Текст обычно выделяется подчеркиванием или выделением. Для этого существует тэг <A>, только после этого тэга необходимо поставить пробел.

Специальные символы HTML

Это те символы которые не вводятся в текст с помощью клавиатуры. Для этого нужны такие специальные тэги.
Четыре символа — <, >, &, и » .
«» их используют в начале и конце тэгов;
& используется для escape-последовательности.

Но это далеко не все операции, которые позволяет выполнить язык HTML.

Как сохранить текст в формате HTML?

Самым простым способом для новичка будет сохранение форматированного текста в Word в формате .html

---

HTML редакторы

Невозможно найти веб-дизайнера, у которого не было бы необходимости в использовании ряда важных и полезных инструментов, к каковым следует отнести редакторы HTML. Данные программы крайне важны для осуществления процессов, связанных с созданием и изменением HTML-страниц.

Количество редакторов, которые сегодня могут справиться с данной задачей невероятно велико. Они обладают определенными отличиями, которые заключаются в управлении и функциональных возможностях. Именно поэтому, существуют не только бесплатные программы, но и те за которые придется заплатить. Однако, оценивая ситуацию объективно, следует заметить, что достаточно большому количеству сотрудников хватит простого редактора, который сможет справляться с рядом основных задач и операций.

Именно поэтому редакторы HTML, которые обладают бесплатной лицензией, достаточно востребованы:

Одним из них можно назвать Notepad++. Он представляет собой достаточно простой и удобный текстовый редактор, функционал которого обеспечивает не только полноценную замену Блокнота Windows, но и возможность использования ряда языков, среди которых HTML, PHP, JavaScript и другие.

Также достаточно популярная программа для редактирования HTML, предусматривающая поддержку HTML и CSS – это Komodo Edit. Его преимуществом является то, что для расширения функционала существует отличная возможность использовать установку всевозможных дополнений. Это позволяет подогнать редактор под индивидуальные требования и значительно повысить эффективность его применения.

Редактирование HTML на профессиональном уровне нередко осуществляется в Aptana – это программа, для которой характерен достаточно объемный дистрибутив. Благодаря этому обеспечиваются более чем достойные функциональные возможности. Как правило, данный редактор популярен среди опытных специалистов, так как огромное количество настроек и всевозможных функций не всегда необходимо новичкам.

Кроме перечисленных программ, существуют и другие удобные редакторы. Каждый из них обладает своими преимуществами, поэтому достаточно сложно составить их рейтинг. Кроме того, в зависимости от рода деятельности, опыта и потребностей, в каждом конкретном случае может быть актуальным какой-то определенный редактор. Соответственно, выбор должен совершаться самим пользователем.

---

JavaScript используется в качестве встраиваемого языка для программного доступа к элементам приложений. С его помощью можно изменить стиль веб-страницы, наполнить ее оригинальными объектами, а также украшать различными эффектами, которые не подвластны стандартным тегам HTML. Проще говоря, без JavaScript не удастся реализовать функциональный и привлекательный сайт. При этом, совсем не придется использовать тонны кода. Достаточно будет внести всего пару строчек и кнопки приобретут необычный вид и определенные функции. JavaScript, внедренный в HTML-страницу, позволяет реагировать на щелчок мыши пользователем, навигацию по странице и на введение данных в форму для заполнения.

Язык программирования JavaScript происходит от небольших типизируемых аналогов, таких как dBASE и HyperTalk, которые обладают упрощенным синтаксисом, минимальными требованиями для создания объектов и специализированной встроенной функциональностью.

Что касается схожести JavaScript с Java, то стоит отметить более свободную форму первого варианта. В этом случае не придется объявлять все переменные, методы и классы, а также указывать, какие методы являются private, public или protected. Java является языком программирования, основанным на классах. Он создан для стремительного выполнения и четкой проверки типов. В этом случае программы состоят из классов и присущих им методов. Посредством LiveConnect существует возможность взаимодействия кода Java с JavaScript. Из JavaScript можно вызывать объекты Java, а также получить доступ к public-методам. В то же время из Java есть доступ к методам, свойствам и объектам JavaScript.

Чтобы запустить скрипт, написанный на языке программирования, потребуется браузер, рассчитанный на работу с JavaScript, к примеру, Microsoft Internet Explorer, начиная с третьей версии, или Netscape Navigator. Код скрипта необходимо разместить непосредственно на странице HTML-документа. Если браузер не рассчитан на работу с JavaScript, то тег <script> будет просто проигнорирован и все указанные коды будут интерпретированы в виде обычного текста.

Чтобы написать сценарий JavaScript можно использовать программы, применяемые для создания HTML-кода. Это “Блокнот”, Netscape Coffe Cup, WordPad, Microsoft Front Page. Если предполагается наполнить сценарий графикой, то подойдут такие графические редакторы, как Adobe Photoshop, Corel Draw.

Что такое таблица стилей CSS?

Таблица стилей CSS выполняет функцию описания внешнего облика документа посредством языка разметки. Проще говоря, каскадные таблицы стилей используются с целью придания оригинального дизайна страницам сайта. Это достаточно удобный способ. Ведь для присвоения определенному элементу конкретных характеристик необходимо единожды описать данный элемент, а затем установить это описание в качестве стиля. Чтобы оформить документ соответствующим образом, потребуется лишь указать на свойства ранее созданного стиля. CSS, в отличие от стандартного HTML, позволяет осуществлять шрифтовое оформление страниц намного продуктивнее, избегая их непомерного утяжеления графикой.

Современный язык CSS способен управлять большим количеством функций элементов HTML. Хотя некоторые браузеры еще не способны поддерживать его в полном объеме.

Для создания и подключения таблицы стилей CSS к простой html-странице, прежде всего, потребуется произвести следующие действия:

• создать папку, которая в последствии будет содержать каскадную таблицу стилей, а также страницу html;
• создать html-страницу (index.html);
• создать текстовый документ под названием style.css.

Чтобы подключить сформированную таблицу стилей CSS к странице, следует в теге “head” файла “index.html” прописать путь к css-файлу (например, <link rel="stylesheet" type="text/css" href="style/style.css">). Чтобы браузер правильно отобразил текст страницы, очень важно при сохранении файла “index.html” установить кодировку Windows-1251.

Далее можно приступить к управлению фоновым изображением html страницы, к изменению цвета и размера, и прочим параметрам.

Чтобы задействовать фоновое изображение, необходимо произвести разметку в папке с созданными файлами. Следующий шаг подразумевает перемещение в папку с css-файлом файла “bg.jpg”. Затем следует задать стиль тегу “body” документа, указав в таблице стилей CSS определенные параметры. Пример:

body
Background - image: url (...jpg);
background - color: #000000;
margin - bottom: 0px;
margin - top: 0px;
font - family;
color: #000000;
font – size 0 px;

где, body — установка стиля для тега body;

background — image: url (…jpg) — задание фонового изображения, путь которого должен быть прописан в указанном параметре url (…jpg);

background — color: #000000 — атрибут, отвечающий за фон тела документа и устанавливается, когда в браузере посетителя выключены изображения;

margin — bottom: 0px — определяет расстояние от тела html-документа до нижней области браузера;

margin — top: 0px — отвечает за расстояние от тела html-документа до верхней области браузера;

font – family — установка размера шрифта по умолчанию;

color: #000000 – задание цвета текста;

font – size — размер шрифта html-документа.

Основы SQL

SQL обозначает структурированный язык запросов, предоставляющий возможность создавать и в дальнейшем управлять реляционными базами данных, относящимися в некоторых системах к группе таблиц.

Стандарт SQL поддерживается ANSI, а на сегодняшний день еще и принимается ISO. Хотя многие коммерческие программы пополняют структурированный язык запросов без уведомления ANSI, расширяя возможности SQL и считая их весьма необходимыми. Иногда они несколько нарушают стандартный язык, однако существуют и довольно хорошие идеи, которые имеют право на развитие и становление в качестве стандартного образца.

Основы SQL выделяют нескольких частей:

1. DDL — это язык определения данных;
2. DML — это язык, отвечающий за манипулирование данными;
3. DCL — это язык управления данными. Предназначение DDL заключается в создании и внесении изменений в базу данных, а также в составные ее части – индексы, таблицы, триггеры, виртуальные таблицы и сохраненные процедуры.

В основах SQL разделяют такие команды, относящихся к языку определения данных:

• Create Table — cоздание таблицы;
• Create View — создание виртуальной таблицы;
• Create Database — создание базы данных;
• Create Index — создание индекса;
• Create Trigger — создание триггера;
• Create Procedure — создание сохраненных процедур;
• Alter Table — модифицирование таблицы;
• Alter Database — модифицирование базы данных;
• Alter View — модифицирование виртуальной таблицы;
• Alter Index — модифицирование индекса;
• Alter Trigger — модифицирование триггера;
• Alter Procedure — модифицирование сохраненной процедуры;
• Drop Database — команда, отвечающая за удаление базы данных;
• Drop Table — команда для таблицы;
• Drop View — команда для удаления виртуальной таблицы;
• Drop Index — команда для удаления индекса;
• Drop Trigger — команда для удаления триггера;
• Drop Procedure — удаление сохраненной процедуры.

DML включает в себя такие четыре команды:

• Select — выбрать;
• Insert — вставить;
• Update — обновить;
• Delete — удалить.

DCL предоставляет либо изымает право на доступ к данным. Он в свою очередь состоит из двух команд:

• Grant — предоставить права;
• Revoke — отнять права.

Кроме этого, основы SQL составляют интерактивный и встроенный структурированный языки запросов. Первый вариант предполагает использование SQL в специальных программах (типа DBD либо WISQL), что дает возможность в интерактивном режиме ввести запрос с применением команд SQL, отправить данные на сервер для выполнения и в результате получить ответ в отведенном для этих целей окне. Встроенный SQL предназначен для прикладных программ, позволяющий отправлять к серверу запросы и обрабатывать результаты, а также комбинировать record-ориентированный и set-ориентированный подходы.

Как часто вам приходится работать с HTML, JavaScript, CSS?