CONTENIDO WEB Textos - Imágenes.

Presentación del tema: "CONTENIDO WEB Textos - Imágenes."— Transcripción de la presentación:

1 CONTENIDO WEB Textos - Imágenes

2 TEXTOS PARA WEB El texto es el elemento central de cualquier sitio Web. No es lo mismo escribir para la Web que para un escrito impreso. El texto es el elemento central porque los usuarios principalmente lo visitan para obtener información No es lo mismo escribir un texto impreso que escribir para la Web porque esta redacción debe comunicar de forma efectiva la información o el contenido del sitio a los usuarios de manera muy clara y sencilla, además de lograr posicionar la página en primeras posiciones en los buscadores por su facilidad de lenguaje.

3 Público a quien se dirige
Tipo de público Para redactar los textos Web se debe tener en cuenta: El público a quien se dirige es muy importante puesto que de esto depende la redacción no es lo mismo redactar para un sitio web de adultos que para un sitio de niños El tipo de público también es de vital importancia porque de esto depende el diseño, por ejemplo: tener en cuenta el idioma si es para público extranjero, la capacidad de navegadores de otros países. Si no se ofrece la opción para el idioma extranjero, el lenguaje que se utilice debe ser tan sencillo que cualquier persona de otro idioma lo pueda comprender. También se debe tener en cuenta el formato de fecha en Colombia (dd/mm/aa) en EEUU utilizan (m/d/a), hora, valores monetarios, unidades de medida porque no todos los países utilizan el mismo formato, por lo tanto debe ser muy estándar. Formato de hora, fecha y número de acuerdo al idioma

4 Lenguaje claro y Sencillo
No usar lenguaje muy técnico Lo más importante al escribir para la web es utilizar un lenguaje claro, sencillo, con una correcta ortografía y gramática No utilizar un lenguaje muy técnico porque lo que se pretende es comunicar el mensaje de manera directa, sencilla y precisa, eliminando términos o expresiones que sean específicos de una disciplina o un grupo de expertos. Eliminar también las siglas no conocidas y los regionalismos, evitando palabras que se presten para confusiones. No usar siglas ni regionalismos

5 Evitar las redundancias Usar una tipografía legible
Usar verbos Evitar redundancias Usar tipografía legible El uso de los verbos precisos comunican con mayor fuerza lo que se desea expresar, ejecutan una acción, por ejemplo: En lugar de decir el sitio web Sirve para explicar como administrar los recursos naturales se puede decir el sitio web explica como administrar los recursos naturales. Evitar las redundancias Usar una tipografía legible

6 Tipografías estándares en la Web
Para visualizar correctamente una fuente de Internet esta debe estar instalada en el equipo del visitante. Hay una serie de tipografías instaladas por defecto en prácticamente todos los sistemas operativos, estas son las tipografías estándares. Las tipografías estándares son: Arial Arial Black Comic Sans Georgia Impact Lucida console Lucida Sans unicode Palatino Tahoma - Geneva Times New Roman - Times Helvatica Verdana La Helvatica es el tipo de fuente que más se utiliza y no viene instalada en el PC, se debe pagar por ella. Arial si viene en el sistema y es muy fácil de leer. Debe ser un tipo de letra común para todos los usuarios

7 No usar imágenes de fondo
No usar cursivas ni abusar de las mayúsculas Para mejorar la legibilidad de los textos para la web hay varios aspectos que se deben tener en cuenta, entre ellos encontramos: Dejar espacios en blanco en la página, para descansar la vista Tratar de no usar imágenes de fondo porque pueden distraer al lector y la legibilidad del texto se pierde La tipografía adecuada Evitar la justificación pues se ve muy cuadriculado Tamaño de letra entre 12 y 14 No abusar del uso de las negritas ni de mayúsculas Los títulos deben ser cortos y de palabras significativas y los subtítulos facilitarán la exploración por el sitio Usar títulos y subtítulos

8 IMAGENES Las imágenes que se utilicen en la web, deben estar enfocadas a los usuarios y a lo que se pretende mostrar. Se deben utilizar formato eficientes para las imágenes, por ejemplo para las fotografías, se puede usar JPG o PNG.. Las imágenes que se utilicen siempre deben tener relación con lo que pretende mostrar el sitio, por ejemplo si el sitio es de una Jardinería debe tener imágenes de un jardín ya completamente organizado y no flores de manera independiente. Se debe utilizar un formato eficiente como JPG, GIF y PNG. El más óptimo es JPG porque es el más comprimido es decir los pixeles estarán más juntos y mejor será la nitidez. El GIF se utiliza para las animaciones y el PNG es la evolución del JPG y trae transparencia en la parte de atrás es decir al momento de ubicarlo en un fondo negro no se verá las esquinas blancas. Debe ser óptimo. Usar un formato inadecuado puede doblar o triplicar el tamaño del archivo y del tiempo de la transferencia desde el servidor.

9 IMAGENES A continuación aparece un ejemplo para ver como afecta a cada tipo de imagen el formato de exportación elegido tanto en calidad de la imagen como en peso:

10 EJEMPLOS: Tomado de http://www.dechicos.net/
Cuando se redacta la información de la empresa, como “quienes somos”, es muy importante ser claros en la razón de ser de la empresa. Indicar en palabras claras y sencillas qué se realiza la empresa, cómo lo hace, quiénes lo hacen y a quién va dirigido. Observe que la imagen complementa el texto. Tomado de

11 La tipografía seleccionada para los textos debe ser clara y legible
La tipografía seleccionada para los textos debe ser clara y legible. En este caso el tipo de fuente es muy pequeña, además al texto le aplicaron una especie de sombra que hace no sea muy legible. Además quisieron dar énfasis en los productos que ofrecen, colocando el texto más oscuro, con esto el usuario no leerá todo el párrafo sino que enfocara la lectura en este texto. Tomado de

12 Cuando un sitio web ofrece productos o servicios, las imágenes a utilizar deben ser reales, donde se observen las particularidades del mismo. En este caso la imagen no es muy óptima, ni describe muy bien el producto. Esta imagen esta acompañada de un texto explicando las características de la cuna. Los párrafos están divididos por títulos, el principal tiene una tipografía más grande que las demás, y los subtítulos tienen un color diferente o tienen negrita. Tomado de

13 Tomado de: http://www.totto.com/co/totto
Una buena galería Web debe mostrar al posible comprador el producto desde diferentes perspectivas. En este caso el sitio ofrece imágenes desde diferentes ángulos del morral. Además muestra una imagen de cómo se debe llevar puesto el morral. Como novedad esta pagina permite al usuario hacer un zoom sobre la imagen para observar mas de cerca los acabados del morral. Contiene las características de éste y su precio. También contiene opciones para agregar al carrito de compras, o a una lista de deseos y la opción para comentar sobre el producto. Por ejemplo: Revisar esta página y verificar toda la usabilidad, tiene widgets Tomado de:

14 Tomado de: http://velez.dafiti.com.co/
En este ejemplo se puede observar los zapatos desde diferentes ángulos, haciendo clic en las imágenes en miniatura de la parte inferior. Además muestra las tallas disponibles. Pero no tiene las características del producto, como materiales o colores disponibles. Tiene la opción de agregar al carrito de compra y de redes sociales. Visitar este sitio, por ejemplo ver todas las imágenes Tomado de: