Documentos de Académico
Documentos de Profesional
Documentos de Cultura
VELOCIDAD 7
DISEÑO 15
COPYWRITING 26
SEGURIDAD 32
CONCLUSIÓN 36
ACERCA DE STAGE 37
TEXTO
DESIGN
INTRODUCCIÓN
Mejorar el rendimiento de un sitio web es un proceso
complejo porque involucra muchas variables: diseño
(requisito asociado al neuromarketing), velocidad
de carga de la página, copywriting, responsividad,
accesibilidad, entre otros elementos que tienen como
objetivo mejorar la experiencia de usuario.
¡Disfruta la lectura!
7
VELOCIDAD
Un estudio de Google de 2017 que evaluó
el comportamiento del usuario en dispositivos móviles,
certificó que el tiempo la carga de la página era
directamente proporcional al porcentaje de rebote.
Un retraso de 1 a 10 segundos, por ejemplo, aumenta
la tasa de rebote en 123%.
Google creó un documento —CrUX Hay cada vez más métodos para reducir
(Chrome User Experience Report)— este tiempo de carga —el uso de sprites,
que demuestra la importancia de la la optimización de imágenes y la reducción
velocidad para la experiencia del usuario. del número de solicitudes HTTP, por
En este requisito, dos métricas son ejemplo. Incluso para conexiones más lentas,
importantes: First Contentful Paint (FCP) es posible reducir en gran medida esta
y DOMContentLoaded (DCL). métrica. Ve algunos consejos a continuación.
Los plugins de caché realizan esta función en ## almacenamiento en caché para dispositivos
WordPress. Los más famosos son W3 Total Cache, móviles;
WP Super Caché y WP-Rocket. Los recursos
para la optimización del rendimiento del sitio ## búsqueda anticipada de DNS.
incluyen:
11
UTILIZA SPRITES CSS Hay plugins que excluyen este tipo de archivo,
como WP-Optimize. También es posible programar
Un sprite es una imagen que contiene todas la exclusión automática de elementos de la basura
las demás. Si el sitio es grande, con varios (solo se debe agregar el código “EMPTY_TRASH_
recursos visuales que exigen capacidad de DAYS”, 7 en su archivo wp-config.php, donde 7
almacenamiento, se pueden comprimir con es el plazo límite que, por patrón, es de 30 días)
una herramienta específica y, mediante CSS, o deshabilitar la opción de revisión (“WP_POST_
se pueden ocultar para optimizar el rendimiento. REVISIONS”, false).
12
REDUCE EL NÚMERO DE
REDIRECCIONES
MINIMIZA EL CÓDIGO CSS, Cada vez que una página se redirige a otra, el visitante
JAVASCRIPT Y HTML debe esperar la conclusión del ciclo de repuesta
y solicitud HTTP y esto también necesita optimizarse
Cuando el usuario mejora el código del sitio web para mejorar la velocidad del sitio web. Por ejemplo,
(elimina espacios, comas y otros caracteres si tu patrón de redireccionamiento para dispositivos
innecesarios, como comentarios, formato y códigos móviles es “misitio.com -> www.misitio.com ->
no utilizados), también optimiza la velocidad m.misitio.com -> m.meusite.com/home”, cada uno
de la página. CSSNano y UglifyJS son ejemplos de estos dos redireccionamientos adicionales hará
de herramientas que realizan esta función. que la página quede más lenta.
15
DISEÑO
También según el estudio de Google, cuando
el volumen de elementos del sitio —texto,
títulos, imágenes, por ejemplo— aumenta, la
probabilidad de conversión disminuye. En el
estudio, el aumento de 5600 elementos resultó
en la reducción del 95% en CRO.
El propietario del sitio web siempre debe pensar en A pesar de la importancia de los recursos gráficos,
la experiencia del usuario. Para eso necesitas poner visuales y de interactividad, es fundamental optimizar
a disposición la cantidad de información necesaria este tipo de contenido para evitar archivos grandes que
para proporcionar la búsqueda inicial del visitante: comprometan la velocidad de carga de la página.
LEY DE HICK
ESPACIO NEGATIVO
TIPOGRAFÍA
La tipografía es otro elemento del diseño. Es necesario El uso de diferentes estilos de fuente puede
garantizar legibilidad a los elementos tipográficos aumentar el interés de los usuarios y el uso
básicos además del estilo de la fuente, como la altura de de negrita e itálico en palabras clave y frases
la línea, el espaciado entre las letras y los tamaños de específicas. Elementos subrayados debe limitarse
la fuente, precisamente para contemplar el requisito de a los enlaces.
espacio negativo.
21
DISEÑO EN F
MATRIZ DE COLORES
CONTRASTE
El color puede desempeñar un papel clave en la
usabilidad de los sitios web, además de ser un requisito El contraste mantiene el contenido, las headlines
indispensable en estrategias de marca. Las matrices y los botones de CTA legibles y más visibles para
y las combinaciones de diferentes colores pueden el usuario en la navegación.
evocarles emociones y reacciones a los usuarios.
Muchas empresas adoptan un esquema de color MENOS ES MÁS
específico como atributo de la marca. Los software
de Adobe ofrecen recursos para crear esquemas de La simplicidad es muy importante cuando se
colores basados en imágenes y ajustar los colores de trata de generar conversiones: un diseño limpio y
algunos elementos individualmente. organizado minimiza las distracciones y es más
agradable estéticamente a los ojos de los usuarios.
PRINCIPIO DE LA SEMEJANZA
DE GESTALT
COPYWRITING
Pero en realidad, el principal requisito del
copywriting es la headline. Primero, es necesario
convencer al usuario de leer lo que tienes a decir.
Otro punto importante del copywriting está De esta forma, es posible producir contenido
relacionado con la comprensión de la audiencia orientado a los clientes, con estilo, lenguaje y
del sitio. Necesitas saber las características métodos de abordaje que se acercan de su realidad,
más relevantes para comprender el perfil y el lo que aumenta considerablemente las posibilidades
comportamiento de estas personas. de conversión. Para optimizar la escritura persuasiva,
algunas estrategias pueden ser aplicadas:
29
## crea una conexión con el lector para que la relación ## anticípate a las objeciones, es decir, responder de
de confianza favorezca el reconocimiento de que el antemano a cualquier pregunta del lector y saber
sitio tiene lo que el visitante realmente necesita en lidiar con cualquier duda;
ese momento;
## trabaja tu capacidad para persuasión, a través
## apuesta por verbos de acción (en imperativo); de principios aspectos psicológicos como la
reciprocidad, prueba social, afección, autoridad,
## provoca el sentido de urgencia del lector, para que consistencia y escasez;
la actitud que genere la conversión sea rápida;
## usa storytelling: una de las formas más efectivas
## haz comparaciones, a través de analogías y de atraer la atención e involucrar a una audiencia
metáforas, para aclarar ideas, aumentar la es a través de una historia convincente;
familiaridad de la información y permitir que
el visitante cree conexiones con el contenido; ## haz preguntas que recibirán respuestas positivas;
## sé objetivo;
30
RESPONSIBIDAD
/ USABILIDAD /
ACCESIBILIDAD
La responsividad garantiza que un sitio web aparezca
de la misma manera en un desktop o en un dispositivo
móvil. El diseño es simple, las características están
disponibles y las acciones no se ven obstaculizadas,
independientemente del tamaño del equipo.
MANTÉN LA INFRAESTRUCTURA
DE TI SIEMPRE ACTUALIZADA
## Sucuri Sucurity;
## Wordfence Sucurity;
CONCLUSIÓN
La experiencia del usuario es la clave para las
estrategias de SEO y CRO. Antes de implementar
cambios estructurales en tu página, estudia
también las características y expectativas de
tu audiencia, analiza los datos cuantitativos y
cualitativos de acceso y haz un diagnóstico de
cualquier problema que pueda interferir con
el funcionamiento del sitio.
ACERCA DE STAGE