Как да програмираме на HTML?

Какво е HTML ?

HTML ( Hypertext Markup Language - език за маркиране на хипертекст ) представлява поредица от стандартни кодове и конвенции, проектирани за изработка на Web страници и акцентиране на текст или картинки изобрзявани в Web браузъри (Internet Explorer, Mozilla Firefox, Opera и други). Чрез HTML, можете да направите Web страница, съдържаща форматиран текст и команди, който карат браузъра да зарежда и показва изображения или мултимедийни елемнти като например клипове, звук и анимации.

От името му "Hypertext Markup Language" става ясно, че това е език за маркиране и това е главната разлика от езиците за програмиране (като например PHP). Като цяло HTML представлява набор от инструкции, който "казват" на браузъра как трябва да показва текста, изображенията и мултимедийните елемнти на страницата. В повечето случаи това се прави чрез използването на команди.

Докато в документите на Word изображенията са вградени като част от документа, HTML документа съдържа само команди (чист текст), които сочат към местоположението на деден файл или изображение.

Някои хора си мислят че програмирането на HTML е трудно и изисква много познания, но това въобще не е вярно. Сега ще ви обясня кратко и ясно как стават нещата..


Стъпка 1

За да се научите по-бързо и зада ви е по-лесно си изтеглете DreamWeaver 8 от сайта на Adobe.

Директен линк: http://www.adobe.com/products/dreamweaver/

Сега, когато сте инсталирали програмата я стартирайте. Ще ви се покаже прозорец в който програмата ви пита какъв файл да редактирате (горе Create new). Изберете HTML.

Ще ви се появи това:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>


<body>
</body>
</html>



Стъпка 2

Да започнем да редактираме кода!

На мястото между <title></title> поставяте името на вашия сайт.

например: <title>My Site</title> Вашият сайт ще се казва My Site.

Ако желаете да сложите цвят за фон на страницата въведете този код под заглавието:

<!--
body {
background-color: #99CC99;
}
-->
</style></head>



Стъпка 3

Е.. завършихме с изгледа на страницата. Сега да започнем с въвеждането на текста.

На мястото реда между <body> и </body> въведете желания текст. Трябва да се получи така:

<body>
<p>ТЕКСТЪТ КОЙТО ЖЕЛАЕТЕ ДА НАПИШЕТЕ!</p>
</body>


Готови сме и с въвеждането на текста. Сега ще ви покажа и начин за вмъкване на снимка.

1-во избирате си снимка от компютъра. Като изберете снимка въведете тозитекст под <p>ТЕКСТЪТ КОЙТО ЖЕЛАЕТЕ ДА НАПИШЕТЕ!</p>

<p><img src="ime_na_snimka.jpg" alt="My image" width="350" height="20" /></p>

Трябва да ви се получи така:

<body>
<p>ТЕКСТЪТ КОЙТО ЖЕЛАЕТЕ ДА НАПИШЕТЕ!</p>
<p><img src="ime_na_snimka.jpg" alt="My image" width="350" height="20" /></p>
</body>


Е.. и с това сме готови. Сайтът е завършен. Сега натиснете „File>Save“ изберете място където да запишете файла и поставете снимката там където се намира вашият сайт. Името на файла на вашия сайт го кръстете „index.html“. Вашият сайт е готов само остава да го качите на някой сървър в интернет. ОЧАКВАЙТЕ ОЩЕ УРОЦИ ЗА HTML.

ТОВА Е ЗАВЪРШЕНИЯТ КОД НА САЙТА:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>ЗАГЛАВИЕТО НА ВАШИЯТ САЙТ</title>
<style type="text/css">
<!--
body {
background-color: #99CC99;
}
-->
</style></head>

<body>
<p>ТЕКСТЪТ КОЙТО ЖЕЛАЕТЕ ДА НАПИШЕТЕ!</p>
<p><img src="ime_na_snimka.jpg" alt="My image" width="350" height="20" /></p>
</body>

</html>



УСПЕХ!

Добави коментар

Трябва да сте регистриран потребител, за да коментирате материалите.

Коментари

Цветан ( 2) на 20 Март 2012
Освен че са сложени малко тагове е добавен и CSS. Да CSS много често върви с HTML, но е по - добре първо да се научат обикновени неща като таблици, форми и т.н.
Записки.инфо ( 2777) на 07 Януари 2007
Ами, да, трябва да се направи по-подробно.
Петър Г. Славчев ( 538) на 05 Януари 2007
Хм, струва ми се има и доста още други моменти, на които трябва д асе обърне внимание. Не сте ли съгласни?