Ochiq
Yopish

Moslashuvchan tartib: bu nima va undan qanday foydalanish kerak. Moslashuvchan interfeyslar Foydali xizmatlar va vositalar

Ayni paytda eng ko'p tashrif buyurilgan 100 000 ta saytning taxminan 11-12 foizi sezgir va keyingi bir necha yil ichida bu raqam yanada oshishiga shubha yo'q.

Ko'proq tashkilotlar ko'p qurilmali veb haqiqatlarini qabul qilish uchun yenglarini shimarib, nirvanaga erishish uchun ishlatiladigan bir nechta strategiyalarni ko'rib chiqishga arziydi:

Moslashuvchan modernizatsiya

Ta'sirchan qayta dizayn - bu faqat ish stoli uchun mavjud bo'lgan veb-saytni olish va "uni sezgir tarzda qayta qurish" jarayoni.

Tayyor saytlar (ayniqsa, tijorat) haqida gap ketganda, jamoalar har doim ham hamma narsani tashlab, qayta qurish imkoniyatiga ega emas.
Dan Sederholm

Aksariyat tashkilotlar uchun noldan yangi dizaynni keng miqyosda yaratish hatto hisobga olinmaydi. Shuning uchun sezgir modernizatsiya mobil qurilmalar uchun yaxshi tajriba yaratishning mashhur usuli hisoblanadi.

Afzalliklar
  • Nisbatan tez.
    Moslashuvchan modernizatsiya qilishning bir qancha usullari mavjud, bu strategiya saytga small-screens.css faylini qo'shish bo'lishi mumkin. Bunday qo'pol misolga qaramay, moslashuvchan modernizatsiya ko'plab tashkilotlar uchun jozibali variantdir, chunki u hamma narsani noldan qayta qurishni talab qilmaydi.
  • Tanish.
    Foydalanuvchilarni chalkashtirib yubormaydi. Odamlar interfeysga ko'nikish uchun yillar sarfladilar va mavjudini modernizatsiya qilish orqali tashkilotlar mobil qurilmalar bilan odamlarning hayotini yaxshilash bilan birga tanish yondashuvni saqlab qolishdi.
  • Tashkiliy jihatdan tezroq.
    Siyosiy nuqtai nazardan, interfeysni modernizatsiya qilish noldan boshlashdan ko'ra xavfsizroqdir. Yashil rangning qaysi soyasini tanlash, qanday arzimas birja fotosuratlarini ishlatish haqida bahs-munozaralar kamroq bo'ladi va menejment qo'llarini burishishi shart emas. Bu jamoalarga sezgir saytlarni tezroq ishga tushirish imkonini beradi.
Kamchiliklar
  • Faqat kichik bir qismga ta'sir qiladi.
    Shunga qaramay, qayta qurishning ko'plab variantlari mavjud, ammo ularning ko'pchiligining maqsadi "uni chiroyli qilish". Tartibni qayta loyihalashga e'tibor qaratgan holda, qayta dizaynlar ko'pincha turli xil qurilmalar uchun muvaffaqiyatli dizaynni yaratishda e'tiborga olinishi kerak bo'lgan ko'plab boshqa omillarni o'tkazib yuboradi.
  • Uch litrli idishda 10 litr suv.
    Ish stoli saytlari faqat ish stoli kompyuterlari uchun moʻljallanganligi sababli (va koʻpincha uzoq vaqt xizmat qiladi), ular juda koʻp tartibsizliklarni oʻz ichiga olishi mumkin. Va modernizatsiya asosan tartibni qayta eritishdan iborat bo'lganligi sababli, kontent bilan bog'liq muammolarning aksariyati to'liq hisobga olinmaydi.
  • Ishlash.
    Kichik qurilmalarni yaxshiroq qo'llab-quvvatlash uchun kod yozishda g'alati narsa bor. Keraksiz narsalarni olib tashlash juda uzoqqa borishi mumkin, ammo unumdorlikka e'tibor bermasdan, u o'z-o'zidan o'smaydi.
  • Eng yomon qo'llab-quvvatlash.
    Dastlab ish stoli kompyuterlari uchun moʻljallangan media soʻrovlar aksariyat mobil qurilmalarda kam quvvatlanadi.
  • Vaqtinchalik tuzatishlar.
    Odamlar mendan biror narsaga “javob berishni” so‘rashlarini eshitganimda, go‘yo bu loyiha rejasidagi belgi qutisidek (ba’zida shunday bo‘ladi) o‘limni his qilaman. Cheklangan fikrlashning bunday turi sezgir dizayn taqdim etadigan haqiqiy imkoniyatlarni o'tkazib yuboradi.
Responsive mobil veb-saytlar Responsive mobil veb-saytlar yoki men ularni “muvofiq kelajak uchun urug‘lar” deb ataganimdek, sezgir dizayn texnikasidan foydalangan holda “m.yourdomain.ru” formatida alohida veb-sayt yaratish amaliyotidir. The BBC, The Guardian va Entertainment Weekly (men ishlagan) kabi saytlar bu strategiyadan foydalanadi.


Mobil versiya sizning eski veb-saytingizdan o'sadigan urug'ni ekish imkoniyatini beradi.


Vaqt o'tishi bilan eskirgan sayt o'chirilishi mumkin va sayt birinchi navbatda mobil, sezgir va kelajakdagi tendentsiyalarni hisobga olgan holda rivojlanadi.

Afzalliklar
  • Pastroq xavf.
    Aksariyat tashkilotlar hali ham mobil qurilmalardan trafikni ozchilik deb bilishadi. Shunday qilib, mobil javob beruvchi veb-saytni ishga tushirish ushbu tashkilotlarga birinchi navbatda mavzu boshiga o'tmasdan suvni sinab ko'rish imkonini beradi.
  • Moslashuvchan bo'lishni o'rganish imkoniyati.
    Dizaynerlar yanada moslashuvchan fikrlashni o'rganishlari mumkin. Ishlab chiquvchilar Android qurilmalarining son-sanoqsiz fokuslarini o'rganadilar. Menejerlar piksel mukammalligidan qanday uzoqlashishni aniqlashlari mumkin. Ta'sirchan mobil sayt o'rganish uchun ajoyib sandbox bo'lishi mumkin.
  • Infratuzilma.
    Jamoalar tasvir yaratish kabi kontentni boshqarish muammolarini bir marta va umuman hal qilishni o'rganishi mumkin
  • Ortiqcha narsalarni olib tashlang.
    Ushbu yondashuv jamoalarga o'zlariga "bu bizga haqiqatan ham kerakmi" deb so'rash uchun ajoyib imkoniyatni taqdim etadi va shu bilan birga ishlashga e'tibor qaratadi. Nega? Chunki ularning asosiy e'tibori mobil qurilmalarda o'z saytining foydalanuvchi tajribasini yaxshilashga qaratilgan.
  • Kelajak mobil-birinchi veb-saytlardir.
    Garchi dastlab kontent yoki funksionallikdan mahrum bo'lsa-da, etarli vaqt va kuch bilan ushbu mobil saytlar oxir-oqibat to'liq sahifali ajdodlarini almashtirishi mumkin.
Kamchiliklar
  • Bu hali ham mobil sayt.
    Bu javob beradimi yoki yo'qmi, bu yondashuv hali ham mobil saytlarning ko'plab kamchiliklarini saqlab qoladi: URL manzilini qayta yo'naltirish, kontentni boshqarish, izchil kontent, izchillik, SEO optimallashtirish va boshqalar bilan bog'liq muammolar.
  • Vaqtinchalik tuzatishlar.
    Ko'pgina mobil saytlar qon ketishini to'xtatish uchun Band-Aid sifatida yaratilgan. Bunday saytlar mobil qurilmalardan kelayotgan ortib borayotgan trafikni tushirish maqsadida yaratilgan. Ushbu echimlar mavjud ehtiyojlarni qondirishi mumkin, ammo kelajakdagi tendentsiyalarni hisobga olsak, ular sizni uzoq muddatda qutqarishi dargumon.
  • Uzumzorda qurib ketish ehtimoli.
    Ba'zi tashkilotlar bunday loyihalarni boshlab, yarmini bosib o'tib, keyingi yil byudjeti qabul qilinmaguncha hamma narsadan voz kechishi mumkin.
  • Kichik ekranlar uchun dizayn.
    Dastlabki e'tibor kichik ekranlarga qaratilganligi sababli, keyinchalik sifatni yo'qotmasdan interfeysni kattaroq displeylarga o'tkazish qiyin bo'lishi mumkin.
Mahalliy mobil qurilmalar uchun sezgir dizayn
Kamchiliklar
  • 50 nomukammallik soyalari.
    Ushbu yondashuv muvaffaqiyatsiz bo'lishi mumkin, chunki foydalanuvchilar eski va yangi bo'lgan Frankenshteyn interfeysi bilan shug'ullanishlari kerak.
  • Uzumzorda qurib ketish ehtimoli.
    Ushbu turdagi loyihalar aniq yakuniy maqsadlarni talab qiladi yoki ular abadiy tozalashda qolib ketishlari mumkin.
  • Texnik hamkorlik.
    Eng so'nggi texnologiyalar va texnikalardan foydalangan holda bitta modul eskirgan modul bilan to'qnashganda nima bo'ladi? Ushbu yondashuv uchun ko'plab arxitektura qiyinchiliklari mavjud.
"Men Chevy Chaseman, siz emassiz." Albatta, har bir tashkilot har xil, shuning uchun qaysi yo'lni tanlash turli omillarga bog'liq. Vaqt, byudjet, ko'lam, tashkiliy tuzilma, malakalar to'plami va boshqa ko'plab omillar qaysi strategiyani amalga oshirish yaxshiroq ekanligiga ta'sir qiladi. Ammo vaqt o'tishi bilan tashkilotlar Internetga kirish imkoniga ega bo'lgan turli xil qurilmalar ustida ishlashlari kerakligi tobora ayon bo'ldi.

Bu sarlovhasi Bred Frostning “Responsive strategiya” sarlavhali maqolasi bo’lgan maqola yangiliklar.net saytiga kiritilgan. UXDepot tomonidan muallifning roziligi bilan tarjima qilingan.

Tarjimonlardan PS: Umid qilamanki, sizga maqola yoqdi. Tarjimadagi xatolarni bizga ko'rsatsangiz, biz ularni tezda tuzatishimiz uchun xursand bo'lamiz. Bizga yozing [elektron pochta himoyalangan], Iltimos:)

Moslashuvchan tartib foydalanuvchi xatti-harakati, platformasi, ekran o'lchami va qurilma yo'nalishiga qarab sahifa dizaynini o'zgartiradi va zamonaviy veb-ishlab chiqishning ajralmas qismidir. Bu sizga sezilarli darajada tejash imkonini beradi va har bir rezolyutsiya uchun yangi dizaynni chizishingiz shart emas, balki alohida elementlarning o'lchami va joylashishini o'zgartiring.

Ushbu maqolada saytning asosiy elementlari va ularni qanday moslashtirish ko'rib chiqiladi.

Ekran o'lchamlarini sozlash

Asos sifatida, siz qurilmalarni turli toifalarga bo'lishingiz va ularning har biri uchun alohida dizayn qilishingiz mumkin, ammo bu juda ko'p vaqtni oladi va besh yil ichida qanday standartlar bo'lishini kim biladi? Bundan tashqari, statistik ma'lumotlarga ko'ra, bizda turli xil rezolyutsiyalar mavjud:

Biz har bir qurilma uchun alohida dizaynni davom ettira olmasligimiz ayon bo'ladi. Ammo keyin nima qilish kerak?

Qisman yechim: hamma narsani moslashuvchan qiling

Albatta, bu mukammal usul emas, lekin u ko'pgina muammolarni bartaraf qiladi.

Ethan Markotte sezgir tartibdan foydalanishni ko'rsatadigan oddiy shablonni yaratdi:

Bir qarashda hamma narsa oson bo'lib tuyulishi mumkin, ammo unday emas. Logotipga qarang:

Agar siz butun tasvirni qisqartirsangiz, yozuvlarni o'qib bo'lmaydi. Shuning uchun, logotipni saqlash uchun rasm ikki qismga bo'linadi: birinchi qism (illyustratsiya) fon sifatida ishlatiladi, ikkinchisi (logotip) uning hajmini proportsional ravishda o'zgartiradi.

h1 elementi fon sifatida tasvirni o'z ichiga oladi va tasvir konteyner (sarlavha) foniga moslashtiriladi.

Moslashuvchan tasvirlar

Tasvirlar bilan ishlash sezgir dizayn bilan ishlashda eng muhim muammolardan biridir. Tasvirlarning hajmini o'zgartirishning ko'plab usullari mavjud va ularning aksariyatini amalga oshirish juda oddiy. Bitta yechim CSS-da maksimal kenglikdan foydalanishdir:

Img (maksimal kenglik: 100%;)

Tasvirning maksimal kengligi ekran yoki brauzer oynasi kengligining 100% ni tashkil qiladi, shuning uchun kenglik qanchalik kichik bo'lsa, tasvir kichikroq bo'ladi. E'tibor bering, IE da maksimal kenglik qo'llab-quvvatlanmaydi, shuning uchun kenglikdan foydalaning: 100% .

Taqdim etilgan usul moslashtirilgan tasvirlarni yaratish uchun yaxshi imkoniyatdir, lekin faqat o'lchamini o'zgartirib, biz rasmning og'irligini bir xil qoldiramiz, bu mobil qurilmalarda yuklash vaqtini oshiradi.

Boshqa usul: sezgir tasvirlar

Filament Group tomonidan joriy etilgan texnika nafaqat tasvirlarning o‘lchamini o‘zgartiradi, balki yuklashni tezlashtirish uchun kichik ekranlardagi tasvirlarning ruxsatini ham siqib chiqaradi.

Ushbu usul Github-da mavjud bo'lgan bir nechta fayllarni talab qiladi. Avval JavaScript faylini olamiz ( rwd-images.js), fayl .htaccess Va rwd.gif(tasvir fayli). Keyin biz katta va kichik o'lchamlarni bog'lash uchun ba'zi HTML-dan foydalanamiz: birinchi navbatda prefiksli kichik rasm .r(tasvir sezgir bo'lishi kerakligini ko'rsatish uchun), keyin data-fullsrc yordamida katta rasmga havola qiling:

Kengligi 480 px dan yuqori boʻlgan har qanday ekran uchun yuqori aniqlikdagi tasvir yuklanadi ( largeRes.jpg) va kichik ekranlarda u yuklanadi ( smallRes.jpg).

iPhone va iPod Touch-ning o'ziga xos xususiyati bor: katta ekranlar uchun yaratilgan dizayn aylantirish yoki qo'shimcha mobil joylashuvsiz kichik o'lchamli brauzerda shunchaki qisqaradi. Biroq, rasmlar va matnlar ko'rinmaydi:

Ushbu muammoni hal qilish uchun meta tegdan foydalaning:

Agar boshlang'ich masshtab birga teng bo'lsa, tasvirlarning kengligi ekranning kengligiga teng bo'ladi.

Moslashtirilgan sahifa tartibi tuzilishi

Sahifa o'lchamidagi sezilarli o'zgarishlar uchun siz elementlarning umumiy tartibini o'zgartirishingiz kerak bo'lishi mumkin. Buni alohida uslublar fayli orqali yoki yanada samaraliroq, CSS media so'rovi orqali amalga oshirish mumkin. Hech qanday muammo bo'lmasligi kerak, chunki ko'pchilik uslublar bir xil bo'lib qoladi va faqat bir nechtasi o'zgaradi.

Masalan, sizda ranglar, fon va shriftlar bilan birga #wrapper , #content , #sidebar , #nav ni belgilaydigan asosiy uslub faylingiz bor. Agar sizning asosiy uslublaringiz tartibingizni juda tor, qisqa, keng yoki baland qilib qo'ysa, siz buni aniqlab, yangi uslublarni qo'shishingiz mumkin.

style.css (asosiy):

/* Bolalar uslublar jadvali tomonidan meros qilib olinadigan asosiy uslublar */ html,body( fon... shrift... rang... ) h1,h2,h3() p, blockquote, pre, code, ol, ul () /* Strukturaviy elementlar */ #wrapper( kengligi: 80%; chekka: 0 avto; fon: #fff; toʻldirish: 20px; ) #content( kenglik: 54%; float: chap; chekka-oʻng: 3%; ) # sidebar-left (kenglik: 20%; float: chap; hoshiya-o'ng: 3%; ) #sidebar-o'ng (kenglik: 20%; float: chap; )

mobile.css (bola):

#wrapper( width: 90%; ) #content( width: 100%; ) #sidebar-left( width: 100%; clear: both; /* Yangi dizayn uchun qoʻshimcha uslublar */ border-top: 1px qattiq #ccc ; margin-top: 20px; ) #sidebar-right( width: 100%; clear: both; /* Bizning yangi tartib uchun qoʻshimcha uslublar */ border-top: 1px solid #ccc; margin-top: 20px; )

Keng ekranda chap va o'ng yon panellar yon tomonga yaxshi mos tushadi. Torroq ekranlarda bu bloklar kattaroq qulaylik uchun bir-birining ostida joylashgan.

CSS3 media so'rovlari

Keling, sezgir dizaynlarni yaratish uchun CSS3 media so'rovlaridan qanday foydalanishingiz mumkinligini ko'rib chiqaylik. min-width ma'lum uslublar qo'llaniladigan brauzer oynasi yoki ekranining minimal kengligini belgilaydi. Agar biron bir qiymat min-width dan past bo'lsa, uslublar e'tiborga olinmaydi. max-width buning aksini qiladi.

@media ekrani va (min-kengligi: 600px) ( .hereIsMyClass (kengligi: 30%; float: oʻng; ) )

Media so'rovi faqat min-kenglik 600 pikseldan katta yoki unga teng bo'lganda ishlaydi.

@media ekrani va (maksimal kenglik: 600px) ( .aClassforSmallScreens (aniq: ikkalasi; shrift oʻlchami: 1.3em; ) )

Bu holda sinf ( aClassforSmallscreens) ekran kengligi 600 pikseldan kam yoki unga teng bo'lganda ishlaydi.

Minimum kenglik va maksimal kenglik ekran kengligi va brauzer oynasi kengligi uchun qo'llanilishi mumkin bo'lsa-da, biz faqat qurilma kengligi bilan ishlashimiz kerak bo'lishi mumkin. Masalan, kichik oynada ochilgan brauzerlarni e'tiborsiz qoldirish. Buning uchun min-device-width va max-device-width dan foydalanishingiz mumkin:

@media ekrani va (maksimal qurilma kengligi: 480px) ( .classForiPhoneDisplay ( shrift oʻlchami: 1.2em; ) ) @media ekrani va (minimum qurilma kengligi: 768px) ( .minimumiPadWidth ( aniq: ikkalasi; pastki chegarasi) : 2px qattiq #ccc ) )

Ayniqsa, iPad uchun media so'rovlar xususiyatga ega orientatsiya, ularning qiymatlari ham bo'lishi mumkin manzara(gorizontal) yoki portret(vertikal):

@media ekrani va (orientatsiya: landshaft) ( .iPadLandscape (kenglik: 30%; float: oʻng; ) ) @media ekrani va (orientatsiya: portret) ( .iPadPortrait (aniq: ikkalasi; ) )

Bundan tashqari, media so'rov qiymatlarini birlashtirishingiz mumkin:

@media ekrani va (minimum kenglik: 800px) va (maksimal kenglik: 1200px) ( .classForaMediumScreen (fon: #cc0000; kenglik: 30%; float: oʻng; ) )

Bu kod faqat 800 va 1200 piksel kengligidagi ekranlar yoki brauzer oynalari uchun bajariladi.

Siz turli xil media so'rov qiymatlari uchun uslublar bilan ma'lum bir varaqni quyidagi kabi yuklashingiz mumkin:

JavaScript

Agar brauzeringiz CSS3 media so'rovlarini qo'llab-quvvatlamasa, jQuery yordamida uslubni almashtirish mumkin:

$(document).ready(function())( $(window).bind("resize",resizeWindow); function resizeWindow(e)( var newWindowWidth = $(window).width(); // Agar kenglik bo'lsa 600 px dan kam boʻlsa, mobil uslublar jadvali if(newWindowWidth< 600){ $("link").attr({href: "mobile.css"}); } else if(newWindowWidth >600)( // Agar kenglik 600 pikseldan katta bo'lsa, ish stoli uslublar jadvali ishlatiladi $("link").attr((href: "style.css")); ) ) );

Ixtiyoriy kontentni ko'rsatish

Elementlarni kichik ekranlarga joylashtirish uchun kichraytirish va qayta joylashtirish qobiliyati juda yaxshi. Lekin bu eng yaxshi variant emas. Mobil qurilmalar odatda kengroq o'zgarishlar to'plamiga ega: soddalashtirilgan navigatsiya, ko'proq yo'naltirilgan kontent, ustunlar o'rniga ro'yxatlar yoki qatorlar.

Yaxshiyamki, CSS bizga ajoyib osonlik bilan kontentni ko'rsatish va yashirish qobiliyatini beradi.

Displey: yo'q;

displey: hech biri yashirilishi kerak bo'lgan ob'ektlar uchun ishlatilmaydi.

Mana bizning belgilashimiz:

Asosiy tarkib Chap yon panel A o'ng yon panel

style.css (asosiy):

#content (kenglik: 54%; suzish: chap; chekka-o'ng: 3%; ) #yon panel-chap (kenglik: 20%; suzish: chap; chekka-o'ng: 3%; ) #yonbosh-o'ng( kenglik: 20 float: chap ) .sidebar-nav(displey: none; )

mobile.css (soddalashtirilgan):

#content( width: 100%; ) #sidebar-left( display: none; ) #sidebar-right( display: none; ) .sidebar-nav( display: inline; )

Agar ekran o'lchami kichraytirilgan bo'lsa, siz, masalan, oq bo'shliqni oshirish yoki qulaylik uchun navigatsiyani almashtirish uchun skript yoki muqobil uslub faylidan foydalanishingiz mumkin. Shunday qilib, elementlarni yashirish va ko'rsatish, rasmlar, elementlar va boshqa ko'p narsalarni o'zgartirish qobiliyatiga ega bo'lgan holda, siz dizaynni istalgan qurilma va ekranga moslashingiz mumkin.

Yandex xizmatlarni shaxsiylashtirish uchun ma'lumotlaringiz va mashina o'rganishingizdan qanday foydalanadi -.

Yaxshi ishingizni bilimlar bazasiga yuborish oddiy. Quyidagi shakldan foydalaning

Bilimlar bazasidan o‘z o‘qishida va faoliyatida foydalanayotgan talabalar, aspirantlar, yosh olimlar sizdan juda minnatdor bo‘ladi.

E'lon qilingan http://allbest.ru

1. Moslashuvchan modernizatsiya

2. Javob beruvchi mobil saytlar

3.Mobil qurilmalar uchun mahalliy darajada sezgir dizayn

4. Bosqichli strategiya

1. Moslashuvchan modernizatsiya

Ta'sirchan qayta dizayn - bu faqat ish stoli uchun mavjud veb-saytni olish va uni sezgir qilish jarayoni.

Ayni paytda eng ko'p tashrif buyurilgan 100 000 ta saytning taxminan 11-12 foizi sezgir va keyingi bir necha yil ichida bu raqam yanada oshishiga shubha yo'q. Ko'proq tashkilotlar ko'p qurilmali veb haqiqatlarini qabul qilish uchun yenglarini shimarib, nirvanaga erishish uchun ishlatiladigan bir nechta strategiyalarni ko'rib chiqishga arziydi:

Tayyor saytlar (ayniqsa, tijorat) haqida gap ketganda, jamoalar har doim ham hamma narsani tashlab, qayta qurish imkoniga ega emas. Aksariyat tashkilotlar uchun noldan yangi dizaynni keng miqyosda yaratish hatto hisobga olinmaydi. Shuning uchun sezgir modernizatsiya mobil qurilmalar uchun yaxshi tajriba yaratishning mashhur usuli hisoblanadi.

Afzalliklari:

· Nisbatan tez. Chunki u hamma narsani noldan qayta qurishni talab qilmaydi.

· Tanish. Foydalanuvchilarni chalkashtirib yubormaydi. Odamlar ko'p yillar davomida interfeysga ko'nikishdi va mavjudini modernizatsiya qilish orqali tashkilotlar mobil qurilmalar bilan odamlarning hayotini yaxshilash bilan birga tanish yondashuvni saqlab qolishdi.

· Tashkiliy jihatdan tezroq. Interfeysni yangilash noldan boshlashdan ko'ra xavfsizroq va osonroq.

Kamchiliklari:

· Faqat kichik bir qismga ta'sir qiladi. Uch litrli idishda 10 litr suv. Ko'p tarkib

· Hosildorlik.

· Eng yomon yordam. Dastlab ish stoli kompyuterlari uchun moʻljallangan media soʻrovlar aksariyat mobil qurilmalarda kam quvvatlanadi.

2. Javob beruvchi mobil saytlar

Responsive mobil veb-saytlar - bu sezgir dizayn texnikasidan foydalangan holda "m.yourdomain.ru" formatida alohida veb-sayt yaratish amaliyotidir.

Mobil versiya sizning eski veb-saytingizdan o'sadigan urug'ni ekish imkoniyatini beradi. Vaqt o'tishi bilan eskirgan sayt o'chirilishi mumkin va sayt birinchi navbatda mobil, sezgir va kelajakdagi tendentsiyalarni hisobga olgan holda rivojlanadi.

Afzalliklari:

· Pastroq xavf. Mobil qurilmalardan kelgan trafik ozchilikni tashkil qiladi.

· Moslashuvchan mobil sayt o'rganish uchun ajoyib sandbox bo'lishi mumkin.

· Keraksiz narsalarni olib tashlang. Ushbu yondashuv jamoalarga o'zlariga "bu bizga haqiqatan ham kerakmi" deb so'rash uchun ajoyib imkoniyatni taqdim etadi va shu bilan birga ishlashga e'tibor qaratadi.

· Kelajak mobil-birinchi veb-saytlardir. Garchi dastlab kontent yoki funksionallik kam bo'lsa-da, etarli vaqt va kuch bilan ushbu mobil saytlar oxir-oqibat to'liq sahifali ajdodlarini almashtirishi mumkin.

Kamchiliklari:

· Bu hali ham mobil sayt. Bu javob beradimi yoki yo'qmi, bu yondashuv hali ham mobil saytlarning ko'plab kamchiliklarini saqlab qoladi: URL manzilini qayta yo'naltirish, kontentni boshqarish, izchil kontent, izchillik, SEO optimallashtirish va boshqalar bilan bog'liq muammolar.

· Vaqtinchalik tuzatishlar. Ko'pgina mobil saytlar qon ketishini to'xtatish uchun Band-Aid sifatida yaratilgan. Bunday saytlar mobil qurilmalardan kelayotgan ortib borayotgan trafikni tushirish maqsadida yaratilgan. Ushbu echimlar mavjud ehtiyojlarni qondirishi mumkin, ammo kelajakdagi tendentsiyalarni hisobga olsak, ular sizni uzoq muddatda qutqarishi dargumon.

· Tokda qurib ketish ehtimoli.

· Kichik ekranlar uchun dizayn. Dastlabki e'tibor kichik ekranlarga qaratilganligi sababli, keyinchalik sifatni yo'qotmasdan interfeysni kattaroq displeylarga o'tkazish qiyin bo'lishi mumkin.

3. Mobil qurilmalar uchun mahalliy darajada sezgir dizayn

smartfon interfeysi dizayni

"Birinchi navbatda mobil" - bu mobil muhitning cheklovlarini (kichik ekran, past tarmoqli kengligi va boshqalar) hisobga oladigan interfeysni loyihalashni o'z ichiga olgan printsipdir, lekin katta ekranlardan to'liq foydalanadi.

Afzalliklari:

· Yangi kuch bilan boshlang. Avval mobil - yangi boshlanish.

· Eng yaxshi yordam. Ko'proq mobil qurilmalarni, ayniqsa media so'rovlarini qo'llab-quvvatlamaydigan eski qurilmalarni qo'llab-quvvatlash.

· Hosildorlik. Saytning ishlashi birinchi navbatda uni amalga oshirish funktsiyasi bo'lsa-da, mobil sezgir dizaynlar jamoalarga boshidanoq ishlashga e'tibor qaratish imkoniyatini beradi.

· Hamma narsani va bir vaqtning o'zida hisobga olish. Mobil-birinchi dizayn (nomiga qaramay) faqat bitta toifadagi qurilmalarni maqsad qilib qo'yishdan ko'ra, ko'p sonli piksellar sonini sig'dira oladi.

· Kelajakdagi dizayn.

Kamchiliklari:

· Ko'p vaqt sarflang

Ongda o'zgarish

· Tashkiliy jihatdan qiyin

· Notanish

4. Bosqichli strategiya

Bosqichma-bosqich sezgir dizayn strategiyasi keng ko'lamli kampaniyani bir necha bosqichlarga ajratadi. Modernizatsiyada bo'lgani kabi (bu strategiyalar bir-birini istisno etmaydi), keng ko'lamli qayta loyihalashning imkoni bo'lmasligi mumkin, shuning uchun ba'zi tashkilotlar buni bir vaqtning o'zida amalga oshiradilar. Moslashuvchan interfeysni bosqichma-bosqich yaratishning bir necha turlari mavjud: Sahifa-sahifa.

Afzalliklari:

· E'tiborli

· Moslashuvchan bo'lishni o'rganish imkoniyati. Siz sezgir interfeyslarni yaratish haqida hamma narsani bilib olishingiz mumkin va keyin bu bilimlarni saytning qolgan qismi uchun ishlatishingiz mumkin.

· Ishga tushirish ehtimoli yuqori

Kamchiliklari:

Yaxlitlikning yo'qligi

Uzumzorda qurib ketish ehtimoli

Allbest.ru saytida e'lon qilingan

Shunga o'xshash hujjatlar

    Foydalanuvchi interfeyslarini ishlab chiqish tamoyillari va usullari, ularni loyihalash qoidalari. Microsoft Expression Blend-da foydalanuvchi interfeyslarini prototiplashning klassik usullari. Expression Blend dasturida matn va grafikalar bilan ishlash.

    kurs ishi, 2012-03-19 qo'shilgan

    Internetning yaratilish tarixi va uning asosiy tamoyillari: protokollar, xizmatlar, xizmatlar. Internetga qaramlik, trolling, kiberpank va tsenzura tushunchalarining ta'rifi. Veb-saytlarni tasniflash va tartibga solish, ularning dizaynini ishlab chiqish. Brauzerlar Mozilla Firefox va Opera.

    referat, 2011 yil 11/10 qo'shilgan

    Veb-saytlarni yaratish va loyihalash usullari va vositalarini ko'rib chiqish. Veb-saytlar yaratish uchun dasturlash tillari. CMS kontentni boshqarish tizimlarining afzalliklari va kamchiliklarini tahlil qilish. Veb-sayt dizayni va tartibini ishlab chiqish. Mahsulot ishlab chiqarish xarajatlarini hisoblash.

    dissertatsiya, 06/02/2016 qo'shilgan

    Zamonaviy dasturlarni optimallashtirish tizimlarining grafik foydalanuvchi interfeyslarini tahlil qilish. SBkZ_PP boshqaruv tizimining matematik modeli va algoritmini, uning arxitektura-kontekst diagrammasini yaratish. Dasturiy ta'minotning texnik hujjatlari.

    dissertatsiya, 2012-04-18 qo'shilgan

    Qo'llaniladigan texnologiyalarni, universitet veb-saytlarining mazmuni va dizaynini, shu jumladan CMS asosida yaratilganlarini ko'rib chiqish va tahlil qilish. PRIPIT veb-saytining mazmunini va uning potentsial tashrif buyuruvchilari turli guruhlarining axborot ehtiyojlarini o'rganish. Veb-sayt dizaynini ishlab chiqish.

    dissertatsiya, 03/11/2010 qo'shilgan

    Ekran grafik komponentlari, tizim ob'ektlari va funktsiyalari. Foydalanuvchining qurilma bilan o'zaro aloqasi uchun vositalar tizimi. Shaxsiy kompyuterlarning grafik foydalanuvchi interfeyslari tarixi, ularning tasnifi. X oyna tizimi.

    taqdimot, 2012-05-22 qo'shilgan

    Savdo korxonasi uchun veb-saytni ishlab chiqish uchun Internet sahifasini yaratish va loyihalash usullarini tanlash. Veb-dizayn elementlari bilan ishlash xususiyatlari: shrift, sarlavhalar, grafikalar. Internet saytlarini yaratish va ulardan foydalanishni huquqiy tartibga solish.

    dissertatsiya, 2010 yil 11/11 qo'shilgan

    Kompyuter ierarxik tizimlarining axborot o'zaro ta'sir interfeyslarining xususiyatlari. "Tekshiruv" tamoyili. Uskuna-dasturiy interfeyslarni yaratish xususiyatlari, soddaligi va qoidalari. Kompyuter tizimlarini loyihalashning yangi yo'nalishlari.

    kurs ishi, 01/05/2017 qo'shilgan

    Konsalting biznesining ommaviy axborot vositalarini tahlil qilish: dasturlash tillari va veb-saytlar, axborot tizimlari va konsalting firmalarining veb-saytlarini yaratish uchun dasturiy ta'minotni ko'rib chiqish. Biznes jarayonlarini modellashtirish. Internetda mavjudligini rivojlantirish.

    dissertatsiya, 04/11/2012 qo'shilgan

    Xosting kompaniyasining tizim xizmatlari uchun vizual interfeys yaratish uchun Internet xizmatini ishlab chiqish. Interfeys va rivojlanish yo'nalishlarini baholash mezonlari. GlideOS ish stoli. Xizmat arxitekturasini, dasturlash tilini va aloqa usullarini tanlash.