Corel Draw, Photoshop (қурстық жұмыс)

МАЗМҰНЫ
КІРІСПЕ
1 Негізгі бөлім
1.1 Corel Draw графиктік редакторының жұмыс істеу орны
1.2 Corel Draw графиктік редакторында құжатпен жұмыс
1.3 Adobe Photoshop программасымен таныстыру
1.4 Adobe Photoshop-тың құралдарымен жұмыс
1.5 Corel Draw – векторлы графикалық редактор
1.6. HTML тілі және графикалық объектілерді өңдеуді программалау
Қорытынды
Пайдаланылған әдебиеттер

КІРІСПЕ

Бұл курстық жобаға түсінікте векторлық графикалармен жұмыстарға қолданылатын Corel Draw пакетінің 11-ші версиясы туралы айтылады.

Corel DrawGraphics Suite 11 адамның қандай да болмасын шығармашылық қиялын қанағаттандыратын толық графикалық пакет. Corel DrawGraphics Suite 11-мен иллюстрациялар, макеттер мен суреттер салу және өңдеу оңайлатылды. Бұл курстық жобаға түсінікте программаның барлық құралдары, олардың функциялары, командалары, эффекттері және де әртүрлі мүмкіндіктері туралы жазылған. Көптеген мысал суреттер құрал мүмкіндіктерін көрсетеді.

Corel Draw 11 бұл версиясында жаңа интерфейсі тартымды көрінеді. Ең бастысы жаңа құралдар: үш нүктелі құралдар(үш нүктелі тіктөртбұрыш, үш нүктелі эллипс, үш нүктелі қисық), Езгіш бояуыш құралы, Сынған құралы, Қылқалам құралы, Шашақтауыш бояуыш құралы енгізілді. Және де 100-ден астам экспорт пен импорт фильтрін қолдайтын болады. Қабаттармен жұмыс жеңілдетілді.

1 Негізгі бөлім

1.1 Corel Draw графиктік редакторының жұмыс істеу орны

Corel Draw графиктік редакторында құралдармен және басқа ресурстармен негізгі терезе мен құжат терзесінде жұмыс жасалынады.

негізгі терезе

Программа жүктелгеннен кейін қыстырма(заставка) терезе(кейінірек тоқтаймыз), содан кейін негізгі терезе пайда болады. Негізгі терезеде қолданушы интерфейсінің негізгі элементтері: меню қатары, құралдар тақтасы, құралдар жиыны, қалып-күй қатары және түстер палитрасы орналасады.

Негізгі терезе

Corel Draw графиктік редакторында Windowsтың стандартты батырмалары, командалары( жабу, ашу, бүктеу, қайта қалпына кетіру, буфермен жұмыс және тағы басқалар) қолданылады. Және де Параметрлер терезесінен парақтың пішімін(формат страницы) және бағдарын(альбомная и книжная оиентация), реңнің түсін(фон), макеттерін келтіруге болады. Параметрлер терезесін ашу үшін Макет→Парақ параметрлері(Размещение →Настройка страницы) командасын орындау керек.

1.2 Corel Draw графиктік редакторында құжатпен жұмыс

1 Жаңа құжатты жасау. Corel Draw графиктік редакторын ашқанда қыстырмадан жаңа графикті таңдасақ жаңа құжат ашылады. Немесе стандартты құралдар тақтасынан "Жаңа" батырмасын басу арқылы жаңа құжат ашуға болады. Файл→Жаңа(Файл→Новый) командасы арқылы да жасуға болады. Жаңа құжат пішімін(формат) құралдар тақтасынан таңдаймыз.

Corel Draw 11-ге қош келдің қыстырма терезесі.

2 Құжатты ашу. Мұны да қыстырмадан таңдауға немесе Файл→Ашу (Файл→Открыть) командасы арқылы орындауға болады. Сол кезде Құжатты ашу терезесі ашылады.

Adobe Photoshop программасының қолдану оқулығы

1.3 Adobe Photoshop программасымен таныстыру

Менің дипломдық жұмысым “HTML тілінде Adobe Photoshop программасының қолдану оқулығын дайындау.” Оқулығымның мазмұны төрт тараудан тұрады. Олар:

 Adobe Photoshop программасымен таныстыру;

 Adobe Photoshop-тың құралдарымен жұмыс;

 Мәтінмен жұмыс;

 Adobe Photoshop программасының қолдану салалары.

Оқулығымның мазмұнына келіп тоқталатын болсақ, оның жалпы көрінісі келесідей:

Енді оқулығымның мазмұнының бірінші тарауына келіп тоқаталатын болсақ, яғни Photoshop программасымен таныстыру тарауына, оның өзі алты бөлімді қарастырады. Жалпы осы тараудың оқулықтағы көрінісі мынадай:

Жалпы осы таруда Adobe Photoshop программасына түснік берілген, оның құралдарының қандай қызмет атқаратыны айтылып, бұдан басқа Photoshop программасының режимдеріне, түстік модельдеріне және фильтрлеріне түсінік берілген. Мұнда Photoshop программасында жиі қолданылатын түсініктерге қысқаша шолып өттім.

Қазіргі кезде компьютерлік технология қоғам өмірінің барлық саласына түбегейлі өзгерістер енгізіп отыр. Оның бір сапалы компьютерлік графикаға сұраныс күннен-күнге артуда. Алғашқы кезде компьютерлік графикамен тек комьютерлік технологияны жетік меңгерген мамандар айналысса, қазіргі таңда осы бағытта барлық қолданушыларға арналған программалар пакеті бар. Бұл программалар өте қарапайым әрекетті орындаудан бастап қиын да күрделі дизайнерлік жұмыстарды атқарады. Қолданбалы программалық қамсыздандырудың мынадай түрлері бар: Сorel Draw, Page Maker, Adobe Photoshop.

Енді Adobe Photoshop программасына тоқталар болсақ, мұнда кез келген кескіндік суретті өңдеу, түзету, фондық түс беру сияқты әртүрлі ортада даярланған объектілерді біріктіру, жинақтау, өңдеу жұмыстарында қолданылады. Adobe Photoshop программасы арқылы ескі фотосуретті жаңалау, яғни басқа түске бояу, көйлекке жаға салу, шашты үлкейту, беттегі әжімді алу, бетті тазалау, ағарту, т.с.с. Қазіргі қолданылатын программалар арқылы үйлену, сүндет той, қыз ұзату, мүшелтой сияқты шақыру билеттері өңделіп даярланады. Әсемдік салонында адамдардың бет бейнесін бөлек шығарып оған шашын әсемдеуде, ал криминалистикада іздеу салу жұмыстарында, портрет жасау жұмыстарында қолданылады. Photoshop программасын іске қосақаннан кейін экранда оның жұмыс үстелі көрінеді. Windows ортасында жұмыс істеп жүрген пайдаланушы үшін мұндағы біраз элементтер таныс болады. Ондағы кескін терезесі компьютердің оперативті және виртуальді жадысының мүмкіншілігіне қарай бір уақытта бірнеше кескіндерді ашуға мүмкіндік береді. Әрбір кескін бөлек терезелерде ашылады. Бір терезеден келесі терезелерге өту Ctrl + tab пернелерін басу арқылы орындалады. Масштабтау алаңында – активті кескіннің көріну өлшемі көрсетіледі (төменгі сол жақ қатарында, бұрышында % - пайыз күйінде). Ақпарат алаңы кескіннің жад өлшемін көрсетеді. Қалып-күй қатары бұл жерде таңдалған саймандарды және кескінді көрсетеді. Егер қалып-күй қатары көрінбей тұрса, Окно → Отобразить строку состояния командасы арқылы шығарамыз.

Photoshop программасы бейнедегі әрбір қабатты қабаттар палитрасында көрсетіледі. Әрбір қабаттың аты ал тұсында кішірейтілген көшірмесі болады. Ал егер көрініс бірнеше қабаттардан тұратын болса, қабаттар палитрасында қабаттың атын көрсетілген жазудың үстінен басып тұрып басқа қабатпен орындарын ауыстыруға болады. Қабаттардың бір-біріне қатысты орналасуымен бір-біріне әсер етуі көп қабатты көріністермен жұмыс жасауда аса маңызды. Алайда фондық қабатты қозғауға болмайды. Кәдімгі қабатты фондық астына да қоюға болмайды. Қабаттың сол жақ тұсында орналасқан көз белгішесі қабаттың көрініп тұрғанын және көріністі құруға қатысып отырғанын білдіреді. Белгішенің үстінен шертсе, қабат көрінбей қалады да көрініс құруға қатыспайды. Оны қайта шертсек, қабат қайта қосылады. Қабатты таңдау үшін қабаттар палитрасынан керекті қабаттың аты бар жазудың үстінен шертсе жеткілікті. Осыдан кейін көріністерге қандай әрекеттер жасасақ та, қылқаламмен сурет салсаң, өшірсек, боясаң мұның бәрі тек таңдалған қабатқа қана әсер етеді. Қабаттар палитрасындағы таңдалған қабат тұсындағы қылқалам түріндегі белгіше осыны хабарлайды. Кейде қабаттар палитрасында қабаттың кішірейтілген суретінде шахмат тақтасы сияқты боялған фрагменттер бар екенін байқауға болады. Бұл фрагменттер қабаттың түссіз жерлері болып табылады. Алайда мұндай түссіз фрагменттері жоқ қабатты да жартылай түссіз етуге де рұқсат етіледі. Мұны түссіздік (непрозрачность) дәрежесі шамасы арқылы көрсетеміз. Егер бұл шама 0-пайыз болса, қабат толығымен түссіз болады және керісінше. Қабаттар палитрасының төменгі жағында 6 түйме орналасқан. Оның ең соңғы түймесін таңдау арқылы активті қабатты жоюға болады. Бесінші түйме жаңа қабат құруға мүмкіндік береді. Әдетте қабаттарға еayers 1, еayers 2, тағы сол сияқты аттар беріледі. Қабаттың атын өзгерту қажет болса, қабатты 2 рет шертіп, жаңа атау енгіземіз.

Қабаттың көшірмесін алу үшін менюден Қабат→Дублировать. Қабаттар палитрасының жоғарғы жағында Lock деген атпен біріктірілген 4 түйме қабаттың бетіне байқаусыздан өзгеріс енгізуден сақтайды. Олардың қызметтері:

- көріністің түссіз аймақтарын өзгертуге рұқсат етпейді.

- көріністің түссіз де, түсті де аймақтарын өзгертуге рұқсат етпейді.

- көріністің қабат үстіне орналасуын өзгертуге рұқсат етпейді.

- қабатпен кез келген операция жасауға және оны жоюға рұқсат етпейді.

Бұдан басқа қабаттарының қасында мынадай түйме бар. Оның қызметі осы белгімен белгіленген қабатпен активті қабат (қылқалам белгішесімен белгіленген) арасында байланыс орнату. Бұл түйме бірнеше қабаттың бірге жұмыс істеуі кезінде қолданады. Бірнеше қабаттарды уақытша байланыстырудың басқада тәсілі бар. Ол үшін бірнеше қабатты бір

жиынға біріктіруге болады. Жаңа бос жиынды құруға арналған түйме палитраның төменгі жағындағы 3-і түйме. Жиынға Set 1, Set 2, тағы сол сияқты атаулар беріледі. Жиынның қасында орналасқан түймесін шертсек, жиынның құрамына кіретін барлық қабаттарды программалар жасырады да, түйме басқа түрге өзгереді. Қайтадан шертсек жиынға кіретін қабаттарды көре аламыз.

Қабат маскасы – бұл қабат үстіне орналасатын және қабат бөліктерін көрінбейтін немесе жартылай көрінетін етуге мүмкіндік беретін арнайы маска. Қабаттың бір маскасы ғана болуы мүмкін. Қабат маскасы “Қабаттар” палитрасында көрінеді. Каналдар палитрасында қабат маскасы жаңа қатарға орналасады және оның аты қабат атауына Mask сөзі қосылып аталады. Маска мөлдірлігі негізгі түске байланысты. Егер негізгі түс қара болса, онда маска мөлдір. Егер ақ болса, мөлдір емес болады. Негізгі түс ретінде кез келген басқа түсті таңдалған кезде маска жартылай мөлдір болады. Қабат маскасын фон қабаты үшін құруға болмайды. Қабат маскасы қабаттар палитрасының төменгі жағындағы “Қабат маскасын қосу” функционалдық түймесі арқылы құрылады.

1.4.Adobe Photoshop-тың құралдарымен жұмыс

Photoshop программасының құрамына мынадай палитралар кіреді. Бұл палитралар жұмыс терезесінің оң жағында бір-біріне бірігіп көрініп тұрады. Ал көрінбей қалған жағдайда оларды ашу үшін терезе менюіндегі ... көрсету командасы тұрады.

1. Navigator (навигатор) палитрасы көріністі масштабтағанда және оның жұмыс терезесіндегі орнын ауыстыруын басқарады.

2. Info (инфо) палитрасы экранға берілген көріністің ерекшеленген жерін және басқа нүктелерді геометриялық, түсті түрінде шығару үшін қолданылады. алитрасы жұмыс құралдарын түзету кезінде қолданылады.

3. Colors (синтез) палитрасы – бұл палитра программаның алдыңғы және артқы түстерін синтездеуге арналған. Бұл палитра құрамына екі контекстік меню кіреді: 1) негізгі меню палитрасы – ол терезенің оң жақ бұрышындағы қара үшбұрыш түймені шерткенде ашылады. 2) түсті синтезатор менюі – ол тышқанның оң жақ түймесін басқанда ашылады.

4. Swatches (каталог) палитрасы – бұл палитрада программаның алдыңғы түстерін синтездеуге арналған. Бірақ бұған палитра терезесінде орналасқан кітапхана нұсқасы қолданылады.

5. Brushes (кисть) палитрасы – бұл палитра кез келген 15 салатын құралмен локальді түзету көрінісінің өлшемі мен пішінін таңдауға арналған.

6. History (события) палитрасы – бұл палитра ашылған құжаттармен жұмыс этап аралығында фиксация жасауға көмектеседі. Тышқанды шерту арқылы кез келген бейнеге өтуге және оларды жоюға болады. Жұмыс істеп жатқан бейне қара түспен беріледі. Әрбір жазу палитрада операция атымен (таңдалған инструмент аты) және сол жағында инструменттің суретімен тұрады. Палитраның ең төменгі жағында 3 түйме орналасқан: 1) Greate new document from current state (жаңа құжат құру) түймелі жаңа құжат құрып, оны жаңа терезеде ашады. 2) Greate new snapshot (жаңа сурет құру) кнопкалы snapshot 1 атты сурет құрады, бұл жерде 1-реттік номер. 3) Delete current state (жою) кнопкалы барлық командаларды жояды.

7. Eayers (слой) палитрасы – бұл палитра көп қабатты көрініс жасауға және қабатпен әртүрлі операция жасауға арналған.

8. Path (контуры) палитрасы – бұл палитра растрлік көрініспен жұмыс кезінде қосымша векторлық нышан түрінде болатын безье контурымен жұмыс жасау үшін арналған.

9. Options (параметры) палитрасы жұмыс құралдарын түзету кезінде қолданылады. Таңдаған құралға байланысты палитра аты және құрамы өзгереді. Осындай құралдармен жұмыс кезінде 4 палитра қолданылады. Олар: эллипсті ерекшелеу, кисть, заливка және художественная кисть событий (artkist history).

1.5. Corel Draw – векторлы графикалық редактор

Векторлық графика компьютерлік графиканың әртүрлілігі. Векторлық графикадағы бейне бөлек объектілерден контурлардан тұрады. Контурлар математикалық формулалармен суреттелетін безье қисықтар деп аталатын сегменттерден тұрады. Қисықтар Француз математигі Пьер Безьенің құрметіне осылай аталған. Векторлық бейне дискіде аз орын алады. Өйткені компьютер жадында бейне емес ол туралы мәлімет сақталады. Мысалы, дөңгелек салу үшін оның центірінің орналасуын рядусын контурдың қалыңдығымен түсін есте сақтау жеткілікті.

Контурлары сығуға, масштабтауға, орнын ауыстыруға болады және бұл кезде оның саласы мүлдем өзгермейді. Векторлық графиканы қолдану аймағы өте кең және векторлық суреттерді құруға мүмкіндік беретін программалық бөлімнің көптеген мөлшері жазылған. Олардың ішінде ең әмбебабы болып Corel Draw программасы саналады. Corel Draw программасы кез-келген мөлшердегі құжатармен жұмыс істеуге мүмкіндік береді. Соның ішіндегі негізгісі баспаханадағы жұмыс болып табылады. Төмендегі суреттер осы Corel Draw-тың мүмкіндіктерін қарастырған. Қолдану аясының қаншалықты кең екендігі көрсетілген.

Corel Draw программасын іске қосқан кезде сұхбаттық терезе ашылады: «New graphic» түймесі жаңа парақ құрады. «Open graphic» сақталып тұрған құжатты ашуға мүмкіндік береді. Ал, «template» түймесі шаблондар шебері терезесін ашады. Әр құжатқа бөлек терезе ашылады. Corel Draw-тың негізгі мәзіріндегі кейбір пунктерге тоқталайық:

• Layout (макет) – құжат беттерін басқару құралдары.

• Arrage (упорядочить) – бірнеше объектілерді басқару: туралау, топтау, түрін өзгерту т.б.

• Effects (эффекты) – векторлық сол сияқты расторлық бейнелерге арнайы эффектілерді меншіктеу.

• Bitmaps (растровое изображение) – импортталған расторлық бейнелермен жұмыс.

• Text (текст) – мәтіндік форматтау және редактрлеу.

• Tools (сервис) – Corel Draw – тағы интерфейспен режимдерді баптау.

• Windows (окно) – құжаттардың ашық терезелерін басқару.

Corel Draw-та баспаханалық өнім беттерімен жұмыс: Публикациядағы бет параметрлерін өзгерту командасы файл→параметр документа болады. Мұнда орындалатын іс-әрекеттер:

1. Публикация форматымен парақ өлшемі параметры документа → формат командасы дайын стандартты формаларды таңдауға мүмкіндік береді немесе стандарт емес жағдайда өлшем өрісі арқылы беттің биіктігімен енін енгізуге болады.

2. Бет бағдары – арентация (книжные, альбомные).

3. Өрістермен варианттар бет өрісінің маңызды параметрлері.

Corel Draw-та қолданылатын арнайы эффектілер: Арнайы эффектілер жағынан Corel Draw-қа тең келер программа жоқ. Оларға қол жеткізу менюдегі эффектілер командасы арқылы іске асады. Мысалыға айтатын болсақ преспектива – бұл эффект бөлек объектілерге немесе объектілер тобына қолданылады. Ол бірмезгілде бірнеше объектілерге қолданбайды. Бірақ бір объектіден келесіге эффекты → копировать перспективу → перспективу из командасы арқылы көшіруге болады. Перспективаның екі түрі бар: бір нүктелі және екі нүктелі. Бір нүктелі перспективада сәуле шығарудың бір нүктесі, ал екі нүктеліде екі нүктесі болады.

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

HTML тілінің атқаратын қызметі: Web – парақтары экранда ықшам түрде безендіріліп, көрсетілгенмен, HTML тілі мәтіндерді пішімдеп көрсететін тілге жатпайды. Өйткені әрбір тұтынушы әртүрлі компьютерлерді пайдаланады. Сол себепті жаңа ғана зауыттан шыққан бір компьютердің Windows жүйесінде жұмыс істей алатын броузері бар болса, екінші бір тұтынушы компьютері тек MS-DOS жүйесінде жұмыс істейтін ескі броузерді пайдалануы мүмкін. Бұл екеуінің көрсету мүмкіндіктері әртүрлі болғандықтан, бір файл екі түрлі болып көрсетіледі. Ал, үшінші компьютердегі Web – парақтарының мәтіндері зағиптарға арналған Брайль қаріптері арқылы берілсе, оның нәтижесі тіпті басқаша болады.

Құжаттарды әрбір тұтынушының әртүрлі құрылғымен және әртүрлі броузер программалармен көретіндіктерін ескерсек, HTML тілін мәтіндерді пішімдеу (форматтау) тәсілдерін жазуға арналған тіл деп атауға болмайды. Ол Интернеттегі мәтін бөліктерінің атқаратын қызметін анықтап, соларды әрбір тұтынушыға бейімдеп жеткізе алатын құжатты функционалды түрде белгілейтін тіл болып табылады.

Мысалы, егер мәтін тақырыбын бейнелеу керек болса, онда HTML коды оны тақырып ретінде көрсетуге тырысады. Тақырыптың белгілеу коды алынған соң, оны броузер – программа өз мүмкіндіктерін пайдаланып, оны үлкейтіп ірі әріптермен жазуы ықтимал немесе тек экран жолдарының ортасына жылжытып қана көрсетуіне де болады. Ал егер бұл құжат мәтіні дыбыс синтезаторы арқылы берілетін болса, одан соң аздап үзіліс жасалуы да мүмкін.

HTML тілінде мәтінді пішімдеу тәсілдерінің де бар екенін айтып кету керек, бірақ жалпы тұрғыдан алғанда құжаттың мазмұны кең оны безендіріп көрсету жолдарының айырмашылығы сақталып отырады. Мысалы, тілдің соңғы HTML 4.0 нұсқауында мәтінді пішімдеу командаларын пайдалану ұсынылмаған.

HTML тілінің көмегімен қарапайым суреттерді қолданып WEB – парақтар жасау: HTML - бұл - құжат аты .htm қосымшасы бар, қарапайым құжат.

HTML – тілінде жазылған файлды қажетті HTML файлының кеңейтілуімен дискіде сақтасақ, оның белгішесі өзгеріп Интернетте көруге болатын түрге айналады.

Бұл файлды бір мезетте Internet Explorer – де және Блокнотта ашып, оларды түрлендіріп көруге болады. Ол үшін файлды Internet Explorer -де шыққаннан соң, Түр - HTML түрінде (Вид - В виде HTML) командаларын орындау қажет. Сонда файлдың алғашқы мәтіні Блокнотта ашылып, оны түрлендіріп өзгерту мүмкіндігіне ие боламыз. Қажетті өзгертулер енгізіп оны қайта сақтап, осы өзгертулердің HTML - құжатта іске асқанын көру үшін, Internet Explorer - де Түр – Жаңалау (Вид - Обновить) командасын орындау керек немесе Саймандар тақтасындағы осы командаға сәйкес батырманы басса болды.

Сонымен кез келген программа мәтінін Блокнотта тергеннен кейін, оған өз қалауымызша ат беріп, оны *.htm түрінде кеңейтілуімен керек. Тергеніңіздің нәтижесін экранды көру үшін, оның атын тышқанмен екі рет шерту керек немесе Internet Explorer – де оны ашу қажет.

HTML тэгтері: HTML тілінің бастапқы мәтінді белгілейтін командалары тэг (tag) деп аталады. Тэг символдар тізбегінен тұрады. Барлық тэг “кіші” (<) символынан басталады да, “үлкен” (>) символымен аяқталады. Осындай қос символ тізбегі бұрыштық жақшалар деп те аталады. Ашылатын бұрыштық жақшадан соң команда аты болып табылатын түйінді сөз – тэг орналасады.

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

HTML тілінің бір тэгі әдетте құжаттың белгілі бір бөлігіне, мысалы бір абзацқа ғана әсер етеді. Осыған орай екі тэг қатар қолданылады: бір – ашады, екіншсі – жабады. Ашатын тэг белгілі бір әсер ету ісін бастайды, ал жабатын тэг – сол әсерді аяқтайды. Жабу тэгтері қиғаш сызық символымен (/) басталуы тиіс.

Кейбір тэгтер тек өз жазылу орнына қарай ғана әсерін тигізеді. Мұндайда жабу тэгі қажет болмай қалады да, ол жазылмайды. Егер тэг ретінде HTML тілінде қолданылмайтын түйінді сөз жазылып кетсе, онда оның ешбір әсері болмайды.

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

Тэг атрибуттары: Көбінесе ашылу тэгтерінің тигізетін әсерлерін түрлендіретін олардың атрибуттары болады. Атрибуттар немесе сипаттамалар – тэг атауының және бір – бірінен бос орын арқылы бөлініп жазылатын қосымша түйінді сөздерден тұрады.

Кейбір атрибуттар оның мәнін жазуды талап етеді. Атрибут мәні оның түйінді сөзінен теңдік белгісі (=) арқылы бөлініп жазылады. Атрибут мәні қостырнақшаға алынып жазылуы тиіс, бірақ кейде қостырнақшаға жазбаса да болады. Жабылу тэгтерінің ешқашанда атрибуттары болмайды.

Түсініктемелер: Программалау тілдерінде түсінік беретін сөздер-комментарийлер жазылатыны сияқты мұнда да программаның орындалуына еш әсер етпей, оны түсінуді жеңілдететін түсініктеме мәтіндер жазып отыруға болады.

HTML тілінің комментарийлері арнайы символдардан <!- - басталады да, түсінік беретін мәтін осыған жалғаса жазылады. Түсініктеме мәтін соңына - > символдары жазылуы тиіс. Түсінік мәтін ”үлкен” таңбасынан (>) өзге кез келген символдардан құрастырыла береді.

HTML тэгтеріне мысалдар:

<TITLE>

<BODY>

<TABLE>

</A>

<img>

</CENTER>

HTML тэгтерінің қосарланып жазылуына мысалдар:

<B> <B>

HTML тэгтерінің жалқы жазылуына мысалдар:

HTMLтэгтерінің атрибуттарымен бірге жазылуына мысалдар:

<BODY BGCOLOR=”#000000” TEXT# FFFFFF”

BASK ROUND=”RAIN.G17”>

HTML құжатының құрылымы: HTML құжаты сол құжаттың негізгі мәтінінен және белгілеу тэгтерінен тұрады да, қарапайым символдар жиыны болып табылады. Сондықтан оны құрастыру үшін жай мәтіндік редактордың бірін, мысалы Windows ортасындағы Блокнотты, пайдалана беруге болады.

1.HTML құжатының кез келгені <HTML> тэгінен басталып, соған сәйкес </HTML>түріндегі жабылу тэгімен аяқталады. Осы екеуінің ортасында құжаттың тақырыптық бөлігі мен тұлғасы болып келетін негізгі бөлігі орналасады.

2.Құжаттың тақырыптық бөлігі <HEAD> және </HEAD> тэгтерінің ортасында тұрады да, жалпы құжат туралы мәлімет береді. Әдетте, бұл бөлікті <TITLE>...</TITLE> тэгтерімен шектелетін құжаттың ресми атауы орналасады. Көптеген броузерлер бұл атауды терезе тақырыбында тұртын файл аты есебінде пайдаланады.

3. Жазылатын мәтін құжат тұлғасы деп аталатын <BODY>...</BODY> тэгтерінің ортасына жазылады.

Осы айтылған төрт тэг HTML құжатының кез келгенінде болуы тиіс. Бірақ <HTML>,<TITLE> тэгтерін жазбай кетсе де болады, дегенмен HTML тілінің құрылымы олардың толық болуын талап етеді. Өйткені алдын ала тұтынушының қандай броузер пайдаланытыны, оның қалай жұмыс істейтіні программа құрушуға белгісіз болады ғой.

Енді қарапайым түрде дұрыс құрастырылған HTML құжатын мысал ретінде келтіре кетейік.

<HTML

<HEAD>

<TITLE> Құжат тақырыбы </TITLE>

</HEAD>

<BODY>

Бұл мәтін экранға шығады

</BODY>

</HTML>

Осы құжат жұмысы нәтижесінде экранға мынадай мәтін шығады:Бұл мәтін экранға шығады

Құжаттың функционалдық бөліктерін анықтау: HTML тілі құжаттың функционалдық жеке бөліктерін сипаттауға арналған. Көптеген құжаттарда негізгі функционалдық бөліктер ретінде тақырыптар мен абзацтар қарастырылады.

1. HTML тілі құжаттардың ішкі тақырыптарының көлеміне қарай алты түрлі деңгейін жасай алады. Олар <H1> және </H1> тэгтерінен басталып, <H6> және </H6> тэгтеріне дейін жалғасады. Компьютер экранда олар әртүрлі мөлшердегі қаріптермен (қарайтылған түрдегі) көрсетіледі.

HTML тілінің идеологиясы бойынша тақырып болып келетін кез келген мәтін осы тэгтердің бірімен бейнеленуі тиіс. Бірақ бұл тэгтерсіз де мәтін әріптерін үлкейтіп жазатын басқа мүмкіндіктер де бар.

2. Жаңа жолдан басталатын абзацтарды белгілеу үшін <P> тэгі (жабу тәгі </P>) қолданылады. Бір абзацты жаппай, жаңа абзац бастап кетсек, алдыңғы абзац автоматты түрде жабылады. Сондықтан көбінесе <P> түріндегі жабу тэгін жазбаса да болады. HTML тілінде абзац азат жолдан басталмайды, тек абзацтар арасында бір бос жол қалдырып кетеді. Көбінесе абзацтарды анық етіп бөліп тұру үшін көлденең горизонталь сызық қойылады. Горизонталь сызық қою <HR> тэгімен көлденең орындалады, оның жабу тэгі болмайды.

3. Сөздер арасында қойылған бірнеше бос орын таңбаларының тек біреуі ғана көрініп тұрады да, басқалары жойылып кетеді. Сол сияқты келесі қатарға көшіретін Enter пернесін басу таңбасы да HTML тілінде ешбір әсер етпейді.

4. Егер абзац жасап бос жол қалдырмай жаңа жолға көшу қажет болса, онда парсыз жалғыз қолданылатын <BR> тэгін қолдану керек.

HTML 4.0 нұсқасынан (версиясынан) бастап кез келген құжатты әдемілеп әшекейлеу ісін, сол құжаттан бөлек жазуға болатын болды, алайда бұл мүмкіндікті көптеген броузерлер арқылы әзір жасауға болмайды. Сол себепті HTML тілінде, тек қана құжаттарды безендіру үшін ғана қолданылатын тэгтер бар. Мүмкін, HTML нұсқаларының алдағы түрлерінде осында жазылған кейбір тэгтердің қажеті болмайтын шығар, бірақ әзірше оларды пайдалануға болады.

1. Әріптің мөлшерін, түсін және сызылымын таңдап алу үшін <Font> тэгін пайдаланады. Бұл қосарланған тэг, оның ашылған және жабылған тэгтері арасында орналасқан барлық мәтіндерді түрлендіруге болады. <Font> тэгінде қолдануға болатын Size=…; Color=…; Face=...; тәрізді үш атрибуттың бірі тұруы тиіс.

Size=… атрибуты әріптің көлемін (мөлшерін) тағайындайды. Әріптердің алдын ала берілетін жеті түрлі көлемі бар, олар 1-ден 7-ге дейінгі сандармен белгіленеді. Бұл сандар белгілі бір өлшем бірліктеріне сәйкес келмейді, тек санның мәні үлкейген сайын әріптің де мөлшері де ұлғаяды. Егер сан көрсетілмесе, келісім бойынша ол 3-ке тең болып саналады.

Color=… атрибуты әріптің түсін таңдау мүмкіндкгін береді, ол ағылшын тіліндегі мағынасы бар түйінді сөз арқылы (мысалы, Red-қызыл) немесе RGB жүйесіндегі он алтылық санмен (мысалы, #FF0000 – бұл да қызыл) берілуі мүмкін.

Face=... атрибуты қаріп (шрифт) типін береді. Осы атрибуттың мәні компьютерде орнатылған қаріптер атының біріне сәйкес келуі керек. Бірақ Интернетте орнатылған құжатты қабылдайтын тұтынушының компьютерінде қандай қаріптердің орнатылғандығын алдын ала білу қиын, сол себепті осы атрибутты көрсетпеген дұрыс. Мысалы:

<BODY>

Алдарыңызда <Font color=”red” Face=”Arial” Size=”3”> үшінші мөлшермен Arial типімен жазылған қызыл түсті әріптер. </Font>

<BODY>

Мұның нәтижесі: Алдарыңызда үшінші мөлшермен типімен жазылған қызыл түсті әріптер.

2. Осы параметрлердің барлығын бүкіл құжат үшін бірден беру қажет болса, онда <BАSEFONT> атты бір ғана тэг пайдаланылады. Бұл тэгте де жоғарыда келтірілген атрибуттар пайдаланылады, олар қаріп түрін, түсін және мөлшерін анықтайды, егер олардың нақты мәндері көрсетілмесе, үнсіз келісім (по умолчанию) тәсілі бойынша белгілі бір мәндер таңдалып алынады.

3.Тэгтердің тағы бір арнайы тобы қаріптердің сызылымын (начертание) өзгерту мүмкіндігін береді. <B> және </B> тэгтері араларында орналасқан мәтін қарайтылған қаріпке ауысады. <I> және </I> тэгтері қаріптерді курсивпен берсе, <U>және</U> тэгтері мәтіндердің астын сызып, <S> және </S> тәгтері – белдерінен сызылған символдарды бейнелейді.

Мысалы:

<HTML

<HEАD> Қәріп типін, түрін, мөлшерін басқару

</HEAD>

<BODY>

Негізгі қаріп Arial KZ типінде төртінші мөлшермен жазылған <P><FONT SIZE= -2 FACE=”Times New Roman KZ COLOR=”GREEN”>

Бұл мәтін әріптері алдынғыдан екі мөлшерге ұсақтау және ол басқа қаріп типі мен жасыл түсті қолданады.</FONT>

<P> <B> қарайтылған қаріп түрі </B>

<P> <I> қисайтылған курсивпен жазылған қаріп түрі </I>

<P> <U> асты сызылған қаріп түрі </U>

<P> <S> белінен сызылған қаріп түрі </S>

</BODY>

</HTML>

Мұның нәтижесі: Негізгі қаріп Times New Roman KZ типінде төртінші мөлшермен жазылған

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

қарайталған қаріп түрі

қисайтылған курсивпен жазылған қаріп түрі

асты сызылған қаріп түрі

белінен сызылған қаріп түрі

Мәтін фрагменттерін логикалық стильмен безендіру: Логикалық стильдер <B>,<I>,<U> тэгтері сияқты сөздерді ерекшеленіп көрсетеді, олар программа мәтінін жазғанда немесе цитат (дәйектеме) келтірген кезде қолданылады. Логикалық стильдерді пайдалану кезінде броузер экранға не шығаратынын алдын ала айту қиын. Әртүрлі броузерлер экранға логикалық стильмен берілген символдарды әртүрлі етіп шығаруы мүмкін. Бұрынғы броузерлер логикалық стильде берілген қаріптерді ерекшелемей, жай қаріп түрінде бейнелей беруі де ықтимал.

Ағылшынның Emphasis – акцент сөзінен шыққан, яғни курсив түрінде берілетін мәтін бөлігін қоршап тұратын белгілер болып табылады.

Ағылшынның Strong emphasis – күшті акцент дегені, мәтін ішінде қарайтылған қаріп болып көсетіледі.

Программа мәтінін көрсету үшін қолданылатын стиль түрі.

Ағылшынның Sample – мысал, үлгі деген сөзі, программа жұмысы жұмысы нәтижелерін ендері бірдей моношрифт түрінде экранға шығарарда пайдаланылады.

Ағылшынның Keyboard – пернетақта (клавиатура) қысқаша сөзі. Пернелерден енгізілген сөз тіркестерін көрсету мақсатында қолданылады.

Ағылшынның Variable – айнымалы сөзі, программадағы айнымалы аттарын жазу үшін енгізілген стиль түрі, қисайтылған курсивке ұқсас қаріп түрі.

Осылардың жұмысына бір мысал келтірейік:

<HTML>

<HEAD>

<TITLLE> Мысал </TITLLE>

<HEAD/>

<BODY>

<H2> Мәтін фрагменттерін белгілеп ерекшелеу тәсілдері <H2>

<P> Мәтіндерді төмендегідей түрде ерекшелеуге болады <BR>

<HR>

<B> қалыңдатылып қарайтылған қаріптермен немесе </B> <BR>

<I> қисайтылған курсивпен немесе </I>

<BR>

<U> асты сызылған символдар арқылы жазуға болады. </U>

<P> Оған қоса мәтіндерді ендері бірдей қаріптер арқылы логикалық стильде жазу мүмкіндіктері де бар.

<HR>

<H3> Логикалық стильдер түрлері: </H3>

<HR>

<P>

<EM> EM –ағылшынның Emphasis – акцент сөзінен шыққан, яғни курсив түрінде берілетін мәтін бөлігі

</EM>

<BR>

<STRONG> STRONG - ағылшынның strong emphasis – күшті акцент дегені, мәтін ішінде қарайтылған қаріп болып көсетіледі.

<BR>

<CODE> CODE - Программа мәтінін көрсету үшін қолданылатын стиль түрі.

</CODE>

<BR>

<SAMP> SAMP - Ағылшынның sample – мысал, үлгі деген сөзі, программа жұмысы жұмысы нәтижелерін ендері бірдей моношрифт түрінде экранға шығарарда пайдаланылады.</SAMP>

<BR>

<KBD> KBD - Keyboard – пернетақта (клавиатура) қысқаша сөзі. Пернелерден енгізілген сөз тіркестерін көрсету мақсатында қолданылады.

</KBD>

<BR>

<VAR> VAR - variable – айнымалы сөзі, программадағы айнымалы аттарын жазу үшін енгізілген стиль түрі, қисайтылған курсивке ұқсас қаріп түрі.

</VAR>

</CENTER>

</BODY>

</HTML>

Сырғымалы жолдарды ұйымдастыру: MARQUEE>…</MARQUEE> тэгтері мәтіндерді үздіксіз жылжып отыратын “сырғымалы жол” түрінде экранға шығарады. Бұл тэгтің ашылуы кезінде тізбектеліп жазылатын бірсыпыра атрибуттері (немесе параметрлері) бар, олар сырғымалы жолдың жылжу жылдамдығын, бағытын, әріптері түсін, т. б. өзгертеді. Параметрлерді өзгертпеуге, яғни жазбауға да болады, онда олардың алдын ала келісім бойынша (значения по умолчанию) бұрын орнатылған мәндері іске қосылады.

Енді жиі өзгертілетін параметрлерлі және олардың мүмкін мәндерін қарастырайық.

BEHAVIOR – мәтіннің бір бағыты (SCROLL) немесе қос бағытта да (ALTERNATE) жылжуын, әйтпесе жылжымай тұруын (SLIDE) қамтамасыз етеді. Оның мүмкін мәндері SCROLL І SLIDE І ALTERNATE.

BGCOLOR – “сырғымалы жолдың” фон түсін анықтайды, он алтылық RGB форматында немесе ағылшынша белгілі бір түс аты беріледі. Мысалы: BGCOLOR=”GREEN”

DIRECTION – жолдың сырғу бағытын анықтайды, оның мүмкін мәндері: LEFT (солға) және RIGHT (оңға), келісім бойынша LEFT мәні іске қосылады.

HEIGHT – “сырғымалы жолдың ” биіктігін пиксель (нүктелер) арқылы анықтайтын бүтін сан, оны пайызбен де (%) көрсетуге болады.

WIDHT – экрандағы “сырғымалы жолдың” енін пиксель арқылы көрсететін бүтін сан, оны пайызбен де (%) көрсетуге болады. Алдын ала келісім бойынша 100% болып саналады.

Келісім мысал осы <MARQUEE> тэгі мен оның параметрлерін пайдалану жолын көрсетеді.

<HTML>

<HEAD>

<TITLE> Мысал </TITLE>

</HEAD>

<H2> Сырғымалы жолдар мысалдары </H2>

<HR>

<H3>

<MARQUEE BGCOLOR=”BLUE” BEHAVIOR=”SCROLL”

DIRECTION=”RIGHT” HEIGHT=30> Бұл алғашқы сырғымалы жол </MARQUEE> </H3>

<P>

<MARQUEE BGCOLOR=”GREEN” HEIGHT=30

WIDHT=”90%”>

Бұл екінші сырғымалы жол

</MARQUEE>

<P>

<MARQUEE BGCOLOR=”GREEN” BEHAVIOR=”ALTERNATE”

DIRECTION=”LEFT” HEIGHT=30>

Бұл үшінші сырғымалы жол

</MARQUEE>

<HR>

</CENTER>

</BODY> </HTML>

Гиперсілтеме бойынша ауысу: HTML – да мәтіннің бір фрагментінен екіншісіне ауысу үшін <A HREF= “[ауысу адресі]”> мәтіннің белгіленген фрагменті </A> тэгінің көмегімен орындалады. [ауысу адресі] параметрінің орнына аргументтердің бірнеше түрін қолдануға болады. Ең қарапайымы – ауысатын HTML-құжаттың атын беру. Мысалы <A HREF=”DOC.htm”> Мазмұн </A>

Бұл мысал HTML – құжатта “Мазмұн” деп белгіленген фрагмент пайда болады, оған тышқан курсорын алып барып шерткенде келесі терезеде DOC.htm құжаты ашылады.

Назар аударыңыз: егер адресте каталог (бума) көрсетілмесе, онда ауысу ағымдағы каталог ішінде орындалады. Ашылған файлды көріп болғаннан кейін артқа қайтып оралу үшін броузердің құралдар тақтасындағы НАЗАД батырмасын басу керек.

Қажет болған жағдайда сілтемені қандай да бір құжатқа емес сол құжаттың ішіндегі белгілі бір сөзге де жасауға болады. Ол үшін сілтеме барысында ашылатын құжатқа қандай да бір сүйеніш нүктесін немесе анкер ашу керек. Мысал арқылы:

Мәселен pr1.htm құжатынан pr2.htm құжатының “Ауысу аяқталады” (құжаттар бір буманың ішінде орналасқан) деген сөзіне көшу керек делік. Алдымен, pr2.htm файлында мынадай анкер ашу керек:

<A NAME=”AAA”> Ауысу аяқталды </A>

“Ауысу аяқталды” сөзі мәтінде ешқандай белгілеусіз жазылады. Енді pr1.htm файлында осы анкерге көшуді анықтау керек.

<A HREF=”2.htm#AAA”> Анкерге ауысу AAA</A>

Анкерге ауысуды pr2.htm құжатының ішінде де орындауға болады, ол үшін құжат ішінде мынадай фрагмент қосу жеткілікті:

<A HREF=”#AAA”> Анкерге ауысу AAA</A>

Бұл үлкен құжаттар жасағанда өте қолайлы. Құжаттың басына бөлімдердің тақырыбында орналасқан анкерлерге сілтеме жасайтын мазмұнды орналастыру керек.

Түсініспеушілік болмас үшін анкерлердің аттарын латын әріптерімен берген дұрыс. Анкерлердің атының жазылуын қадағалаңыз: көптеген броузерлер үлкен әріптерді кіші әріптерден ажырата алады. Егер анкер атын ААА деп анықтап, ал анкерге сілтемеде ааа немесе АаА деп жазсаңыз, онда құжтыңыз дұрыс ашылса да ААА анкеріне шыға алмайсыз.

Осыған дейін біз HTML – құжатқа сілтеме жасауды сөз еттік, алайда ресурстардың басқа да түрлеріне сілтеме жасауға болады.

<A HREF=”ftp://server/directory/file.ext”> файлды түсіндіру </A>

Бұндай сілтеме орындалған жағдайда, файлдарды беру протоколын іске қосып, server серверінің directory бумасында орналасқан file.ext файлын қолданушының жергілікті дискісіне түсіре бастайды.

<A HREF=”mailto: Этот e-mail адрес защищен от спам-ботов, для его просмотра у Вас должен быть включен Javascript ”> Хат жіберу </A>

Егер қолданушы жоғарыдағыдай сілтемеге ауысса, онда экранда пошта программасының шығу мәліметтерін енгізу терезесі ашылады. Пошта программасының “Қайда” жолында Этот e-mail адрес защищен от спам-ботов, для его просмотра у Вас должен быть включен Javascript көрсетіледі.

Байланыстар жайлы мысал:

<HTML>

<HEAD>

<TITLE> 2-мысал </TITLE >

</HEAD>

<BODY>

<H1> Байланыстыру </H1>

<P> Сілтеуердің көмегімен басқа файлдарға көшуге болады (мысалы, <A HREF=”ftp://mail.ru/home/Srailov Riszhan/html-pr.doc”> бұл Microsoft Word 2.0 форматындағы нұсқау </A>) FTP. Бойынша </P>

</BODY> </HTML>

Бір анкердің ішіне екіншісін орналастыруға болмайды. Ашылатын және жабылатын белгілерді міндетті түрде қою керек. Анкерлер гипертекстік сілтемелерді анықтау үшін қолданылады.

Name – анкердің атын анықтайтын жол. Бір құжаттың ішінде анкерлердің аттары қайталанбау керек.

Herf – гипертекстік сілтеме бойынша ауысатын ресурстың адресін білдіреді. Бұл басқа HTML – құжат, PDF – файл немесе сурет болуы мүмкін.

Title – сілтеме ресурстың аты

HTML құжатындағы мәтін: FONT элементі HTML-дағы мәтіннің сыртқы түрін басқарады.FONT элементі <FONT> тэгімен ашылып</FONT> тэгімен жабылатын контейнер болып табылады. Егер ашылатын тэгте ешқандай атрибуттар көрсетілмесе онда FONT элементі ешқандай әсер етпейді.

FONT элементін кез келген мәтіннің ішінде қолдануға болады. FACE (гарнитура), SIZE (өлшем) және COLOR(түс) атрибуттарының көмегімен құжаттағы мәтіннің түрін мүлдем өзгертуге болады.

FACE құжатта қолданылатын қаріп түрін таңдауға мүмкіндік береді. FACE атрибутының параметрі – қаріп аты. Атрибутта көрсетілген қаріп аты, қолданушы компьютерінің қаріп атымен сәйкес келуі керек, кері жағдайда браузер бұл атрибутты қабылдамайды да, айтылмаған жағдайда пайдаланылатын қаріпті қолданады. Қаріп атындағы бас және кіші әріптер айырмашылығы жоқ, ал бос орын міндетті түрде қойылуы керек.

Төменде қаріпті таңдау мысалы келтірілген.

<HTML>

<HEAD>

<TITTLE> Қаріп түрін таңдау</TITTLE>

</HEAD>

<BODY>

<FONT FACE= “Arial”> Бұл жерде басқа қаріп түрі пайдаланылған</FONT>

</BODY>

</HTML>

Егер сіз қолданушы компьютерінде қандай қаріптер бар екенін білмесеңіз, онда сіз FACE атрибутында үтір арқылы бірнеше қаріп атын көрсетуіңізге болады. Браузер қаріптер тізімін солдан оңға қарай қарап, бірінші сәйкес келген қаріпті қолданады.Төменде бірнеше қаріпті қолдану мысалы көрсетілген.

<HTML>

<HEAD>

<TITLE> Қаріп таңдай мысалы </TITLE>

</HEAD>

<BODY>

Бұл қаріп таңдау мысалы. </FONT>

</BODY>

</HTML>

Бұл мысалда негізгі қаріп ретінде Verdana көрсетілген, ол қаріп болмаған жағдайда Arial, Helvetica қаріптерін қолдануға болады.

SIZE – бұл элемент мәтіндегі белгілердің биіктігін таңдауға мүмкіндік береді, ол қарапайым стиль қаріптер шкаласының 3 мәніне сәйкестелінген. Size атрибутын екі түрлі әдіспен қолдануға болады: қаріптің абсолютты өлшемін көрсету, мысалы, SIZE=5 немесе салыстырмалы өлшемді көрсету SIZE=+2. Екінші әдіс көбіне негізгі қаріп ретінде Basefont көрсетілгенде қолданылады.

Мысалы

Нәтижесі:

size=1

size=2

COLOR . Қаріптің атын немесе өлшемін көрсеткендей мәтіннің түсін де көрсетуге болады. COLOR атрибуты RGB он алтылық санау жүйесінің мәнін немесе стандартты түстер атын қабылдайды. Төменде құжатта түстерді анықтауға арналған мысал келтірілген. Түстерді анықтау BODY элементінің BGCOLOR атрибутына ұқсас.

<HTML>

<HEAD>

<TITLE> Түстер таңдауға мысал </TITLE>

</HEAD>

<BODY>

<FONT COLOR=”#FF0000”>Бұл мәтіннің түсі қызыл </FONT>

<BR>

<FONT COLOR=”GREEN”> Бұл мәтіннің түсі жасыл </FONT>

<BR>

</BODY>

</HTML>

HTML – құжаттарында кесте тұрғызу: Кесте тұрғызу <TABLE> және </TABLE> тэгтері көмегімен орындалады, оның әрбір жолын анықтау - <TR> және </TR> тэгтері арқылы, ал сол жолдардағы бағаналар - <TD> және </TD> немесе <TH> және </TH> тэгтері арқылы анықталады. <TD> және <TH> тэгтерінің жұмысы ұқсас, бірақ <TH> тэгтерімен қоршалған мәтін қарайтылған бағана тақырыптары болып табылады да, <TD> тэгтерімен одан кейінгі қарапайым бағаналар жазылады.

Кесте тақырыбы <CAPTION> және </CAPTION> тэгтерімен қоршалып жазылады. Жалпы кестені толық анықтау ережесі төмендегі үлгімен беріледі:

</TABLE>

Бірақ кесте тұрғызу кезінде олардың кейбірі қолданылмауы да мүмкін. Енді осы кесте тэгі атрибуттарының атқаратын жұмысына тоқталайық:

ALIGN атрибуты кестенің шет жақтарға туралануын анықтайды (көрсетілмесе, келісім бойынша сол жақ шетке). ALIGN мәні қостырнақша ішіндегі сөз – мына сөздердің біріне сәйкес келуі тиіс: LEFT (сол жақ шетке), CENTER (ортаға), RIGHT (оң жақ шетке).

BGCOLOR кесте торының ішкі фон түсін тағайындайды (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгіленген түс атауы).

BORDER – бүтін сан, кесте жақтаулары сызығының пиксельмен берілген қалыңдығы. Егер BORDER берілмесе, жақтау сызықтары көрсетілмейді

BORDERCOLOR жақтау сызықтарының түсін тағайындайды (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгіленген түс атауы); BORDER атрибутымен бірге қолданылады.

WIDHT – кесте енін анықтайтын бүтін сан, оның мәні пиксельмен немесе пайызбен (%) беріледі. Кесте тақырыбы <CAPTION> тәгімен төмендегі ережеге сәйкес беріледі:

Мұндағы < CAPTION > тэгінің төмендегідей атрибуттары болады.

ALIGN атрибуты кесте тақырыбын шет жақтарға туралайды, оның мәні LEFT, CENTER (көрсетілмесе, келісім бойынша осы мән қабылданады), RIGHT сөздерінің біріне сәйкес келуі тиіс.

VALIGN атрибуты кесте тақырыбын вертикаль бағытта туралайды, ол TOP, MIDDLE, BOTTOM (келісім бойынша осы мән қабылданады), BASELINE сөздерінің бірін мән ретінде қабылдай алады.

Кесте жолы <TR> және </TR> тэгтерімен қоршалып тұрады, бұлардың алғашқысының мынадай бірсыпыра атрибуттары болуы мүмкін:

<TR ALIGN=”align” BGCOLOR=”#rrggbb”

BORDERCOLOR=”#rrggbb”> Кесте жолы... </TR>

Енді <TR> тэгінің атрибуттарына тоқталайық.

ALIGN жол шеттерін туралау. Оның мүмкін мәндері LEFT(келісім бойынша), CENTER, RIGHT

BGCOLOR жолдың ішкі фон түсін анықтайды (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгіленген түс атауы).

BORDERCOLOR жол жақтауларының сызықтарының түсі (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгіленген түс атауы); Бұл атрибут <TABLE> тэгінің BORDER атрибутының мәні нөлге тең болмағанда қолданылады.

Кесте жолындағы бағаналар (ұялар) <TD>...</TD> және <TH>...</TH> тэгтерімен төмендегі ережеге сәйкес анықталады.

<TD немесе TH ALIGN=”align” BACKGROUND=”url”

[BGCOLOR=”#rrggbb” BORDERCOLOR=”rrggbb” ]>

Бағана...</TD немесе /TH>

<TD> және <TH> тэгтерінің мынадай атрибуттары болады:

ALIGN мәтінді горизонталь бағытта туралау. Оның мүмкін мәндері: LEFT, CENTER(келісім бойынша), RIGHT

BGCOLOR фон түсі (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгіленген түс атауы).

BORDERCOLOR ұя жақтауларының түсі (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгіленген түс атауы). Бұл атрибут <TABLE> тэгінің BORDER атрибутының мәні нөлге тең болмағанда ғана қолданылады.

COLSPAN – бағаналар тақырыбына арналған жол (ұя) ішінде орналасатын бағаналар саны.

<TABLE ALIGN=”CENTER” BORDER=3 WIDHT=”80%”

BGCOLOR=YELLOW BORDERCOLOR=BLUE>

<CAPTION> <H2> Кесте тақырыбы </H2> </CAPTION>

<TR> <TD> Кестенің бірінші торы </TD> <TD> Кестенің екінші торы </TD> </TR>

</TABLE>

Бұл мысалда екі жолдан тұратын кесте тұрғызылады.

Ал келесі жолдарда үш бағанадан тұратын кестені салып көрейік:

<CAPTION ALIGN=”RIGHT”> Тақырып кестенің оң жақ бұрышына шығады </CAPTION>

<TR> <TН COLSPAN=”3”> Бағана тақырыбы </TН> <TR>

<TH> 1 бағана </TH> <TH> 2 бағана </TН> <TН> 3 бағана </TН> </TR>

<TR> <TD> 1 бағана мәліметтері </TD>

<TD> 2 бағана мәліметтері </TD>

<TD> 3 бағана мәліметтері </TD>

</TR>

</TABLE>

Графикалық объектілерді өңдеуді программалау: HTML – құжат ішіне графикалық объектілерді енгізу оңай, HTML - құжаттың сурет қойылатын жеріне тэгті жазып, ол жердегі файл атын сурет URL – на алмастыру керек.

Бұл жердегі SRC міндетті түрде жазылатын атрибут. Суретке баратын жолды көрсетеді – GIF, JPEG немесе PNG форматты файлдар.

Айтылған жағдайда броузер суретті көрсетілген жерге, оның алдындағы мәтіннің немесе басқа обьектінің оң жағына орналастырады.

Төмендегі мысалда бір сурет үш рет көрсетіледі. Үш ретте де сурет жолда көрсетіледі, сондықтан броузер оны алдындағы мәтіннің оң жағына орналастырады.

<HTML>

<HEAD>

<TITLE> IMG тэгін қолдану </TITLE>

</HEAD>

<BODY>

Бұл мәтін суреттен кейін орналасады.

<P> Бұл мәтін < IMG SRC=”DOG.gif > суретімен бөлінген.

<P> Мұндайда сурет мәтіннен кейін пайда болады.

< IMG SRC=”DOG.gif >

</BODY>

</HTML>

Суреті бар мәтінді жолда түзету ALIGN атрибутының көмегімен жүзеге асырады. Айтылмаған жағдайда, суретті жолға қойғанда мәтін суреттің төменгі жағы бойынша түзетіледі.Сіздің бұл түзетуді өзгерткіңіз келуі мүмкін, себебі бұл жағдайда көп бос орын қалады. Мұны IMG дискрипторындағы ALIGN атрибутының көмегімен жүзеге асыруға болады.

ALIGN=TOP -мәтінді суреттің жоғары жағымен туралайды;

ALIGN=MIDDLE –мәтінді суреттің ортасымен туралайды;

ALIGN=BOTTOM –мәтінді суреттің төмен жағымен туралайды;

ALIGN=LEFT –суретті сол жағы бойынша туралау.Мәтін суреттің оң жағына орналасады. ALIGN=RIGHT –суретті оң жағы бойынша туралау. Мәтін суреттің сол жағына орналасады. Төмендегі мысалда, жоғарыда айтылған үш түрлі туралау қолданылған, үш суреті бар HTML - құжат келтірілген.

<TITTLE>IMG дискрипт орында ALIGN атрибутын қолдану</TITTLE></HEAD><BODY><P>

Бұл мәтін суреттің жоғары жағы бойынша тураланады.</P><P>

Бұл мәтін суреттің ортасы бойынша тураланады. </P><P>

Бұл мәтін суреттің төменгі жағы бойынша тураланады. </P></BODY></HTML>

Келесі мысалда мәтіннің суретпен қатар орналасу варианттары көрсетілген.

<TITTLE> IMG& тәгінде ALIGN атрибутын қолдану </TITTLE></HEAD><BODY><P>

Бұл мәтін суреттің сол жағында және одан төмен орналасады.

</P><P>

Бұл мәтін суреттің сол жағында және одан төмен орналасады.

</P>

</BODY> </HTML>

Гипермәтін немесе графикалық объектілерді гиперсілтемелер – қосымша элементтерді басқару мақсатында ішіне арнаулы код, яғни екпінді элемент (archor) орналасқан мәтін. Ол мәтін ішіне сурет, дыбыс енгізу, мәтінді безендіру, пішімдеу (форматтау) ісін орындайтын немесе осы құжаттың басқа бөлігіне сілтемесі бар алғашқы нүкте ретінде қарастырылатын белгіленген сөз. Сөзді ерекшелеп белгілеу дегеніміз – келесі көрсетілетін құжат бөлігі қалай бейнеленетінін анықтайтын айрықша кодты осы сөз ішіне енгізу. Гипермәтінді бейнелеу үшін броузер (browsers) деп аталатын арнайы көрсету программалары қолданылады. Гипермәтін экранда белгіленген қарапайым сөз ретінде тұрады, егер курсорды сол сөзге жеткізіп, тышқанды шертсек (ENTER пернесін бассақ), онда сонымен байланысты (ол сілтеп тұрған) басқа құжатты оқимыз. Ол құжаттар мәліметтер ішіндегі басқа парақтарда немесе Web жүйесіндегі басқа тораптарда орналасып, бейнежазба, сурет, жазылған дыбыс күйінде болуы мүмкін.

Сонымен, мәтіндерді осылай байланыстыра отырып, белгілейтін мүмкіндікті беретін HTML тілі. Оның дұрыс нәтиже алуды қамтамасыз ететін өз заңдылықтары мен нәтижелері бар.

ҚОРЫТЫНДЫ

Қорыта айтқанда пакеті қуатты құралдар, графикалық дизайнның қиын тапсырмаларын оңайлатады, сан түрлі эффекттер, үш өлшемді графикамен жұмыс, растрлық объекттерді өңдеу және т.с.с. Corel DrawGraphics Suite 11 пакетінің өзіне теңдесі жоқ мықты графикалық пакет екендігін дәләлдейді.

“Adobe Photoshop” программасының қолдану салаларының түрлері әлі де көп. Қазір күннен күнге дамып, көбеюде. Сондықтан әлі бұл жұмысымның зерттелетін мәселелері бар.

Пайдаланылған әдебиеттер

1. О.Н.Рева. HTML. Просто как дважды два. Москва: Эксмо, 2007. – 256с.

2. С.Велихов. Справочник по HTML 4.0. Серия книг «Руководство по работе: советы, хитрости, трюки и секреты». Москва: Бук-пресс, 2006. – 412с.

3. Е.Л.Полонская. Язык HTML. Самоучитель.: - М.: Издательский дом «Вильяме», 2003. – 320с.

4. С.Луций. «Изучаем Photoshop». Санкт-Петербург, 2002.

5. Ю.А.Гурский, А.В.Васильев. Photoshop CS 2. Трюки и эффекты. – СПб.: Питер, 2004. – 555с.

Скачать	Размер файла
Corel Draw, Photoshop (қурстық жұмыс)	852 Kb

Банк рефератов

Corel Draw, Photoshop (қурстық жұмыс)

На русском языке

Қазақ тіліндегі

Новое на сайте