HTML ШАБЛОНЫ САЙТОВ
Современные готовые адаптивные HTML 5 шаблоны.
Откройте для себя мир современных и оригинальных шаблонов сайтов...
АДАПТИВНЫЕ ШАБЛОНЫ шаблоны сайтов
Независимо от устройства, Вам будет удобно пользоваться сайтом.
Изображения будут большими, а текст четким! шаблоны сайтов

Ступенька 10-ая.

Ступенька 10-ая. 

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

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

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

Теперь я с чистой совестью поведаю вам, как вставлять картинки в документ: 

<img src="/my.jpg"> 

Вместо my.jpg мы можем подставить имя любой картинки (me.gif, main.png). Самое главное понять, что все расположенное между кавычками - ссылка (путь к картинке). Наш пример говорит о том, что картинка лежит в том же каталоге (директории, папке), в которой лежит и наш документ. Если картинка лежит в поддиректории (в папке, которая лежит в вашей основной папке), то ссылка на неё будет выглядеть так: 

<img src="/my/my.jpg"> 

Если картинка лежит на уровень выше, а документ находится в поддиректории, то ссылка на неё будет такой: 

<img src="/../my.jpg"> 

Если картинка лежит на другом сайте, то путь прописывается полностью: 

<img src="http://www.homepage.ru/my/my.jpg"> 

Для вашего удобства кладите картинку в ту же папку, что и документ, тогда путаницы будет меньше:) Также я хочу обратить ваше внимание на то, что MY.jpg, my.JPG, my.jpg и MY.JPG – это разные имена файлов. Никогда не забывайте, что регистр нужно учитывать.

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



     
<html>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<div align="center">
<H3>Здравствуйте, это моя первая страница.</H3>
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </div>
<p align="justify">
<img src="/primtocodephoto.gif"> Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появится <b> еще один виртуальный друг? :)</b>
</p> 
</body>
</html> (посмотреть)



Посмотрите, что у нас получилось. Не очень симпатично, не так ли? Было бы лучше, если бы текст аккуратно располагался, например, сбоку от картинки. Идем дальше, чтобы узнать, как это сделать. 

 

 
Please enable / Bitte aktiviere JavaScript!
Veuillez activer / Por favor activa el Javascript!

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

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

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

Скачивайте бесплатные HTML шаблоны сайта и создавайте свои проекты в кратчайшие сроки.