Сайт жасау техналогиясы

<td>5-шіұяшық, 2-шіқатар, 2-шібағана</td>

<td>6-шіұяшық, 2-шіқатар, 3-шібағана</td>

</tr>

</table>

</body>

</html> 

 

Графикалық және мультимедиалық объектілері үшін арнайы тәгтер

Дыбыс,күй,видеоклиптарды енгізу үшін арнайы тәгбар:<img>. 

HTML құжаттарында графиканы қолданудың екі түрі бар:

1)     Графиканы мәтінге енгізу.

Мәтінге сурет қою үшін келесі команданы  қолдану керек:<imgsrc=”url”>. Міндетті атрибут src=”url”көрсеткіге сурет қайда орналасқанын көрсетеді. Сурет көрсеткі қолдайтынграфиктік форматта сақталуы керек. Қазіргі кезде көрсеткілердеgif және jpg(jpeg) форматтары қолданылады. Адрес (url) абсолютті және салыстырмалы болады.

2)     Сурет “картасын”қолдану.

Суреттің белгілі аймағын басқан кезде басқа адреске қатынау бар болу үшін келесі конструкцияны қолдану керек:

<imgsrc=”url”usemap=”#name”>

url орнына графиктік файл адресі жазылады, ал name орнына – карта сипаттамасыбелгісі. Карта сипаттамасы экранда көрінбейді және html-файлыныңкез-келген жерінде орналасады. Карта сипаттамасы келесі командалар арасына қойылады:<mapname=”name”>…</map>.

Көрініп тұрғандай, картаны сипаттауда тек белгісі жазылады, ал суретті қоюда # қосымша жазылады.

Картаның активті облыстарын сипаттау келесі командалар арқылы іске асырылады:<areahref=”url”shape=…coоrds=”…”>. shape атрибуты coоrds-пен бірге облыс формасынкөрсетеді. Ол rect,circle,poly  мәндерін қабылдайды.

1) rect – тікбұрыш;coоrds =”x1,y1,x2,y2”x және y жоғарғы сол және төменгі оң бұрыштар координаталарын береді.

2)  circle – шеңбер;  coоrds =”x0,y0,r”x0 және y0 – центр координаталары,r – радиус.

3)     poly – көпбұрыш;coоrds =”x1,y1,x2,y2,x3,y3...” x және y – төбе координаталары.

Соңғы жылдарда Web құжаттарында белсенді компоненттер жиі қолданылады. Ол объектілер тек мәтіндік,графикалық,мультимедиялық мәліметтерде ғана емес,программалық кодтардан да тұрады. Белсенді компоненттер басқа біреудің компьютерінде бұзушы қызмет жасамас үшін, олар көрсеткінің барлауымен қолданылады.

Графикалық немесе басқа объектілердің  мәтінге кіруі,HTMLтәгінің көмегімен іске асады.HTMLтәгінің көмегімен іске асатын Web құжаттарының басты белгісі гипермәтіндік сілтемелер.

ОсылайшаWWW серверлерінде сақталып жатқан көптеген гипермәтінді электронды құжаттар жиынтығы өзіндік бір құжаттардың гиперкеңістігінқұрайды.Web-кеңістікте құжаттар арасындағы кеңістікті Web-серфинг деп атайды.

Web құжаттар аралығын мақсатты бағыттау Web навигациялар деп аталады.

Интернеттің физикалық серверінде сақталып жатқан жүздеген миллион құжаттың гипермәтіндік байланысы Web кеңістігінің болуының логикалық негізі.

Әрбір файлдың толық аты, оған аты және файлға қалай енгізуге болатыны туралы мәлімет сақталады. Бүкіл әлемдік тізбекке дейін даму мүмкіндігі бар. Бүкіл әлемдік масштабта кез келген файл мекен-жайыресустықунифицияланғанURL көрсеткішпен анықталады.

Гипермәтіндік байланыстар  орнату 

 

 

  Бұранғы ФНИ.НТМ файлын Web – парақтың алдыңғы жағына жазылатын  апта күндерінің аттары жазылған кестелермен  толықтырайық.

Ол үшін:         

<FONT COLOR=”RED SIZE” =”6”  FACE=”KZ ARIAL””>        

<B>ФНИ  - 1 топтарының  сабақ кестесі  </B>        

<FONT></P><BR> жолдарынан  кейін мынадай тәгтер тізбегін  жазайық:          

<TABLE WIDTH=100%>

<TR>

<TD> Дүйсенбі  </TD>

<TD> Сейсенбі </TD>  

<TD> Сәрсенбі </TD>  

<TD>Бейсенбі </TD>  

<TD> Жұма </TD>  

<TD> Сенбі </TD>  

</TR></TABLE>

<BR>

Бұл фрагменттен кейін (RASP.HTM файлында) Дүйсенбі   сөзіне сілтеймін белгі қоямыз, яғни <B> Дүйсенбі   </B></FONT> сөздері орнына:

… <B><A NAME=”ДС”> Дүйсенбі  </A></B></FONT > … сөздерін жазу керек.

Енді кесте ішіндегі  Дүйсенбі   сөзіне гиперсілтеме жасаймыз, яғни <TABLE WIDTH=100%><TR><TD> Дүйсенбі   </TD>  <TD> Сейсенбі </TD>  <TD> Сәрсенбі </TD>  <TD> … сөздері орына:

<TABLE WIDTH=100%>

<TR><TD><A HREF=”#ДС”>Дүйсенбі  </A></TD>

<TR><TD><A HREF=”#CС”> Сейсенбі </A></TD>

<TR><TD><A HREF=”#CP”>   Сәрсенбі </A></TD> сөздерін жазамыз. 

 

HTML гипермәтіндік тілін оқытқаннан кейін оқушыларға WEB сайтты безендіруге арналған CSS стильдер тілін оқытқан жөн. Оқушы тек бетті құрастырып қоймай қолданушының көзінің жауын алатын WEB парақтың дизайнын да тартымды қылып жасауы міндетті.

CSS технологиясы: жалпы көзқарас

"Каскадты кесетелер стилі"атауы«Cascading Style Sheets» ағылшын сөзінен шыққан, CSS аббревиатурасы болып табылады. Алғашқы стиль HTML 4.0 пайда болған, яғни ол HTML-дің элементтерін анықтау үшін және құжаттардағы мәселелерді анықтау үшін арналған.Стильдер әдетте стильдердің кестелерінде сақталады: HTML-құжаттардың ішінде жәнедеcss-тің кеңейтілген арнайы файлында сақталуы мүмкін. Әртүрлі файлдарда стильдердің кестелерін  сақтауды қолданса, анағұрлым жұмыстың көлемін қысқартады.Сонымен бірге бірнеше стильдерді анықтауға болады,яғни олар белгіленген ережелерге бағынып, каскадты түрде белгілі бір стильді көрсетеді.

CSS-ты қолдану мысалы

CSS көмегіменәртүрлі стильдердің  қорытындыларын енгізу арқылы  HTML құжаттарын  шығаруға болады. 

 

Мысал. Бірнеше стильдер кестесін  алайық:

Style1

p{color: blue; font-style: italic;

margin-left: 20pt;}

ol,ul,li{list-style: circle;

font-family: arial; }

a:link    {color:black}

a:visited {color:black}

body{background-image: url("http://www.intuit.ru/departament/picture.gif")}

Style2

h1,h3,h6{margin: 20pt;}

h1,h2,h3,h4,h5,h6,p,ol,li{font-family: arial, "sans serif";}

p,table,td,ol,ul{font-style: oblique;}

:link {COLOR: blue;}

:visited {COLOR: blue;}

a:active {COLOR: black;}

a:hover {COLOR: black;}

a.myln:link {COLOR: olive;}

a.myln:visited {COLOR: olive;}

a.myln:active {COLOR: teal;}

a.myln:hover {COLOR: teal;}

Style3

p,ol,ul

{font-style: italic;

margin-right: 20pt;}

p,h1,h6  {font-family: "comic sans ms", arial, "sans serif"; }

p,th{font-size: 20%}

table {background-color: blue}

body {background-color:#FFF000}

p,ol,ul {color:green; }

:link    {color:blue}

:visited {color:blue}

:active  {color:green}

:hover   {color:green}

Style4

:link     { color:red }

:visited  { color:red }

:active   { color:yellow }

:hover    { color:yellow }

body{background-color: #FAD123;}

h1,h2,h6{margin-left: 20pt;

color: blue;}

h3,h4,h5{margin-left: 10pt;

color: green;}

p,h1,h3{font-size: 150%;}

p,h1,h2,h3,h4,h5,h6,table

{font-family: arial;}

p{margin-left: 30pt;}

Style5

p,h1,h2,h3{font-size: 75%;}

table,h4,h5,h6,li

{font-family: arial, "sans serif";

margin-left: 20pt;}

body{background-color: #F2FF2F;}

ol,ul {color: 12a45d;}

:link    {color:brown}

:visited {color:brown}

:active  {color:blue}

:hover   {color:blue}

Біртіндеп осы стильдердің  үнемі бір құжатқа қолданып отыру, оның ұсынысын өзгертуге болады

Стильлердiң арналуы.

HTML тiлі құжаттың мазмұнын сипаттау  үшiн жасалған. Оның тегтерi «Заголовка», «Параграф», «Таблицы» (<h1 >, <p >, <table > және тағы басқалар)анықтауы үшiн арналды . Бастапқыда құжаттардың ұсыныстары үшiн қандай болмасын қалыптаудың тегтерi ескерiлмедi, яғни құжаттың ұсынысы туралы браузер ойластырады деп есептедi.

Бірақ бұлбастапқы  HTML –діңNetscape және Internet Explorer браузерлердің спецификациясына әкелді  (Мысалы: тег <font> және  атрибут color) және  өзіндік тегтер мен атрибуттарды жасау процесін тудырды, бұлHTML құжаттарының мазмұны  көрсетілген құжаттың деңгейінен әлдеқайда  бөлек болған Web-сайттардың жасалуын қиындай түсірді.

Но это породило процесс  создания своих тегов и атрибутов  к исходной спецификации HTML-браузерами Netscape и Internet Explorer (такие, например, как  тег <font> и атрибут color), что затруднило создание Web-сайтов, на которых содержимое документов HTML было четко отделено от уровня представления документа.

Бұл жағдайдаHTML- дің стандартизациясына жауаптыкоммерциялық емес ұйым - W3C (World Wide Web Consortium ) консорциумы  - HTML 4.0 стандарттың өңдеуiнiң барысында каскадты кестелердің стилін жасады.

Сайып келгенде, iшiндегi құжаттың бөлiнуi және оның ұсынысының қажеттiлiгi CSS технологияның ұйымдасуына алып келдi.

Бұл технологияны бүгiн (Internet Explorer, Mozilla Firefox, Opera тағы басқалар) барлық негiзгi браузерлердi қолдайды.

Стильдердiң кестелерi жұмыс  көлемi айтарлықтай қысқарта алады

Стильдердiң кестелерiHTML элементтерiнiң қорытындыларын айқындайды. (Мысалы, fontтың тегi жәнеHTML 3.2-дегі  colorатрибуты). Айтылып өткендей, каскадтыстильдердiң кестелерi әдетте css  кеңейтілуi бар сыртқы файлдарда сақталады. Бұл әдiстің қолайлығы сырт пiшiнi мен Web-тағыбарлық қажеттi беттерiнiң құрастырылымын өзгертуге болады, яғни CSS-тың бiр ғана  құжаты редакциялайды.

Өңдеушi стильлер келесi әдiстермен  анықтай алады:

HTML-дің iшiндегі жалғыз  элементi

HTML бетіндегі<head > элементтiң  iшiнде

CSS-тың сыртқы файлында.

Стильдердiң қолдануының  басымдылығы

Каскадтыстильдердiң кестелерi үшiн қолданудың басымдылықтары анықталған. Егерде HTML-дің элементi үшiн бiр  стильден көп стиль анықталса, онда барлық стильдердiң кестесi кезекпен «каскадталған» және де жаңа «виртуалды»  стильдер кестесі  болады, келесi ережелерге сәйкес:

браузер үнсіз келісім  бойынша қолданылатын стильдер;

сыртқы кестеде сақталатын  стильдер;

стильдердiң iшкi кестеде  сақталған стильдері(iшiнде <head > тега);

кiрiстiрiлген стиль(HTML элементтiң iшiнде).

Бұл ережелер стильдердiң  басымдылықтың ұлғаюының ретілігін  анықтайды.

Сайып келгенде, кiрiстiрiлген стиль(HTML элементтiң iшiнде) ең жоғарғы  басымдылық болады, яғни <head > тегіндегі  жариялайтын стиль сыртқы стильдердiң  кестесi немесе браузерде қайта анықтайды.

PHP ден методикалық кешен  HTML гипермәтіндік тілі мен CSS стильдер  тілін оқытқаннан кейін барып  қана оқытылады. Онда да алдымен  теориялық материал содан кейін барып сабақты бекітетін практикалық сабақтар беріледі.  

PHP web программалау тілі   

PHP әзірлеушілерге икемдігімен  де ерекшеленеді. Өйткені, HTML, JavaScript, WML, XML тілдерімен үйлесіп жұмыс  жасайды. PHP-де сценарийлер браузерлерде, сондай-ақ ұялы телефондарда, электронды  жазу кітапшаларда, пейджерлерде, портативті  компьютерлерде де жіберіледі. 

Referat911.ru

Войти  Поиск  Новые работы  Служба помощи

РубрикаторИнформатика

Сайт  жасауды оқыу әдістемесі

Дата поступления: 27 Февраля 2013 в 19:39 
Автор работы: N**********@mail.ru 
Тип: дипломная работа

Скачать полностью (1.06 Мб)

Прикрепленные файлы: 1 файл

Скачать документ  Просмотреть файл  

редактированная.docx   

—  1.11 Мб  

PHP-де белгілі бір уеб-серверге  арналған код жоқ, яғни қолданушылар  белгілі бір сервер түрлерімен  шектелмейді. Apache, Microsoft IIS, Netscape Enterprise Server, Stronghold және Zeus сияқты серверлердің  бәрінде жұмыс жасай алады.  Негізі жоғарыдағы серверлердің  барлығы әр қилы платформаларда  жұмыс істейді. Әйтсе де, PHP платформаға  тәуелсіз болғандықтан UNIX, Solaris, FreeBSD, Windows 95/98/NT/2000/XP/2003 және тағы басқа  да платформалардың бәріне қол  жеткізе алу мүмкіндігіне ие. 

Бірінші бағдарлама   

 Егерде сіз PHP тіліне  қатысты болатын серверді және  интерпретаторды орнатып болсаңыз, first.php файлын құрамыз. Содан кейін  бірінші PHP-де бағдарламамызды  жасауды бастаймыз.  

<html>

<head>

<title>Бірінші PHP бағдарлама</title>

</head>

<body>

<?php

echo "<p>Сәлем, Әлем!</p>";

?>

</body>

</html>

first.php файлын сақтап, локальдық серверде D:\server\www\ сілтеме бойынша папкаға орналастырамыз. Браузердің іздеу қатарында тексеріліп жатқан файлдың http://localhost/first.php URL адресін жазамыз. Егерде бәрі дұрыс жасалып, php интерпретатор кодты анализдеп, браузерге мына кодты жібереді:

<html>

<head>

<title>Бірінші PHP бағдарлама</title>

</head>

<body>

<p>Сәлем, Әлем!</p>

</body>

</html>   

PHP тілі HTML құжатты тікелей енгізеді, бұның үшін құжаттың кеңейтуі .html болуы шарт емес, кеңейтуі .php болады. символдары скрипттің басталуын және аяқталуын білдіріп, оны құжаттың қалаған жерінде қолдануға болады. PHP сценариі сервер жақта амалға асып, яғни сервер құжатты скриптпен қабылдайды, ал браузер болса тек ғана HTML код қайтарады. Уеб бет PHP-мен жасалды дегені оның функционалдығы және браузерде адрес іздейтін орында .php  кеңейтуімен қолдануын білдіреді. 

 

Синтаксисі және негізгі түсініктер