Создайте веб-страницу, представленную на рис. 1, используя теги и .

HTML-сайты не обязательно имеют примитивный дизайн. Существует множество бесплатных HTML шаблонов, ничем не уступающих по привлекательности тем, что используются в конструкторах сайтов или CMS. Но большие проекты на них неудобно делать. Много страниц – много мороки, поскольку редактирование каждой требует копания в коде. У них нет панели управления, также все страницы будут статическими – никаких блогов, форумов и т. д.

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

Вёрстка в HTML бывает табличной (table – устаревший стандарт) и блочной (div – именно её сейчас используют). Язык использует обширный набор тегов, почти все из которых используются парой – открывающий и закрывающий теги (например,

— тег абзаца), внутри которых содержится контент. В CSS используются атрибуты, свойства и их значения, подключаемые к отдельным элементам HTML-каркаса страницы. То есть можно выборочно придавать желаемый вид каждому элементу на сайте по отдельности.

Мы не ставим своей целью обучить вас синтаксису языков – если нужно, то без труда сможете найти сотни уроков и справочников по ним в Сети. Покажем основу – как сделать простой сайт на HTML в блокноте, создать своими руками веб-страницу по тем же стандартам, что используют все посещаемые вами сайты. На примере вы сможете уловить суть процесса, оценить для себя, интересна ли вообще эта тема.

Шаг 1 – создание страницы формата HTML

Откройте стандартный блокнот для Windows (или любой другой текстовый редактор – Notepad++, Sublime Text — неважно), откройте меню «Файл», выберите «Сохранить как», измените кодировку с ANSI на UTF-8 (для правильного отображения русских букв в браузере), впишите заголовок веб-страницы и измените расширение на html (оно идёт после точки), после чего сохраните изменения.

Шаг 2 – добавляем разметку веб-страницы

Теперь приступаем к редактированию файла. Первым делом необходимо добавить -веб-разметку – стандартный кусок кода, позволяющий браузерам распознавать контент, находящийся во внутренних тегах. Просто скопируйте и вставьте его:

    Топовый сайт новичка

для чайников

Вас заинтересовал вопрос: “Как сделать html страницу?”, то просмотрев данную статью, вы сможете сделать html страницу самостоятельно, не прилагая больших усилий.

HTML (HyperText Markup Language — «язык разметки гипертекста») не является языком программирования, он предназначен для разметки текстовых документов (т.е. с помощью него мы указываем браузеру где будет размещен текст, картинка, таблица и т.п. ).

То, как будут выглядеть картинки, текст и другие элементы на вашей странице, и как они будут располагаться относительно друг друга, определяют метки (тэги).

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

Теперь мы перейдем к практическому осуществлению нашей задачи “Как сделать html страницу?”. Для этого нам понадобится любой текстовый редактор. Я вам посоветую «Notepad++». Либо можете воспользоваться стандартным блокнотом, только будьте внимательны, когда будете сохранять файл, обязательно сохраняйте его с расширением «html». Название обязательно пропишите латинскими буквами.
Это будет выглядеть так:
«page.html»

И так, открываем наш редактор, и пишем следующий код:

Моя первая страница

Я Вас приветствую.
Это Начало большого пути в просторы Интернета

HTML – главный и наиболее используемый при создании интернет-сайтов язык программирования веб-станиц Интернета (Всемирной паутины). Он был придуман Тимом Бернерс-Ли как язык описания гипертекстовых структур, пригодный для использования людьми, не являющимися специалистами в области компьютерной верстки и интернет-дизайна. К середине 1990-х гг. язык гипертекстовой разметки HTML был приведен в стандартизованную форму и спецификации языка были впервые опубликованы в 1995 г. в документе «Hypertext Markup Language- 2.0» [1] . Этот стандарт остается ядром программных средств конструирования содержания веб-сайтов Интернета и сегодня.

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

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

  • • как должны выглядеть на экране компьютера пользователя те или иные элементы текста (включая обозначение границ абзаца, перехода с одной строки текста на другую, выравнивания фрагментов текста относительно границ экранного пространства, оформление информации в виде списка или в виде таблицы, обозначение гиперссылок на разные части текста или на какие-то другие веб-страницы в Интернете и т.д.);
  • • как все смысловые, структурные и композиционные элементы текста должны быть размещены на двумерном пространстве веб-страницы наиболее оптимальным и эффективным образом (т.е. определять дизайн вебстраницы);
  • • каким образом текстовые элементы будут совмещаться с информационными элементами другой модальности – картинками, диаграммами, видеороликами, анимацией и т.д.;
  • • какие элементы в тексте документа потребуют определенных интерактивных действий пользователя (например, обозначение способов активизации компонентов веб-страницы, обозначающих гиперссылки);
  • • в какой последовательности и в каком виде должны применяться правила дизайнерского оформления предъявляемого пользователю информационного материала для усиления эффективности его воздействия.

Все эти, а также некоторые другие параметры гипертекстовых материалов можно однозначно определить в языке HTML с помощью специальных команд, представляющих собой коды, составленные по определенным правилам и записанные в виде символьных последовательностей, которые называются тэгами (англ. tag – ярлык, этикетка, бирка). Набор тэгов языка HTML фиксирован и стандартизирован (хотя в него возможно добавлять новые тэги, которые, однако, должны подчиняться установленным принципам); совокупность всех тэгов определяет самые широкие возможности языка HTML по оформлению информации в Интернете.

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

Все тэги языка HTML имеют одинаковый формат: они начинаются знаком » » (закрывающая косая скобка). Сама компьютерная команда представлена символами, помещенными между этими знаками, при этом для обозначения закрывающего тэга используется знак «обратная косая черта», или «слэш» («/»), который ставится сразу после обозначающей начало тэга открывающей косой скобки.

Например, базовые тэги языка HTML, без которых невозможно создание веб-страницы и установление ее связей с другими страницами Интернета (гиперссылок), выглядят так:

  • • тэг должен стоять в начале текста любого файла, который является страницей Интернета – веб-документом (это открывающий тэг); соответственно, в конце текста файла должен стоять парный ему закрывающий тэг – ;
  • • тэг [2] (он отмечает начало так называемого тела веб-документа, т.е. того, что будет выведено браузером на экран компьютера) ставится перед началом текста, который появится на экране пользователя; этот тэг тоже парный, поэтому обозначающий конец текста веб-страницы закрывающий тэг выглядит следующим образом:

Делаем свою первую HTML-страницу (веб-страницу)

Урок №2
Создание своей первой веб-страницы

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

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

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

Открыть Блокнот в Windows можно следующим образом:

Пуск — Все программы

В Блокноте наберите следующий код:

Или просто скопируйте его и вставьте в Блокнот :

Затем сохраните получившийся документ на Рабочий стол , в виде файла с названием index и расширением .html

Для этого нажмите на кнопки:
Файл — Сохранить как…

В появившемся окне выберите Рабочий стол , имя файла напишите index.html и нажмите кнопку:
Сохранить

Теперь файл index.html , который вы сохранили на Рабочий стол , можно открыть в браузере и посмотреть на получившуюся HTML-страницу. Для этого, нужно нажать правой кнопкой мыши по файлу index.html и выбрать из имеющихся у вас браузеров, я обычно использую браузер FireFox :
Открыть с помощью — FireFox

Если у вас на компьютере не установлен браузер FireFox , то можете открыть файл index.html любым другим браузером, например: Opera , Google Chrome , Internet Explorer или Safari .

Файл index.html , открытый в браузере FireFox :

На этом, первый урок учебника по HTML, окончен. В следующем уроке мы подробно разберём HTML-код и узнаем из каких частей он состоит.

Как сделать веб страницу html