ОәК 042-33 101/03-2013 №1 басылым 03. 09. 2013



жүктеу 5,89 Mb.
Дата28.01.2020
өлшемі5,89 Mb.
#27511

ОӘК 042-33.1.101/03-2013

№1 басылым 03.09.2013

беттен бет


ҚАЗАҚСТАН РЕСПУБЛИКАСЫНЫҢ БІЛІМ ЖӘНЕ ҒЫЛЫМ МИНИСТРЛІГІ

ШӘКӘРІМ АТЫНДАҒЫ СЕМЕЙ МЕМЛЕКЕТТІК УНИВЕРСИТЕТІ





СМК құжатының 3-деңгейі

ОӘК

ОӘК 042-33.1.101/03-2013

ОӘК

«Web дизайн» пәнінен оқу - методикалық материалдар



№1 басылым

03.09.2013



ОҚУ-ӘДІСТЕМЕЛІК КЕШЕН

«Web дизайн»
5В042100 – «Дизайн» мамандығына

ОҚУ-МЕТОДИКАЛЫҚ МАТЕРИАЛДАР

Семей


2013

Мазмұны

1 Глоссарий

3

2 Дәріс

4

3 Тәжірибелі сабақ

14

4 Курстық жоба

17

5 Студенттердің өздік жұмыстары

17


1 ГЛОССАРИЙ
Web-бет дизайны – бұл ақпараттық дизайн.

Web-дизайн - өзіне визуалды дизайнды енгізеді.

Web – сайттың картасы – серверде жеке белгіленген бет, сайттың толық текстурасы бар;

HTML (HyperTextMarkupLanguage) – бұл құжаттарды кодтау үшін қолданылатын гипертекстік белгілеу тілі.

HTML тiлiнде колданылатын командаларды "тег” деп айтамыз.

Банерлік жарнама – интернеттегі жарнаманың ең ежелгі түрлерінің бірі.

Плакат – жарнама ақпараттың графикалық тасушысы, тікбұрышты пішінді, анимация ретінде жасалынады, gif форматтағы файлға негізделенеді.

Фондық сурет – шағын төртбұрышқа орналасқан суреті бар графикалық файл.

Фон ретінде пайдаланылатын сурет тегінде көрсетіледі.

Designer – бұл ең алдымен графикалық редактормен жұмыс істейтін дизайнерлер үшін бағытталған

Developer – Web-жариялымдарын құру үшін Flash МХ-ты қолдануында жұмыс істейтін құрушылар үшін бағытталған

General – жалпы жағдайлар үшін

Tool (құрал-саймандар) – нақты құралдарды таңдау батырмасы орналасқан; бұл құралдарды 2 түрге бөледі: таңдау және сурет салу құралдары

View (Түр) кескіннің көру құралдарын басқару, бұл өрісте 2 батырма орналасқан

Hand Tool (Қол) – батырманы шерту арқылы режім қосылады және жұмыс облысын тышқан көмегімен әртүрлі бағытта орналастыруға мүмкіндік береді

Zoom Tool (Масштаб) – жұмыс облысындағы батырманы шерту арқылы тез масштабтау режимі қосылады және бұл режимді қосқанда Options  өрісінде екі қосымша батырмалар пайда болатын масштабтау бағытын таңдау үшін рұқсат етеді (үлкейту немесе кішірейту).



2 ДӘРІС

1- дәріс

Тақырып: Web-бет дизайны

Қазақстан Республикасының білім беру жүйесін ақпараттандыру еліміздің даму стратегиясының негізгі бағыттарының бірі, себебі ХХІ ғасыр – білім беру жүйесін ақпараттандыру ғасыры.

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

Интеренетте материалды жариялау тиімді болу үшін ол Web-дизайн ережелеріне сәйкес болу керек. Демек, Web-дизайн негіздерін білу кез келген мамандықта қажет болады, өткені Web-бет дизайны – бұл ақпараттық дизайн.


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

Web – дизайн

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

Рынокта екі басты браузер бар: Netscape Navigator және Microsoft Internet Explorer. Бірлесіп олар барлық версияны енгізеді, шамалы 90 % (немесе одан да көп) осы кезде қолданылатын браузерлер.

Осы екі браузер рынокта бірінші орынға бір – бірімен бәсекелеседі. Басқа жағынан Netscape және Microsoft ортасындағы бәсеке, Web - тің үлкен дамуына әкелді.

Сайт дизайні

Сервердің дизайні біртұтас болуы керек, оның басты ойы және ақпарат мазмұны. Оның структурасы, веб – беттерін безендіруі, графикалық бейнелер және олардың саны, салмағы осының бәрі сервердің біртұтас аудиториясына бейімді болу керек.

Бірталай жиынтық новигациялар бар. Навигацияны жасаушысына келесі элементтер жатады:


  • Рационом – веб – сайттың басты тараулар тізімі.

  • Веб – сайттың картасы – серверде жеке белгіленген бет, сайттың толық текстурасы бар;

  • Өткен бетке оралу немесе басқа бетке көшу веб – сайттың ссылкалар, осы немесе басқа тәсілмен ерекшелеу;

  • Іздеу автомашина – веб – сайтта бар ақпараттың ішіннен іздеп табу үшін арналған.

2-дәріс

Тақырып: Қазіргі замандағы Интернет-технологиялар

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

Бұның негізгі белгісі Интернет-жобаларға өсіп жатқан инвестициялар, Web-сайттардың күрделі білімдік, ғылыми, комерциялық мүмкіндіктері. Интернет технологиялар төмендегі жолдармен дамып келе жатыр:


  • Web-технологиялар;

  • Сайт жасау экономикасы;

  • Web-дизайн және Web-программалау маркетингісі;

  • Адам ресурстары және т.б.

Web-сайт жасақтау жұмысын бірнеше кезеңден турады:

  • Жоспарлау;

  • Элементтерді жасақтау;

  • Бағдарламау;

  • Тестілеу;

  • Жариялау;

  • Жарнамалау;

  • Бақылау;

Жоспарлау кезеңінде төменгі мәселелер шешілуі керек:

  1. Сайттың орны.

  2. Сайттың аудиториясы кімдер.

  3. Қандай ақпарат жарияланады.

  4. Қолданушылармен қарым-қатынас қандай түрде ұйымдастырылады.

Элементтерді жасақтау кезеңінде сайттың программалық өнім түрінде жүзеге асырылуы қарастырылады:

  1. Навигациялық құрылымын жасау.

  2. Беттің дизайнын жасау.

  3. Бетті толтыру үшін мәтіндік және бейне ақпаратты әзірлеу.


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

Тестілеу
Сайт жасаудың негізгі кезеңдерінің бірі тестілеу. Тестілеу кезеңде сайттың жұмыс істеу дұрыстылығы тексеріледі, оның ішінде:

  1. Сілтеменің жұмысы;

  2. Мәтіндегі қателер;

  3. Навигацияның тиімділіғі.

  4. Пошта және басқа формалардың дұрыстығы.

  5. Графикалық файлдардың ашылуы.

  6. Әр түрлі браузерлерде сайттық жұмысы.


Жариялау

Тест аяқталғандан кейін Web-сайт серверде жарияланады және қайтадан тексеріленеді.


Жарнамалау

Web-қоғамдастығына жаңадан жарияланған сайт тұралы белгілі болу үшін сайттың адресін және ол жердегі материал туралы аннотацияны хабарлау керек. Осы мақсатқа жету үшін келесі мүмкіндіктерді пайдалануға болады:


1. Web-cайт адресін әр түрлі баспаларға жазу керек;

2. Web-сайтты әр түрлі серверлерде тіркеу;

3. Web-cайтқа сілтемелерді басқа Web-сайттарқа кіргізу;

4. Баннерлерді жарнама ретінде қолдану.


Бақылау

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


3 – дәріс

Тақырып: HTML негіздері

HTML (HyperTextMarkupLanguage) – бұл құжаттарды кодтау үшін қолданылатын гипертекстік белгілеу тілі. HTML ді көбі программалау тілі деп ойласа да, бұл программалау тілі емес. HTML – мәтінді белгілеу тілі.


HTML құжаттарды көру үшін браузерларды қолданамыз. Браузер-программалардың саны өте көп, мысалы көп таралғандар Netscape Communicator, Microsoft Internet Explorer, Opera.

HTML тiлiнде колданылатын командаларды "тег” деп айтамыз. HTML тiліндегi тегтер екi топқа бөлiнедi: жұпты, жұпсыз.

Жұпты тегтер дегенiмiз, бiр тег ашылса, келесi тег оны жабады. Мысалы, тегтiң жұмысын ашады да келесi тегi оны жабады. ашылуы, жабылуы. Жұпсыз тегтер дегенiмiз, тег ашылады да қолданыла бередi. Мысалы, т.с.с.

Көрсетілген мысалдарды компьютерде көрү үшін мәтінді Блокнот программасына теріп, оны htm түрінде сақтаңыз. Файлды браузерде ашыңыз.


Құжаттың структурасы HTML құжаттың негізгі структурасы төмендегідей:


<br />… <br />



тегімен басталынатын негізгі бөлімнен.

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



, тегтерінің арасында құжаттың аты жазылады, сол сөз терезенің тақырып жолына шығады.

Мысалы:
Моя первая страница



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

- сайт тілі

- сайт авторы

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

Мәтінді форматтау тегтері

Құжатта тақырыптар , тегтерімен жасалынады, бұл жерде і=1 болғанда ең үлкен тақырып жазылады, і=6 болғанда – ең кіші.

Мысалы,
Көрінетін мәтін

HTML де жазылуы

Заголовок1


Заголовок1

Заголовок2


Заголовок2

Заголовок3


Заголовок3

Заголовок4


Заголовок4

Заголовок5


Заголовок5

Заголовок6


Заголовок6

Абзац енгізу үшін


,
тегтерін қолданады, мәтіннің сол жақ, ортада, оң жақта орнату үшін align атрибуты пайдалынады.

Мысалы:


Менің бірінші бетім


«Менің бірінші бетім» сөйлемі беттің ортасына орналасады.
Align дің мәні тағыда left (сол жақ), right (оң жақ) болуы мүмкін.
тегінің көмегімен біз мәтіннің шрифтің, көлемін, түсін белгілейміз. Ол үшін атрибуттарды пайдаланамыз.

Мысалы:


Менің бірінші бетім

Осындай жол жазғанда Web бетімізде arial шрифтімен, 5-көлемде, көк түсті

«Менің бірінші бетім» деген сөйлем шығады.

Жолды бөлү үшін


тегін қолданса болады, мысалы:

Ана тілін – арың бұл,

Ұятын боп тұр бетте

Қаратырылған әріптерді пайдалану үшін мәтінді , тегтерінің ортасына аламыз, қиғаш әріптер үшін - ,.

Мысалы:
Көрінетін мәтін

HTML де жазылуы

Менің бірінші бетім

Менің бірінші бетім

Менің бірінші бетім

Менің бірінші бетім

Менің бірінші бетім

Менің бірінші бетім


,
тегтері мәтін редакторда қандай жазылған болса, сол бойынша браузерге шығарады, мысалы:

Ана тілін – арың бұл,

Ұятын боп тұр бетте.

Өзге тілдің бәрін біл,

Өз тіліңді құрметте

Тізім
Нөмірленген тізімді ұйымдастыру үшін

    және тегтері

    қолданылады.


      Қолданылған әдебиеттер тізімі

    1. Полонская Е.П. Самоучитель HTML

    2. Мержевич В. Создание Web страниц



    Егер тізім номерін керекті бір номермен бастау керек болса онда start атрибутын пайдалынамыз, мысалы:

      Қолданылған әдебиеттер тізімі

    1. Полонская Е.П. Самоучитель HTML

    2. Мержевич В. Создание Web страниц



    Тізімдің түрін өзгерту үшін type атрибуты көмектеседі, мысалы номерлерді латын цифрларымен жазу үшін төмендігідей жазамыз

      Қолданылған әдебиеттер тізімі

    1. Полонская Е.П. Самоучитель HTML

    2. Мержевич В. Создание Web страниц



    Маркерлік тізімді жазғанда

жүктеу 5,89 Mb.

Достарыңызбен бөлісу:




©g.engime.org 2024
әкімшілігінің қараңыз

    Басты бет
рсетілетін қызмет
халықаралық қаржы
Астана халықаралық
қызмет регламенті
бекіту туралы
туралы ережені
орталығы туралы
субсидиялау мемлекеттік
кеңес туралы
ніндегі кеңес
орталығын басқару
қаржы орталығын
қаржы орталығы
құрамын бекіту
неркәсіптік кешен
міндетті құпия
болуына ерікті
тексерілу мемлекеттік
медициналық тексерілу
құпия медициналық
ерікті анонимді
Бастауыш тәлім
қатысуға жолдамалар
қызметшілері арасындағы
академиялық демалыс
алушыларға академиялық
білім алушыларға
ұйымдарында білім
туралы хабарландыру
конкурс туралы
мемлекеттік қызметшілері
мемлекеттік әкімшілік
органдардың мемлекеттік
мемлекеттік органдардың
барлық мемлекеттік
арналған барлық
орналасуға арналған
лауазымына орналасуға
әкімшілік лауазымына
инфекцияның болуына
жәрдемдесудің белсенді
шараларына қатысуға
саласындағы дайындаушы
ленген қосылған
шегінде бюджетке
салығы шегінде
есептелген қосылған
ұйымдарға есептелген
дайындаушы ұйымдарға
кешен саласындағы
сомасын субсидиялау