Сайт бетінің өлшемі
Мазмұны
Кіріспе 4
1 Сайт беттерін құруда html тілінің қолданылуы 6
1.1 HTML тілінің элементтері және Web-беттерді құру принциптері 6
1.2 Web-беттегі графика мен мультимедия 15
1.3 Сайт құрылымы. Дизайн 19
1.4 JavaScript сценарилерінің тілі 23
1.5 Интернетте Web-сайтты жоспарлау және орналастыру 30
1.6 Тэг атрибуттары және HTML құжатының құрылымы 32
1.7 Құжаттың негізгі бөлігі 36
2 HTML тілін қолданып, мектептің web-сайтын құру 39
2.1 Сайтты құруда құжаттағы мәтінді өңдеу 39
2.2 Сайт жасауда кестені пайдалану 42
2.3 Web-беттерде графиканы қолдану. Баннерлерді орналастыру 44
2.4 Web-беттерде стильдерді қолдану 44
2.5 HTML формасында мәліметтерді енгізу 47
2.6 JavaScript тілін қолдану 48
2.7 Мектеп сайтының жұмыс істеу тәсілі 51
Қорытынды 60
Қолданылған әдебиеттер тізімі 61
Қосымша А. Сайт коды 62
Кіріспе
World Wide Web бүкіл әлемдік өрмектің негізі гипертексті HTML тілі
екендігі бізге белгілі. HTML Интернет сәнінің негізі болып табылады.
Желідегі виртуальді журналдар парақтарында, теледидар бағдарламаларында,
Интернетке қатысты талқыланған әдемі суреттер, Web-парақтардың
интерактивтілігі, браузерді өңдеуші фирмалар арасындағы (Netscape және
Microsoft) қақтығыс, бизнес, ойындар және т.б. жайттар гипермәтін тілімен
байланысты деп айтуға болады.
HTML Web-парақтарды құрудың негізі болғандықтан, бейнелеу өнерінің
жаңа бағыты – Web дизайнға да тікелей қатысы бар. Суретшіге Интернетте
қарапайым әдемі суреттер салу, түпнұсқалы логотиптер, жаңа фирмалық стиль
құру жеткіліксіз. Ол осының бәрін Желіге сыйдырып барлығы қозғалыста
болатындай етіп, Web-парақтардың өзара байланысын ойластырып,
пайдаланушының істеген әрекетіне назар аударып қызықтыруы керек, ал
желідегі өзінің осы салада қайталанбас зат құруына ниетін тудыруы керек.
Веб-беттерді құруға арналған HTML тілі бүгінде кең таралған. Сонымен
қоса, қазір PHP скриптар тілі қолданылып жүр. ASP, GGI, Perl, SSI, ASP
тілдері де кеңінен қолданылмаса да, кейбір веб-беттерді осы тілдермен
құруға тура келеді. XML, XHTML және DHTML веб-программалау тілдеріне
жатпаса да, оларды толықтыруға өте пайдалы. Скриптардың ішінен JavaScript
және VBScript тілдерін айтуға болады. HTML, гипертекст тілі арқылы жұмыс
істеу өте жеңіл әрі ыңғайлы, сондықтан болар көптеген жасаушылар осы тілді
таңдайды.
Менің дипломымның мақсаты – HTML тілін пайдалана отырып, мектептің
сайтын жасау.
Міндеттері – HTML тілінің қарапайымдылығын анықтау, оның мүмкіндіктерін
қарастыру, осы тілді пайдалана отырып, сайт жасау.
ХХІ ғасыр - ақпарат пен жаңа технологиялар ғасыры. Бүгінде интернет
ақпаратты, жаңалықтарды, компания және фирма қызметін, сонымен қоса қызықты
ойын-сауықтарды және т.б. іздеуге мүмкіндік беретін құрал. Көптеген адамдар
немесе қызмет орындары өз сайттарын құруға тырысады. Себебі, әсіресе, сауда-
саттық орындары нарыққа шығудың сәтті жолдарын іздейді. Интернеттегі
сайттың өмір сүруі оның оқушыларына, қолданушы клиенттеріне байланысты.
Сондықтан, сайттың қызықты әрі толық ақпаратты бере алуы ресурс тақырыбы
қызықтырған бірнеше адамдар тобын жинайды. Яғни, аудиториясы күннен-күнге
кеңейеді және сауда-саттық орнына табыс әкеледі.
Қазіргі уақытта Web-беттерді құруға арналған көптеген технологиялар
бар. Бірақ, Web құжаттарды дайындаудың негізі болып, әрине, HTML тілі
жатады. Сондықтан, осы тілдің қыр-сырын білмей сайт жасау - анағұрлым
күрделі.
Дипломдық жұмыстың бірінші бөлімінде сайт беттерін құруда HTML тілінің
қолданылуы, құрудағы принциптері, Web-беттегі графика мен мультимедия,
JavaScript сценарийлерінің тілі, Интернетте Web-сайтты жоспарлау және
орналастыру және т.б. сұрақтар қарастырылған.
Ал, жұмыстың екінші бөлімінде мектеп сайтын жасаудың негізгі жолдары
аталып өтіледі. Сонымен қос, сайт құруда құжаттағы мәтінді өңдеу,
скриптерді қолдану, баннерлердің жасалуы, кестелердің пайдалануы, веб-
беттерде стильдердің қолданылуы қамтылған.
1 Сайт беттерін құруда HTML тілінің қолданылуы
1.1 HTML тілінің элементтері және Web-беттерді құру принциптері
Web беттерді құруға әртүрлі орталарды қолдануға болады. Олардың ең
қарапайым түрінің бірі Блокнот (Пуск Программы Стандартные Блокнот).
Мұнда жасалынған програма браузерлерде көрінуі үшін арнайы операторлар
қолданылады. Олар тілдің тэгтері деп аталынады. Құрылған файлды .html
қосымшасымен сақтайды.
HTML тэг –символдардың жиыны. Барлық тэгтар белгісінен басталып
белгісімен аяқталады.Бұл белгілердің ішінде қызметші сөздер орналасады.
Әрбір қызметші сөздің атқаратын іс-әрекеті бар. Тэгтарды жазуда бас не кіші
әріптердің айырмашылығы болмайды. HTML тілінің тэгі әдетте құжаттың бір
бөлігіне ғана әсер етеді. Бұл жағдайда жұп - ашатын және жабатын тэгтар
қолданылады. Ашатын тэг іс-әрекеттің басталуын анықтаса, ал жабатын тэг оны
аяқтауды білдіреді және онда қосымша белгісі қолданылады. Кейбір тэгтар
сол анықталған жерінде ғана қолданылады. Бұл жағдайларда жабатын тэгтар
қажет болмайды.
Ашылатын тэгтарда іс-әрекетке әсер ететін қосымша қызметші сөздер –
атрибуттар қолданылады. Кейбір атрибуттардың мәндері міндетті түрде
көрсетілуі тиіс. Ондай жағдайларда = белгісі қолданылады.
Жабылатын тэгта ешқандай атрибуттар болмайды.
Түсініктеме !-- белгілерінен басталып -- белгісімен жабылады 1.
Төменде әдеттегі Web парақтың дайындау үлгісі көрсетілген. HTML
парағының құрылымен қарастырайық.
HTML
HEAD
TITLEWeb парағының құрылымынTITLE
STYLEH2{font-family:Arbat;}
CODE{ font-family:Areal;} STYLE
META http-equiv=”Content-Type” content – “texthtml; charset=windows-
1251”
META name=”Authoer” content=”Algojina”
META name=” Keywords” content=”WWW;HTML,document,element”
HEAD
A name=”top”A
ӨтуA href=”#bottom”құжатAсоңыp
ӨтуA href=”#S001”Bсілтемеге 1BAсоңыp
p
HR
H1тақырып 1H1
H2тақырып 2H2
H3тақырып 3H3
H4тақырып 4H4
H5тақырып 5H5
H6тақырып 6H6
HR
PМұнда сілтемеBорналасқанB
A name=”S001”A
HR
PWeb-парақтың түпнұсқа мәтіні орналасуы керек
HR
A name=”bottom”AP
Құжаттың басына A name=”#top”өтуA
BODY
HTML
Егер алдындағы әртүрлі Web-парақтың мәтіндерін қарастырсақ, олардың
құрылымдарының ұқсастықтарын көруге болады. Бұны құжаттар белгілі бір
ережемен құрылады деп түсіндіріледі. HTML тілінің синтаксисінің негізіне
ISO 8879:”Information processing. Text and office systems” Standard
Generalize Marcup Language (SGML)” стандарты жатқызылады.
Ресми және шыныдығында негізделген стандарттар арасында үлкен
айырмашылық бар. HTML тілі үнемі дамып отыратындықтан оны ресми алғашқы
оқулықтармен ғана үйреніп қоймай, іс жүзінде алдағы келе жатқан өңдеуші
фирмалармен және мамандардың еңбектерін де пайдаланыңыздар. Web-парақтың
құрылымын үйрену үшін оның барлық элементтерін қарастырумыз керек. Тілдің
элементтерін қарастырғанда тегтің екі сыңары бастапқы және соңғы тегтар
келтірілге. Мысалға I және I.
Әр дайындаушы бір элементке сыңар тегті пайдалану керек. Латын
алфавитінің бас әрпін және кіші әрпін пайдаланады. Web-парақтың мазмұнын
түсіну үшін ыңғайлы болады.
HTML HTML HTML тіліндегі құжатты білдіру. Осы тегтердің Web-парақ
орналасқандықтан, бұл элемент ең сыртқы элементі. Негізінен бұл элемент
немқұрайлықпен қарастырылады version, lang және dir атрибуттары бар.
Берілген жағдайда пайдаланылмайды. Web-парақтың жалпы құрылымын анықтайтын
HEAD, BODY, FRAMESET енгізбелерін жібереді.
HEAD HEAD Web-парқтың аумағы. Басқаша айтқанда, оның бірінші
бөлімі. Алдындағы элемент сияқты HEAD элементі құжаттың жалпы құрылымын
құрастыру үшін ғана қолданады. Lang және dir атрибуттары бар, BASE, META,
LINK, OBJECT, SCRIPT, STYLE енгізбелерін жібереді.
TITLETITLE Web-парақтың тақырыбын орналастыратын элемент. Осы
элементтің ішіндегі жол құжатта бейнеленбейді, броузер терезесінің тақырып
жолында бейнеленеді. Сондықтанда, Web-парақты құрастырушы авторлар осы
жолдың ұзын болмауын қамтамассыз ету керек.
BODY элементінің ішіне Web-парақтың дизайнына арналған элементтерді
жазуға болады. Сәйкесінше бұл элементтің соңғы тегін құжаттың соңына
жазады. Бастпақы тег ішінен парақты түгелдей өзгертетін атрибуттарды
жазуға болады. Дизайнда пайдалы атрибут парақтың фонын анықтайтын атрибут
2.
Background=”файл фонына жол” немесе қарапайым түрі bgcolor=”#RRGGBB”
Қызыл және жасыл, көк түстердің реңін анықтайтын, фонның түсі үш, екі
топты, он алтылық санмен беріледі. Жоғарыда келтірілген атрибуттар баламалы
болып табылмайтындықтан әдетте екеуі де қолданылады: егер фонның суреті
табылмайтын болса, түс пайдаланылады.
Парақтың фоны өзгеретін болғандықтан, мәтіннің түсін сәйкес таңдау
керек. Ол үшін келесі атрибут text=”#RRGGBB” қолданылады. Гиперсілтемелер
мәтіннің түсін беру үшін келесі атрибуттар:
Link=”#RRGGBB”
Vkink=”#RRGGBB”
Alink=”#RRGGBB”
BODY элементінің ішіндегі гипермәтін еркін құрылым болады.
H1 H1 тақырып элементі. Алты деңгейі бар H1...H6 бірінші деңгей ең
үлкені, алтыншы ең кіші.
Солға, оңға, ортаға тегістеу атрибутын пайдалануға болады.
Align=”left”
Align=”right”
Align=”center”
HR көлденең сызық (horizontal rule) - өте жиі қолданылатын элемент.
Біріншіден, осының көмегімен парақты бөлікке бөле аламыз. Екіншіден парақ
авторының осыған ұқсас элементттерді таңдау мүмкіндігі аз. Шынында да,
HTML тілінде іс жүзінде ұқсас құрастырулар аз, көлденең сызыққа ғана
шектеулі. Элементте соңғы тег жоқ, бірақ солға, оңға, ортаға тегістеу
атрибутын пайдалануға болады.
Align=”left”
Align=”right”
Align=”center”
Сызықтың жуандығын белгілеуге болады size=пиксел.
STYLESTYLE Web-парақтың кейбір элементтерінің стилін сипаттау. Әр
элемент үшін стилдік ресімдеу үнсіз келісім бойынша орнатылады, сондықтан
бұл элементті қолдану міндетті емес, бірақ қолданған дұрыс болады.
META Бұл элемент Web-парақты көргенде бейнеленбейтін, қызметтік
ақпаратты сипаттайды. Оның ішінде әдеттегі түсінікті мәтін жоқ,
сондықтанда соңғы тек жазылмайды. Әр МЕТА элементі екі негізгі атрибутты
сипаттайды, біріншісі мәліметтердің түрін анықтайды, ал екіншісі –
мазмұнын сипаттайды. МЕТА мәліметтердің бірнеше мысалы:
1. Құжаттың сақтау мерзімін көрсететін мерзімі: name=”Expires”
conten=”күні”:
- электрондық пошта адресі: name=”Reply-to” content=аты@адресі;
- іздеу үшін кілт сөздердің жиынтығы: name=”Keywords” content=”сөз1,
сөз2, сөз3”;
- Web-парақтың авторы: Name=”Author” content=”Автордың аты”
2. Web-парақтың қысқаша мазмұны: name=”Deccripton” content=”парақтың
мазмұны”
3. Web-парақтың сипаттамасы мен түрін сипаттау: name=”Generator”
content=”HTML редакторының атауы”;
name атрибуты клиент – қосымша мен Web-парақ туралы қосымша ақпарат
алу және оларды жөнге келтіру үшін пайдаланады. Бұл атрибутты көбінісе
http-equiv атрибутымен алмастырады. Ол сұранысты орындау кезінде қосымша
өріс құру үшін сервермен пайдаланады. Сонымен қоса, МЕТА элементі URL-ды
сипаттай алады. Үлгісі мынадай: URL=http:адрес.
AA HTML құжатты өте үлкен болуы мүмкін, осындай жағдайда құжаттың
керекті бөліміне жылдам өтуіне болады.
BASE Сілтемелерге базалық адресін беретін элемент (URL). Құжаттың
сілтемелерге адрестің бастапқы бөлігін жібертеді. Бұл элементті пайдалану
үшін BASE href=http:компютер жол1.
Жол1 үзіндісін міндетті болып саналмайды. Толық адресін жазғанда, ол
қажет етілмейді. Егер құжат мәтінінде салыстырмалы сілтеме кездессе: A
href=”жол2 html құжат-аты” сілтеменің көрінетін мәтіні A, онда URL-на
сәйкес келеді: http:компьютержол2html құжат-аты. Жергілікті дискіге
базалық адрес беру үшін: BASE href=file:C:\жол\. Салыстырмалы
сілтемені көрсеткенде, файлдың атын ғана емес, сонымен қоса файл
орналасқан папкалардың атын көрсетуге болады. Басқаша айтқанда, файлға жол
2-ге бөлінеді: шексіз және салыстырмалы. Салыстырмалы – құжатта
көрсетілген файлдар үшін, жолдың бастапқы, жалпы үзіндісі болған жағдайда
ыңғайлы. Шексіз сілтеменің білдіргенде, (file:) ену сызбасын көрсеткенде
жібергенде қолайлы. Шексіз сілтеменің бірінші сол жақ символына дейін
\, яғни жергілікті дискінің атына дейін, тек сол жақ бөлігі ескеріледі.
Синтаксис ережесі. Web-парақтың кодының түрін білеміз, HTML
синтаксисіне қатысты жалпы қорытындылар келтіруге болады. Әр элементті
пайдаланғанда, оның ішіне қандай элементтер кіргізуге және өзі қандай
элементтерінің ішіне орналасатынын білуіміз маңызды. Сонымен, тек мына
жағдайда егер фреймдер пайдаланылмағанда, HTML, HEAD, TITLE, BODY
элементтерінің өзара орналасуы кез-келген парақта, стандартты болуы керек.
Егер парақ фреймнің жоспарын ұсынса, онда байланысты BODY элементінің
FRAMESET элементін пайдалана аламыз.
Қатар пайдаланатын элементтер тобы бар. Оған кестелер, тізімдер,
фреймдер құратын элементтер жатады. Бұл жағдайда элеметтерді орналастыру
тәртібі парақтағы сол немесе басқа объектіні құру логикасы мен анықталады:
құрастырудың күрделі емес ережелерін есте сақтау керек. Кестелер мен
фреймдер көбінісе, парақтың бөлшектерін белгілі ретпен сыйғыздыру үшін
қолданылады. Мысалы, суретті ұяшық ішіне орналастыра отырып, оның белгілі
бір жағдайына қол жеткізуге болады. Мұндай жағдайларда элементердің
орналастыруын Web-парақтың дайындаушымен анықталады, және көптеген басқа
орналастырулар орнын білімімен қиялына байланысты жасалады.
Көптеген, мәтінді форматтауда пайдаланатын элементтер, орналастырудың
бірнеше варианттарын ұсынады. Және өздері белгіленген элементтер ішінде
орналасуы керек. Мұнда дұрыс ойланып басқару керек : әр элемент берілген
қызметті орындайды және белгілі аумақ әрекетін орындайды.
Төмендегі мысалды екі абзац және кесте келтірілген: P
style=”border:3px solig green”Абзац мәтініP
TABLE...TABLE
P Абзац мәтіні P
Бірінші абзацтың соңғы тегі жойылған. Енді кесте бірінші абзацтың
бөлігі болып саналады, және кесте мәтін жасыл рамкамен қоршалады. Керсінше
Р элементі кестенің ішінде орналаса алады: мысалға, TD ұяшығының бір
элементі бірнеше Р абзацтарда сипаттай алады.
Енгізудің ережелерін бұзу – Web-парақтарды құрғанда, көп кездесетін
қателіктердің бірі. Осындай қателіктерді болдырмау үшін синтаксис
ережелерінің орындалуын автоматты түрде бақылайтын, гипермәтін
редакторларын пайдаланыңыз. Төменде, жіберелетін ұқсас қателер келтірілген:
H1Тақырып H2Тақырып H1ТақырыпH2. Атап өтуіміз қажет броузерлер
гипермәтінді белгілеудегі қателітерден мән бермеуге тырысады. Егер парақ
бейнеліп тұрса, экранға ескертпелері хабарламасыз шығарылады. Бағдарлама
қате жазылған тегтарды белгілі бір қалыппен аударады және дайындаушылардың
ойлауымен жазылғаны бойынша толтырады. Осы кезде парақтың түрі автордың
ойына сәйкес келмеуі мүмкін. Тек күрделі қателерде немесе қайшы
құбылыстарда, броузер парақтың бейнеленуінің мүмкін еместігі туралы
хабарлама шығарады. Белгілеудің қателігінің жанама белгісін, парақ бетіне
кодының үзінділерінің пайда болуы көрсетеді. Интернетпен көп жұмыс
істейтін пайдаланушылар, осындай жағдайларда тап болған шығар 3.
Синтаксис ережесі, сипатталған элементтің атрибуттарына және бастапқы
және соңғы тегтарды пайдалануға да кең таралған. Элемент және Тег
түсініктерін шатастырмаңыздар. Элемент - бастпақы және соңғы тег
арасындағы пайдалы ақпарат және бастапқы тегтар ішіндегі атрибуттар
сипатталған контейнерлер. Тег - бұрыш жақшаға алынған және элемент
әрекетінің аумағын белгілеу деп пайдаланатын құрылым.
Кейбір элементтерде соңғы тег жоқ. BR элементі, жолдың соңын көрсететін
элемент. Кейбір элементтер соңғы тегпен немесе соңғы тегсіз пайдаланады.
Мысал ретінде Р элементін алуға болады. IMG сурет элементі, UL тізім
элементі,TABLE және тағы басқалар соңғы тегтері болмайды.
Бір элементтің пайдалы ақпараты берілген элементті соңғы және бастапқы
элементтер арасында немесе бастапқы тегпен келесі элементінің бастпақы
тегінің арасында орналасуы керек. Параққа енгізілген кез-келген еркін
жазылған мәтінді, экранға шығарылуы тиісті ретінде броузер қабылдайды.
Мәтіндік редактордан алынған ақпарат мәтінді жаңа жолдан жазуды бөлу
қарастырылмайды. Іс жүзінде барлық – Web-парақтарды бір ұзын жолға
сыйғызуға болады. Мысалы, блокнотка енгізілген жолдың соңын көрсететін
символдарды HTML кодын оқуға көмектеседі, бірақ броузерда бейнеленбейді.
Экранға парақты шығарарда жолды Hn, P немесе BR элементтері үзе алады, ал
қалған жағдайларда абзацтарды мәтін көлеміне, шрифт өлшеміне және өтіп
жатқан терезенің өлшеміне байланысты ерекше форматтайды, сондықтанда Web-
парақтардың түрлері монитордың әртүрлі режимдерінде шешілетіндей яғни
өзгермейтіндей етіп құрастыру керек. Өте маңызды ережесі болып
элементтердің атрибуттары алғашқы тег ішіне орналастыру 5.
Түсті басқару. Түсті кодтау шрифтерді, көлденең сызықтарды, фондты және
басқа парақтың элементтерін бояу үшін пайдаланады. Түстерді ағылшын
немесе оналтылық санымен белгіленеді. Түстің параметрлерінің мағыналары
болып табылатын, бірнеше атрибуттар бар. Ең қарапайым әдісі түсті – ағылшын
тілінде көрсету. Мысалы FONT элементінде қызыл шрифт былай көрсетіледі:
COLOR=”red”.
Кез келген белгіленген үйлесімділікпен алынған қызыл (R), жасыл (G)
және көк (B) түстердің ретінде ұсынылады.
Төмендегі кестеде (1 кесте) түстердің атау көрсетіліп отыр 4.
1-кесте.Түс элементтері
Жалпы атауы Ағылшынша атауы RGB-код
Аквамарин Aqua #00FFFF
Ақ White #FFFFFF
Сары Yellow #FFFF00
Алтын түсті Gold #FFD700
Жасыл Green #008000
Индиго Indigo #4B0080
Каштан Maroon #800000
Қызыл Red #F0000
Оливкалы Olive #808000
Қызыл сары Orange #FFA500
Пурпурлы Purple #800080
Ашық-жасыл Lime #00FF00
Күміс Silver #COCOCO
Сұр Grey #808080
Сизый Teal #008080
Көк Blue #0000FF
Ультрамин Navy #000080
Фиолет Violet #EE80EE
Фуксиновый Fuchsia #FF00FF
Қара Black
Web-парақтарды бояу - қазіргі кездегі кәсіби түр береді деген
қорытынды жасауға болады. Берілген жағдайда талғаммен ойлап табу зор мағына
бермейді, сонымен қатар пайдалану шегі де рөл атқарады. Web-парақтардың
түсті талқылау көп санды суреттерді пайдаланудың орнына және құжаттың
жылдам жүктелуін қамтамасыз етеді.
Мәтінді форматтау. Мәтінді арнайы анықтаманың талап етпейтін Web-
парақтың бірден-бір. Қысқаша айтсақ, туынды символдар сөзсіз-ақ мәтіндік
мәліметтер береді. Бірақ мәьінді форматтау үшін көптеген элементтер бар.
Арнайыларын басқа олардың басым көпшілігі стандартты атрибуттарды: long,
dir, id, class, title, style қолдайды.
Мәтінді кәдімгі элементтер де форматтауға болады: үзінділерді
курсивпен, жартылай қарамен ажырату, шрифт таңдау және тағы басқа. Осы
элементтерді қарастырайық.
PP
Абзац элементі – ең пайдалылардың бірі. Ол тек бастапқы тегті
пайдалануға мүмкіндік береді, себебі келесі элементі келесі абзацтың
басталуын ғана емес, алдындағысының аяқталуында білдіреді мен мағынасы
бойынша абзацтың аяқталуын көрсету қажет болса, соңғы тегті пайдалануға
болады. Абзац элементтерімен қатар
Align=”left”-сол жақ шеті бойынша тегістеу
Align=”right”- оң жақ шеті бойынша
Align=”center”-ортасы бойынша тегістеу
BR жаңа жолға мәжбүрлі ауыстыру элементі. Ол тег бастапқы тегқа ғана
ие. Оны ораналастыру жеріне қатар аяқталады, қалған мәтін жаға қатардан
басталады. Clear атрибуты оьъектілерді элементі пайдаланылған мәтінге
қатысты түзетуге мүмкіндік береді. Егер объект элементінде align атрибуты
болса, жанында орналасқан BR элементтерінде clear атрибуты болуы керек,
мысалы:
BR clear=”right”
none-үнсіз келісім бойынша,
left-егер объект солға тегістелген болса,
right- егер объект оңға тегістелген болса
all – кез-келген шеті бойынша тегістелу мүмкін объект үшін
BIGBIG шрифт өлшемін үлкейті
SMOLLSMOLL шрифт өлшемін кішірейту
II мәтінді курсив пен ажырату
STRIKESTRIKE немесе SS мәтінді сызылған ретте ажырату
UU мәтіннің астын сызу
SUBSUB төменгі индекс әрекеттін құратын эффектісін құратын элемент
SUPSUP жоғары индекс әрекеттін құратын эффектісін құратын элемент
TTTTтелетайп элементін көрсететін элемент
INSINSDELDEL бұл элементтер қойылған INS немесе алшақталған
DEL сияқты көрсету керек болатын мәтінді ажыратады.
PREPRE алдын ала форматталған мәтінді анықтауға арналған элемент.
BB мәтінді жартылай майлы шрифтерді ажырату өте әйгілі элемент
жартылай жуан шрифті пайдалану – мәтіндік редакторлардан алынған тәсіл
FONTFONT шрифт типін, өлшемін және түсін анықтау. Оларды сәйкес
атрибуттар арқылы анықтайды. Шрифтің абсолюттік өлшемін size атрибутымен
береді. Бұл атрибут 1-7 шамаларына тең болады. Шрифт өлшемі базалыққа да
қатыстыда берілуі мүмкін. Түсін беру color=”түс”.
Шрифтерді белгілеу атрибуты face мысалы, face=”Arial;Verdana;Tahoma”.
Осы элементіннің негізінде құрылған атау жақсы көріну үшін бұл элементтің
басқа элементтермен комбинациялау қажет: CENTER, B, I, P.
Стильдер кестесі. Атрибуттарға қарағанда қасиет аты және мағынасы қос
нүктемен ажыратылады, қасиеттер өзара нүкте, үтірмен ажыратылады. Элемент
қасиетін қайта анықтау үшін style стандарттық атрибуты пайдаланады.
STYLESTYLE
STYLE type=”textcss”
H1{boder-width=1;border:groover:tex t=align:center:green}
H2{colro:maroon;font-style:italic}
CODE{font family:Arial;Verdana;fint-size;12pt }
P{text-indent:10;color:green;font-s ize;12pt}
P CODE{font-weght:bold;color:violet;f ont-size:12pt}
Бұл жағдайда барлық бетке бірінші және екніші деңгей атаулары үшін
жаңа стильдері жасалады. CODE элементтері үшін шрифт және фон түсті
таңдалады. Абзацтар (D) үшін бірінші жол шегінсінің шамасы, әріптердің
түсі мен өлшемі таңдалады. Бұл қарапайым мысал стильдері артықшылығын
көрсетеді: парақтың авторы бір атрибуттарды пайдалануда мүмкін емес
эффектілерді оңай жасай алады.
Біздің мысалымызда соңында қосалқыланған элементтері үшін арнлаған
стиль келеді. Оны броузер CODE элементі Р элементінің ішіне кіргенде ғана
пайдалана алады. Мұнда мәтіннің қасетері мұралықпен алынады: абзац
элементінен шегініс (text-indent:10); CODE элементінен – фон
(background:white); шартты түрде РCODE деп атауға болатын стиль қосымша
форматтарды енгізеді: жартылай жуан сызу (font-weight:bold); әріптердің
фиолеттік түсін (color:violet) символ өлшемі (font-size:12pt).
Стильдерді пайдалануға арналған екі элемент бар DIV элементінің
ерекшелігі – ол элементтерінің контейнер ретінде пайдалануға арналған;
HEAD
STYLE type=”textcss”
DIV тақырып {қасиеті, мағынасы;...}STYLE
HEADBODY
DIV class=”тақырып”
H1H1
PP
DIV
BODY
SPAN элементі, керсінше басқа элементтердің құрамына енгізуге арналған
HEAD
STYLE type=”textcss”
SPAN тақырып {қасиеті, мағынасы;...} STYLE
HEADBODY
SPAN class=”тақырып”
H1H1
PP
SPAN
BODY
Фреймдер. FrameFramesetFrameset. Фреймдер-броузер терезесінде
бірнеше құжатты бір уақытта ашып көрсету үшін құралатын аумақ. Фреймдер мен
парақтар құрғанда бірнеше Web парақтар өңделеді.
Сілтеме - бір құжаттың ішінде екніші құжатқа жылжу. Жалпы гиперсілтеме
– басқа файлға немесе объектінің көрсеткіші болып табылатын мәтін үзіндісі.
Гиперсілтеме басқа құжатқа көшу үшін қажет.
Суреттер. IMG Бұл элементте соңғы тег жоқ. Барлық ақпарат атрибуттар
көмегімен беріледі. Бұл элемент универсалды болып табылады. Осы элементінің
көмегімен; гиперсілтемелерге бейнелер пайдалануға, кестелерге суреттер
қоюға, маркерлер құру, дизайнның мәселелерін шешуге және тағы басқа болады.
Кестелер. Кестелер парақ бетіне мәлісеттерді форматтау тәсілінің өте
ыңғайлы тәсілі болып табылады. Негізгі ыңғайы кестенің қоршауын броузер өз
міндетіне алды. Қоршаудың өлшемі броузер де көру терезесінің өлшемдерімен
бірдей аутоматты, әрине кесте ұяшағына суреттер және мәтін жолымен де
сайкес орнатылады. Сонымен қатар кестелер, таза дизайн мәселелерін алады:
бір-біріне тиісті парақтардың бөлімін тегістеу, мәтін мен суреттер қатар
орналастыру, түспен толтыруды басқару және тағы басқа.
Тізімдер. Тізімдер (list) html-ға сөз жоқ мәтіндік редакторлардың
табысынан ықпалымен енгізілді. Тізім әдеттегі ең алдымен пайдаланушыға
бөлімдерді нөмерлеуді ойламауға болады: бұл мәселені бағдарлама өз мойына
алғанымен ерекшеленеді. Егер тізім жаңа бөлімдермен толтырылса немесе
қысқартылса, нөмірлеу аутоматты түрде түзетеді. Нөмірімізде бағдарлама
әрқайсысынын алдына маркерлер: дөнгелек, тіктөртбұрыш, ромбы тағы басқа
бейнелерді қояды 5.
Сценарии. Сценарии – парақтың мәтініне қайтымды мәтін ретінде
қосылады және парақты көргенде броузермен орындалады. Сценарии Netscape
фирмасымен дайындаған Java Script тілінде Microsoft фирмасымен дайындалған
Visual BasicScript (VBScript) тілінде жазылуы мүмкін 5.
SCRIPTSCRIPT
Бұл элемент – программа – сценариидің мәтәнәі парақтығы басқа
ақпараттан айыру мүмкіндігін береді. Тілді анықтайтын және келесі
мағыналарды қабылдай алатын атрибут language.
Java Script – Java Script тілінде жазылған
Tcl- Tcl тілінде жазылған
VBScript – VBScript тілінде жазылған
Бағдарлама мәтінін басқа бөлек файлға сақтаған ыңғалы. Онда script
элемент осы файлға сілтімені көрсету керек. Src=”URL”. Java Script
бағдарламасының файлын сақтағанда js кеңтараумен сақтайды. Type атрибуты да
тілдің типін көрсетеді. Typr=”textjavascript”.
Сценариидің прекшелігі парқтағы бар мәліметті бағдарлама жұмысының
нәтижесін өзгерту мүмкіндігі. Бір бұл ережесі емес, мүмкіншілігі ғана.
Defer атрибутының көмегімен (ешқандай мағынаны қабылдамайды) броузерге
оған өзгеріс болмайтынын хабарлайды. Кейбір жағдайда парақ жүктелуін
жылдаамдатады. Стандартты атрибут ретінде charset атрибутын пайдалануға
болады. Script элемент (немесе осы сияқты) HEAD бөлімінің ішінде
орналасады. Сол сияқты BODY бөлімінің ішінді. Script элементінің
қабылдайтын броузер бағдарламалық кодты экранға әдеттегі мәтін сияқты
шығарады: мысалы, әдеттегі парақ, бірақ мүнда бір жолдан тұратын сценарии
alert әдісімен жазылған. Жүктелудің алдында мәлімет шығарды батырманы
шерткенде жүктелу жалғастырылмайды 5.
NOSCRIPTNOSCRIPT
Броузер сценарииді қабылдамаған жағдайда қолданылады. Бұл элемент
бірнеше тәсілдермен пайдалануы мүмкін:
1. Осы элементтің ішіне мына сияқты ескерту жазуға болады: Сіздің
броузеріңіз сценарииді қабылдамайды;
2. Элементтің ішіне скрипсіз парақтың қысқаша версиясын жазу;
3. Басқа құжатқа сілтеме жазу.
1.2 Web-беттегі графика мен мультимедия
World Wide Web алғашқы жылдары тек мәтіндік ақпаратты ғана
орналастыруға пайдаланылатын. Тек Mosaic браузерінің пайда болуынан
бастап, графикалық суреттері бар ресурстарды көруге болатын. Web-те
суреттердің қолданылуы ауқымды желі арқылы деректер ағынының интенсивті
өсуіне әкелді. Сонымен қоса, Web-беттерде әртүрлі графикалық ақпараттың
орналасуы қолданушылар санын да арттырды.
Web-беттерде суреттерді қолдану құжаттардың қабылдануын сөзсіз
арттырады, бірақ шамадан тыс графикамен әуестену кері әсер береді.
Біріншіден, графикалық суреті бар құжат ұзақ жүктеледі. Нашар модеммен
немесе байланыстың нашар линиясымен қосылған Интернетпен қолданушы суреттің
жүктелуін бірнеше минут күтуі мүмкін. Осылайша суреттердің баяу жүктелуі
оны ашуландыруы мүмкін, осыдан кейін ол осы Web-сайтқа қайта кірмеуі де
мүмкін. Сондықтан графиканы қолдану кезінде келесі ұсыныстарды ескеру
қажет:
– Web-беттерде орналасқан графикалық ақпарат санын минимумға дейін
жеткізу қажет. Бұл суреттің санына да, оның өлшеміне де байланысты.
– Мүмкіндіктерді беттің ашылу жылдамдығы бойынша қолданған жөн: суреттің
кішірейтілген нұсқасын алдын-ала жүктеу, жолдық развертка, сонымен қоса
қолданушының браузерінде суреттердің шығуына рұқсат бермейтін
альтернативті мәтін.
– Көп суреттерді қолдану кезінде жалпыға ортақ ережелерді ескеріңіз: ірі
суреттер арнайы және тар сұрақтарға жауап беретін төменгі деңгейдегі
беттерде орналасуы қажет. Сайттың басты бетінде тек кіші суреттер ғана
қолданылуы тиіс.
Суреттер жайлы ақпараттар графика форматының файлдарында сақталған.
Графикалық деректердің ұйымдастырылуын қамтамасыз ететін көптеген форматтар
бар (мысалы, BMP, EPS, GIF, JPEG, PCX, TIFF және т.б.). Бірақ, берілген
форматтағы графикалық суретті браузер қолдаса ғана, қолданушы оны көре
алады. Сондықтан, суреттер көптеген браузерлер түсінетін форматтарда
жасалады. Бұндай форматтарға келесілер жатады:
– GIF (Graphics Interchange Format – тасымалдаудың графикалық форматы),
кеңейтілуі - .gif;
– JPEG (Joint Photographic Experts Group – фотографиялар эксперттерінің
бірлескен тобы), кеңейтілуі - .jpg немесе .jpeg;
– PNG (Portable Network Graphics – тасымалданатын желілік графика),
кеңейтілуі - .png.
Web-бетке суретті орналастыру процедурасы өте қарапайым және BODY
элементінің кез-келген жеріне жалғыз IMG тегімен орналастырылады. Сонымен
қоса суреттің URL-адресі src (бұл атау source – қайнар көз деген сөзден
алынған) атрибутының мәнімен беріледі. Бұл атрибут - IMG тегінің ішінде
міндетті түрде болатындардың бірі.
Беттің жүктелуін дайындау кезінде браузер бетте орналасқан суреттердің
өлшемдерін ескереді. Үнсіздік бойынша графикалық файлдарда сақталған
суреттердің шынайы өлшемдері алынады. Бұл өлшемдерді width және height
атрибуттарының көмегімен өзгертуге болады. Олардың мәндері суреттің ені мен
ұзындығын анықтайды.
Суреттердің өлшем мәндері пиксельмен беріледі, мысалы, width=”133”
height=”33”. Сонымен қоса, суреттердің ені мен ұзындығының мәнін пайыздық
қатынастарда беруге болады.
Суретті бетке қойғаннан кейін оның бетте орналасуына көңіл бөлеміз. Ол
үшін IMG тегін қосымша align атрибутымен толықтыру керек. Бұл атрибут
суреттің туралануын мәтінге қатысты орындайды.
Тігінен туралау үшін align атрибутының келесі мәндері қарастырылады:
– bottom – суретті қою кезінде оның төменгі шекарасы жолдың төменгі шеті
бойынша тураланады (бұл мән, әдетте, үнсіздік бойынша орнатылады);
– middle – суреттің ортасы мәтіндік жолдың шетімен тураланады;
– top – суреттің жоғарғы шекарасы мәтіннің жоғарғы шеті бойынша
тураланады.
Көлденеңінен туралау үшін align атрибутының келесі мәндері
қарастырылады:
– left – суретті беттің сол жағына қарай орналастыру; мәтін суреттің оң
жағына ораналасады;
– right – суретті беттің оң жағына қарай орналастыру және мәтінді сол
жағына жазу.
Көпетеген түрлі-түсті суреттер экранда әдемі көрінгенмен, олар ұзақ
ашылады. Netscape компаниясы осы проблеманы шешетін lowsrc атрибутын
қолдануды ұсынды. Бұл атрибут кіші өлшемді графикалық файлға сілтеме
жасайды да, оны бірінші ашады, содан кейін src атрибутында көрсетілген файл
жүктеледі.
Web-беттердің тез ашылуы үшін көптеген қолданушылар өз браузерлерінен
суреттерді ажыратады. Суреті жоқ бос орынға оның мағынасын түсіндіретін
мәтін жазуға болады. Оны альтернативті мәтін дейді.
Осы мүмкіндікті жүзеге асыру үшін IMG тегіне alt атрибутын қосу
қажет. Осы атрибуттың мәні ретінде тырнақшаға алынып жазылған альтернативті
мәтін беріледі. Мысалы,
IMG src=”middlesea_acuba.gif” width=”500” height=”150” alt=”Акуба
курортының тамаша түрі”
Web-беттерде дыбыстық жазбалардың қолданылуы қандай да бір эффект
береді және экранда көрінбейді. Дыбысты қолданылуын қажет ететін сайттар
бар (мысалы, әуендік). Алайда, беттерде көптеген дыбыстық файлдар мен
мультимедиялық материалдарды орналастыру үлкен көлемді және ұзақ жүктелуді
талап етеді. Егер қарапайым арналарды қолдану кезіндегі жүктелу уақыты 10
секундтан асса, жүктелетін файлдың көлемін және форматын көрсеткен жөн.
Дыбыстық жазбаның жүктелуі видеофильмнің жүктелуіне қарағанда аз уақыт
алады, сондықтан бетте дыбыспен қоса фотографияларды қолдану видеоны
қойғанға қарағанда тиімділеу. Web-беттердің интерфейсіне дыбыстар кейбір
оқиғаларды дыбыстау үшін қолданылады: терезенің ашылуы, батырманың басылуы,
сілтеме бойынша шертпе және т.б. Негізінен сапалы дыбыстар қолданушының
қызығушылығын арттырып, оның осы сайтқа қайта кіруіне әсерін қалдырады.
Барлық мультимедиялық файлдар арнайы қосымшаларда жасалып немесе
өңделіп, HTML-құжаттардан жеке сақталады. Құжаттарға осы файлдарды шақыру
арқылы Web-беттерге оларды шығаруға немесе ойнатуға болады. Шақыру екі
тәсілмен жүзеге асырылады: А байланыстыру элементі арқылы немесе арнайы
тегтердің қолданылуымен.
А элементі басқа файлға сілтеме жасауға арналғандығы бізге белгілі.
Мысалы, .avi кеңейтілуі бар MiddleSeaAcuba видеофайлға гиперсілтеме бетте
Орта теңіз демалыс орындарының әсем пейзаждарын көрсетеді. Ол HTML тілінде
келесідей болады:
A href=”http:TravelDev.comvideoMi ddleSeaAcuba.avi” Сіз тура қазір
Акуба жағажайын тамашалай аласыз
A
Гипермәтінге шерткеннен кейін видео-клип көрсетіледі.
Арнайы элементтер Web-беттерге мультимедия-файлды енгізуге мүмкіндік
береді. Олардың А элементінен айырмашылығы мультимедиялық файлды беттің
барлық мазмұны ашылғанда бірге ойнатылады. HTML 4.0 және HTML 4.01
тілдеріне енген арнайы элементтердің бірнеше түрі бар: IMG, APPLET, OBJECT,
EMBED, BGSOUND.
Дыбыстық эффектілер аудио файлдардың қолданылуымен жүзеге асады. WWW
ортасында жазу әдісі мен қолданылу аймағы бойынша ерекшеленетін дыбыстық
файлдардың көптеген түрлері бар. Кеңінен таралған форматтар төменде
келтірілген:
– AU (Audio format – дыбыстық формат дегенді білдіреді, кеңейтілуі -.au)
– Интернеттегі ең ескі дыбыстық форматтардың бірі, 8-битті дыбысқа
арналған.
– WAV (Waveform Audio – толқын формасындағы дыбыс дегенді білдіреді,
кеңейтілуі - .wav) – Windows жүйесіндегі сандық аудионың стандартты
форматы. Бұл форматтың дыбысы барлық Windows-қосымшаларда ойнайды.
– MIDI (Musical Instrument Digital Interface - әуенді инструменттердің
сандық интерфейсі, кеңейтілуі - .midi немесе .mid) – шынайы дыбыспен
байланыссыз формат. Бұл формат музыка синтезделетін жазба ноталарынан,
музыкалық инструменттер кодынан және т.б. ақпараттардан тұрады.
– MP3 (MPEG Audio Layer 3, кеңейтілуі .mp3). Бұл формат деректерді
сығудың жоғарғы деңгейлігін дыбсытарға қолданылуымен ерекшеленеді.
Осыдан дыбыстың сапасы бізге білінбейтін деңгейге төмендейді.
– RealAudio (шынайы дыбыс, кеңейтілуі - .ra) – дыбыстаудың жоғарғы
сапасын қолданып ойнатуға арналған. Бұл форматтың файлдары дыбыстық
деректердің ағынын қолдайды, яғни файлдың толық жүктелуін күтпей-ақ
ойнатылуы мүмкін. Ал, бұған дейінгі сипаттап өткен форматтар файл толық
ашылғанда ғана орындалады.
Web-те видеофайлдардың бірнеше стандартты форматтары қолданылады. Олар:
– MPEG (Moving Picture Expert Group – қозғалмалы суреттер бойынша
эксперттер тобы, кеңейтілуі .mpg немесе .mpeg) – аудио файлдармен қоса
видеофайлдарды да сығуға арналған. Бұл формат жоғарғы сапаны
қамтамасыз етеді және сандық видеоның стандарты болып табылады. Бірақ
бұл форматтың файлдары үлкен көлемді болғандықтан, олармен жұмыс істеу
қиынға түседі.
– AVI (Audio Video Interleaved – “қозғалмалы аудио және видео”,
кеңейтілуі .avi) - Windows жүйесінде аудио және видеодеректерді
ойнатуға және сақтауға арналған. AVI файлдары Интернетте жиі кездеседі.
– QuickTime (кеңейтілуі .mov немесе .qt) – Apple компаниясымен ойлап
шығарылған қазіргі уақытта танымал болып отырған видеоформат. Бұл
формат Интернетте кең таралған, желі бойынша ұзақ жүктелуді талап
етпейді, көптеген модульдермен қамтамасыз етілген.
Web-бетке қандай да видеофайлды орнатар алдында, осы форматтармен
тәжірибе жасап көріңіз, қайсысы сапасы және ашылу уақыты бойынша тиімдірек
соны таңдаңыз.
1.3 Сайт құрылымы. Дизайн
HTML-бетті құру алдында, оның құрылымы мен жұмыс істеуін талқылау
керек.
Web-сайт навигация және көру үшін ыңғайлы болуы қажет, бұл әрқашан
орындалуы керек аксиома. Өзіңіздің шығармаңызды өңдеп дұрыстауға
уақытыңызды алмаңыз- қайтару сілтемелері, мәтіндегі қосымшалар және көмекші
фреймдер сияқты кез келген пайданы ұсақ-түйектер әрқашан да өзіңіздің де,
біреудің көңілін көтереді.
Уақыт өте келе сайтқа жиі кіріп, оны аралап отыру керек. Алғашқыда оңай
түзелетін багтар кездеседі . Жұмыс істемейтін сілтемелер-дөрекі және
өкінішті қате, оларды серверге жүктер алдында ұстау керек. Upload барысында
бұзылған суреттерді тез арада ауыстырып отыру керек- олар қолданушылардың
көңілін өлі линктерден кем емес түсіріп, рейтингілері серверлер алдында
шайқалады.
Сайтты жетілдіру бойынша қазіргі идеалары оның онлайндық тексеру
процестерінде келеді. “Жалынған” және дұрысталған сайт, тіпті қарапайым
дайындалса да, құрмет пен эстетикалық қанағатты тудырады.
Жылжу
Жаңадан құрылған сайтқа қолданушылар аз келеді немесе тіпті келмейді.
Бұл жоққа шығаруға қиын болатын аксиома. Құрылған бірінші аптада сайт
жарнамасы бойынша максимум күш кетіру.
Сайтты қайда тегін және тиімді жарнамалауға болады?
Іздеу машинасынан басталатынына көбісі қателеседі. Алдымен өз
тақырыбыңыз бойынша конференциялар анықтаңыз . Бұл Usenet немесе
Fido(соңғысы тиімді емес- оны қолданушылардың жартысы желіге шыға алмайды)
түріндегі жаңалықтар тобы, сол сияқты Веб-сайттардағы хабарламалар тақтасы
бола алады. Конференцияға орналастырылған сайттың ашылуы туралы
хабарламаның нәтижесі барлық үміттерден асып түседі, әсіресе егер
конференция жалпы сипат алса (ағымдағы хабарламалар саны 300-ден астам).
Өзіңіз туралы жазбаларды қайда болсын қалдырсаңыз, конференцияларда,
басқа сайттардың қонақ кітаптарында, тіпті тақырып бойынша сәйкес келмейтін
бірнеше жағдайларда-адамның қызығушылығында шек жоқ.
Тематика бойынша ұқсас, Веб-сайттар иелеріне хат жазып, оларға
сілтемелерді айырбастауға ұсыныңыз. Көптеген жағдайларда бұл да өз
нәтижесін береді. Жарнамалық e-mail-дарды жіберуге қандай да бір база
бойынша немесе сәйкес интернет сервистерін пайдалануға болады. Бірақ
спаммерлерді еш жерде ұнатпайтынын есте сақтаңыз және жіберулер соның
ішінде болуы мүмкін. Сонда Веб-мастер ретінде қалған бірінші әсерлер
бұзылуы мүмкін.
Web-сервер концепциясы
Web-сервер концепциясы (ыңғайлы навигация, модификациясының
қарапайымдылығы) оның құрылымын ұйымдастырудан басталады. Web-сервердің ең
қарапайым құрылымы толық байланысты құрылым делінеді. Мұндай құрылымы бар
Web-сервер бас беттен тұрады, онда барлық сілтемелер орналасқан. Көне және
ұмытылып кеткен Web-сервердің тізбектей ұйымдастырылуы сілтемелердің
тізбектей (алға және артқа) өтуіне негізделген. Web-сервердің аса күрделі
құрылымы көптеген корпоративті қолданылады. Комбиинациялық құрылымда
жоғарыда аталғандардың барлығы бар. Кез келген құрылымның даму мүмкіндігі
болуы керек екенін есте сақтаңыз.
Web-серверді қалай дұрыс және жылдам құруға болады. Алдымен, үй бетін
құрыңыз, яғни Web басталатын HTML-құжаты. Бұл бетке графиканы (де-факто
стандарты- 65-тен 95-ке дейін килобайт графика) ұмытпаңыз . Тек қана
қолданушыға бұл жерде қандай ақпарат таба алатынын, сонымен бірге қажет
кодтауын ұсыну керек.
Мысалға, егер Web ақпараттық болса, барлық беттерді экранның ең тиімді
(640х480) рұқсаттылығында міндетті түрде тиімділеу керек.
Ыңғайлы навигация
Web-серверге келуші гипермәтіндік құжаттарды қарайтын схема навигация
деп аталады. Навигация ыңғайлы, түсінікті және ойланып жасалған болуы керек
екені түсінікті.
Навигациялық схеманы құрғанда Web-сервердің негізгі тақырыбынан
қолданушының көңілі бөлмейтін түстер гаммасын қолдану керек.
Негізгі навигациялық элемент, мысалға басы, ережеге сәйкес, жоғарыда
орналасады, ал екінші элементтер кез келген жерде, барлық жалпы
дизайнерлік шешімдер болып табылады.
Web-дизайн және графика
Web-бетті графикалық толтыру жалпы стилде орындалуы керек деп
есептеледі. Бұл жағдай Web-беттің шебер орындалуын сипаттайды. Әрі қарай
оны Internet-те қалай жүзеге асыруға болатын жолдар кетеді. Алдымен бұл
түсі, басы(шапка), мәзірі, кестелері және сілтемелер.
Негізінде, Web-дизайндағы түстер препресс дизайндағы сияқты заңдарға
бағынады. Мысалы, жылы түстер мен ашық түстер жалпы стильдік элементтер
болып саналады, ал суық сұр түстер күлгін түсті гамманы және оған жақын
спектрді (фиолетовый) жасайды.
Түс және жарық
Түс туралы ғылымда - түстануда дизайнер мен суретшіге өте керекті
мәліметтер жинақталған. Әр түрлі денелер жарықты әр түрлі шығарады немесе
шағылыстырады. Көрінетін оптикалық спектр 760-тан 380-микронға дейінгі
толқындармен шектелген. Ақ түсті заттардан кез келген түрлі түсті жарық
бірдей өлшемде бейнеленеді. Егер қызыл жарық түссе, олар қызғылдау, жасыл
жарық түссе, жасылдау болып көрінеді. Сұр түсті денелер жарықты аз
бейнелейді. Қара түсті денелер жарықты өте аз бейнелейді, себебі жарық
энергиясын жұтып, жылу көзіне айналдырады.
Бірдей өлшемді әр түрлі түстік сәулелерді шағылыстыратын және жұтатын
денелер ақ, сұр және қара болып ахроматты деп аталады. Әрі сұр түс
әртүрлі өзгеруі мүмкін және дайындау кезінде оның қолдануы бойынша үлкен
мүмкіндіктерді ұсынады. Басқа түрлі түсті заттар (ақ, сұр және қарадан
басқа) әр түрлі жарықты әр түрлі шағылыстырады. Осылай қызыл түсті заттар
қызыл түсті сәулелерді көп шағылыстырады және де қызыл жарықтың астында
өте ашық, ал жасыл жарықтың астында өте күңгірт, қара дерлік болып
көрінеді. Сондықтан әр түрлі шағылыстыратын денелер хроматты деп аталады.
Мұндай құбылыс көрмедегі заттарға жарық түсіру үшін қолданылады, өйткені
жарық түсімен сәйкес келетін денелер ашық болады. Ол үшін жарық фильтрлер
қолданылады. Жасанды жарық түскенде денелердің ақ, сұр және жасыл түстері
сарғаяды; көктері өте күңгірттенеді; күлгін түстері күңгірттенеді және
қызарады; заттардың көлеңкелері кенет қараланады; көлеңкеде орналасқан
денелердің түстері нашар айқындалады.
Алыстаған кезде түстің өзгеруі байқалады. Арақашықтығы үлкен болған
жағдайда барлық денелер көгілдір болып көрінеді. Бірақ жарық өте көп
түсетін заттар, мысалы-таулардың қарлы шыңдары, арақашықтығы үлкен болған
жағдайда қызғылт сары болып көрінеді. Алыстанған кезде ақшыл заттар
күңгірттенеді, ал күңгірт заттар жұмасарады және ақшылдайды.
Дизайн үшін түсті таңдаудың өте үлкен мағынасы бар. Мұнда психологиялық
моменттер үлкен рөл атқарады. Психологиялық зерттеулердің мәліметтері
бойынша әрбір түс адам үшін белгілі қасиеттерге ие болады. Түсті таңдағанда
осы кәсіпорынның өзіне тән түсі жоқ па деген сұрақ қою өте маңызды болады.
Түс тауардың өтуін ғана емес, сонымен қатар мәртебесін қамтамасыз етуі
керек.
Түстік шеңберіндегі түстердің белгілеулері және аттары:
Қ – қызыл
ҚҚс – қызыл - қызғылт сары
Қс - қызғылт сары
С - сары
СЖ - сары – жасыл
Ж - жасыл
КЖ - көк - жасыл
К- көк
ККн - көк - күлгін
Кн - күлгін
ҚКн – қызыл - күлгін
Гете бойынша түстердің табиғи шеңбері
КҚС – негізгі үшбұрыш, бастапқы (негізгі) түстер. КнҚсЖ- аударылған
үшбұрыш (екінші ретті түстер, бірінші ретті аралас түстер). КЖ, ККн, ҚКн
және т.б. – екінші ретті аралас түстер.
Түстердің үйлесушілігі үйлесімдік композицияларды құру кезінде маңызды
рөл атқарады, бірақ олар киімнің түсі сияқты модаға ұшырайды.
Шеңбер ішінде бір-біріне салыстырмалы түстердің орналасуы келесі
үйлесулердің түрлерін бөліп алуға мүмкіндік береді:
1. Қарама-қарсы үйлесушілік. Бірі-біріне қарама- қарсы орналасқан түстер
(мысалы, Кн және С). Бір-бірін толықтырып тұратын және үйлесімдік
түстермен сай келеді.
2. Негізгі немесе аударылған үшбұрыштық бұрыштарында орналасқан түстердің
үйлесушілігінің (мысалы, К және С), үйлесушілігі кемірек болады.
3. Шеңбердің ішінде бұрыш жасап орналасқан түстердің үйлесушілігі
(екі, үш немесе төрт түстен үйлесушілікті іріктеп алу үшін), мысалы, ККн
және Ж немесе СҚс және Ж.
4. Нюанстік (монохромдық ) үйлесушілік (мысалы, көгілдір және көк
дельфиниумдер).
5. Бірдей түсті әртүрлі заттардан немесе өсімдіктерден құралған түстердің
үйлесушілігі (мысалы, сары раушан, хризантемалар, нарцистер,
қызғалдақтар шоқтары).
Адамның көзі қызыл, қызғылт сары, сары түстерін және олардың реңдерін
жылы, көк және күлгін – суық өңдер ретінде қабылдайды. Жасыл түстің суық
және жылы реңдері бар.
Освальдттың үлкен түстік шеңбері
Екі, үш, төрт түстік реңдерден гормониялық үйлесушілікті жасау үшін
қолданылады.
Түстерді қиыстырған кезде кейбір түстер бір-бірімен жағымды әсерін, ал
басқалары көзді ауыртатан әсерін қалдырады деген мәселеге тап болады. Осы
мәселені шешуге түстік шеңбер көмектеседі. Бұл шеңбер керекті
үйлесімділікті табуға толық мүмкіндік береді.
Фонның көмегі арқылы жалпы алғанда композицияның, оны бөлек бөлшектерін
немесе заттардың сезілуін күшейтуге болтынын есте сақтау керек. Сұр, қара
және ақ фондар жағымды үйлесімділікті құрайды, бірақ ашық фондағы ақ заттар
жоғалады. Сұр фонда сарғыш түстер жоғалады. Сонымен қатар, композицияның
сезілуін ақ, қызғылт немесе алтындалған раманың түбіне орналастырып
күшейтіп алуға болады.
Желі үшін бейне
Интернетте негізінен графикалық бейненің екі түрі қолданылады. Олардың
белгілі болуы олардың сығылуына қабілеті бар және әр түрлі компьютерлер мен
операциялық жүйелерде олардың көрінуі және өңделінуіне мүмкіндік беруімен
сипатталады.
Ең әйгілі формат-GIF(Graphic Intenchang Format, “гиф ” деп аталады).
Бұл цифрлық бейнелер үшін сығылу протоколы болып табылады. Бұл формат
интернеттің пайда болуының алдында да пайдаланылып жүрген. Бұл форматтың
сығылу схемасы бір түсті бейнелер үшін сәйкес келеді, ал көп түсті бейнелер
үшін онша сай келмейді, мысалы, фотосурет. Бұл форматтағы бейнені
анимациялауға болады және олар мөлдірлік қасиетін қолдайды. Бұл олардың кең
қолданылуының бір себебі болып табылады. Сонымен қатар, GIF-бейнелер
батырмалар және пиктограммалар үшін керемет сай ... жалғасы
Сіз бұл жұмысты біздің қосымшамыз арқылы толығымен тегін көре аласыз.
Кіріспе 4
1 Сайт беттерін құруда html тілінің қолданылуы 6
1.1 HTML тілінің элементтері және Web-беттерді құру принциптері 6
1.2 Web-беттегі графика мен мультимедия 15
1.3 Сайт құрылымы. Дизайн 19
1.4 JavaScript сценарилерінің тілі 23
1.5 Интернетте Web-сайтты жоспарлау және орналастыру 30
1.6 Тэг атрибуттары және HTML құжатының құрылымы 32
1.7 Құжаттың негізгі бөлігі 36
2 HTML тілін қолданып, мектептің web-сайтын құру 39
2.1 Сайтты құруда құжаттағы мәтінді өңдеу 39
2.2 Сайт жасауда кестені пайдалану 42
2.3 Web-беттерде графиканы қолдану. Баннерлерді орналастыру 44
2.4 Web-беттерде стильдерді қолдану 44
2.5 HTML формасында мәліметтерді енгізу 47
2.6 JavaScript тілін қолдану 48
2.7 Мектеп сайтының жұмыс істеу тәсілі 51
Қорытынды 60
Қолданылған әдебиеттер тізімі 61
Қосымша А. Сайт коды 62
Кіріспе
World Wide Web бүкіл әлемдік өрмектің негізі гипертексті HTML тілі
екендігі бізге белгілі. HTML Интернет сәнінің негізі болып табылады.
Желідегі виртуальді журналдар парақтарында, теледидар бағдарламаларында,
Интернетке қатысты талқыланған әдемі суреттер, Web-парақтардың
интерактивтілігі, браузерді өңдеуші фирмалар арасындағы (Netscape және
Microsoft) қақтығыс, бизнес, ойындар және т.б. жайттар гипермәтін тілімен
байланысты деп айтуға болады.
HTML Web-парақтарды құрудың негізі болғандықтан, бейнелеу өнерінің
жаңа бағыты – Web дизайнға да тікелей қатысы бар. Суретшіге Интернетте
қарапайым әдемі суреттер салу, түпнұсқалы логотиптер, жаңа фирмалық стиль
құру жеткіліксіз. Ол осының бәрін Желіге сыйдырып барлығы қозғалыста
болатындай етіп, Web-парақтардың өзара байланысын ойластырып,
пайдаланушының істеген әрекетіне назар аударып қызықтыруы керек, ал
желідегі өзінің осы салада қайталанбас зат құруына ниетін тудыруы керек.
Веб-беттерді құруға арналған HTML тілі бүгінде кең таралған. Сонымен
қоса, қазір PHP скриптар тілі қолданылып жүр. ASP, GGI, Perl, SSI, ASP
тілдері де кеңінен қолданылмаса да, кейбір веб-беттерді осы тілдермен
құруға тура келеді. XML, XHTML және DHTML веб-программалау тілдеріне
жатпаса да, оларды толықтыруға өте пайдалы. Скриптардың ішінен JavaScript
және VBScript тілдерін айтуға болады. HTML, гипертекст тілі арқылы жұмыс
істеу өте жеңіл әрі ыңғайлы, сондықтан болар көптеген жасаушылар осы тілді
таңдайды.
Менің дипломымның мақсаты – HTML тілін пайдалана отырып, мектептің
сайтын жасау.
Міндеттері – HTML тілінің қарапайымдылығын анықтау, оның мүмкіндіктерін
қарастыру, осы тілді пайдалана отырып, сайт жасау.
ХХІ ғасыр - ақпарат пен жаңа технологиялар ғасыры. Бүгінде интернет
ақпаратты, жаңалықтарды, компания және фирма қызметін, сонымен қоса қызықты
ойын-сауықтарды және т.б. іздеуге мүмкіндік беретін құрал. Көптеген адамдар
немесе қызмет орындары өз сайттарын құруға тырысады. Себебі, әсіресе, сауда-
саттық орындары нарыққа шығудың сәтті жолдарын іздейді. Интернеттегі
сайттың өмір сүруі оның оқушыларына, қолданушы клиенттеріне байланысты.
Сондықтан, сайттың қызықты әрі толық ақпаратты бере алуы ресурс тақырыбы
қызықтырған бірнеше адамдар тобын жинайды. Яғни, аудиториясы күннен-күнге
кеңейеді және сауда-саттық орнына табыс әкеледі.
Қазіргі уақытта Web-беттерді құруға арналған көптеген технологиялар
бар. Бірақ, Web құжаттарды дайындаудың негізі болып, әрине, HTML тілі
жатады. Сондықтан, осы тілдің қыр-сырын білмей сайт жасау - анағұрлым
күрделі.
Дипломдық жұмыстың бірінші бөлімінде сайт беттерін құруда HTML тілінің
қолданылуы, құрудағы принциптері, Web-беттегі графика мен мультимедия,
JavaScript сценарийлерінің тілі, Интернетте Web-сайтты жоспарлау және
орналастыру және т.б. сұрақтар қарастырылған.
Ал, жұмыстың екінші бөлімінде мектеп сайтын жасаудың негізгі жолдары
аталып өтіледі. Сонымен қос, сайт құруда құжаттағы мәтінді өңдеу,
скриптерді қолдану, баннерлердің жасалуы, кестелердің пайдалануы, веб-
беттерде стильдердің қолданылуы қамтылған.
1 Сайт беттерін құруда HTML тілінің қолданылуы
1.1 HTML тілінің элементтері және Web-беттерді құру принциптері
Web беттерді құруға әртүрлі орталарды қолдануға болады. Олардың ең
қарапайым түрінің бірі Блокнот (Пуск Программы Стандартные Блокнот).
Мұнда жасалынған програма браузерлерде көрінуі үшін арнайы операторлар
қолданылады. Олар тілдің тэгтері деп аталынады. Құрылған файлды .html
қосымшасымен сақтайды.
HTML тэг –символдардың жиыны. Барлық тэгтар белгісінен басталып
белгісімен аяқталады.Бұл белгілердің ішінде қызметші сөздер орналасады.
Әрбір қызметші сөздің атқаратын іс-әрекеті бар. Тэгтарды жазуда бас не кіші
әріптердің айырмашылығы болмайды. HTML тілінің тэгі әдетте құжаттың бір
бөлігіне ғана әсер етеді. Бұл жағдайда жұп - ашатын және жабатын тэгтар
қолданылады. Ашатын тэг іс-әрекеттің басталуын анықтаса, ал жабатын тэг оны
аяқтауды білдіреді және онда қосымша белгісі қолданылады. Кейбір тэгтар
сол анықталған жерінде ғана қолданылады. Бұл жағдайларда жабатын тэгтар
қажет болмайды.
Ашылатын тэгтарда іс-әрекетке әсер ететін қосымша қызметші сөздер –
атрибуттар қолданылады. Кейбір атрибуттардың мәндері міндетті түрде
көрсетілуі тиіс. Ондай жағдайларда = белгісі қолданылады.
Жабылатын тэгта ешқандай атрибуттар болмайды.
Түсініктеме !-- белгілерінен басталып -- белгісімен жабылады 1.
Төменде әдеттегі Web парақтың дайындау үлгісі көрсетілген. HTML
парағының құрылымен қарастырайық.
HTML
HEAD
TITLEWeb парағының құрылымынTITLE
STYLEH2{font-family:Arbat;}
CODE{ font-family:Areal;} STYLE
META http-equiv=”Content-Type” content – “texthtml; charset=windows-
1251”
META name=”Authoer” content=”Algojina”
META name=” Keywords” content=”WWW;HTML,document,element”
HEAD
A name=”top”A
ӨтуA href=”#bottom”құжатAсоңыp
ӨтуA href=”#S001”Bсілтемеге 1BAсоңыp
p
HR
H1тақырып 1H1
H2тақырып 2H2
H3тақырып 3H3
H4тақырып 4H4
H5тақырып 5H5
H6тақырып 6H6
HR
PМұнда сілтемеBорналасқанB
A name=”S001”A
HR
PWeb-парақтың түпнұсқа мәтіні орналасуы керек
HR
A name=”bottom”AP
Құжаттың басына A name=”#top”өтуA
BODY
HTML
Егер алдындағы әртүрлі Web-парақтың мәтіндерін қарастырсақ, олардың
құрылымдарының ұқсастықтарын көруге болады. Бұны құжаттар белгілі бір
ережемен құрылады деп түсіндіріледі. HTML тілінің синтаксисінің негізіне
ISO 8879:”Information processing. Text and office systems” Standard
Generalize Marcup Language (SGML)” стандарты жатқызылады.
Ресми және шыныдығында негізделген стандарттар арасында үлкен
айырмашылық бар. HTML тілі үнемі дамып отыратындықтан оны ресми алғашқы
оқулықтармен ғана үйреніп қоймай, іс жүзінде алдағы келе жатқан өңдеуші
фирмалармен және мамандардың еңбектерін де пайдаланыңыздар. Web-парақтың
құрылымын үйрену үшін оның барлық элементтерін қарастырумыз керек. Тілдің
элементтерін қарастырғанда тегтің екі сыңары бастапқы және соңғы тегтар
келтірілге. Мысалға I және I.
Әр дайындаушы бір элементке сыңар тегті пайдалану керек. Латын
алфавитінің бас әрпін және кіші әрпін пайдаланады. Web-парақтың мазмұнын
түсіну үшін ыңғайлы болады.
HTML HTML HTML тіліндегі құжатты білдіру. Осы тегтердің Web-парақ
орналасқандықтан, бұл элемент ең сыртқы элементі. Негізінен бұл элемент
немқұрайлықпен қарастырылады version, lang және dir атрибуттары бар.
Берілген жағдайда пайдаланылмайды. Web-парақтың жалпы құрылымын анықтайтын
HEAD, BODY, FRAMESET енгізбелерін жібереді.
HEAD HEAD Web-парқтың аумағы. Басқаша айтқанда, оның бірінші
бөлімі. Алдындағы элемент сияқты HEAD элементі құжаттың жалпы құрылымын
құрастыру үшін ғана қолданады. Lang және dir атрибуттары бар, BASE, META,
LINK, OBJECT, SCRIPT, STYLE енгізбелерін жібереді.
TITLETITLE Web-парақтың тақырыбын орналастыратын элемент. Осы
элементтің ішіндегі жол құжатта бейнеленбейді, броузер терезесінің тақырып
жолында бейнеленеді. Сондықтанда, Web-парақты құрастырушы авторлар осы
жолдың ұзын болмауын қамтамассыз ету керек.
BODY элементінің ішіне Web-парақтың дизайнына арналған элементтерді
жазуға болады. Сәйкесінше бұл элементтің соңғы тегін құжаттың соңына
жазады. Бастпақы тег ішінен парақты түгелдей өзгертетін атрибуттарды
жазуға болады. Дизайнда пайдалы атрибут парақтың фонын анықтайтын атрибут
2.
Background=”файл фонына жол” немесе қарапайым түрі bgcolor=”#RRGGBB”
Қызыл және жасыл, көк түстердің реңін анықтайтын, фонның түсі үш, екі
топты, он алтылық санмен беріледі. Жоғарыда келтірілген атрибуттар баламалы
болып табылмайтындықтан әдетте екеуі де қолданылады: егер фонның суреті
табылмайтын болса, түс пайдаланылады.
Парақтың фоны өзгеретін болғандықтан, мәтіннің түсін сәйкес таңдау
керек. Ол үшін келесі атрибут text=”#RRGGBB” қолданылады. Гиперсілтемелер
мәтіннің түсін беру үшін келесі атрибуттар:
Link=”#RRGGBB”
Vkink=”#RRGGBB”
Alink=”#RRGGBB”
BODY элементінің ішіндегі гипермәтін еркін құрылым болады.
H1 H1 тақырып элементі. Алты деңгейі бар H1...H6 бірінші деңгей ең
үлкені, алтыншы ең кіші.
Солға, оңға, ортаға тегістеу атрибутын пайдалануға болады.
Align=”left”
Align=”right”
Align=”center”
HR көлденең сызық (horizontal rule) - өте жиі қолданылатын элемент.
Біріншіден, осының көмегімен парақты бөлікке бөле аламыз. Екіншіден парақ
авторының осыған ұқсас элементттерді таңдау мүмкіндігі аз. Шынында да,
HTML тілінде іс жүзінде ұқсас құрастырулар аз, көлденең сызыққа ғана
шектеулі. Элементте соңғы тег жоқ, бірақ солға, оңға, ортаға тегістеу
атрибутын пайдалануға болады.
Align=”left”
Align=”right”
Align=”center”
Сызықтың жуандығын белгілеуге болады size=пиксел.
STYLESTYLE Web-парақтың кейбір элементтерінің стилін сипаттау. Әр
элемент үшін стилдік ресімдеу үнсіз келісім бойынша орнатылады, сондықтан
бұл элементті қолдану міндетті емес, бірақ қолданған дұрыс болады.
META Бұл элемент Web-парақты көргенде бейнеленбейтін, қызметтік
ақпаратты сипаттайды. Оның ішінде әдеттегі түсінікті мәтін жоқ,
сондықтанда соңғы тек жазылмайды. Әр МЕТА элементі екі негізгі атрибутты
сипаттайды, біріншісі мәліметтердің түрін анықтайды, ал екіншісі –
мазмұнын сипаттайды. МЕТА мәліметтердің бірнеше мысалы:
1. Құжаттың сақтау мерзімін көрсететін мерзімі: name=”Expires”
conten=”күні”:
- электрондық пошта адресі: name=”Reply-to” content=аты@адресі;
- іздеу үшін кілт сөздердің жиынтығы: name=”Keywords” content=”сөз1,
сөз2, сөз3”;
- Web-парақтың авторы: Name=”Author” content=”Автордың аты”
2. Web-парақтың қысқаша мазмұны: name=”Deccripton” content=”парақтың
мазмұны”
3. Web-парақтың сипаттамасы мен түрін сипаттау: name=”Generator”
content=”HTML редакторының атауы”;
name атрибуты клиент – қосымша мен Web-парақ туралы қосымша ақпарат
алу және оларды жөнге келтіру үшін пайдаланады. Бұл атрибутты көбінісе
http-equiv атрибутымен алмастырады. Ол сұранысты орындау кезінде қосымша
өріс құру үшін сервермен пайдаланады. Сонымен қоса, МЕТА элементі URL-ды
сипаттай алады. Үлгісі мынадай: URL=http:адрес.
AA HTML құжатты өте үлкен болуы мүмкін, осындай жағдайда құжаттың
керекті бөліміне жылдам өтуіне болады.
BASE Сілтемелерге базалық адресін беретін элемент (URL). Құжаттың
сілтемелерге адрестің бастапқы бөлігін жібертеді. Бұл элементті пайдалану
үшін BASE href=http:компютер жол1.
Жол1 үзіндісін міндетті болып саналмайды. Толық адресін жазғанда, ол
қажет етілмейді. Егер құжат мәтінінде салыстырмалы сілтеме кездессе: A
href=”жол2 html құжат-аты” сілтеменің көрінетін мәтіні A, онда URL-на
сәйкес келеді: http:компьютержол2html құжат-аты. Жергілікті дискіге
базалық адрес беру үшін: BASE href=file:C:\жол\. Салыстырмалы
сілтемені көрсеткенде, файлдың атын ғана емес, сонымен қоса файл
орналасқан папкалардың атын көрсетуге болады. Басқаша айтқанда, файлға жол
2-ге бөлінеді: шексіз және салыстырмалы. Салыстырмалы – құжатта
көрсетілген файлдар үшін, жолдың бастапқы, жалпы үзіндісі болған жағдайда
ыңғайлы. Шексіз сілтеменің білдіргенде, (file:) ену сызбасын көрсеткенде
жібергенде қолайлы. Шексіз сілтеменің бірінші сол жақ символына дейін
\, яғни жергілікті дискінің атына дейін, тек сол жақ бөлігі ескеріледі.
Синтаксис ережесі. Web-парақтың кодының түрін білеміз, HTML
синтаксисіне қатысты жалпы қорытындылар келтіруге болады. Әр элементті
пайдаланғанда, оның ішіне қандай элементтер кіргізуге және өзі қандай
элементтерінің ішіне орналасатынын білуіміз маңызды. Сонымен, тек мына
жағдайда егер фреймдер пайдаланылмағанда, HTML, HEAD, TITLE, BODY
элементтерінің өзара орналасуы кез-келген парақта, стандартты болуы керек.
Егер парақ фреймнің жоспарын ұсынса, онда байланысты BODY элементінің
FRAMESET элементін пайдалана аламыз.
Қатар пайдаланатын элементтер тобы бар. Оған кестелер, тізімдер,
фреймдер құратын элементтер жатады. Бұл жағдайда элеметтерді орналастыру
тәртібі парақтағы сол немесе басқа объектіні құру логикасы мен анықталады:
құрастырудың күрделі емес ережелерін есте сақтау керек. Кестелер мен
фреймдер көбінісе, парақтың бөлшектерін белгілі ретпен сыйғыздыру үшін
қолданылады. Мысалы, суретті ұяшық ішіне орналастыра отырып, оның белгілі
бір жағдайына қол жеткізуге болады. Мұндай жағдайларда элементердің
орналастыруын Web-парақтың дайындаушымен анықталады, және көптеген басқа
орналастырулар орнын білімімен қиялына байланысты жасалады.
Көптеген, мәтінді форматтауда пайдаланатын элементтер, орналастырудың
бірнеше варианттарын ұсынады. Және өздері белгіленген элементтер ішінде
орналасуы керек. Мұнда дұрыс ойланып басқару керек : әр элемент берілген
қызметті орындайды және белгілі аумақ әрекетін орындайды.
Төмендегі мысалды екі абзац және кесте келтірілген: P
style=”border:3px solig green”Абзац мәтініP
TABLE...TABLE
P Абзац мәтіні P
Бірінші абзацтың соңғы тегі жойылған. Енді кесте бірінші абзацтың
бөлігі болып саналады, және кесте мәтін жасыл рамкамен қоршалады. Керсінше
Р элементі кестенің ішінде орналаса алады: мысалға, TD ұяшығының бір
элементі бірнеше Р абзацтарда сипаттай алады.
Енгізудің ережелерін бұзу – Web-парақтарды құрғанда, көп кездесетін
қателіктердің бірі. Осындай қателіктерді болдырмау үшін синтаксис
ережелерінің орындалуын автоматты түрде бақылайтын, гипермәтін
редакторларын пайдаланыңыз. Төменде, жіберелетін ұқсас қателер келтірілген:
H1Тақырып H2Тақырып H1ТақырыпH2. Атап өтуіміз қажет броузерлер
гипермәтінді белгілеудегі қателітерден мән бермеуге тырысады. Егер парақ
бейнеліп тұрса, экранға ескертпелері хабарламасыз шығарылады. Бағдарлама
қате жазылған тегтарды белгілі бір қалыппен аударады және дайындаушылардың
ойлауымен жазылғаны бойынша толтырады. Осы кезде парақтың түрі автордың
ойына сәйкес келмеуі мүмкін. Тек күрделі қателерде немесе қайшы
құбылыстарда, броузер парақтың бейнеленуінің мүмкін еместігі туралы
хабарлама шығарады. Белгілеудің қателігінің жанама белгісін, парақ бетіне
кодының үзінділерінің пайда болуы көрсетеді. Интернетпен көп жұмыс
істейтін пайдаланушылар, осындай жағдайларда тап болған шығар 3.
Синтаксис ережесі, сипатталған элементтің атрибуттарына және бастапқы
және соңғы тегтарды пайдалануға да кең таралған. Элемент және Тег
түсініктерін шатастырмаңыздар. Элемент - бастпақы және соңғы тег
арасындағы пайдалы ақпарат және бастапқы тегтар ішіндегі атрибуттар
сипатталған контейнерлер. Тег - бұрыш жақшаға алынған және элемент
әрекетінің аумағын белгілеу деп пайдаланатын құрылым.
Кейбір элементтерде соңғы тег жоқ. BR элементі, жолдың соңын көрсететін
элемент. Кейбір элементтер соңғы тегпен немесе соңғы тегсіз пайдаланады.
Мысал ретінде Р элементін алуға болады. IMG сурет элементі, UL тізім
элементі,TABLE және тағы басқалар соңғы тегтері болмайды.
Бір элементтің пайдалы ақпараты берілген элементті соңғы және бастапқы
элементтер арасында немесе бастапқы тегпен келесі элементінің бастпақы
тегінің арасында орналасуы керек. Параққа енгізілген кез-келген еркін
жазылған мәтінді, экранға шығарылуы тиісті ретінде броузер қабылдайды.
Мәтіндік редактордан алынған ақпарат мәтінді жаңа жолдан жазуды бөлу
қарастырылмайды. Іс жүзінде барлық – Web-парақтарды бір ұзын жолға
сыйғызуға болады. Мысалы, блокнотка енгізілген жолдың соңын көрсететін
символдарды HTML кодын оқуға көмектеседі, бірақ броузерда бейнеленбейді.
Экранға парақты шығарарда жолды Hn, P немесе BR элементтері үзе алады, ал
қалған жағдайларда абзацтарды мәтін көлеміне, шрифт өлшеміне және өтіп
жатқан терезенің өлшеміне байланысты ерекше форматтайды, сондықтанда Web-
парақтардың түрлері монитордың әртүрлі режимдерінде шешілетіндей яғни
өзгермейтіндей етіп құрастыру керек. Өте маңызды ережесі болып
элементтердің атрибуттары алғашқы тег ішіне орналастыру 5.
Түсті басқару. Түсті кодтау шрифтерді, көлденең сызықтарды, фондты және
басқа парақтың элементтерін бояу үшін пайдаланады. Түстерді ағылшын
немесе оналтылық санымен белгіленеді. Түстің параметрлерінің мағыналары
болып табылатын, бірнеше атрибуттар бар. Ең қарапайым әдісі түсті – ағылшын
тілінде көрсету. Мысалы FONT элементінде қызыл шрифт былай көрсетіледі:
COLOR=”red”.
Кез келген белгіленген үйлесімділікпен алынған қызыл (R), жасыл (G)
және көк (B) түстердің ретінде ұсынылады.
Төмендегі кестеде (1 кесте) түстердің атау көрсетіліп отыр 4.
1-кесте.Түс элементтері
Жалпы атауы Ағылшынша атауы RGB-код
Аквамарин Aqua #00FFFF
Ақ White #FFFFFF
Сары Yellow #FFFF00
Алтын түсті Gold #FFD700
Жасыл Green #008000
Индиго Indigo #4B0080
Каштан Maroon #800000
Қызыл Red #F0000
Оливкалы Olive #808000
Қызыл сары Orange #FFA500
Пурпурлы Purple #800080
Ашық-жасыл Lime #00FF00
Күміс Silver #COCOCO
Сұр Grey #808080
Сизый Teal #008080
Көк Blue #0000FF
Ультрамин Navy #000080
Фиолет Violet #EE80EE
Фуксиновый Fuchsia #FF00FF
Қара Black
Web-парақтарды бояу - қазіргі кездегі кәсіби түр береді деген
қорытынды жасауға болады. Берілген жағдайда талғаммен ойлап табу зор мағына
бермейді, сонымен қатар пайдалану шегі де рөл атқарады. Web-парақтардың
түсті талқылау көп санды суреттерді пайдаланудың орнына және құжаттың
жылдам жүктелуін қамтамасыз етеді.
Мәтінді форматтау. Мәтінді арнайы анықтаманың талап етпейтін Web-
парақтың бірден-бір. Қысқаша айтсақ, туынды символдар сөзсіз-ақ мәтіндік
мәліметтер береді. Бірақ мәьінді форматтау үшін көптеген элементтер бар.
Арнайыларын басқа олардың басым көпшілігі стандартты атрибуттарды: long,
dir, id, class, title, style қолдайды.
Мәтінді кәдімгі элементтер де форматтауға болады: үзінділерді
курсивпен, жартылай қарамен ажырату, шрифт таңдау және тағы басқа. Осы
элементтерді қарастырайық.
PP
Абзац элементі – ең пайдалылардың бірі. Ол тек бастапқы тегті
пайдалануға мүмкіндік береді, себебі келесі элементі келесі абзацтың
басталуын ғана емес, алдындағысының аяқталуында білдіреді мен мағынасы
бойынша абзацтың аяқталуын көрсету қажет болса, соңғы тегті пайдалануға
болады. Абзац элементтерімен қатар
Align=”left”-сол жақ шеті бойынша тегістеу
Align=”right”- оң жақ шеті бойынша
Align=”center”-ортасы бойынша тегістеу
BR жаңа жолға мәжбүрлі ауыстыру элементі. Ол тег бастапқы тегқа ғана
ие. Оны ораналастыру жеріне қатар аяқталады, қалған мәтін жаға қатардан
басталады. Clear атрибуты оьъектілерді элементі пайдаланылған мәтінге
қатысты түзетуге мүмкіндік береді. Егер объект элементінде align атрибуты
болса, жанында орналасқан BR элементтерінде clear атрибуты болуы керек,
мысалы:
BR clear=”right”
none-үнсіз келісім бойынша,
left-егер объект солға тегістелген болса,
right- егер объект оңға тегістелген болса
all – кез-келген шеті бойынша тегістелу мүмкін объект үшін
BIGBIG шрифт өлшемін үлкейті
SMOLLSMOLL шрифт өлшемін кішірейту
II мәтінді курсив пен ажырату
STRIKESTRIKE немесе SS мәтінді сызылған ретте ажырату
UU мәтіннің астын сызу
SUBSUB төменгі индекс әрекеттін құратын эффектісін құратын элемент
SUPSUP жоғары индекс әрекеттін құратын эффектісін құратын элемент
TTTTтелетайп элементін көрсететін элемент
INSINSDELDEL бұл элементтер қойылған INS немесе алшақталған
DEL сияқты көрсету керек болатын мәтінді ажыратады.
PREPRE алдын ала форматталған мәтінді анықтауға арналған элемент.
BB мәтінді жартылай майлы шрифтерді ажырату өте әйгілі элемент
жартылай жуан шрифті пайдалану – мәтіндік редакторлардан алынған тәсіл
FONTFONT шрифт типін, өлшемін және түсін анықтау. Оларды сәйкес
атрибуттар арқылы анықтайды. Шрифтің абсолюттік өлшемін size атрибутымен
береді. Бұл атрибут 1-7 шамаларына тең болады. Шрифт өлшемі базалыққа да
қатыстыда берілуі мүмкін. Түсін беру color=”түс”.
Шрифтерді белгілеу атрибуты face мысалы, face=”Arial;Verdana;Tahoma”.
Осы элементіннің негізінде құрылған атау жақсы көріну үшін бұл элементтің
басқа элементтермен комбинациялау қажет: CENTER, B, I, P.
Стильдер кестесі. Атрибуттарға қарағанда қасиет аты және мағынасы қос
нүктемен ажыратылады, қасиеттер өзара нүкте, үтірмен ажыратылады. Элемент
қасиетін қайта анықтау үшін style стандарттық атрибуты пайдаланады.
STYLESTYLE
STYLE type=”textcss”
H1{boder-width=1;border:groover:tex t=align:center:green}
H2{colro:maroon;font-style:italic}
CODE{font family:Arial;Verdana;fint-size;12pt }
P{text-indent:10;color:green;font-s ize;12pt}
P CODE{font-weght:bold;color:violet;f ont-size:12pt}
Бұл жағдайда барлық бетке бірінші және екніші деңгей атаулары үшін
жаңа стильдері жасалады. CODE элементтері үшін шрифт және фон түсті
таңдалады. Абзацтар (D) үшін бірінші жол шегінсінің шамасы, әріптердің
түсі мен өлшемі таңдалады. Бұл қарапайым мысал стильдері артықшылығын
көрсетеді: парақтың авторы бір атрибуттарды пайдалануда мүмкін емес
эффектілерді оңай жасай алады.
Біздің мысалымызда соңында қосалқыланған элементтері үшін арнлаған
стиль келеді. Оны броузер CODE элементі Р элементінің ішіне кіргенде ғана
пайдалана алады. Мұнда мәтіннің қасетері мұралықпен алынады: абзац
элементінен шегініс (text-indent:10); CODE элементінен – фон
(background:white); шартты түрде РCODE деп атауға болатын стиль қосымша
форматтарды енгізеді: жартылай жуан сызу (font-weight:bold); әріптердің
фиолеттік түсін (color:violet) символ өлшемі (font-size:12pt).
Стильдерді пайдалануға арналған екі элемент бар DIV элементінің
ерекшелігі – ол элементтерінің контейнер ретінде пайдалануға арналған;
HEAD
STYLE type=”textcss”
DIV тақырып {қасиеті, мағынасы;...}STYLE
HEADBODY
DIV class=”тақырып”
H1H1
PP
DIV
BODY
SPAN элементі, керсінше басқа элементтердің құрамына енгізуге арналған
HEAD
STYLE type=”textcss”
SPAN тақырып {қасиеті, мағынасы;...} STYLE
HEADBODY
SPAN class=”тақырып”
H1H1
PP
SPAN
BODY
Фреймдер. FrameFramesetFrameset. Фреймдер-броузер терезесінде
бірнеше құжатты бір уақытта ашып көрсету үшін құралатын аумақ. Фреймдер мен
парақтар құрғанда бірнеше Web парақтар өңделеді.
Сілтеме - бір құжаттың ішінде екніші құжатқа жылжу. Жалпы гиперсілтеме
– басқа файлға немесе объектінің көрсеткіші болып табылатын мәтін үзіндісі.
Гиперсілтеме басқа құжатқа көшу үшін қажет.
Суреттер. IMG Бұл элементте соңғы тег жоқ. Барлық ақпарат атрибуттар
көмегімен беріледі. Бұл элемент универсалды болып табылады. Осы элементінің
көмегімен; гиперсілтемелерге бейнелер пайдалануға, кестелерге суреттер
қоюға, маркерлер құру, дизайнның мәселелерін шешуге және тағы басқа болады.
Кестелер. Кестелер парақ бетіне мәлісеттерді форматтау тәсілінің өте
ыңғайлы тәсілі болып табылады. Негізгі ыңғайы кестенің қоршауын броузер өз
міндетіне алды. Қоршаудың өлшемі броузер де көру терезесінің өлшемдерімен
бірдей аутоматты, әрине кесте ұяшағына суреттер және мәтін жолымен де
сайкес орнатылады. Сонымен қатар кестелер, таза дизайн мәселелерін алады:
бір-біріне тиісті парақтардың бөлімін тегістеу, мәтін мен суреттер қатар
орналастыру, түспен толтыруды басқару және тағы басқа.
Тізімдер. Тізімдер (list) html-ға сөз жоқ мәтіндік редакторлардың
табысынан ықпалымен енгізілді. Тізім әдеттегі ең алдымен пайдаланушыға
бөлімдерді нөмерлеуді ойламауға болады: бұл мәселені бағдарлама өз мойына
алғанымен ерекшеленеді. Егер тізім жаңа бөлімдермен толтырылса немесе
қысқартылса, нөмірлеу аутоматты түрде түзетеді. Нөмірімізде бағдарлама
әрқайсысынын алдына маркерлер: дөнгелек, тіктөртбұрыш, ромбы тағы басқа
бейнелерді қояды 5.
Сценарии. Сценарии – парақтың мәтініне қайтымды мәтін ретінде
қосылады және парақты көргенде броузермен орындалады. Сценарии Netscape
фирмасымен дайындаған Java Script тілінде Microsoft фирмасымен дайындалған
Visual BasicScript (VBScript) тілінде жазылуы мүмкін 5.
SCRIPTSCRIPT
Бұл элемент – программа – сценариидің мәтәнәі парақтығы басқа
ақпараттан айыру мүмкіндігін береді. Тілді анықтайтын және келесі
мағыналарды қабылдай алатын атрибут language.
Java Script – Java Script тілінде жазылған
Tcl- Tcl тілінде жазылған
VBScript – VBScript тілінде жазылған
Бағдарлама мәтінін басқа бөлек файлға сақтаған ыңғалы. Онда script
элемент осы файлға сілтімені көрсету керек. Src=”URL”. Java Script
бағдарламасының файлын сақтағанда js кеңтараумен сақтайды. Type атрибуты да
тілдің типін көрсетеді. Typr=”textjavascript”.
Сценариидің прекшелігі парқтағы бар мәліметті бағдарлама жұмысының
нәтижесін өзгерту мүмкіндігі. Бір бұл ережесі емес, мүмкіншілігі ғана.
Defer атрибутының көмегімен (ешқандай мағынаны қабылдамайды) броузерге
оған өзгеріс болмайтынын хабарлайды. Кейбір жағдайда парақ жүктелуін
жылдаамдатады. Стандартты атрибут ретінде charset атрибутын пайдалануға
болады. Script элемент (немесе осы сияқты) HEAD бөлімінің ішінде
орналасады. Сол сияқты BODY бөлімінің ішінді. Script элементінің
қабылдайтын броузер бағдарламалық кодты экранға әдеттегі мәтін сияқты
шығарады: мысалы, әдеттегі парақ, бірақ мүнда бір жолдан тұратын сценарии
alert әдісімен жазылған. Жүктелудің алдында мәлімет шығарды батырманы
шерткенде жүктелу жалғастырылмайды 5.
NOSCRIPTNOSCRIPT
Броузер сценарииді қабылдамаған жағдайда қолданылады. Бұл элемент
бірнеше тәсілдермен пайдалануы мүмкін:
1. Осы элементтің ішіне мына сияқты ескерту жазуға болады: Сіздің
броузеріңіз сценарииді қабылдамайды;
2. Элементтің ішіне скрипсіз парақтың қысқаша версиясын жазу;
3. Басқа құжатқа сілтеме жазу.
1.2 Web-беттегі графика мен мультимедия
World Wide Web алғашқы жылдары тек мәтіндік ақпаратты ғана
орналастыруға пайдаланылатын. Тек Mosaic браузерінің пайда болуынан
бастап, графикалық суреттері бар ресурстарды көруге болатын. Web-те
суреттердің қолданылуы ауқымды желі арқылы деректер ағынының интенсивті
өсуіне әкелді. Сонымен қоса, Web-беттерде әртүрлі графикалық ақпараттың
орналасуы қолданушылар санын да арттырды.
Web-беттерде суреттерді қолдану құжаттардың қабылдануын сөзсіз
арттырады, бірақ шамадан тыс графикамен әуестену кері әсер береді.
Біріншіден, графикалық суреті бар құжат ұзақ жүктеледі. Нашар модеммен
немесе байланыстың нашар линиясымен қосылған Интернетпен қолданушы суреттің
жүктелуін бірнеше минут күтуі мүмкін. Осылайша суреттердің баяу жүктелуі
оны ашуландыруы мүмкін, осыдан кейін ол осы Web-сайтқа қайта кірмеуі де
мүмкін. Сондықтан графиканы қолдану кезінде келесі ұсыныстарды ескеру
қажет:
– Web-беттерде орналасқан графикалық ақпарат санын минимумға дейін
жеткізу қажет. Бұл суреттің санына да, оның өлшеміне де байланысты.
– Мүмкіндіктерді беттің ашылу жылдамдығы бойынша қолданған жөн: суреттің
кішірейтілген нұсқасын алдын-ала жүктеу, жолдық развертка, сонымен қоса
қолданушының браузерінде суреттердің шығуына рұқсат бермейтін
альтернативті мәтін.
– Көп суреттерді қолдану кезінде жалпыға ортақ ережелерді ескеріңіз: ірі
суреттер арнайы және тар сұрақтарға жауап беретін төменгі деңгейдегі
беттерде орналасуы қажет. Сайттың басты бетінде тек кіші суреттер ғана
қолданылуы тиіс.
Суреттер жайлы ақпараттар графика форматының файлдарында сақталған.
Графикалық деректердің ұйымдастырылуын қамтамасыз ететін көптеген форматтар
бар (мысалы, BMP, EPS, GIF, JPEG, PCX, TIFF және т.б.). Бірақ, берілген
форматтағы графикалық суретті браузер қолдаса ғана, қолданушы оны көре
алады. Сондықтан, суреттер көптеген браузерлер түсінетін форматтарда
жасалады. Бұндай форматтарға келесілер жатады:
– GIF (Graphics Interchange Format – тасымалдаудың графикалық форматы),
кеңейтілуі - .gif;
– JPEG (Joint Photographic Experts Group – фотографиялар эксперттерінің
бірлескен тобы), кеңейтілуі - .jpg немесе .jpeg;
– PNG (Portable Network Graphics – тасымалданатын желілік графика),
кеңейтілуі - .png.
Web-бетке суретті орналастыру процедурасы өте қарапайым және BODY
элементінің кез-келген жеріне жалғыз IMG тегімен орналастырылады. Сонымен
қоса суреттің URL-адресі src (бұл атау source – қайнар көз деген сөзден
алынған) атрибутының мәнімен беріледі. Бұл атрибут - IMG тегінің ішінде
міндетті түрде болатындардың бірі.
Беттің жүктелуін дайындау кезінде браузер бетте орналасқан суреттердің
өлшемдерін ескереді. Үнсіздік бойынша графикалық файлдарда сақталған
суреттердің шынайы өлшемдері алынады. Бұл өлшемдерді width және height
атрибуттарының көмегімен өзгертуге болады. Олардың мәндері суреттің ені мен
ұзындығын анықтайды.
Суреттердің өлшем мәндері пиксельмен беріледі, мысалы, width=”133”
height=”33”. Сонымен қоса, суреттердің ені мен ұзындығының мәнін пайыздық
қатынастарда беруге болады.
Суретті бетке қойғаннан кейін оның бетте орналасуына көңіл бөлеміз. Ол
үшін IMG тегін қосымша align атрибутымен толықтыру керек. Бұл атрибут
суреттің туралануын мәтінге қатысты орындайды.
Тігінен туралау үшін align атрибутының келесі мәндері қарастырылады:
– bottom – суретті қою кезінде оның төменгі шекарасы жолдың төменгі шеті
бойынша тураланады (бұл мән, әдетте, үнсіздік бойынша орнатылады);
– middle – суреттің ортасы мәтіндік жолдың шетімен тураланады;
– top – суреттің жоғарғы шекарасы мәтіннің жоғарғы шеті бойынша
тураланады.
Көлденеңінен туралау үшін align атрибутының келесі мәндері
қарастырылады:
– left – суретті беттің сол жағына қарай орналастыру; мәтін суреттің оң
жағына ораналасады;
– right – суретті беттің оң жағына қарай орналастыру және мәтінді сол
жағына жазу.
Көпетеген түрлі-түсті суреттер экранда әдемі көрінгенмен, олар ұзақ
ашылады. Netscape компаниясы осы проблеманы шешетін lowsrc атрибутын
қолдануды ұсынды. Бұл атрибут кіші өлшемді графикалық файлға сілтеме
жасайды да, оны бірінші ашады, содан кейін src атрибутында көрсетілген файл
жүктеледі.
Web-беттердің тез ашылуы үшін көптеген қолданушылар өз браузерлерінен
суреттерді ажыратады. Суреті жоқ бос орынға оның мағынасын түсіндіретін
мәтін жазуға болады. Оны альтернативті мәтін дейді.
Осы мүмкіндікті жүзеге асыру үшін IMG тегіне alt атрибутын қосу
қажет. Осы атрибуттың мәні ретінде тырнақшаға алынып жазылған альтернативті
мәтін беріледі. Мысалы,
IMG src=”middlesea_acuba.gif” width=”500” height=”150” alt=”Акуба
курортының тамаша түрі”
Web-беттерде дыбыстық жазбалардың қолданылуы қандай да бір эффект
береді және экранда көрінбейді. Дыбысты қолданылуын қажет ететін сайттар
бар (мысалы, әуендік). Алайда, беттерде көптеген дыбыстық файлдар мен
мультимедиялық материалдарды орналастыру үлкен көлемді және ұзақ жүктелуді
талап етеді. Егер қарапайым арналарды қолдану кезіндегі жүктелу уақыты 10
секундтан асса, жүктелетін файлдың көлемін және форматын көрсеткен жөн.
Дыбыстық жазбаның жүктелуі видеофильмнің жүктелуіне қарағанда аз уақыт
алады, сондықтан бетте дыбыспен қоса фотографияларды қолдану видеоны
қойғанға қарағанда тиімділеу. Web-беттердің интерфейсіне дыбыстар кейбір
оқиғаларды дыбыстау үшін қолданылады: терезенің ашылуы, батырманың басылуы,
сілтеме бойынша шертпе және т.б. Негізінен сапалы дыбыстар қолданушының
қызығушылығын арттырып, оның осы сайтқа қайта кіруіне әсерін қалдырады.
Барлық мультимедиялық файлдар арнайы қосымшаларда жасалып немесе
өңделіп, HTML-құжаттардан жеке сақталады. Құжаттарға осы файлдарды шақыру
арқылы Web-беттерге оларды шығаруға немесе ойнатуға болады. Шақыру екі
тәсілмен жүзеге асырылады: А байланыстыру элементі арқылы немесе арнайы
тегтердің қолданылуымен.
А элементі басқа файлға сілтеме жасауға арналғандығы бізге белгілі.
Мысалы, .avi кеңейтілуі бар MiddleSeaAcuba видеофайлға гиперсілтеме бетте
Орта теңіз демалыс орындарының әсем пейзаждарын көрсетеді. Ол HTML тілінде
келесідей болады:
A href=”http:TravelDev.comvideoMi ddleSeaAcuba.avi” Сіз тура қазір
Акуба жағажайын тамашалай аласыз
A
Гипермәтінге шерткеннен кейін видео-клип көрсетіледі.
Арнайы элементтер Web-беттерге мультимедия-файлды енгізуге мүмкіндік
береді. Олардың А элементінен айырмашылығы мультимедиялық файлды беттің
барлық мазмұны ашылғанда бірге ойнатылады. HTML 4.0 және HTML 4.01
тілдеріне енген арнайы элементтердің бірнеше түрі бар: IMG, APPLET, OBJECT,
EMBED, BGSOUND.
Дыбыстық эффектілер аудио файлдардың қолданылуымен жүзеге асады. WWW
ортасында жазу әдісі мен қолданылу аймағы бойынша ерекшеленетін дыбыстық
файлдардың көптеген түрлері бар. Кеңінен таралған форматтар төменде
келтірілген:
– AU (Audio format – дыбыстық формат дегенді білдіреді, кеңейтілуі -.au)
– Интернеттегі ең ескі дыбыстық форматтардың бірі, 8-битті дыбысқа
арналған.
– WAV (Waveform Audio – толқын формасындағы дыбыс дегенді білдіреді,
кеңейтілуі - .wav) – Windows жүйесіндегі сандық аудионың стандартты
форматы. Бұл форматтың дыбысы барлық Windows-қосымшаларда ойнайды.
– MIDI (Musical Instrument Digital Interface - әуенді инструменттердің
сандық интерфейсі, кеңейтілуі - .midi немесе .mid) – шынайы дыбыспен
байланыссыз формат. Бұл формат музыка синтезделетін жазба ноталарынан,
музыкалық инструменттер кодынан және т.б. ақпараттардан тұрады.
– MP3 (MPEG Audio Layer 3, кеңейтілуі .mp3). Бұл формат деректерді
сығудың жоғарғы деңгейлігін дыбсытарға қолданылуымен ерекшеленеді.
Осыдан дыбыстың сапасы бізге білінбейтін деңгейге төмендейді.
– RealAudio (шынайы дыбыс, кеңейтілуі - .ra) – дыбыстаудың жоғарғы
сапасын қолданып ойнатуға арналған. Бұл форматтың файлдары дыбыстық
деректердің ағынын қолдайды, яғни файлдың толық жүктелуін күтпей-ақ
ойнатылуы мүмкін. Ал, бұған дейінгі сипаттап өткен форматтар файл толық
ашылғанда ғана орындалады.
Web-те видеофайлдардың бірнеше стандартты форматтары қолданылады. Олар:
– MPEG (Moving Picture Expert Group – қозғалмалы суреттер бойынша
эксперттер тобы, кеңейтілуі .mpg немесе .mpeg) – аудио файлдармен қоса
видеофайлдарды да сығуға арналған. Бұл формат жоғарғы сапаны
қамтамасыз етеді және сандық видеоның стандарты болып табылады. Бірақ
бұл форматтың файлдары үлкен көлемді болғандықтан, олармен жұмыс істеу
қиынға түседі.
– AVI (Audio Video Interleaved – “қозғалмалы аудио және видео”,
кеңейтілуі .avi) - Windows жүйесінде аудио және видеодеректерді
ойнатуға және сақтауға арналған. AVI файлдары Интернетте жиі кездеседі.
– QuickTime (кеңейтілуі .mov немесе .qt) – Apple компаниясымен ойлап
шығарылған қазіргі уақытта танымал болып отырған видеоформат. Бұл
формат Интернетте кең таралған, желі бойынша ұзақ жүктелуді талап
етпейді, көптеген модульдермен қамтамасыз етілген.
Web-бетке қандай да видеофайлды орнатар алдында, осы форматтармен
тәжірибе жасап көріңіз, қайсысы сапасы және ашылу уақыты бойынша тиімдірек
соны таңдаңыз.
1.3 Сайт құрылымы. Дизайн
HTML-бетті құру алдында, оның құрылымы мен жұмыс істеуін талқылау
керек.
Web-сайт навигация және көру үшін ыңғайлы болуы қажет, бұл әрқашан
орындалуы керек аксиома. Өзіңіздің шығармаңызды өңдеп дұрыстауға
уақытыңызды алмаңыз- қайтару сілтемелері, мәтіндегі қосымшалар және көмекші
фреймдер сияқты кез келген пайданы ұсақ-түйектер әрқашан да өзіңіздің де,
біреудің көңілін көтереді.
Уақыт өте келе сайтқа жиі кіріп, оны аралап отыру керек. Алғашқыда оңай
түзелетін багтар кездеседі . Жұмыс істемейтін сілтемелер-дөрекі және
өкінішті қате, оларды серверге жүктер алдында ұстау керек. Upload барысында
бұзылған суреттерді тез арада ауыстырып отыру керек- олар қолданушылардың
көңілін өлі линктерден кем емес түсіріп, рейтингілері серверлер алдында
шайқалады.
Сайтты жетілдіру бойынша қазіргі идеалары оның онлайндық тексеру
процестерінде келеді. “Жалынған” және дұрысталған сайт, тіпті қарапайым
дайындалса да, құрмет пен эстетикалық қанағатты тудырады.
Жылжу
Жаңадан құрылған сайтқа қолданушылар аз келеді немесе тіпті келмейді.
Бұл жоққа шығаруға қиын болатын аксиома. Құрылған бірінші аптада сайт
жарнамасы бойынша максимум күш кетіру.
Сайтты қайда тегін және тиімді жарнамалауға болады?
Іздеу машинасынан басталатынына көбісі қателеседі. Алдымен өз
тақырыбыңыз бойынша конференциялар анықтаңыз . Бұл Usenet немесе
Fido(соңғысы тиімді емес- оны қолданушылардың жартысы желіге шыға алмайды)
түріндегі жаңалықтар тобы, сол сияқты Веб-сайттардағы хабарламалар тақтасы
бола алады. Конференцияға орналастырылған сайттың ашылуы туралы
хабарламаның нәтижесі барлық үміттерден асып түседі, әсіресе егер
конференция жалпы сипат алса (ағымдағы хабарламалар саны 300-ден астам).
Өзіңіз туралы жазбаларды қайда болсын қалдырсаңыз, конференцияларда,
басқа сайттардың қонақ кітаптарында, тіпті тақырып бойынша сәйкес келмейтін
бірнеше жағдайларда-адамның қызығушылығында шек жоқ.
Тематика бойынша ұқсас, Веб-сайттар иелеріне хат жазып, оларға
сілтемелерді айырбастауға ұсыныңыз. Көптеген жағдайларда бұл да өз
нәтижесін береді. Жарнамалық e-mail-дарды жіберуге қандай да бір база
бойынша немесе сәйкес интернет сервистерін пайдалануға болады. Бірақ
спаммерлерді еш жерде ұнатпайтынын есте сақтаңыз және жіберулер соның
ішінде болуы мүмкін. Сонда Веб-мастер ретінде қалған бірінші әсерлер
бұзылуы мүмкін.
Web-сервер концепциясы
Web-сервер концепциясы (ыңғайлы навигация, модификациясының
қарапайымдылығы) оның құрылымын ұйымдастырудан басталады. Web-сервердің ең
қарапайым құрылымы толық байланысты құрылым делінеді. Мұндай құрылымы бар
Web-сервер бас беттен тұрады, онда барлық сілтемелер орналасқан. Көне және
ұмытылып кеткен Web-сервердің тізбектей ұйымдастырылуы сілтемелердің
тізбектей (алға және артқа) өтуіне негізделген. Web-сервердің аса күрделі
құрылымы көптеген корпоративті қолданылады. Комбиинациялық құрылымда
жоғарыда аталғандардың барлығы бар. Кез келген құрылымның даму мүмкіндігі
болуы керек екенін есте сақтаңыз.
Web-серверді қалай дұрыс және жылдам құруға болады. Алдымен, үй бетін
құрыңыз, яғни Web басталатын HTML-құжаты. Бұл бетке графиканы (де-факто
стандарты- 65-тен 95-ке дейін килобайт графика) ұмытпаңыз . Тек қана
қолданушыға бұл жерде қандай ақпарат таба алатынын, сонымен бірге қажет
кодтауын ұсыну керек.
Мысалға, егер Web ақпараттық болса, барлық беттерді экранның ең тиімді
(640х480) рұқсаттылығында міндетті түрде тиімділеу керек.
Ыңғайлы навигация
Web-серверге келуші гипермәтіндік құжаттарды қарайтын схема навигация
деп аталады. Навигация ыңғайлы, түсінікті және ойланып жасалған болуы керек
екені түсінікті.
Навигациялық схеманы құрғанда Web-сервердің негізгі тақырыбынан
қолданушының көңілі бөлмейтін түстер гаммасын қолдану керек.
Негізгі навигациялық элемент, мысалға басы, ережеге сәйкес, жоғарыда
орналасады, ал екінші элементтер кез келген жерде, барлық жалпы
дизайнерлік шешімдер болып табылады.
Web-дизайн және графика
Web-бетті графикалық толтыру жалпы стилде орындалуы керек деп
есептеледі. Бұл жағдай Web-беттің шебер орындалуын сипаттайды. Әрі қарай
оны Internet-те қалай жүзеге асыруға болатын жолдар кетеді. Алдымен бұл
түсі, басы(шапка), мәзірі, кестелері және сілтемелер.
Негізінде, Web-дизайндағы түстер препресс дизайндағы сияқты заңдарға
бағынады. Мысалы, жылы түстер мен ашық түстер жалпы стильдік элементтер
болып саналады, ал суық сұр түстер күлгін түсті гамманы және оған жақын
спектрді (фиолетовый) жасайды.
Түс және жарық
Түс туралы ғылымда - түстануда дизайнер мен суретшіге өте керекті
мәліметтер жинақталған. Әр түрлі денелер жарықты әр түрлі шығарады немесе
шағылыстырады. Көрінетін оптикалық спектр 760-тан 380-микронға дейінгі
толқындармен шектелген. Ақ түсті заттардан кез келген түрлі түсті жарық
бірдей өлшемде бейнеленеді. Егер қызыл жарық түссе, олар қызғылдау, жасыл
жарық түссе, жасылдау болып көрінеді. Сұр түсті денелер жарықты аз
бейнелейді. Қара түсті денелер жарықты өте аз бейнелейді, себебі жарық
энергиясын жұтып, жылу көзіне айналдырады.
Бірдей өлшемді әр түрлі түстік сәулелерді шағылыстыратын және жұтатын
денелер ақ, сұр және қара болып ахроматты деп аталады. Әрі сұр түс
әртүрлі өзгеруі мүмкін және дайындау кезінде оның қолдануы бойынша үлкен
мүмкіндіктерді ұсынады. Басқа түрлі түсті заттар (ақ, сұр және қарадан
басқа) әр түрлі жарықты әр түрлі шағылыстырады. Осылай қызыл түсті заттар
қызыл түсті сәулелерді көп шағылыстырады және де қызыл жарықтың астында
өте ашық, ал жасыл жарықтың астында өте күңгірт, қара дерлік болып
көрінеді. Сондықтан әр түрлі шағылыстыратын денелер хроматты деп аталады.
Мұндай құбылыс көрмедегі заттарға жарық түсіру үшін қолданылады, өйткені
жарық түсімен сәйкес келетін денелер ашық болады. Ол үшін жарық фильтрлер
қолданылады. Жасанды жарық түскенде денелердің ақ, сұр және жасыл түстері
сарғаяды; көктері өте күңгірттенеді; күлгін түстері күңгірттенеді және
қызарады; заттардың көлеңкелері кенет қараланады; көлеңкеде орналасқан
денелердің түстері нашар айқындалады.
Алыстаған кезде түстің өзгеруі байқалады. Арақашықтығы үлкен болған
жағдайда барлық денелер көгілдір болып көрінеді. Бірақ жарық өте көп
түсетін заттар, мысалы-таулардың қарлы шыңдары, арақашықтығы үлкен болған
жағдайда қызғылт сары болып көрінеді. Алыстанған кезде ақшыл заттар
күңгірттенеді, ал күңгірт заттар жұмасарады және ақшылдайды.
Дизайн үшін түсті таңдаудың өте үлкен мағынасы бар. Мұнда психологиялық
моменттер үлкен рөл атқарады. Психологиялық зерттеулердің мәліметтері
бойынша әрбір түс адам үшін белгілі қасиеттерге ие болады. Түсті таңдағанда
осы кәсіпорынның өзіне тән түсі жоқ па деген сұрақ қою өте маңызды болады.
Түс тауардың өтуін ғана емес, сонымен қатар мәртебесін қамтамасыз етуі
керек.
Түстік шеңберіндегі түстердің белгілеулері және аттары:
Қ – қызыл
ҚҚс – қызыл - қызғылт сары
Қс - қызғылт сары
С - сары
СЖ - сары – жасыл
Ж - жасыл
КЖ - көк - жасыл
К- көк
ККн - көк - күлгін
Кн - күлгін
ҚКн – қызыл - күлгін
Гете бойынша түстердің табиғи шеңбері
КҚС – негізгі үшбұрыш, бастапқы (негізгі) түстер. КнҚсЖ- аударылған
үшбұрыш (екінші ретті түстер, бірінші ретті аралас түстер). КЖ, ККн, ҚКн
және т.б. – екінші ретті аралас түстер.
Түстердің үйлесушілігі үйлесімдік композицияларды құру кезінде маңызды
рөл атқарады, бірақ олар киімнің түсі сияқты модаға ұшырайды.
Шеңбер ішінде бір-біріне салыстырмалы түстердің орналасуы келесі
үйлесулердің түрлерін бөліп алуға мүмкіндік береді:
1. Қарама-қарсы үйлесушілік. Бірі-біріне қарама- қарсы орналасқан түстер
(мысалы, Кн және С). Бір-бірін толықтырып тұратын және үйлесімдік
түстермен сай келеді.
2. Негізгі немесе аударылған үшбұрыштық бұрыштарында орналасқан түстердің
үйлесушілігінің (мысалы, К және С), үйлесушілігі кемірек болады.
3. Шеңбердің ішінде бұрыш жасап орналасқан түстердің үйлесушілігі
(екі, үш немесе төрт түстен үйлесушілікті іріктеп алу үшін), мысалы, ККн
және Ж немесе СҚс және Ж.
4. Нюанстік (монохромдық ) үйлесушілік (мысалы, көгілдір және көк
дельфиниумдер).
5. Бірдей түсті әртүрлі заттардан немесе өсімдіктерден құралған түстердің
үйлесушілігі (мысалы, сары раушан, хризантемалар, нарцистер,
қызғалдақтар шоқтары).
Адамның көзі қызыл, қызғылт сары, сары түстерін және олардың реңдерін
жылы, көк және күлгін – суық өңдер ретінде қабылдайды. Жасыл түстің суық
және жылы реңдері бар.
Освальдттың үлкен түстік шеңбері
Екі, үш, төрт түстік реңдерден гормониялық үйлесушілікті жасау үшін
қолданылады.
Түстерді қиыстырған кезде кейбір түстер бір-бірімен жағымды әсерін, ал
басқалары көзді ауыртатан әсерін қалдырады деген мәселеге тап болады. Осы
мәселені шешуге түстік шеңбер көмектеседі. Бұл шеңбер керекті
үйлесімділікті табуға толық мүмкіндік береді.
Фонның көмегі арқылы жалпы алғанда композицияның, оны бөлек бөлшектерін
немесе заттардың сезілуін күшейтуге болтынын есте сақтау керек. Сұр, қара
және ақ фондар жағымды үйлесімділікті құрайды, бірақ ашық фондағы ақ заттар
жоғалады. Сұр фонда сарғыш түстер жоғалады. Сонымен қатар, композицияның
сезілуін ақ, қызғылт немесе алтындалған раманың түбіне орналастырып
күшейтіп алуға болады.
Желі үшін бейне
Интернетте негізінен графикалық бейненің екі түрі қолданылады. Олардың
белгілі болуы олардың сығылуына қабілеті бар және әр түрлі компьютерлер мен
операциялық жүйелерде олардың көрінуі және өңделінуіне мүмкіндік беруімен
сипатталады.
Ең әйгілі формат-GIF(Graphic Intenchang Format, “гиф ” деп аталады).
Бұл цифрлық бейнелер үшін сығылу протоколы болып табылады. Бұл формат
интернеттің пайда болуының алдында да пайдаланылып жүрген. Бұл форматтың
сығылу схемасы бір түсті бейнелер үшін сәйкес келеді, ал көп түсті бейнелер
үшін онша сай келмейді, мысалы, фотосурет. Бұл форматтағы бейнені
анимациялауға болады және олар мөлдірлік қасиетін қолдайды. Бұл олардың кең
қолданылуының бір себебі болып табылады. Сонымен қатар, GIF-бейнелер
батырмалар және пиктограммалар үшін керемет сай ... жалғасы
Сіз бұл жұмысты біздің қосымшамыз арқылы толығымен тегін көре аласыз.
Ұқсас жұмыстар
Пәндер
- Іс жүргізу
- Автоматтандыру, Техника
- Алғашқы әскери дайындық
- Астрономия
- Ауыл шаруашылығы
- Банк ісі
- Бизнесті бағалау
- Биология
- Бухгалтерлік іс
- Валеология
- Ветеринария
- География
- Геология, Геофизика, Геодезия
- Дін
- Ет, сүт, шарап өнімдері
- Жалпы тарих
- Жер кадастрі, Жылжымайтын мүлік
- Журналистика
- Информатика
- Кеден ісі
- Маркетинг
- Математика, Геометрия
- Медицина
- Мемлекеттік басқару
- Менеджмент
- Мұнай, Газ
- Мұрағат ісі
- Мәдениеттану
- ОБЖ (Основы безопасности жизнедеятельности)
- Педагогика
- Полиграфия
- Психология
- Салық
- Саясаттану
- Сақтандыру
- Сертификаттау, стандарттау
- Социология, Демография
- Спорт
- Статистика
- Тілтану, Филология
- Тарихи тұлғалар
- Тау-кен ісі
- Транспорт
- Туризм
- Физика
- Философия
- Халықаралық қатынастар
- Химия
- Экология, Қоршаған ортаны қорғау
- Экономика
- Экономикалық география
- Электротехника
- Қазақстан тарихы
- Қаржы
- Құрылыс
- Құқық, Криминалистика
- Әдебиет
- Өнер, музыка
- Өнеркәсіп, Өндіріс
Қазақ тілінде жазылған рефераттар, курстық жұмыстар, дипломдық жұмыстар бойынша біздің қор #1 болып табылады.
Ақпарат
Қосымша
Email: info@stud.kz