Како да го тестирате содржината на вашата веб-страница

Тестирање слики и должина на текст за да се осигура дека вашиот сајт реагира соодветно

Кога дизајнираме веб-страници и планираме како ќе биде прикажана содржината на тие сајтови, ние често го правиме тоа со идеална ситуација во умот. Насловите и текстуалните области се замислени како што имаат одредени должини, додека сликите што го придружуваат тој текст се дизајнирани да бидат прикажани во димензии што ќе им овозможат да работат како што е наменето во целокупниот дизајн. Дури и ако овие елементи се малку течни како дел од изградениот веб-сајт (што треба да биде), ќе има ограничување колку флексибилни можат да бидат.

Ако распоредите веб-локација на CMS (систем за управување со содржини) и им дозволуваат на клиентите да управуваат со тоа место и да додаваат нови содржини со текот на времето, апсолутно ќе бидат поставени тестовите за границите што сте ги дизајнирале. Верувајте во фактот дека вашите клиенти ќе најдат начини да ја сменат веб-страницата што никогаш не сте ја сонувале. Ако не сте земале предвид ситуации надвор од идеалните со кои работеле во процесот на дизајнирање, распоредот на овој сајт би можел да биде во сериозна опасност. Ова е причината зошто е особено важно да ги тестирате сите содржини на веб страната и аспектите на изгледот на страницата пред да го започнете тоа место. Еве неколку совети за тоа како можете да го направите ова.

Тестирање на големини на слики

Без сомнение, најчестиот начин на кој луѓето го скршнуваат распоредот на нивната веб-страница е со додавање на несоодветно големи слики (ова е и начинот на кој тие негативно влијаат врз вкупните перформанси на сајтот и предизвикуваат брзи брзини на преземање). Ова ги вклучува сликите кои се премногу големи, како и оние кои се премногу мали за да работат како што е наменето во вашата веб-страница.

Дури и ако користите CSS за да ја присилите големината на овие слики во вашиот распоред, сликите кои се многу извонредни со вашите оригинални спецификации за локацијата ќе предизвикаат проблеми. Ако димензиите на сликата се неточни, вашиот CSS може да ја присили таа слика да се прикажува со користење на соодветна ширина и висина, но самата слика и неговиот сооднос на сликата може да бидат искривени. Тоа сигурно ќе има негативен ефект врз изгледот на вашиот сајт, бидејќи сликата која е премногу мала ќе биде "разнесена" и ќе го изгуби квалитетот. Сликата што е преголема, која е помала со CSS, изгледа добро и го задржува својот квалитет, но големината на датотеката може да биде неразумно голема за тоа како се користи.

При тестирањето на работата на вашиот веб-сајт, не заборавајте да додадете слики кои не спаѓаат во предвидениот обем. Додајте во CSS и техники за одзив на слики кои ги адресираат овие предизвици со промена на големината на сликата според, или, во случај на погрешен сооднос на соодносот, исто така, размислува да користи нешто како CSS сопственост на клип за да ја исече сликата по потреба.

Тестирање на други медиуми

Покрај сликите, исто така тестирајте други медиуми како видеа на вашиот сајт и да видиме како овие елементи ќе се појават во вашиот изглед користејќи различни вредности за големина и големини. Уште еднаш, размислете за реактивната природа на вашиот сајт и како ќе работи за различни уреди и големини на екран .

Тестирање на текстуални наслови

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

Ако имате дизајнирано веб-страница за да приспособите наслов како овој:

"Тестирање на текстуални наслови"

Но, вашиот клиент го користи CMS за да додаде статија со наслов како овој:

"Тестирање на текстуални наслови на повеќе веб-страници со различна големина и потреби"

Потоа вашиот изглед можеби нема да биде во можност чисто да се приспособат на тој екстра текст. Исто како што би требало да ги нагласите и да ги тестирате вашите слики и медиуми со додавање на записи кои паѓаат добро надвор од големината која првично сте ја дизајнирале, така треба да го направите со насловите на текстот за да бидете сигурни дека се доволно флексибилни за ефикасно прикажување дури и ултра долги линии како што е еден погоре.

Тестирање на должината на текстот

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

Бидејќи веб-страниците, по природа, растат во големина за да се приспособат на висината на текстот што го содржат, страниците со многу текст обично ќе се скалираат по висина колку што е потребно. Освен ако не сте ја ограничиле висината на страната (што не треба да ја направите ако сакате вашата страница да биде флексибилна), дополнителниот текст не треба да претставува проблем. Премногу мал текст е уште едно прашање - и тоа е оној што многу дизајнери забораваат да ги тестираат за нивниот дизајн процес.

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

Тестирање на страница зум

Луѓето со проблеми со видот може да ја користат функцијата Page Zoom на веб-прелистувачот за да ја зголемат големината на вашата веб-страница. Ако некој зумира во значителна сума, вашиот распоред може да се прекине. Ова е една од причините зошто можеби ќе сакате да ги користите ЕМ како мерна единица за големината на фонтот на вашиот веб-сајт, како и вашите медиумски пребарувања . Бидејќи EMs се релативна единица за мерење (врз основа на стандардната големина на текстот на тој прелистувач), тие се повеќе придонесуваат за течни, флексибилни распореди на веб-страници.

Проверете ја вашата веб-страница за зумирање на страници и немојте само да застанете на едно или две нивоа на зумирање. Зумирајте го вашиот сајт нагоре и надолу на различни нивоа за да осигурате дека вашите страници реагираат како што треба.

Не заборавајте за брзината на преземање и ефикасноста

Додека го тестирате изгледот на импликациите на клиентските одлуки, не заборавајте исто така да обрнете внимание на влијанието што тие одлуки го имаат врз перформансите на сајтот. Сликите и содржината што ќе ги додадат тие клиенти може да ја попречат брзината на преземање на страницата и сериозно да ја уништат севкупната употребливост на страницата. План за влијанието на овие додатоци и направете ја вашата улога во развојниот процес за да ги минимизирате овие ефекти.

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

Обуката на клиенти е од суштинско значење

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