Бара-бара жогорулатуу

Браузерлер чейин сайттар бар эле бери болуп келатат. Чынында, браузерлер тажрыйбасы же сайтты көрүп адамдардын негизги составдык бөлүгү болуп саналат, - бирок баары браузерлер да түзүлгөн. Бул толугу менен мүмкүн (жана, чынында, адилеттүү, балким,) сиздин баракчаларды абдан эски браузерлерде жана заманбап браузерлерде табылган өзгөчөлүктөрдү жок көрүү кардарларга ээ болуу болуп саналат. Бул сиз пайдаланып сайттарын иштеп жатсак да олуттуу көйгөйлөрдү жаратат болот сайтынын дизайны жана өнүктүрүү боюнча акыркы өнүгүүлөр . Эгер кимдир бирөө сайтына ошол antiqued браузерлердин бирин колдонуп келсе, жана акыркы заманбап ыкмаларын алар үчүн иштебейт, сен жалпы кедей тажрыйбасы жеткирип болушу мүмкүн. Бара-бара жогорулатуу азыркы колдоосу жетишсиз башка браузерлерде, тактап айтканда, ошол эски браузерлер учун интернет баракча дизайнын менен иштөөнүн стратегиясы болуп саналат.

Бара-бара жогорулатуу колдонуучу агент дагы өзгөчөлүктөрү да интернет баракчаларды иштеп, көп мүмкүнчүлүктөр интернет барак бар колдоп бир жолу болуп саналат. Ал ошондой эле аталган долбоор стратегиясын карама-каршы келет жасаган бузулушу . Бул стратегия биринчи заманбап браузерлер учун барактарын түзүп, анда алар да аз иш браузерлерде менен акылга сыярлык, жакшы иштейт деп кепилдик берет, - ". Сылык бузат" тажрыйбасы Бара-бара жогорулатуу биринчи азыраак жөндөмдүү браузерлерде менен башталат жана ал жерден бир окуя курат.

Бара-бара жогорулатууга кантип колдонсо болот?

Сиз прогрессивдүү күчөтүүнү пайдаланып желе үлгүсүн түзүп, сен кыла турган биринчи нерсе браузерлердин калыпка үчүн иштеген долбоорду түзүү болуп саналат. Өзөгүндө, акырындык менен жогорулатуу мазмун жеткиликтүү бардык интернет браузер бир суб-set.This бул эски колдоо менен башталат, ошондуктан жок болушу керек деп айтылат, эскирген жана азыраак жөндөмдүү browsers.If жакшы иштейт сайтты түзүү алар үчүн, сен, бери дегенде, коноктордун баары үчүн жарактуу тажрыйбасын куткара турган негизги түзгөн билебиз.

биринчи жок дегенде жөндөмдүү браузерлерде баштап жатканда, бүт HTML анык жана семантикалык туура болушу керек камсыз кылууга түрткү берет. Бул колдонуучу агенттердин бөлүктөрү ар кандай бет көрүү жана так көрсөтө аласыз деп камсыздоого жардам берет.

Көрүү дизайн стилдери жана жалпы барак макети колдонуу менен кошо экенин унутпа тышкы стилдерди . Бул акырындык менен жогорулатуу болуп жерде чынында. Сиз коноктордун баары үчүн иштеген сайттын дизайнын түзүү үчүн стилдер жадыбалы колдонушат. Сиз анда колдонуучу агенттери кызматтарга ээ болуп, бет жогорулатуу үчүн кошумча стилин кошууга болот. Ар бир адам баштапкы образын алат, ал эми өнүккөн жана заманбап образын кармап турган кабар браузерлер учун, алар кээ бир кошумча алууга. Сиз ошол образын кармап алат браузерлер учун бет "акырындык менен жогорулатуу".

Сиз прогрессивдүү күчөтүүнү колдоно аласыз бир нече жолдору бар. Баарынан мурда, сиз браузер CSS сызыгын түшүнүк жок болсо, эмне үчүн ойлонуп көрүшүбүз керек - аны этибарга албай! Бул, чынында, өз пайдасына иштейт. баарын серепчилер түшүнө стилдеги базалык тобун түзө турган болсок, анда жаңы браузерлер учун кошумча стилин кошууга болот. Алар образын кармап болсо, аларды колдонууга болот. Эгерде ал жок болсо, аларды четке кагып, ошол баштапкы стилин колдонот. прогрессивдүү өркүндөтүү боюнча жөнөкөй мисал, бул CSS көрүүгө болот:

негизги-мазмунду {
маалымат: # 999;
маалымат: rgba (153,153,153, 75);
}

Бул стили биринчи бозгуч түсү артында калтырган. Экинчи эреже ачык-айкындыктын деъгээлин коюуга RGBA түстүү баалуулуктарды колдонот. браузер RGBA колдогон болсо, анда ал экинчи биринчи стили жокко чыгара алат. андай эмес болсо, анда бир гана биринчи колдонулат. Сиз баштапкы түскө, андан кийин азыркы браузерлер учун кошумча образын кошо койдум.

Колдонуу Feature Queries

Сиз прогрессивдүү күчөтүүнү тиешелүү дагы бир жолу "көркөм суроо" деп аталат пайдалануу болуп саналат. Бул сыяктуу медиа суроо маанилүү бөлүгү болуп саналат, кабыл сайты үлгүлөрү . бир экран өлчөмдөрүн ММК үчүн суроолор тексти менен, өзгөчөлүгү суроолор бир өзгөчөлүгү шайкеш бар же жок экенин билүү үчүн текшерет. сиз колдоно турган синтаксиси:

@supports (дисплей: FLEX) {}

Бул эреже ичинде кошо ар кандай стилдери гана браузер Flexbox үчүн стилдери "FLEX", колдоого алынган болсо, иштеп келет. Сиз ар бир эрежелерин бир катар коюп, андан кийин тандалган браузерлер үчүн гана кошумча кошуу үчүн өзгөчөлүк сурамдарды тийиши мүмкүн.

Атайга Krynin тарабынан Original макалада. Jeremy Джирард тарабынан 12/13/16 күнү өзгөртүлдү.