Как Вы проводите свое время в Интернете?
В основном, ищу нужную информацию
Читаю новости, блоги
Работаю
Развлекаюсь
Играю в онлайн игры
Общаюсь, обмениваюсь информацией
Ищу и скачиваю кино и музыку
Общаюсь в социальных сетях
Популярное
     
    » » Как создать свой первый сайт
    0
    Как создать свой первый сайт

    Создаем простую html-страничку

    Страницы сайта могут быть созданы в любом текстовом редакторе при помощи языка разметки документа HTML. Откроем блокнот notepad и напишем:

    <html>Это мой первый сайт. </html>

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

    Теперь запомним файл под именем index.html в новой папке, которую вы создали специально для файлов своего сайта (папку можно назвать, на пример, "site").
    Откроем файл index.html с помощью броузера (на пример, Microsoft Internet Explorer). Мы увидим такую картинку:


    Рис. 1. Наша первая страница.

    В HTML существует множество других ярлыков (тэгов). В ярлыках можно использовать как строчные, так и прописные буквы.
    Тэги бывают открывающие и закрывающие (с косой чертой "/"). На пример, тег </html> - закрывающий.
    Для некоторых тегов наличие парного закрывающего тега не обязательно.

    Как правило в html-страницах используется несколько обязательных тегов. Среди них ярлык <head> (и закрывающий </head>) для описания заголовка html-страницы. Здесь можно указать название страницы. Название должно быть помещено между тегами <title> и </title>. На пример:

    <title>Личная страница дизайнера Николаенко</title>

    В стандартных броузерах заголовок будет показан в верхней части главной рамки основного окна, как на рис. 1.
    Поскольку тэг <title> располагается в самом начале html-файла, то при загрузке страницы в первую очередь загружается именно заголовок документа. Далее броузер загружает основное содержание страницы, что может занять некоторое время. Таким образом, некоторое время название страницы будет единственной информацией о ней, видимой посетителю сайта.

    После заголовка мы используем другую пару тэгов: <body> и </body>, между которыми располагается основной текст документа. Таким образом, html-код страницы выглядит сейчас так:

    <html>
    <head>
    <title>Личная страница дизайнера Николаенко</title>
    </head>
    <body>
    Это мой первый сайт. 
    </body>
    </html>

    Форматирование текста

    Для примера мы скопировали первый попавшийся текст на новостном портале и вставили этот текст в наш файл после тегов <body>. В окне броузера мы видим сплошной неформатированный текст.


    Рис. 2 - Неформатированный текст.

    Текст гораздо лучше смотрится, если он разбит на абзацы. В html-документах для этого существует тэг <p> (и парный к нему </p>).
    Тэг <p> может задаваться с параметром горизонтального выравнивания align, который может иметь следующие значения:
    left - выравнивание по левой границе окна броузера.
    center - выравнивание по центру окна броузера.
    right - выравнивание по правой границе окна броузера.
    justify - выравнивание по ширине (растягивание по двум сторонам окна броузера).

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

    Еще для форматирования текста чаще всего применяются парные тэги:
    <b> и </b> - отображает текст полужирным шрифтом. 
    <strong> и </strong> - используется для выделения важных фрагментов (н.п. заголовков) текста. Броузеры обычно отображают текст между тэгами полужирным шрифтом.
    ...

    После форматирования текста наша страничка будет выглядеть вот так:


    Рис. 3 - Форматированный текст.

    В текст можно вставить также картинку(и). Отберите картинки или фотографии, которые планируете выложить на свой сайт, уменьшите их до желаемого размера в любом графическом редакторе и поместите уменьшенные картинки в папку site (можно даже создать для картинок сайта подпапку img или image).
    Для того, чтобы вставить в текст картинку, существует тэг <img>.
    На странице с текстом вставьте там, где хотите, чтобы была картинка, следующую строчку:
    <img src="картинка1.jpg">


    Рис. 4 - Картинка в тексте.

    Если вы хотите, чтобы картинка находилась справа или слева от текста, то для этого у тэга <img> существует параметр <align> со следующими значениями:
    left - изображение прижимается к левому полю окна, текст обтекает изображение с правой стороны
    right - изображение прижимается к правому полю окна, текст обтекает изображение с левой стороны

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

    Связь между страницами

    В предыдущем абзаце в тексте встречалась ссылка (линк) на другой сайт. Для этого используется парный тэг <a> и </a>.

    На пример, так: <a href="http://ho.com.ua/photo/">здесь...</a>

    Активная ссылка в тексте выделяется другим цветом и часто подчеркиванием.

    С помощью тэга <a> можно также ссылаться не только на другие сайты, но и на страницы своего сайта.
    На пример, создадим вторую страницу и назовем ее photo.html. Создавать новые страницы можно просто копированием уже существующего файла, но с другим именем. Главное - аккуратно изменить не только текст новой страницы, но и ее заголовок (заключенный между тэгами <head> и </head>).

    Разместим на новой странице какие-то картинки. Это можно сделать вручную или с помощью программ, описанных здесь... А на первой (главной) странице поставим ссылку на вторую страницу, для этого добавим такую строчку:
    <a href="photo.html">Мои работы можно посмотреть здесь...</a>.

    Вот что получится:


    Рис. 5. Ссылка в тексте.

    Здесь стоит отметить, что на сайте только одна страница может называться index.html - главная. Когда посетитель придет на ваш сайт, она загрузится первой.

    Если вы, на пример, создали фотогаллерю с помощью какой-то программы, то нужно проверить названия страниц и в случае необходимости переименовать их. Важно: изменяя имена html-файлов, нужно менять и ссылки на них в других страницах.

    Как выложить свой сайт в Интернет

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

    Для того, чтобы разместить свой сайт на Хостинге Обыкновенном, нужно зарегистрировать для него логин. Как это сделать, можно прочитать в нашем FAQ-е (от англ. ответы на часто задаваемые вопросы):
    Заказ хостинга (заполнение формы заявки) - помощь пользователю.
    Как быстро можно приступать к работе после заказа хостинга?

    После того, как ваш логин будет активирован, можно заливать файлы на сервер, используя ftp-соединение. Сделать это проще всего с помощью броузера, н.п. Internet Explorer'а. Ввведите в адресной строке броузера один из следующих адресов:

    ftp://LOGIN@sN.ho.ua, 
    где LOGIN - ваш логин, а sN.ho.ua (s1.ho.ua, s2.ho.ua и т.п.) - имя сервера хостинга, на котором расположен ваш сайт.

    После этого в браузере появится окно, котрое запросит ваш пароль к FTP - введите его и вы получите доступ к вашей домашней директории на сервере.


    Рис. 6. Доступ по ftp с помощью броузера.

    Копировать файлы своего сайта нужно в папку htdocs. Но перед этим рекомендуем прочитать раздел FAQ "Редактирование и настройка сайта".

    Рекомендуем также посетить форум пользователей Хостинга обыкновенного, где Вы можете задавать свои вопросы.

    Поиск дешевого хостинга - Каталог и обзор лучших хостингов.

    источник

    Также рекомендуем:
    Добавить комментарий
    Имя:*
    E-Mail:
    Комментарий:
    b
    i
    u
    s
    |
    left
    center
    right
    |
    emo
    url
    leech
    color
    |
    hide
    quote
    translit
    Вопрос:
    Мальчику 15 лет, на дворе 2015 год, в котором году он родился ? (ответ цифрами ХХ00 )
    Ответ:*
    Наверх Полезные заметки при работе з компьютером - www.osopen.ru
    Все права на интеллектуальную собственность (в том числе и авторские) перепечатанных текстов имеют своих авторов и принадлежат только им.
    Публикация статьей на данном сайте НЕ является присвоением каких-либо прав на интеллектуальную собственность автора.
    Предоставленные материалы, взяты из Интернета из разных свободных источников и будут удалены по первому требованию законного правообладателя.
    Администрация сайта не несет никакой ответственности.