Tegi sarlavhaning tegidir, va hujjatga nom bеrish uchun hizmat qiladi hujjat nomi va

15-Amaliy mashg’ulot

Mazvu: Wеb-dizaynning uskunaviy vositalari

Ishdan maqsad: Wеb-dizaynning uskunaviy vositalari bo’yicha ko’rsatmalar berish.

Nazariy qism

Saytning eng birinchi bosqichi – bu asosiy sahifaning dizayinidir. Umuman olganda qanaqa dizaynli sayt yaratish kerak, shuni yodda tutish kerakki sayt bu bir guruh yig`indisi, 100 dan ortiq sahifalar, har bir sahifa uchun alohida dizayn qilish kerak emasku. Bugun man sizlarga qanday qilib sayt dizaynini qilish haqida o`rgatmoqchman, keyinchalik sayt yaratuvchi unda butunlay ishlashi uchun.

Hozirda veb saytlarning dizaynini tayyorlash uchun 2 xil dastur eng keng tarqalgandir. Ular:

1. 
   Adobe Photoshop
   
2. 
   Adobe Fireworks
   

Har ikki dasturning afzalliklari bor, Photoshop dasturi biroz qiyinroq. Uning imkoniyati ham ko’p. Chunki Photoshop – bu universal bo’lib uni dizaynning istalgan yo’nalishida ishlatish mumkin, Masalan Fotograf uchun ham, Naqqoshlar uchun ham, logotiplar yaratish uchun ham qo’l kelaveradi… Photoshopni o’zingiz mustaqil o’rganish qiyin. Siz uchun ustoz yoki biror darslik kerak bo’ladi

Fireworks esa aynan interfeys (sayt va dasturlarning dizayni) yaratish uchun moslangan, Unda ishlash ham juda oson. Hatto o’zingiz «kavlab» ham o’rganasiz… Bu dasturda ham boshqa vazifalarni bajarish mumkin. Masalan Logotiplar yoki rasmlarni bezatish kabi ishlarni qilish mumkin. Lekin ba’zi qiyin effektlar tayyorlashda baribir Photoshopga murojaat qilasiz…

Saytingiz dizayni haqida gapiradigan bo’lsak, unda asosan quyidagi sahifalar uchun dizayn qilasiz. Ammo ularning fon va menulari deyarli bir xil bo’lishi ham mumkin.

• 
  Bosh sahifa
  
• 
  Bo`limlar sahifasi
  
• 
  Maqolalar bo`limi
  
• 
  Ro`yhatdan o`tish sahifasi
  
• 
  Qidirish natijalarini chiqaruvchi sahifa
  
• 
  Baholash natijalarini chiqarish sahifasi
  
• 
  Foydalanuvchilarni qayta ishlash sahifasi…
  

Qolgan barcha sahifalar dizayinni kuchirmasi bilan bir xil bo`ladi va faqat o`rta qismi kontenti o`zgaradi.

Har bir foydalanuvchi WEB-sahifa yaratish uchun o’zining dasturini tanlaydi. By MS Front Page yoki Macromedia Dream Weaver, masalan, bloknotdan foydalanadi. Matn muxarrirlaridan uncha katta bulmagan sahifalar yaratishda foydalanish mumkin, chunki ularning kamchiliklari juda ko’pdir: loyihalar qo’llab-kuvvatlanmaydi, matn «podsvetka»si yuk, umuman ,ishlash juda noqulay. MS Front Pagening asosiy kamchiligi HTML-kodning kattaligi (ortikchasi ko’p), shuning uchun sahifa katta bo’ladi va yuklanish tezligiga ta`sir qiladi. Sahifachalar kiyshik chikadi, shuning uchun sifatli WEB-sahifa yaratish uchun paketlardan foydalanish tavsiya etiladi.  Macromedia Dream Weaver kompaniyasi WEB-saytlar yaratuvchi dasturlar ishlab chikarish buyicha lider va bu soxada yangiliklar yaratuvchi kompaniya hisoblanadi. Bu kompaniyaning  HTML-muxarriri oxirgi versiyasi – WYSIWYG –muxarrirlari kategoriyasiga kiruvchi Dream Weaver 3 bo’lib, bu paket juda ko’p  afzalliklarga ega: qulay interfeys, funktciyalar nastroykasi, katta loyihalarni qo’llab kuvvatlash (va Shock Wave texnologiyalarni) , FTP orqali fayllarni olish imkoniyati, SSI ni qo’llash va boshqalar.

Bu dasturda ishlash uchun HTMLni to’liq bilish shart emas.

Lekin Dream Weaverdan WYSIWYG texnologiyasini kullovchi boshqa muxarrirlar ancha oldinda, birinchi navbatda juda toza HTML-kod bilan. Keyingi muxarrir –HOME SITE 4sahifalarni kulda yaratish uchun, ya`ni HTML bilimdonlari uchun. Siz HTML-kod ustidan to’liq nazorat qilasiz va sahifangizni manna shu 3brauzer (MSIE, NN, Opera)da optimallashtishingiz mumkin. HOME SITE 2asosiy rejimdan iborat: Edit va Design.Design rejimi – WYSIWYG( HTML-kod chikaruvchi) muxarririga uxshash bo’lib, agar begona HTML-kod yuklasangiz, HOME SITE uni o’ziga moslashtirib o’zgartiradi. Edit rejimi sahifacha ustidan to’liq nazorat qilish imkonini beradi. Bunda siz hamma narsa , har bir teganing vazifasini o’zgartirishingiz mumkin. (bunda siz sahifaning har qanday brauzerida ham bir xil kurinadi).

 HOME SITEning yana bir ajralib turuvchi hususiyati shundaki, bu uning Dream Weaver bilan «skleyka»si. HOME SITEda «Dream Weaver» tugmasi bo’lib, shuningdek uning standart paketiga Kira oladi. Dream Weaver ham (HTML kodni tuzatish uchun muxarrir sifatida) HOME SITEga ulanish imkoniga ega. HTML-muxarrirlarining oxirgilaridan bo’lib, EVR soft 1^st Page 2000^2 hisoblanadi.

 Muxarrirda bir necha rejimlar: Normal, Easy, Advanced Expert va Hardcore bo’lib, siz o’zingizga mosini tanlab, keyinchalik esa yuqori darajalisiga o’tishingiz mumkin.Yana bir hususiyat – Java Script va DHTMLda katta skriplar kollektciyasining mavjudligi.

Grafik muxarrir.

Grafikani yaratish va optimallashtirish – murakkab va injik ishdir. WEB-sahifalarni grafikadan foydalanmagan holda ham yaratish mumkin. Bunda shriftlar, skriptlar va stillar jadvali (CSS) yordamida yaratiladi va bu ham chiroyli bo’ladi. Lekin hujjatning oxirgi ko’rinishi bir necha turli xil omillardan bog’liq bo’ladi, bularga: brauzer oynasining kengligi, brauzerning oldindan tayyorlanganligi , nom iva rangi kiradi. Bundan tashqarihamma skriptlar va stillar ham hamma brauzerlarga to’g’ri kelavermaydi.Agar grafika qo’llangan bulsa, sahifadan foydalanuvchi uni qanday qilingan bulsa , huddi shunday kuradi.

WEB-grafika bilan ishlashning asosiy murakkabligi shundaki, ko’p xollarda Internet kanallarining o’tkazuvchanlik kobiliyati past va sizning oldingizda grafik faylni qanday qilib kichikrok xajmli, lekin yaxshi sifatli qilish, uni optimallashtirishda qanday dasturlar va usullardan foydalanish muammolari paydo bo’ladi.

Vektorli varastrli grafik muxarrirlar rasmlarni qayta ishlashda kuchli asbob hisoblanadi. Bu muxarrirlarni kurib chiqishdan oldin vektorli va rastrli rasmlar orasidagi farkni ajratish lozim.Rastrli grafika setka (rastr) ko’rinishida bo’lib,uning yacheykalari piksellar deb ataladi. Rastrli rasmdagi har bir piksel aniq joy va ranga ega bo’lib, har qanday ob`ekt buyalgan piksellar to’plami ko’rinishida ifodalanadi. Bush uni anglatadiki, foydalanuvchi rastrli rasmlar bilan ishlayotganida u aniq bir ob`ekt ustida emas, balki uni tashkil etuvchi piksellar guruxi ustida ishlaydi.

Vektorli rasmlar vektorlar deb ataluvchi matematik figuralar asosida shakllanadi va rasm ko’rinishida vektorlar parametrlari bilan aniqlanadi.Boshqacha qilib aytganda, vektorli grafika koordinatalari ,rangi va boshqa parametrlari bo’lgan egri chiziqlar va biror rang bilan tuldirilgan yopik soxalardan iborat. Bu soxalarning chegaralari ham egri bo’ladi. Vektorli rasmlar saqlanadigan fayllarda egri chiziqlarning parametrlari va koordinatalari bo’ladi. Vektorli rasmlarni qayta ishlash natijasi asbobning imkoniyatidan bog’liq emas, shuning uchun siz uning parametrlarini (ulcham, rang, shakl va b.) o’zgartirsangiz ham sifatiga ta`sir kilmaydi. Vektorli grafika mayda shrift ulchamli  tcifrli ob`ektlar yaratishda yoki logotiplar yaratishda (ular uchun chegaralanmagan masshtablashtirishda ham konturlar aniqligi salanishi muhim).

Grafik muxarrirlar 2 ga bulinadi:rastrli va vektorli. Endi ulardan mashxurlarini kurib chikamiz. Rastrli grafik muxarrirlari.

Microsoft Paint. Microsoftning operatcion sistemasi standart postavkasiga kiruvchi oddiy muxarrir.Unda oddiy funktciya (kistochka, kalam, uchirgich va b.) Lar to’plami bo’lib, ular orqali har xil rasmlar chizish mumkin. Afsuski, grafikani qayta ishlashda undan foydalanib bulmaydi.

 Adobe Photoshop – bugungi kunda rastrli grafikani qayta ishlovchi eng kuchli paket.Turli xil filtrlar va effektlar to’plamidan iborat kompleks bo’lib, rastrli rassmlarni modifikatciya qilishning ko’p sonli imkoniyatlariga ega.Bundan tashqari mustakil ishlab chikaruvchilar instrumentlariga ulanish imkoniyati mavjud. Paket quyidagilarni , masalan, zararlangan rasmlarni qayta tiklash, tasavvurimizdagi turli xil fantastik kollajlarni yaratish vositalarini taklif qiladi.Umuman bu paket xakikatdan ham yuqori potentcialga ega. 5.5 versiyasidan boshlab, paketga Adobe Image Ready (P.5.6) dasturi kiritildi. Bu dastur WEBdagi grafikalarni qayta ishlash buyicha katta imkoniyatlarga ega.(rasmlarni optimallashtirish, animatciyalangan gifni yaratish , rasmlarni mayda bulaklarga «kirkish» va b.)

 Adobe Photoshop yaratuvchilari – faqat texnik mukammallikni emas, balki ijod mustakilligini ham taklif qiladi.

PhotoPaint-Core 1 Draw paketi grafik muxarrirlardan biri bo’lib, rastrli grafikani qayta ishlash buyicha Adobe Photoshop bilan rakobatlasha oladi. Bunda grafikani qayta ishlash uchun muhim bo’lgan turli xil filtrlar, teksturalar instrumentlari mavjud. Ishlashdagi qulaylik, interfeys va filtrlarni qo’yish tezligida fark qiladi.

Painter – muxarrir chizishning real instrumentlari: grafit, mel,moy va b. ni emulyatciya qilish imkoniyatini beradi WEB-sahifa yoki fonli rasmlarni surat ko’rinishida ishlab chiqishda qulaydir. Bu dasturdan foydalangan paytda o’zingizni huddi xakikiy rassomday sezasiz.Yana bir qancha muxarrirlar (Microsoft Photo Editor, Microsoft Photo DRAW) mavjud bo’lib, ular oddiy topshiriqlarni bajarish imkonini beradi.

   Vektorli grafika muxarrirlari.

Adobe Illustrator – vektorli grafikani yaratish ,qayta ishlash va taxrir qilish imkonini beruvchi paketdir. U Adobe Photoshop muxarriri bilan teng kuchga ega bo’lib; bir xil interfeysga ega, turli filtr va effektlarni ulaydi, turli grafik formatlar, xatto cdr (Corel Draw) va swf (Flash)ni tushunadi.

Corel Draw  – vektorli grafikani qayta ishlovchi paketdir. Paket o’zining kuchiga karab, grafik muxarrirlar Adobe Photoshop va Adobe Illustratordan kolishmaydi. Vektorli grafikani qayta ishlash bilan bir katorda rastrli grafikani ham qayta ishlovchi (PhotoPaint) , rasmlarni trassirovkachi, shriftlar muxarriri , teksturalarni tayyorlash va shtrix kodlarni yaratish, shuningdek juda katta rasmlar kollektciyasi (Corel Gallery) mavjud.

Adobe Streamline – Adobe firmasining yana bir mahsuloti bo’lib, rastrli grafikani vektorliga aylantirishga muljallangan. Bu uncha katta bulmagan, lekin foydali va kuchli mahsulot. Asosan, WEB-sahifani vektorli grafika yordamida yaratayotgan bulsangiz, masalan, Flash texnologiyasida, foydali bo’ladi.