Как сделать сайт в блокноте html с несколькими страницами?

15 ответов на вопрос “Как сделать сайт в блокноте html с несколькими страницами?”

  1. Dazer Ответить

    1. — эти теги должны присутствовать на каждой веб-странице обязательно. Они сообщают браузерам и поисковым машинам, что это html-страница.
    Любая html страница имеет следующую структуру:



    Заголовочные теги




    Тело страницы



    2. — между этими тегами заключается весь видимый контент страницы.
    3. — внутри этих тегов должны располагаться все заголовочные теги. Этот раздел можно опустить, но я не советую это делать, поскольку это важная часть документа, особенно для поисковых систем. Более подробно про читайте в описание заголовочных тегов
    4. — между этими тегами прописывается заголовок страницы, которое отображается в самом вверху браузера. Кстати, когда Вы что-то ищите в поисковиках, то первое, что отображается, это как раз название страницы. Тег часто сокращенно называют “тайтлом”. Советую ознакомиться со статьей: как составить тег
    Теперь перейдем к тегам, которые находятся в теле html страницы (внутри и ).
    5. — эти теги выравнивают все, что находится внутри них по центру. В данном случае центром будет – центр экрана. В будущем рекомендуется отказаться от использования этих тегов.
    6. — это один из класса тегов заголовочных тегов .., обычно в него заключают название страницы. Например, у этой странице заголовочный тег “Пример создания html страницы”.
    Примечание
    эти теги имеют большой вес в ранжировании сайта, поэтому ими необходимо пользоваться аккуратно и с умом.
    При составлении html-кода нужно придерживаться простого правила: сначала должен идти заголовочный тег , а дальше могут идти уже

    ,

    и т.д. Главное, чтобы не было сначала

    , потом , потом

    и т.п. Должна быть строгая иерархия. Заголовков

    ,

    и т.п. может быть много.
    Более подробно про эти теги читайте в уроке 14 HTML теги – – заголовочные теги внутри страницы
    7.
    — это одиночный тег, который не требует закрывающего тега. Он осуществляет переход на следующую строку. В моем примере написаны два одиночных тега подряд, чтобы дважды перейти на следующую строку.
    8. — это одиночный тег, который выводит изображение.
    src — обязательный параметр, в котором указывается адрес изображения (вместо URL_ИЗОБРАЖЕНИЯ необходимо прописать адрес, где хранится Ваше изображение).
    Примечание:
    Если изображение находится в одной папке с Вашей html-страницей, то достаточно написать название изображения, иначе нужно прописывать либо абсолютный или относительный URL;
    Не забудьте указать расширение изображения. Например, .jpg, .gif, .jpeg.
    alt или title — в эти параметры можно записать описание к Вашему изображению. Когда Вы наведете мышкой на изображение, то появится это описание. Эти параметры важны для продвижения сайта, особенно в поиске по картинкам. Если изображение не удалось загрузить, то будет выведен этот текст, что также является плюсом.
    Более подробно про читайте в специальном уроке: html тег

  2. SnexFO Ответить

    Урок №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-код
    Category:
    HTML
    Tag:
    html, создание страницы, учебник html

  3. FITO Ответить


    Рис. 2. Это уже, по сути, веб-страничка, хоть и самая примитивная.
    Сохраняйте и опять открывайте страницу в браузере. Если вы видите фразу на фоне красного цвета – все работает. Можно начинать работу над созданием своего сайта. В css мы указали команду сделать красный цвет фоном всей нашей страницы. Теперь понимаете для чего он нужен, этот css?
    Вот так вот мы и будем создавать сайт: формировать элементы в html, потом оформлять их через css и в конце концов получим что-то, похожее на сайт.

    Структура сайта

    Пока я предлагаю вам отвлечься от кода и немного подумать. Наверняка в сети вы бывали на сотнях сайтов. Хотя внешний вид у всех их разный, общая структура часто очень похожа. Есть так называемая шапка сайта, где размещается логотип, контактная информация и т.д.
    Есть горизонтальное или вертикальное меню, в котором вынесены ссылки на самые главные страницы и разделы сайта. Также есть основная часть, где располагается контент и, возможно, еще одна боковая колонка. Обязательно присутствует низ страницы, где тоже что-то размещают.
    Нам остается только разобраться, как с помощью html можно эти элементы явно задать, а потом прописать им какой-то внешний вид. Об этой, более подробной и практической части создания поговорим в следующей статье, потому что тема слишком велика, чтобы описать ее на одной странице.
    Ну а вообще, разработке сайта в блокноте – не самый удобный способ, как я уже и говорил. В дальнейшем, если вы захотите серьезно заниматься сайтостроением, то вам в любом случае понадобится более серьезная программа вместе с уроками, которые позволят изучить нужные технологии. А в следующей статье мы продолжим создание сайта с помощью html в блокноте и сделаем нашу страничку более похожей на настоящий сайт.

  4. Vinovnik Ответить

    Привет! Это мой первый сайт.
    Скопируйте приведенный код в блокнот (Notepad) и сохраните на компьютере в формате .html. Чтобы теперь посмотреть на нашу веб-страницу, откройте сохраненный файл с помощью браузера (Правой кнопкой мыши -> Открыть с помощью).
    Большинство тегов, которые используются в нашем коде уже были рассмотрены в предыдущих статьях:
    html – корневой тег документа, является контейнером веб-страницы;
    head – в этом теге указываются основные данные, касающиеся генерации веб-страницы (заголовок, стили, скрипты, мета-теги и так далее);
    body – основной тег страницы. Представляет собой “тело” документа, внутрь которого помещаются остальные теги;
    – указывает на тип документа (Doctype);
    meta – используется для указания метаданных страницы (в нашем случае тег указывает на кодировку страницы. Подробнее о мета-тегах читайте в статье Мета-теги);
    title – задает непосредственный заголовок страницы (Тег title);
    H1 – заголовок страницы/статьи (подзаголовки задаются тегами H2-H6);
    P – тег, с помощью которого выделяются абзацы в тексте страницы;
    Как показано выше, HTML-страницы сайта имеют древовидную структуру. Одни теги могут быть вложены в другие, а те, в свою очередь, – в третьи. Это означает, что структура документа определена достаточно четко. Открывающиеся теги обязательно должны иметь закрывающую пару. Немного усложним нашу страницу:
    ООО Василий Пупкин
    Информация о нашей компании

    Кто мы?

    Мы – комманда профессионалов.

    Наши услуги

    Создание сайтов

    Мы создаем по-настоящему крутые сайты.

    Продвижение сайтов

    Ваш сайт в ТОП-3 поисковых систем через 2 дня.

    Посадка картошки

    20 соток в час.

    Контакты

  5. VideoAnswer Ответить

Добавить ответ

Ваш e-mail не будет опубликован. Обязательные поля помечены *