5 особине реснично одговорног веб сајта

Имате ли " одзивну веб страницу "? Ово је страница са изгледом који се мења на основу уређаја посјетитеља и величине екрана. Одговарајући веб дизајн је сада најбоља пракса у индустрији. Гоогле препоручује и налази се на милионима страница широм Веба. Постоји, међутим, велика разлика између постављања веб странице која једноставно "одговара" различитим величинама екрана и има сајт који је стварно одговоран.

Ја рутински видим да компаније редизајнирају своју веб страницу и издају саопштење за јавност којим се истичу врлини њиховог новог дизајна који је погодан за мобилне уређаје. Када посећем те локације, оно што често налазим је распоред који се заиста мијења и мијења како би се прилагодио различитим екранима, али то је у мери у којој они размишљају о одговору. Ово није довољно. Одлично одзивна веб страница више него скали да се уклапа у мањи или већи екран. На овим страницама ћете пронаћи и сљедеће важне особине.

1. Оптимизоване перформансе

Нико не жели чекати да се веб сајт учита, а када неко користи мобилни уређај са везом која може бити мања од идеала, потреба за брзо учитавање сајта је још важнија.

Па како оптимизирати перформансе свог сајта? Ако почнете са новим сајтом као део редизајн, онда бисте требали направити тачку да креирате буџет за учинак као дио тог пројекта. Ако радите са постојећим сајтом и не почињете на почетку, први корак је да тестирате перформансе свог сајта како бисте видели где сте данас.

Једном када имате основну тачку где ваша страница стоји на перформансама, можете почети да правите неопходна побољшања како бисте повећали брзину преноса. Одлично место за почетак је вероватно са сликама вашег сајта. Превише велике слике су кривци # 1 када се ради о спорим сајтовима за учитавање, па оптимизација ваших слика за испоруку на мрежи може стварно помоћи вашем сајту са становишта перформансе.

Реалност је да побољшане перформансе веба и брзе брзине преноса представљају предност коју ће сви посетиоци ценити. На крају крајева, нико се никад није жалио да је веб локација "пребрзо", али ако локација предуго предузме, апсолутно ће људи искључити да ли се одговорно "уклапа" на њихов екран или не.

2. Смарт Цонтент Хијерархија

Када се веб страница приказује на великом екрану, ви можете да поставите садржај на разне начине због значајног расположивог екрана на екрану. Често можете поставити важне поруке и слике, ажуриране вести, информације о догађајима и навигацију локације на екрану. Ово омогућава посетиоцу да лако и брзо скенира садржај целокупне странице и одлучи шта им је важно.

Овај сценарио драстично се мења када узмете тај дизајн сајта и трансформирате га на мале уређаје као што је мобилни телефон. Изненада радите са делом екрана који сте имали раније. То значи да морате да одлучите шта ће се прво појавити на сајту, шта ће га пратити, итд. Уместо свега што се види одједном, вероватно имате само простор да покажете једну или двије ствари (од којих је једна вероватна навигација). То значи да је потребно донијети одлуке хијерархије. Нажалост, оно често одређује оно што први долази на екрану, а затим друго, итд. Је начин на који се кодира страница. Најлакше је, када се гради одговарајућа страница, да се на екрану прикаже оно што је најпре прво у шифри, затим следеће ставке у шифри и тако даље. Нажалост, оно што је најважније на једном уређају можда није толико критично на другом. Одлично одзивна страница схвата да би хијерархија садржаја требало да се мења у зависности од различитих ситуација и требало би да буде паметно о томе шта она приказује тамо где.

Побољшања у техникама распореда ЦСС-а, укључујући ЦСС Грид Лаиоут, Флекбок и још много тога, омогућавају веб дизајнерима и програмерима више опција када је у питању интелигентно постављање садржаја, умјесто да буду ометани точним редоследом подручја садржаја у ХТМЛ коду. Искоришћење ових нових техника распореда ће постати још важније од уређења простора и потреба корисника нашег сајта, и даље се развија.

3. Искуства која узимају у обзир јачине и слабости уређаја

Останите на тему уређаја - сваки уређај који неко може да користи да посети вашу локацију има и снаге и слабости које су инхерентне овој платформи. Одлична одзивна локација разуме могућности и ограничења различитих уређаја и користи их за креирање прилагођених искустава која су најпогоднија за било који уређај који корисник може користити у том тренутку.

На пример, мобилни телефон садржи низ функција које не бисте нашли на традиционалном десктоп рачунару. ГПС је један од примера функције која се односи на мобилне уређаје (да, такође можете добити информације о општој локацији на десктопу, али ГПС уређај је много прецизнији). Ваша страница може да користи ГПС податке да паметно пошаље особу врло детаљним и специфичним информацијама о смеру по кораку или специјалним понудама на основу тачно где су у том тренутку.

Други примјер овог принципала у пракси би био сајт који разуме какав приказ заслона користите и шаље слике које су најбоље прилагођене том екрану. Ако имате екран високе густине пиксела, можете одлучити да пошаљете квалитетније слике на тај екран. Ове исте слике би биле бесмислене на мање способном екрану, међутим, додатни квалитет би се изгубио док би додатна величина датотеке била скинута без икаквог стварног разлога.

Стварно сјајне одзивне локације разматрају целокупно искуство корисника и раде на прилагођавању тог искуства заснованог не само на типу уређаја или величини екрана већ и на другим важним аспектима хардвера.

4. Садржај са контекстом

На почетку, одговарајући веб дизајн је добио име због идеје о распореду сајта који одговара различитим величинама екрана, али можете одговорити на много више од величине екрана. Коришћењем претходног примера коришћења предности и слабости уређаја, могли бисте да користите те, као и друге податке као што су датум и време, да бисте стварно прилагодили искуство на веб локацији.

Замислите веб страницу за велики сајамски догађај. Док веб страница која одговара ће промијенити изглед страница на страници да би се скали са различитим екранима, такође бисте могли користити датум да бисте утврдили који је садржај најважнији за приказ. Ако је то временски период пре догађаја, вероватно желите да видно приказујете информације о регистрацији. Ако, међутим, догађај у ствари се дешава у том тренутку, регистрација можда није најважнији садржај. Уместо тога, можете одлучити да је распоред догађаја у данима критичнији јер је релевантнији за непосредне потребе тог корисника.

Узимајући ствари корак даље, могли бисте да додирнете ГПС уређај уређаја да бисте утврдили где су заправо на сајму. Можете им дати интерактивни садржај на основу њихове локације, показујући им у близини кабине или сесије да бисте започели.

5. Приступачност

Последњи пример који ћемо погледати како локација може стварно реаговати на потребе посетилаца је размишљати о приступачности веб-сајта . Веб странице треба да буду у могућности да их користе што више људи, укључујући оне са инвалидитетом. Ваша веб страница би требало да буде у могућности да користи неко ко захтева читач екрана или други помоћни софтвер за приступ његовом садржају. На овај начин, ваша страница одговара на њихове потребе јер сте осигурали да је искуство, иако је различито за посетиоце са инвалидитетом, и даље прикладно.

Одговарајући на што је могуће више тачака података, а не само на величини екрана, веб страница може бити много више од "мобилне пријатности". То може постати искрено одзивно искуство у сваком смислу фразе.