5 Рысы Сапраўды Спагадны вэб-сайт

Ці ёсць у вас « спагадны сайт »? Гэта сайт з макетам , што змены на аснове прылады наведвальніка і памер экрана. Адаптыўны вэб-дызайн у цяперашні час з'яўляецца лепшай практыкі галіны. Ён рэкамендаваны Google і знайшоў на мільёнах сайтаў у Інтэрнэце. Існуе, аднак, вялікая розніца паміж наяўнасцю вэб-сайтам, які проста «універсальным» на розных памерах экрана і мець сайт, які сапраўды рэагуе.

Я рэгулярна бачу кампанію перапраектоўваць свой сайт і выпхнуць прэс-рэліз extoling вартасці свайго новага мабільнага дружалюбнага дызайну. Калі я наведваю гэтыя сайты, што я часта знаходжу гэта макет, які робіць сапраўды маштаб і змены, каб змясціцца на розных экранах, але гэта так далёка, як яны прымаюць ідэю спагадлівасці. Гэтага недастаткова. Сапраўды спагадны сайт робіць больш, чым проста маштабаваць, каб адпавядаць меншы або большы экран. На гэтых сайтах вы таксама знойдзеце наступныя важныя рысы.

1. Аптымізаваная прадукцыйнасць

Ніхто не любіць чакаць вэб-сайта для загрузкі, і калі хтосьці з дапамогай мабільнага прылады з падключэннем, якое можа быць менш, чым ідэал, патрэба ў месцы для хуткай загрузкі з'яўляецца яшчэ больш важным.

Так як жа аптымізаваць прадукцыйнасць вашага сайта? Калі вы пачынаеце з новым сайтам у рамках рэдызайну, то вы павінны зрабіць гэта ў кропцы , каб стварыць бюджэт прадукцыйнасці ў рамках гэтага праекта. Калі вы працуеце з існуючым сайтам і не пачынаць з нуля, то першы крок, каб праверыць прадукцыйнасць вашага сайта, каб убачыць, дзе вы стаіце сёння.

Калі ў вас ёсць базавы ўзровень, дзе ваш сайт стаіць прадукцыйнасці мудрай, вы можаце пачаць, каб зрабіць неабходныя паляпшэння, каб павялічыць хуткасць загрузкі. Выдатнае месца, каб пачаць, верагодна, з выявамі вашага сайта. Занадта вялікія выявы з'яўляюцца # 1 вінаватым , калі гаворка ідзе , каб запаволіць загрузку сайтаў, таму аптымізаваць выявы для вэб - дастаўкі сапраўды можа дапамагчы ваш сайт з пункту гледжання прадукцыйнасці.

Рэальнасць такая, што хуткасць палепшаная прадукцыйнасць сайта і хуткая загрузка з'яўляюцца перавагай, што ўсе наведвальнікі па вартасці ацэняць. У рэшце рэшт, ніхто ніколі не скардзіўся, што сайт загружаецца «занадта хутка», але калі сайт займае занадта шмат часу для загрузкі, ён будзе абсалютна адвярнуць чалавек Ці яна зваротны «прыпадкі» на іх экране ці не.

2. Smart Content, Іерархія

Калі сайт адлюстроўваецца на вялікім экране, вы можаце закласці ўтрыманне ў розных формах з-за значнага экрана нерухомасці даступныя. Часта можна ўсталяваць важныя паведамленні і малюнкі, абнаўленне навін, інфармацыю пра падзеі і навігацыю па сайце усё на экране адначасова. Гэта дазваляе наведвальніку лёгка і хутка сканаваць змесціва ўсёй старонкі і вырашыць, што для іх важна.

Гэты сцэнар змяняецца даволі моцна, калі вы бераце, што дызайн сайта і ператварыць яго для невялікіх прылад экрана, як мабільны тэлефон. Раптам вы працуеце з доляй экрана нерухомасці вы былі раней. Гэта азначае, што вы павінны вырашыць, што будзе адлюстроўвацца першым на месцы, што будзе ісці за ім, і г.д. Замест таго, каб увесь час бачыць адразу, вы, верагодна, ёсць толькі прастора, каб паказаць адну або дзве рэчы (адзін з якіх, хутчэй за ўсё, рух). Гэта азначае, што рашэнні іерархіі павінна быць зроблена. На жаль, тое, што часта вызначае, што прыходзіць першым на экране, а затым другі і г.д. шлях сама старонка кадуецца. Гэта прасцей за ўсё, пры стварэнні спагадлівага сайта, каб паказаць усе, што першы ў кодзе першай на экране, а затым другога элементам у кодзе і гэтак далей. На жаль, тое, што можа быць найбольш важным на адным прыладзе можа быць не гэтак крытычна на іншы. Сапраўды спагадны сайт разумее, што іерархія ўтрымання павінна мяняцца ў залежнасці ад розных сітуацый, і ён павінен быць разумным аб тым, што ён паказвае, дзе.

Паляпшэнні ў метадах разметкі CSS, уключаючы CSS Grid Layout, Flexbox, і многае іншае, дазваляюць вэб-дызайнерам і распрацоўнікам больш варыянтаў, калі гаворка ідзе пра разумна выкладваючы змест, а не кульгае дакладнай парадку абласцей кантэнту ў HTML-кодзе. Выкарыстоўваючы гэтыя новыя метады кампановак стане яшчэ больш важна, як пейзаж прылады і запатрабаванні карыстальнікаў нашага сайта, працягвае развівацца.

3. Вопыт, якія прымаюць пад увагу моцныя і слабыя бакі для прылады

Застаючыся на тэму прылады - кожная прылада, што хтосьці можа выкарыстоўваць, каб наведаць ваш сайт мае моцныя і слабыя бакі, якія ўласцівыя гэтай платформе. Выдатны спагадны сайт разумее магчымасці і абмежаванне розных прылад і выкарыстоўвае іх для стварэння карыстацкага досведу, якія лепш за ўсё падыходзіць для любой прылады наведвальніка можа выкарыстоўваць у дадзены момант.

Напрыклад, сотавы тэлефон ўключае ў сябе шэраг функцый, якія вы не знойдзеце ў традыцыйным настольным кампутары. GPS з'яўляецца адным з прыкладаў мабільнай арыентаваных функцыі (так, вы можаце атрымаць агульную інфармацыю пра месцазнаходжанне на працоўных сталах, а таксама, але прылада GPS з'яўляецца значна больш дакладным). Ваш сайт можа выкарыстоўваць інфармацыю GPS шустра адправіць чалавеку вельмі падрабязны і канкрэтны крок за крокам інфармацыю аб накіраванні або спецыяльныя прапановы, заснаваныя на дакладна, дзе яны знаходзяцца ў дадзены момант.

Іншым прыкладам такога даверніка на практыцы будзе сайт, які разумее, што выгляд адлюстравання экрана вы выкарыстоўваеце, і пасылае выявы, якія лепш за ўсё падыходзяць для гэтага дысплея. Калі ў вас ёсць экран з высокай шчыльнасцю пікселяў, вы можаце вырашыць, каб адправіць больш высокую якасць малюнка на гэты экран. Гэтыя ж малюнкі былі б бессэнсоўныя на менш здольны экране, аднак, і дадатковае якасць будзе потерянно у той час як дадатковы памер файла будзе загружаны без усялякай рэальнай прычыны.

Сапраўды вялікія рэагуюць сайты лічаць увесь карыстацкі вопыт і працу, каб адаптаваць гэты вопыт, заснаваны не толькі тып прылады або памер яго экрана, але і іншыя важныя аспекты апаратнага забеспячэння, а таксама.

4. Змест Кантэкстнае

Першапачаткова, спагадны вэб-дызайн атрымаў сваю назву з-за ідэі макета сайта адказваючы на ​​розныя памеры экрана, але вы можаце адказаць на столькі больш, чым проста памеры экрана. Грунтуючыся на папярэднім прыкладзе, выкарыстоўваючы моцныя бакі прылады і слабыя бакі, вы маглі б выкарыстоўваць гэтыя, а таксама іншыя дадзеныя, такія як дата і час, каб сапраўды наладзіць вопыт вэб-сайта.

Уявіце сабе вэб-сайт для вялікай выставы выпадку. Нягледзячы на ​​тое, спагадны сайт зменіць макет старонак сайта для маштабавання з рознымі экранамі, вы можаце таксама выкарыстоўваць дату, каб вызначыць, які кантэнт з'яўляецца найбольш важным для адлюстравання. Калі гэта перыяд часу да падзеі, вы, верагодна, хочаце прыкметна адлюстроўваць інфармацыю аб рэгістрацыі. Калі, аднак, гэтая падзея на самай справе адбываецца ў той момант, рэгістрацыя не можа быць найбольш важным зместам. Замест гэтага, вы можаце decidethat графік дзённых падзей з'яўляецца больш важным, бо яно больш актуальна для непасрэдных патрэбаў гэтага карыстальніка.

Прымаючы рэчы крокаў далей, вы можаце падлучыцца да GPS для прылады, каб вызначыць, дзе яны на самай справе на выставе. Вы маглі б даць ім інтэрактыўнага кантэнту на аснове іх размяшчэння, паказваючы ім суседнія кабіны або сеансы каля пачаць.

5. Даступнасць

У апошнім прыкладзе мы разгледзім , як для сайта сапраўды можа рэагаваць на патрэбы наведвальніка, каб думаць аб вэб - даступнасці . Сайты павінны быць у стане быць выкарыстана ў якасці як мага больш людзей, у тым ліку з абмежаванымі магчымасцямі. Ваш сайт павінен быць у стане выкарыстоўвацца кімсьці, хто мае патрэбу для чытання з экрана або іншае праграмнае забеспячэнне, каб пры садзейнічанні доступ да яго змесціва. Такім чынам, ваш сайт адказвае іх патрэбам, таму што вы дамагліся таго, што вопыт, у той час як іншыя для наведвальнікаў з абмежаванымі фізічнымі магчымасцямі, па-ранейшаму неабходна.

Рэагуючы на ​​столькіх кропак, як гэта магчыма, і не толькі памер экрана, вэб-сайт можа быць значна больш, чым проста «мабільная сяброўскай.» Гэта можа стаць сапраўды спагадным вопытам ва ўсіх сэнсах гэтага выказвання.