Көптеген құрылғылардың веб-дизайнына екі түрлі тәсілдерді салыстыру
Жауапкершілігі бар және бейімделгіш веб-дизайн көптеген экрандар өлшемдерінде жақсы жұмыс істейтін көп құрылғыға арналған веб-сайттарды жасаудың әдісі болып табылады. Жауапкершілікті веб-дизайнды Google ұсынған және екі тәсілдің танымал болғаны көп құрылғылардың веб-дизайны үшін осы әдістердің екеуі де олардың күшті және әлсіз жақтарына ие.
Жауапкершілік пен адаптивті веб-дизайн арасындағы айырмашылықтарды қарастырып көрейік, атап айтқанда мына негізгі бағыттарға назар аударайық:
- Дамудың қарапайымдылығы
- Сіз дизайны бойынша басқару деңгейіңіз
- Құрылғының / экранның қолдауының кеңдігі
- Келешектегі достық шешім қалай
- Жалпы жүктеу жылдамдығы және сайттың өнімділігі
Кейбір анықтамалар
Біз жауап беретін және бейімделгіш веб-дизайнды салыстыра отырып, осы екі тәсілдің жоғары деңгейлі анықтамасын қарауға сәт түсірейік.
Жауапты веб-сайттарда қолданылатын экран өлшеміне қарамастан, өзгеретін және бейімделетін сұйықтық орналасуы бар. Медиа сұраулары , егер шолғыш өлшемі өзгертілсе, жауап беретін сайттар тіпті «ұшақта» өзгерте алады.
Адаптивті дизайн бет жүктелген кезде анықталатын экран өлшеміне ең лайықты орналасу нұсқасын жеткізу үшін алдын ала анықталған тоқтау нүктелеріне негізделген тұрақты өлшемдерді пайдаланады.
Осы кең анықтамалармен бірге, басты назар аударған жөн.
Дамудың қарапайымдылығы
Жауапкершілікті және адаптивті веб-дизайн арасындағы ең маңызды айырмашылық осы шешімдер веб-сайтқа қолданылатындай. Жауапкершілікпен жасалған дизайн толығымен сұйықтықтың орналасуын жасағандықтан, оны сайтты қайтадан жасайтын жобаларда жақсы қолдануға болады . Қолданыстағы веб-сайттың кодын өзгертуге әрекет жасау жиі қиындық тудырады, себебі сіз бұл кодты нөлден бастап, осы процестің ең ерте кезеңдерінде ескеруді ескере отырып дамытсаңыз, бақылау деңгейіне ие болмайсыз . Бұл дегеніміз, сіз сайтты жауап беру үшін жаңартқан кезде, қолданыстағы кодтық базаның ішінде болу үшін ымыраға баруға тура келеді.
Егер сіз қолданыстағы тұрақты веб-сайтпен жұмыс жасасаңыз, адаптивті тәсіл сізге сайттың бұзылғаны үшін қажетті көлемді қалдыруды және қажет болғанда қосымша бейімделгіш тоқтау нүктелерін қосуды білдіреді. Кейбір жағдайларда, егер жобаның бюджеті кішкентай болса және егер ол аз дамыған жұмыс көлемін ғана қанағаттандыратын болса, шағын экран / ұялы орталықтандырылған өлшемдер үшін жаңа адаптивті тоқтау нүктелерін қосуды таңдауға болады. Бұл дегеніміз, сіз үлкенірек бейнебеттердің бәріне сол орналасуды қолдануға рұқсат бересіз дегенді білдіреді - мүмкін, бұл сайт бастапқыда жобаланған еді.
Адаптивті тәсілге айналдыру - сіз қолданыстағы тораптың кодын пайдалануды жақсартуға болады, бірақ төмендегілердің бірі қолдау көрсетуді таңдаған әр тоқтау нүктесіне әртүрлі орналасу үлгілерін жасау болып табылады. Бұл ұзақ мерзімді перспективада осы шешімді дамыту және қолдау үшін қажетті жұмыс жүктемесіне әсер ететін болады.
Дизайнды басқару
Қатысты веб-сайттардың біреуі олардың ағындық қабілеттілігі бейімделген тәсілмен анықталған алдын ала орнатылған тоқтау нүктелеріне ғана емес, барлық экран өлшемдерін бейімдеуге және қолдауға мүмкіндік береді. Дегенмен, шындық, белгілі бір негізгі экран өлшемдерінде (әдетте нарықта танымал құрылғыларға сәйкес келетін өлшемдер) керемет көрінуі мүмкін, бірақ визуалды дизайн жиі танымал шешімдер арасында бұзылады.
Мәселен, 1400 пиксельді экран, 960 пиксель экранның өлшемі және 480 пиксельді экранның көрінісі сайтты жақсы көрінуі мүмкін, бірақ бұл өлшемдердің арасындағы мемлекеттер туралы не деуге болады? Дизайнер болғандықтан, сізде бұл өлшемдер арасындағы бақылау болмайды, ал беттің визуалды түрі бұл өлшемдерде әдетте мінсіз.
Адаптивті веб-сайт арқылы сізде әртүрлі орналасуларға арналған дизайнды бақылау әлдеқайда көп, себебі олар сіздің белгіленген тоқтау нүктелеріңізге негізделген тіркелген өлшемдер. Бұл елдер арасында ыңғайсыз жағдайлар енді қиындық тудырмайды, өйткені сіз келушілерге жеткізілетін әр «көрініс» (әр тоқтау нүктесінің дисплейін білдіретін) мұқият ойластырғансыз.
Бұл дизайнерлік бақылау деңгейіне әсер етуі мүмкін, себебі ол баға бойынша жеткізіледі. Ия, әр тоқтау нүктесінің көрінісін толық бақылауыңыз бар, бірақ бұл әрқайсысысыз орналасулардың дизайнын жасау үшін қажет жобалау уақытын инвестициялау керек. Сіз ойлап тапқан артық нүктелер, сол уақытқа жұмсауға тура келеді.
Қолдаудың кеңдігі
Екі жауапты және бейімделген веб-дизайн әсіресе заманауи браузерлерде өте сенімді қолдау көрсетеді.
Адаптивті веб-сайттар сервер өлшемінің құрамдас бөліктерін немесе экран өлшемін анықтауға арналған Javascript талап етеді. Әлбетте, егер бейімделген сайт Javascript талап етсе, бұл сайттың дұрыс жұмыс істеуі үшін браузерді қосу керек деген сөз. Бұл сізге үлкен алаңдаушылық тудырмауы мүмкін, өйткені адамдардың көбінде браузерлерде Javascript болады, бірақ кез-келген уақытта кез-келген сайтқа тәуелді болады.
Жауап беретін веб-сайттар мен бұқаралық ақпарат құралдарының сұраулары оларға барлық заманауи браузерлерде жақсы жұмыс істейді. Internet Explorer бағдарламасының ең ескі нұсқаларымен жалғыз проблемалар бар, себебі 8 және одан кейінгі нұсқалар медиа сұрауларын қолдамайды. Осыған айналысу үшін Javascript полифильді жиі пайдаланылады , бұл жерде Javascript-ге тәуелділік бар, кем дегенде, IE-дің ескірген нұсқалары үшін. Тағы да, бұл сізге көп көңіл аудармауы мүмкін, әсіресе егер сіздің сайтыңыздың сараптамасы ескі ескі шолғыш нұсқаларын пайдаланып келушілерді қабылдамайтыныңызды көрсеңіз.
Болашақ достық
Жауапкершілікті веб-сайттардың сұйық табиғаты бейімделгіш сайттардан артықшылыққа ие болуға мүмкіндік береді. Өйткені, бұл жауапты сайттар тек алдын-ала белгіленген тоқтау нүктелерін орналастыру үшін салынбаған. Олар бүгінгі күні нарықта болмауы мүмкін барлық экрандарға бейімделуге бейімделеді. Бұл жаңа экранның ажыратылымы кенеттен танымал болса, жауапты сайттарды «бекітілген» етудің қажеті жоқ дегенді білдіреді.
Құрылғының ландшафтындағы керемет әртүрлілікті (2015 жылдың тамыз айынан бастап нарықта 24 000-нан астам Android құрылғысы бар) көре отырып, бұл кең ауқымды экрандарды орналастыру үшін барлық мүмкіндікті жасайтын сайт болашақ достық үшін аса маңызды. Өйткені, бұл ландшафт келешекте кем емес әр түрлі болуы мүмкін емес, демек, егер нақты шындыққа жеткен болмасақ, нақты экрандар мен өлшемдерді жобалау мүмкін болмайды.
Осы салыстыру сценарийінің екінші жағында, егер сайт адаптивті болса және нарықта маңызды болуы мүмкін жаңа шешімдерге сай болмаса, сіз сол тоқтау нүктесін сіз жасаған сайттарға қосуға мәжбүрлеуіңіз мүмкін. Бұл жобалау мен әзірлеу уақытын жобаларға қосады және бұл бейімделгіш сайттар нарыққа жаңа тоқтау нүктелері енгізілмегендігіне көз жеткізу үшін жүйелі түрде қадағалау керек дегенді білдіреді. Тағы да, құрылғының алуан түрлілігімен, жаңа өлшемдерге үнемі қарап, оларды жаңа тоқтау нүктелерімен қамтамасыз етуге мүмкіндік беретін үнемі мәселе болып табылады, ол сізге сайтты қолдау үшін қажет жұмысқа әсер етеді және осы қызмет көрсетудің өзіндік құны сайтқа арналған компания немесе ұйым.
Өнімділік
Жауапкершілікті веб-дизайны ұзақ уақыт бойы (көптеген жағдайларда әділетсіз түрде) жүктеу жылдамдығы / өнімділік тұрғысынан кедей шешім ретінде айыпталды. Бұл көбінесе осы көзқарастың алғашқы күндерінде көптеген веб-дизайнерлер сайттың қолданыстағы CSS-іне кішкентай экрандық медиа сұрауларын жөндейді. Бұл үлкен экрандарға арналған кескіндерді және ресурстарды барлық құрылғыларға жеткізуге мәжбүрледі, тіпті егер бұл кішігірім экрандар оларды соңғы жоспарларында қолданбаса. Жауапкершілік дизайны ұзақ уақытқа созылды, өйткені сол күндер мен шындықтар сапалы жауап беретін сайттар бүгінгі күні өнімділік проблемаларынан зардап шекпейді.
Баяу жүктеу жылдамдығы және ширыққан веб-сайттар жауапты веб-сайт мәселесі емес - бұл барлық веб-сайттарда кездесетін мәселе. Тым ауыр суреттер, әлеуметтік медиадан, артық сценарийлерден және тағы басқалардан сайтты төмен салмайды, бірақ екеуі жауап беретін және бейімделетін веб-сайттарды жылдам жүктеу үшін салынады. Әрине , олар да өнімділікке басымдық бермейтін етіп салынуы мүмкін, бірақ бұл шешімнің өзіндік ерекшелігі емес, керісінше, сайттың өзін дамытуға қатысқан команданың көрінісі.
Орналасудан басқа
Адаптивті веб-дизайндың ең тартымды аспектілерінің бірі сіз сайттың дизайны тоқтау нүктелеріне арналған дизайнды ғана емес, сондай-ақ сол сайт нұсқаларына жеткізілген ресурстарды басқару болып табылады. Мысалы, бұл тордың суретін тек қана торға арналған құрылғыларға жіберуге болады, ал торлы емес экрандар файл өлшемінде кішігірім бейнелерді алады . Басқа сайт ресурстары (Javascript файлдары, CSS стильдері және т.б.) ақылды түрде олар қажет болғанда және пайдаланылатын кезде ғана жеткізілуі мүмкін.
Адаптивті веб-дизайнды қолдану «веб-торапты жаңартып отырсаңыз, бейімдеу оңай қолдануға ыңғайлы болуы мүмкін» деген қарапайым теңдеулерден асып кетеді. Барлық сайттар, соның ішінде толық қайта құрастыру, неғұрлым бейімделген тәжірибеге бейімделген тәжірибеге ие болады.
Бұл сценарий осы «жауап беруге қарсы және бейімделгіш» пікірталастың нәзік сипатын көрсетеді. Дегенмен адаптивті әдіс сайтымыздың жаңғыртуларына жауап беруден гөрі жақсырақ болуы мүмкін, бірақ ол сонымен қатар толық жаңартулар үшін тамаша шешім болуы мүмкін. Сол сияқты, кейбір жағдайларда қолданыстағы тораптың кодтық базасына жауапты көзқарас қосуға болады, бұл сайтты толығымен жауап беретін тәсілдің барлық артықшылықтарын береді.
Қандай тәсіл жақсы?
Адаптивті веб-дизайнға жауап беруге келгенде, нақты «жеңімпаз» жоқ, бірақ жауапты, әрине, танымал тәсіл. Шындығында, «жақсы» тәсіл нақты жобаның қажеттілігіне байланысты. Бұған қоса, бұл «немесе / немесе» жағдай болуы керек емес. Адаптивті дизайнның күшті нұсқалары (жақсы дизайнды басқару, сайт ресурстарын ақылды жүктеу) барынша жауап беретін веб-дизайнды (сұйықтық ені, болашақ қолдау) біріктіретін көптеген веб-мамандар бар.
Әдетте RESS (Серверлік компоненттері бар жауапты веб-дизайн) деп аталатын бұл әдіс шын мәнінде «бір өлшемнің бәріне сәйкес келетінін» көрсетеді. Екі жауапты веб-дизайны да бейімделгіш де өзінің күшті және қиындықтарына ие, сондықтан қандай сіздің нақты жобаңыз үшін жақсы жұмыс істейді, немесе гибридтік шешім сізді қолдана алады.