http://siliconbank.kz/2013/01/28/site/
Сайт жасауға арналған тэгтер .
Бастамасы (Мазмұны)
Алдымен html кодтарын білуіңіз қажет, сайт жасау үшін.
Сайттың басқада тэгтері
Веб бет құрамыз
Тексттерді форматтау
Графика
Мәтіннің сілтемелері
Графикалық сілтемелер
Сайттың мета тэгтері
Алдымен HTML Кодтарын зерттеп біліп алыңыз
WEB беттерін құруға арналған көптеген программалар бар: Блокнот, FrontPage, Notepad++, SublimeText, wyziwig, wordart. Соның ішінде ең қарапайым Блокнот арқылы жазып бастаңыз алғашқыда. Блокнотты ашу үшін пускке кіріңіз - стандартные – Блокнот. Осы блокнотқа әр-түрлі кодтарды жазып, қандай функция атқаратын зерттеп біліп алыңыз. Мен өзім көбіне SublimeText және Notepad++ тексттік редакторларын қолданамын.
Сайттың ТЕГтері
Тегтер – бұл программалық метка, сіздің веб бетіңіздің HTML кодтарын, графикалық түрге өзгертіп, браузерден көрсетуге арналған.
Тег екі түрлі болады – жұп және жалғыз, то есть жабылатын тег және жабудың қажеті жоқ тег. Барлық тег мынандай скобкалардың ішіне жазылады <тег>. Егер тегтің сыртынан бұндай скобка салынбаса, онда браузер бұл тегтің функциясын орындай алмайды, сондықтан тег жазарда міндетті түрде скобканың ішіне жазыңыз. Скобканың ішіне жазылған текст, браузерде адамдарға көрінбейді, ол тек белгілі бір функцияларды атқаруға арналған. Егер скобка дұрыс жазылмаса, онда тегіңіз браузерден обычный текст ретінде көрініп тұрады.
Жұпты тегтер ашылатын <html> және жабылатын </html> тегтерден тұрады. Тегті жабу үшін, скобканың ішіне, тегтің алдына косой / салынады.
Барлық ақпараттар, тексттер, графика және суреттер, жұпты тегтің ішіне жазылады.
Тегтер арқылы тексттің түсін және оның түрін өзгертуге болады, және басқа сайтқа өтетін сілтеме жасауғада болады.
Қарапайым веб бет құрайық HTML.
Жай ғана HTML бетін құру үшін, ешқандай арнайы программасыз, блокнотты қолданыңыз txt форматында, немесе WordPad, Сонда сайттың негізгі тегтерін жазыңыз:
<html>
<head>
<title>Осы жерге тақырыбын жазасыз</title>
</head>
<body> Ал бұл жер сайттың денесі, осы тегтің ішіне барлық информацияны саласыз </body>
</html>
Блокнотты жабыңыз, алдымен сақтап алыңыз – Сохранить как – имя – форматы - txt форматының орнына htm немесе html деп жазыңыз, астыңғы жақта кодтау жүйесін өзгертіңіз. Ansi деп түрады, соны utf8 деп қоясыз. Осымен алғашқы шағын веб бет құрылды, енді соны браузермен ашып көріңіз. Бетте жаңағы body тегінің ішіне жазған тексттер, суреттер көрінеді.
<html> </html> - бұл ашылатын және жабылатын тег, бұның ішіне барлық HTML документтер жазылады. Бұл тегтердің ішіне жазбай, сыртына текст жазатын болсаңыз, браузер ол текстті көрсетпейді немесе қате деп шығып тұрады.
<title>Документ</title> - Бұл документтің атын жазуға арналған тег. Браузерді ашқанда вкладкада көрініп тұрады.
<head></head> - бұл қызметтік тег, Бұнда ақпараттық тегтер, мета тегтер жазуға арналған. Поисковиктер, роботтар, боттар осы тегтің ішіне жазылған кілтті сөздер арқылы іздейді ақпаратты.
<body></body> - документтің денесі, негізгі ақпараттың барлығы осы тегтің ішіне салынады.
<html> <head> <title>Документ</title> </head> <body> Текст </body> </html>
Болды, қарапайым веб бет құруға осы тегтер қолданылады, сақтағанда атын index.html деп сақтаңыз.
Текстті форматтауға арналған тегтер
Осы тегтер арқылы тексттің шрифтін, стилін, сайтта орналасу бағытын өзгерте аласыз.
Келесі абзацқа өтуге арналған тег <br>
Абзацты түзету, бағытын өзгерту:
<p align="left">абзац сол жақтан басталады...</p>
<p align="right">абзац оң жақтан басталады...</p>
<p align="center">абзац ортасынан...</p>
<p align="justify">абзац жайылмалы болып келеді, тексттер бір абзац ішіне созылмалы түрде болады...</p>
Шрифттің размері
<p><font size="1">Шрифт 1</font></p> ең кіші шрифт
<p><font size="2">Шрифт 2</font></p>
<p><font size="3">Шрифт 3</font></p>
<p><font size="4">Шрифт 4</font></p>
<p><font size="5">Шрифт 5</font></p>
<p><font size="6">Шрифт 6</font></p>
<p><font size="7">Шрифт 7</font></p> ең үлкен шрифт, осылай үлкейіп кете береді.
Шрифттің түрі
<p><strong>Қою текст, жирный</strong></p>
<p><em>Курсив</em></p>
<p><u>Асты сызылған текст</u></p>
<p><strike>Сызып тастаған текст</strike></p>
<center>Ортаға қою текстті</center>
<p><strong><em>Қою және курсивті текст</em></strong></p>
<p>Жоғарғы <sup>индекс</sup></p>
<p>Төменгі <sub>индекс</sub></p>
Шрифттің түсі
<p><font color="#ff0000">Қызыл түс</font></p>
Негізгі түс және олардың кодталуы.
000000 — қара, FFFFFF — ақ, FF0000 — қызыл, 00FF00 — жасыл, 0000FF - көк, FF00FF — фоилетовый, FFFF00 — сары, 00FFFF — аспан түстес көк.
Басқа түстің коды керек болса, фотошоп программасы арқылы білуге болады. Фотошопта түс таңдаған кезде, қасында түстің коды жазылып тұрады, соны тек көшіріп аласыз.
Тақырып аты. Заголовка.
Загаловка деген поисковый роботтар ақпарат іздегенде табылатын текст. Тексттің размері үлкен болған сайын, роботтар анық көреді.
<h1>Заголовок 1 үлкен размер</h1>
<h2>Заголовок 2 одан кішірек</h2>
<h3>Заголовок 3 оданда кішірек</h3>
<h4>Заголовок 4 кіші текст</h4>
<h5>Заголовок 5 ұсақ (майда, уақ) текст</h5>
<h6>Заголовок 6 кіп-кішкентай</h6>
ГРАФИКА
Суреттер және анимация қою үшін келесі тегтер қолданылады.
alt – суреттің описаниясы. Суретке курсорды жақындатқанда, суреттің описаниесі шығады.
<p><center><img src="сурет.jpg" alt="Бұл жерде суреттің описаниесі"></center></p>
Веб беттің фоны.
Сурет «img src» және фон «background» .
<body background="fon.jpg"><p><img src="сурет.jpg" border="1"></p></body>
Суреттің размерін өзгерту <img src="img/сурет.jpg" width="100" height="82">
Текстті сілтемеге айналдыру
Гипперсілемелердің түріне байланысты, түсіде әр түрлі болады. link, vlink, alink,
link – гипперсілтеме, әлі қаралмаған, то есть сайт қолданушысы әлі баспаған сілтеме. Көбінесе көк түсті болып келеді.
vlink - уже кірілген сілтеме, фиолетовый түс.
alink - активный гипперсілтемені белгілейді.
<a href="index.html">Басты бетке өту</a>
<a href="qonaq_kitapshasy.html"> Қонақ кітапшасы </a>
<a href="http://www.siliconbank.kz">Жантурин Нурберген жеке блогына өту</a>
Графикалық сілтеме
Сурет және анимацияларды сілтеме ретінде қолдануға болады.
<a href=" http://www.siliconbank.kz "><img src="rita500x80.gif" width="500" height="80" border="0" />
МЕТА ТЕГИ
Мета тег <META> , <head> тегінің ішіне салынады. Бұл тегте сайттың описаниесі, кілт сөздер, автор туралы ақпараттар, іздеу роботтарына арналған ақпараттар.
<META NAME="Keywords" CONTENT="Кілт сөздер, сайт, жасау, домен, хостинг">
Аз ғана қулықтар )
Жүгіртпе жолақтары. Бегущая строка
<marquee behavior="scroll" direction="left"> Жүгіртпе жолақтары </marquee>
<marquee behavior="alternate" direction="right" loop="30" scrollamount="10"> Жүгіртпе жолақтары 2</marquee>
<marquee behavior="scroll" direction="left" scrolldelay="500" bgcolor="#00ff00"> Жүгіртпе жолақтары 3</marquee>
Қорытынды
Міне менің білетіндерім осы. Басқада тегтер көөөп, бірақ сізге айтарлықтай қатты білмеймін. Сайттың версткасын жасауға арналған жақсы программа бар Macromedia Dreamweaver 8.0 деген, осыны қолдануларыңызға да болады, мен өзім әлі дұрыс білмеймін. Сіздің сайт жасап үйренуіңізге көмегім тиер деген үміттемін!!!
http://siliconbank.kz/2013/01/28/site/
