Como estrés Proba o contido do teu sitio web

Compara as imaxes e as lonxitudes de texto para garantir que o sitio reacciona de forma adecuada

Cando deseñamos sitios web e planificamos como se mostrará o contido destes sitios, a miúdo faino cunha situación ideal. Os titulares e as áreas de texto pódense imaxinar como tendo certos tamaños, mentres que as imaxes que acompañan ese texto están deseñadas para mostrarse en dimensións que lles permitan funcionar como se desexa no deseño xeral. Aínda que estes elementos sexan un tanto fluídos como parte dun sitio web sensible (o que deberían ser), haberá un límite para a flexibilidade que poden ser.

Se implementas un sitio web nun CMS (sistema de xestión de contido) e permite que os clientes poidan xestionar ese sitio e engadir un novo contido ao longo do tempo, os límites que deseñou serán absolutamente probados. Confíe no feito de que os seus clientes atopen formas de alterar o sitio web que nunca soñou que farían. Se non representou situacións ben afastadas das que traballou no seu proceso de deseño, o deseño do sitio podería estar en grave perigo. É por iso que é especialmente importante que estrés a proba de todos os contidos do sitio web e os aspectos do deseño do sitio antes de iniciar ese sitio. Aquí tes algúns consellos para saber como podes facelo.

Probas de tamaños de imaxes

Sen dúbida, a forma máis común de que as persoas rompen o deseño do seu sitio web é engadindo imaxes de tamaño inadecuado (esta tamén é a forma na que impactan negativamente o rendemento global dun sitio e causan velocidades de descarga lentas). Isto inclúe imaxes que son demasiado grandes, así como aquelas que son demasiado pequenas para funcionar como o desexa no seu sitio web.

Mesmo se usa CSS para forzar o tamaño destas imaxes no seu deseño, as imaxes que estean fóra de escala con as súas especificacións orixinais para o sitio causarán problemas. Se as dimensións dunha imaxe son incorrectas, o CSS pode forzar que a imaxe se amose usando o ancho e a altura axeitados, pero a imaxe e a relación de aspecto poden distorsionarse. Iso seguramente terá un efecto negativo na mirada do seu sitio porque unha imaxe que é demasiado pequena será "soprada" e perderá a calidade. Unha imaxe que é demasiado grande que se fai máis pequena con CSS fíxase moi ben e conserve a súa calidade, pero o tamaño do ficheiro podería ser pouco razoable para o seu uso.

Ao probar o traballo do teu sitio web, asegúrate de engadir imaxes que non teñan o alcance desexado. Agregue CSS e técnicas de imaxe que respondan a estes retos redimensionando a imaxe de acordo ou, no caso dunha relación de aspecto incorrecta, tamén considerando usar algo así como a propiedade de CSS clip para recortar a imaxe segundo sexa necesario.

Probas de outros medios

Ademais das imaxes, tamén probar outros medios como os vídeos do seu sitio e ver como aparecerán eses elementos no seu deseño usando diferentes valores de tamaño e relación de aspecto. Unha vez máis, considere o carácter sensible do seu sitio e como funcionará para diferentes dispositivos e tamaños de pantalla .

Probas de encabezados de texto

Despois das imaxes, a seguinte área do sitio web que provoca máis problemas cos sitios web en directo xestionados por profesionais non profesionais son títulos de texto. Estas son as (supostamente) liñas curtas de texto que adoitan comezar o contido dunha páxina ou unha sección nesa páxina. O texto anterior a este parágrafo que le "Probas de encabezados de texto" é un exemplo diso.

Se desexas un sitio para acomodar un título como este:

"Probar títulos de texto"

Pero o teu cliente usa o CMS para engadir un artigo cun título como este:

"Probar títulos de texto nunha variedade de páxinas web con requisitos de tamaños diferentes e necesidades dos usuarios"

A continuación, o seu deseño pode non ser capaz de acomodar limpo todo o texto extra. Do mesmo xeito que debería estresar a proba das imaxes e os medios engadindo entradas que caen ben fóra dos tamaños deseñados inicialmente, así que deberías facelo cos encabezados de texto para asegurarte de que son o suficientemente flexibles como para mostrar de forma eficaz liñas extremadamente longas como a un anterior.

Probar lonxitudes de texto

Manténdose no tema do texto, tamén quererá probar longitudes de texto diferentes para o contido principal das páxinas . Isto inclúe texto que é moi, moi longo e moi curto, que pode ser o problema que condena moitos esquemas de páxinas.

Porque as páxinas web, por natureza, crecen en tamaño para acomodar a altura do texto que conteñen, as páxinas con moito texto normalmente só se escalarán en altura segundo sexa necesario. A non ser que teña restrinxido o alto da páxina (o que non debería facer se quere que a súa páxina sexa flexible), o texto extra non debe supoñer un problema. Moi pouco texto é outro tema e é un que moitos diseñadores esquecen de probar no seu proceso de deseño.

Moi pouco texto pode facer que a páxina pareza incompleta ou mesmo rota, así que asegúrate de escalar o contido da túa páxina para ver o que sucede nesas instancias e facer os axustes necesarios para o CSS do teu sitio para xestionar esas situacións.

Páxina de proba de zoom

As persoas con problemas de visión poden estar usando a función Zoom de páxina dun navegador web para aumentar o tamaño da súa páxina web. Se alguén se afasta de forma significativa, o seu deseño podería descompoñerse. Este é un dos motivos polos que pode querer usar EM como a unidade de medida para os tamaños de fontes do seu sitio web e as súas consultas multimedia . Debido a que os EM son unha unidade de medida relativa (baseada no tamaño de texto por defecto dese navegador), son máis propicias para un fluído e flexible deseño de sitios web.

Proba o teu sitio web para o zoom da páxina e non te pare simplemente a un ou dous niveis de zoom. Amplíe o seu sitio cara arriba e abaixo nunha variedade de niveis para asegurar que as páxinas reaccionen como desexado.

Non esqueza sobre a velocidade de descarga e rendemento

Ao probar as implicacións de deseño das decisións dos clientes, non esqueza tamén prestar atención ao impacto que estas decisións teñen no desempeño dun sitio. As imaxes e os contidos que engadirán estes clientes poderían dificultar a velocidade de descarga dun sitio e destruír seriamente a usabilidade xeral do sitio. Planifique o impacto destas adicións e faga a súa parte no proceso de desenvolvemento para minimizar estes efectos.

Se o teu sitio está a ser construído cun orzamento de rendemento, comparta esta información cos teus clientes e mostralles como probar unha páxina web para obter métricas de rendemento. Explicarlles a importancia de manter estes limiares establecidos para o tamaño da páxina e a velocidade de descarga e amosarlles como as adicións que fan poden afectar o conxunto do sitio. Aproveite o tempo para instruirlos como manter o sitio funcionando e mirando ben. Sobre o tema da formación ...

O adestramento ao cliente é esencial

É importante estrés testear as imaxes do seu sitio, o texto e outros elementos da páxina e crear estilos que representarán casos extremos, pero iso nunca é un substituto para a formación do cliente. O seu traballo a proba de bala dun sitio web debe ser ademais do tempo que se dedica a capacitar aos seus clientes como coidar de forma eficaz e xestionar o seu sitio. Ao final, un cliente ben adestrado que comprenda as súas responsabilidades e o impacto das decisións que fan nun sitio será inestimable para os seus esforzos para manter o sitio funcionando e buscando o mellor.