SlideShare una empresa de Scribd logo
1 de 13
Agustín Rojas Flores
INDICE 
1. Concepto de sitios Web y páginas Web 
2. Concepto de Usabilidad y Accesibilidad de un sitio Web. 
3. Aspectos de Usabilidad a tener en cuenta: 
a) Objetivos y público objetivo. 
b) Tipos de estructura de un sitio Web 
c) Niveles en un sitio Web 
d) Navegación en un sitio Web. Consejos 
e) Tipos de enlaces Web 
f) Diseño lógico de un sitio 
g) Prototipación
Sitios Web y Páginas Web 
Sitio Web: Es un conjunto de archivo llamados páginas Web generalmente 
vinculadas entre si por enlaces, con un mismo contenido temático, y organizadas 
jerárquicamente. Generalmente tiene una página principal que se llama 
index.html 
Página Web: Es parte de un sitio Web y es un único archivo con nombre propio. 
Página Web 
Sitio Web 
Página principal: 
Index.html
Similitudes CCoommeerrcciioo // SSiittiioo WWeebb 
Comercio Un Sitio Web necesita 
•Un Nombre 
•Una dirección física en 
determinado lugar 
•Un espacio físico (Local) 
•Organizar las mercaderías 
dentro del local 
•Una Vidriera (Primera cara 
visible) 
•Accesos internos a las 
distintas ofertas que se 
comercializan 
•Un Nombre 
• Una dirección virtual 
(Dominio) 
•Un espacio físico de 
alojamiento (Hosting) 
•Organizar la información 
dentro del Sitio Web 
•Una Página Principal 
(Primera cara visible) 
•Hipervínculos a las distintas 
Páginas publicadas.
Elementos de una página Web 
Fuente: www.vectoralia.com/manual/html/elementos_web.html
¿Qué hace que un sitio Web sea fácil de 
usarlo e intuitivo para la mayoría de las 
personas? 
DDooss ccoonncceeppttooss ccllaavveess 
UUssaabbiilliiddaadd AAcccceessiibbiilliiddaadd 
Es la capacidad de un sitio Web de 
ser comprendido, aprendido y usado 
por un usuario. Conjunto de técnicas 
orientadas a tal fin (diseño grafico, 
estructura, publico objetivo, 
navegación y enlaces entre otros 
Es la capacidad de acceso a un sitio Web y 
sus contenidos por parte de todas las 
personas independientemente de la 
discapacidad (física, intelectual o técnica) 
que tengan o las relacionadas al contexto 
de uso. Por ejemplo: textos alternativos en 
imágenes (ALT), enlaces significativos, etc
Objetivo y público objetivo 
Implica 
A. Conocer cómo son Edad de la mayoría de los usuarios que podrían 
B. Para qué usan el sitio 
C. Qué necesitan 
Usos del sitio Web trabajo, divulgación, comercial, educativo 
D. Testar el sitio con los propios usuarios 
E. Investigar cómo reaccionan ante el 
diseño 
F. Cómo es su experiencia de uso 
G. Cómo es el contexto de uso 
MODELADO DEL 
USUARIO 
Uso intuitivo y efectivo. “Amigable” 
Capacidad de adaptación al sistema 
de navegación. 
Es determinar perfiles 
de usuarios en relación 
a atributos comunes 
Enlace: Perfiles de usuarios 
acceder al sitio. 
Necesidades de información. 
Conocimientos informáticos. 
Ubicación geográfica.Idioma.Equipo de cómputo
Diseño lógico de un sitio Web 
Luego de saber los objetivos se establece la organización lógica de las páginas 
del sitio Web y la información que irá en cada una de ellas. 
Para el diseño lógico se aplico metáforas que implica utilizar ejemplos concretos y 
familiares de la vida que me sirvan luego en la estructura del sitio. Por ejemplo un 
árbol, libro, tienda entre otras. 
De la estructura lógica de un sitio surgen los mapas de navegación es decir la 
estructura que tiene mi sitio Web y sus interconexiones
EEssttrruuccttuurraa ddee uunn ssiittiioo WWeebb 
Es la forma que tendrá el Sitio Web con sus secciones, funcionalidades y 
sistemas de navegación 
Tipos 
Arbol Listas 
Existe una página principal 
y de ahí se accede a otro 
grupo de páginas y estas a 
su vez son nodo de otras 
(niveles). Es jerarquizada, 
compleja, y algo difícil para 
navegar.Consejo no mas 
de 3 niveles. 
La organización del 
sitio es totalmente 
opuesto al anterior.No 
existe una página raíz 
o principal. Ideal para 
manuales o guías. 
Mixta 
Tiene las ventajas 
de las 2 
anteriores. Las 
páginas están 
jerarquizadas en 
niveles, y en cada 
nivel se organizan 
como listas. 
Red 
Páginas todas 
conectadas entre 
si. Algo anárquica. 
¡Ojo! no dejar 
enlaces 
inexistentes y que 
el usuario se 
pierda
Niveles de un Sitio Web 
Se refiere a distancia máxima para alcanzar un determinado documento dentro de 
un sitio Web. Es aconsejable no mas de 3 niveles. 
Nivel 1 
Nivel 2 
Nivel 3 
Nivel 4 
Nivel 5
Navegación en los sitios Web 
Se refiere a las formas de acceder a los distintos contenidos del sitio 
Debe tener las siguientes características: 
A-Consistente: El sistema de navegación debe ser similar en todo el sitio 
en su ubicación y disposición en las páginas. 
B- Uniforme: Deben de usarse los mismos términos en todas las páginas 
para que el usuario se sienta seguro que va donde desea. 
C-Visible: El sistema debe distinguirse claramente dentro del sitio 
También hay que considerar 2 elementos claves para la navegación: 
1- Textual: La navegación se hace con elementos concretos: menú, guías y 
botones que digan con claridad la acción que van realizar 
2- Contextual: Elementos relevantes que permitan mostrar la navegación en 
pantalla
Tipos de enlaces Web 
Enlaces semánticos: Son enlaces entre páginas que tienen una relación de 
contenidos entre sí 
“De una importancia igual o superior a la conquista militar, la 
evangelización de los pueblos indígenas recayó en manos de los 
Frailes dominicos, quienes mandaron construir, con mano de obra 
esclava de origen indígena, numerosos templos iglesias y conventos.” 
Enlace semántico 
Enlaces de navegación: Solo sirven para conectar páginas entre sí sin un 
relación explícita. Ej.: El enlace “Volver” o “Página inicial” o el camino recorrido 
en el sitio 
Enlace de navegación
Prototipado 
Significa elaborar modelos o prototipos del sitio Web y por lo tanto no es 
el producto final, pero sirve para observar si se van cumpliendo los 
objetivos de usabilidad y accesibilidad. Luego de implementado se 
desecha. 
Según el grado de fidelidad o calidad del prototipo se distingue entre: 
Prototipado de alta fidelidad: El prototipo será muy parecido al sitio 
Web una vez terminado. 
Prototipado de baja fidelidad: El aspecto del prototipo distará bastante 
del que tenga el sitio Web final

Más contenido relacionado

La actualidad más candente

Arquitectura de un sitio web
Arquitectura de un sitio webArquitectura de un sitio web
Arquitectura de un sitio webedgarcajun
 
Diseno web 4
Diseno web 4Diseno web 4
Diseno web 4blogdevon
 
Diseño y Maquetacion
Diseño y MaquetacionDiseño y Maquetacion
Diseño y Maquetacionvictoremr
 
Introducción a la Arquitectura de Información
Introducción a la Arquitectura de InformaciónIntroducción a la Arquitectura de Información
Introducción a la Arquitectura de Informaciónwww.usarte.co
 
Organización, navegación y tipologías de sitios web
Organización, navegación y tipologías de sitios web   Organización, navegación y tipologías de sitios web
Organización, navegación y tipologías de sitios web LuisGonzlez362
 
Informatika
InformatikaInformatika
InformatikaAndres
 
arquitectura de la informacion
arquitectura de la informacionarquitectura de la informacion
arquitectura de la informacionrjtassi
 
Pagina web, blog y microblog
Pagina web, blog y microblogPagina web, blog y microblog
Pagina web, blog y microblogLore Lorenita
 
Diseño Web-Personales Institucionales
Diseño Web-Personales InstitucionalesDiseño Web-Personales Institucionales
Diseño Web-Personales InstitucionalesYadith Gomez Nolasco
 
Introduccion al diseño web
Introduccion al                                 diseño webIntroduccion al                                 diseño web
Introduccion al diseño webdianayroman
 
Criterios para evaluar sitios web
Criterios para evaluar sitios webCriterios para evaluar sitios web
Criterios para evaluar sitios webAna Gabriela Garcia
 

La actualidad más candente (18)

Arquitectura de un sitio web
Arquitectura de un sitio webArquitectura de un sitio web
Arquitectura de un sitio web
 
Diseño y maquetación de sitios web.ppt
Diseño y maquetación de sitios web.pptDiseño y maquetación de sitios web.ppt
Diseño y maquetación de sitios web.ppt
 
Diseno web 4
Diseno web 4Diseno web 4
Diseno web 4
 
Unidad 4.docx sotfwer
Unidad 4.docx sotfwerUnidad 4.docx sotfwer
Unidad 4.docx sotfwer
 
Navegación
NavegaciónNavegación
Navegación
 
Diseño y Maquetacion
Diseño y MaquetacionDiseño y Maquetacion
Diseño y Maquetacion
 
Introducción a la Arquitectura de Información
Introducción a la Arquitectura de InformaciónIntroducción a la Arquitectura de Información
Introducción a la Arquitectura de Información
 
Organización, navegación y tipologías de sitios web
Organización, navegación y tipologías de sitios web   Organización, navegación y tipologías de sitios web
Organización, navegación y tipologías de sitios web
 
Informatika
InformatikaInformatika
Informatika
 
Buscadores 1
Buscadores 1Buscadores 1
Buscadores 1
 
arquitectura de la informacion
arquitectura de la informacionarquitectura de la informacion
arquitectura de la informacion
 
Pagina web, blog y microblog
Pagina web, blog y microblogPagina web, blog y microblog
Pagina web, blog y microblog
 
El diseño web
El diseño webEl diseño web
El diseño web
 
Diseño Web-Personales Institucionales
Diseño Web-Personales InstitucionalesDiseño Web-Personales Institucionales
Diseño Web-Personales Institucionales
 
sitio web
sitio websitio web
sitio web
 
Clase 3 Wix- Primera Parte
Clase 3 Wix- Primera ParteClase 3 Wix- Primera Parte
Clase 3 Wix- Primera Parte
 
Introduccion al diseño web
Introduccion al                                 diseño webIntroduccion al                                 diseño web
Introduccion al diseño web
 
Criterios para evaluar sitios web
Criterios para evaluar sitios webCriterios para evaluar sitios web
Criterios para evaluar sitios web
 

Destacado

Matemática para todos
Matemática para todosMatemática para todos
Matemática para todosagustin rojas
 
matematica unheval 1
matematica unheval 1matematica unheval 1
matematica unheval 1agustin rojas
 
Terminos basicos estadistica
Terminos basicos estadisticaTerminos basicos estadistica
Terminos basicos estadisticaagustin rojas
 
Estadística sesión 00
Estadística sesión 00Estadística sesión 00
Estadística sesión 00agustin rojas
 
Importancia del aprendizaje de la matematica
Importancia del aprendizaje de la matematicaImportancia del aprendizaje de la matematica
Importancia del aprendizaje de la matematicama_isa
 
Como enseñar historia
Como enseñar historiaComo enseñar historia
Como enseñar historiamarriteere
 
Cómo enseñar matemáticas
Cómo enseñar matemáticasCómo enseñar matemáticas
Cómo enseñar matemáticasBibiana Papini
 
Piaget y las matemáticas en infantil I
Piaget y las matemáticas en infantil IPiaget y las matemáticas en infantil I
Piaget y las matemáticas en infantil IUniversidad de Oviedo
 

Destacado (12)

La suma-resta
La suma-restaLa suma-resta
La suma-resta
 
Matemática para todos
Matemática para todosMatemática para todos
Matemática para todos
 
matematica unheval 1
matematica unheval 1matematica unheval 1
matematica unheval 1
 
Terminos basicos estadistica
Terminos basicos estadisticaTerminos basicos estadistica
Terminos basicos estadistica
 
Estadística sesión 00
Estadística sesión 00Estadística sesión 00
Estadística sesión 00
 
Importancia del aprendizaje de la matematica
Importancia del aprendizaje de la matematicaImportancia del aprendizaje de la matematica
Importancia del aprendizaje de la matematica
 
Como enseñar historia
Como enseñar historiaComo enseñar historia
Como enseñar historia
 
Cómo enseñar matemáticas
Cómo enseñar matemáticasCómo enseñar matemáticas
Cómo enseñar matemáticas
 
Piaget y las matemáticas en infantil I
Piaget y las matemáticas en infantil IPiaget y las matemáticas en infantil I
Piaget y las matemáticas en infantil I
 
Pensamiento matematico en preescolar
Pensamiento matematico en preescolarPensamiento matematico en preescolar
Pensamiento matematico en preescolar
 
Pensamiento matematico
Pensamiento matematico Pensamiento matematico
Pensamiento matematico
 
Pensamiento Matemático
Pensamiento MatemáticoPensamiento Matemático
Pensamiento Matemático
 

Similar a Sitio web

Elementos del sitio web
Elementos del sitio webElementos del sitio web
Elementos del sitio webRosa N Escobar
 
Páginas_web guia didactica.pdf
Páginas_web guia didactica.pdfPáginas_web guia didactica.pdf
Páginas_web guia didactica.pdfTEMPORAL13
 
Proyecto integrador
Proyecto integrador Proyecto integrador
Proyecto integrador grillor77lk
 
Diseño web-personales institucionales
Diseño web-personales institucionalesDiseño web-personales institucionales
Diseño web-personales institucionalesYadith Gomez Nolasco
 
Evaluacionpaginasweb
EvaluacionpaginaswebEvaluacionpaginasweb
Evaluacionpaginaswebguest922fe3
 
Ficha# 1 página y sitio web (1) (terminada)
Ficha# 1 página y sitio web (1) (terminada)Ficha# 1 página y sitio web (1) (terminada)
Ficha# 1 página y sitio web (1) (terminada)valenena8
 
Evaluación de fuentes de informacion digital
Evaluación de fuentes de  informacion digitalEvaluación de fuentes de  informacion digital
Evaluación de fuentes de informacion digitalelizaaristizabal
 
Clase4 Pdigital2008 II
Clase4 Pdigital2008 IIClase4 Pdigital2008 II
Clase4 Pdigital2008 IIedgarcajun
 
Presentación evolución de la web 10-05
Presentación evolución de la web 10-05Presentación evolución de la web 10-05
Presentación evolución de la web 10-05Brayan Triviño
 
Clase5 Pdigital2008 II
Clase5 Pdigital2008 IIClase5 Pdigital2008 II
Clase5 Pdigital2008 IIedgarcajun
 
Presentación evolución de la web sebastian vargas
Presentación evolución de la web sebastian vargasPresentación evolución de la web sebastian vargas
Presentación evolución de la web sebastian vargasSebastian Vargas
 

Similar a Sitio web (20)

Elementos del sitio web
Elementos del sitio webElementos del sitio web
Elementos del sitio web
 
Páginas_web guia didactica.pdf
Páginas_web guia didactica.pdfPáginas_web guia didactica.pdf
Páginas_web guia didactica.pdf
 
Proyecto integrador
Proyecto integrador Proyecto integrador
Proyecto integrador
 
Arquitectura de la información
Arquitectura de la informaciónArquitectura de la información
Arquitectura de la información
 
Clase no 3
Clase no 3Clase no 3
Clase no 3
 
Diseño web-personales institucionales
Diseño web-personales institucionalesDiseño web-personales institucionales
Diseño web-personales institucionales
 
Diseno web 4
Diseno web 4Diseno web 4
Diseno web 4
 
Introduccion al lenguaje_html
Introduccion al lenguaje_htmlIntroduccion al lenguaje_html
Introduccion al lenguaje_html
 
Evaluacionpaginasweb
EvaluacionpaginaswebEvaluacionpaginasweb
Evaluacionpaginasweb
 
DISEÑO WEB
DISEÑO WEBDISEÑO WEB
DISEÑO WEB
 
Ficha# 1 página y sitio web (1) (terminada)
Ficha# 1 página y sitio web (1) (terminada)Ficha# 1 página y sitio web (1) (terminada)
Ficha# 1 página y sitio web (1) (terminada)
 
Guía de evaluación heurística de sitios web
Guía de evaluación heurística de sitios webGuía de evaluación heurística de sitios web
Guía de evaluación heurística de sitios web
 
Evaluación de fuentes de informacion digital
Evaluación de fuentes de  informacion digitalEvaluación de fuentes de  informacion digital
Evaluación de fuentes de informacion digital
 
Clase4 Pdigital2008 II
Clase4 Pdigital2008 IIClase4 Pdigital2008 II
Clase4 Pdigital2008 II
 
tic
tictic
tic
 
Presentación evolución de la web 10-05
Presentación evolución de la web 10-05Presentación evolución de la web 10-05
Presentación evolución de la web 10-05
 
Clase5 Pdigital2008 II
Clase5 Pdigital2008 IIClase5 Pdigital2008 II
Clase5 Pdigital2008 II
 
Presentación evolución de la web sebastian vargas
Presentación evolución de la web sebastian vargasPresentación evolución de la web sebastian vargas
Presentación evolución de la web sebastian vargas
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 
pagina web
pagina webpagina web
pagina web
 

Más de agustin rojas

ESTADÍSTICA BASICA.pptx
ESTADÍSTICA BASICA.pptxESTADÍSTICA BASICA.pptx
ESTADÍSTICA BASICA.pptxagustin rojas
 
ESTADÍSTICA Educ-1.pptx
ESTADÍSTICA Educ-1.pptxESTADÍSTICA Educ-1.pptx
ESTADÍSTICA Educ-1.pptxagustin rojas
 
Estadisticos modelos probabilisticos 29 3-2020
Estadisticos modelos probabilisticos 29 3-2020Estadisticos modelos probabilisticos 29 3-2020
Estadisticos modelos probabilisticos 29 3-2020agustin rojas
 
Estadisticos muestreo 29 3-2020
Estadisticos muestreo 29 3-2020Estadisticos muestreo 29 3-2020
Estadisticos muestreo 29 3-2020agustin rojas
 
Silabo maestria en educacion
Silabo maestria en educacionSilabo maestria en educacion
Silabo maestria en educacionagustin rojas
 
Didactica matematica 1 rufino
Didactica matematica 1 rufinoDidactica matematica 1 rufino
Didactica matematica 1 rufinoagustin rojas
 
Paradigmas programacion rufino
Paradigmas programacion rufinoParadigmas programacion rufino
Paradigmas programacion rufinoagustin rojas
 
Fundamentosdeprogramacion 2
Fundamentosdeprogramacion 2Fundamentosdeprogramacion 2
Fundamentosdeprogramacion 2agustin rojas
 
lenguaje de programación 1
lenguaje de programación 1lenguaje de programación 1
lenguaje de programación 1agustin rojas
 
Lenguaje de programación 00
Lenguaje de programación 00Lenguaje de programación 00
Lenguaje de programación 00agustin rojas
 
Directiva 02 jornadas dui
Directiva 02 jornadas duiDirectiva 02 jornadas dui
Directiva 02 jornadas duiagustin rojas
 

Más de agustin rojas (20)

ESTADÍSTICA BASICA.pptx
ESTADÍSTICA BASICA.pptxESTADÍSTICA BASICA.pptx
ESTADÍSTICA BASICA.pptx
 
ESTADÍSTICA Educ-1.pptx
ESTADÍSTICA Educ-1.pptxESTADÍSTICA Educ-1.pptx
ESTADÍSTICA Educ-1.pptx
 
Estadisticos modelos probabilisticos 29 3-2020
Estadisticos modelos probabilisticos 29 3-2020Estadisticos modelos probabilisticos 29 3-2020
Estadisticos modelos probabilisticos 29 3-2020
 
Estadisticos muestreo 29 3-2020
Estadisticos muestreo 29 3-2020Estadisticos muestreo 29 3-2020
Estadisticos muestreo 29 3-2020
 
Instrumento (1)
Instrumento (1)Instrumento (1)
Instrumento (1)
 
Estadígrafos 3
Estadígrafos 3Estadígrafos 3
Estadígrafos 3
 
Estadígrafos 2
Estadígrafos 2Estadígrafos 2
Estadígrafos 2
 
Estadigrafos1
Estadigrafos1Estadigrafos1
Estadigrafos1
 
Estadigrafos
EstadigrafosEstadigrafos
Estadigrafos
 
Silabo maestria en educacion
Silabo maestria en educacionSilabo maestria en educacion
Silabo maestria en educacion
 
Física recreativa
Física recreativaFísica recreativa
Física recreativa
 
Correlación 1
Correlación 1Correlación 1
Correlación 1
 
didacticamatematica
didacticamatematicadidacticamatematica
didacticamatematica
 
Didactica matematica 1 rufino
Didactica matematica 1 rufinoDidactica matematica 1 rufino
Didactica matematica 1 rufino
 
Paradigmas programacion rufino
Paradigmas programacion rufinoParadigmas programacion rufino
Paradigmas programacion rufino
 
Fundamentosdeprogramacion 2
Fundamentosdeprogramacion 2Fundamentosdeprogramacion 2
Fundamentosdeprogramacion 2
 
lenguaje de programación 1
lenguaje de programación 1lenguaje de programación 1
lenguaje de programación 1
 
Lenguaje de programación 00
Lenguaje de programación 00Lenguaje de programación 00
Lenguaje de programación 00
 
Rufio
RufioRufio
Rufio
 
Directiva 02 jornadas dui
Directiva 02 jornadas duiDirectiva 02 jornadas dui
Directiva 02 jornadas dui
 

Último

Cuaderno de trabajo Matemática 3 tercer grado.pdf
Cuaderno de trabajo Matemática 3 tercer grado.pdfCuaderno de trabajo Matemática 3 tercer grado.pdf
Cuaderno de trabajo Matemática 3 tercer grado.pdfNancyLoaa
 
Valoración Crítica de EEEM Feco2023 FFUCV
Valoración Crítica de EEEM Feco2023 FFUCVValoración Crítica de EEEM Feco2023 FFUCV
Valoración Crítica de EEEM Feco2023 FFUCVGiustinoAdesso1
 
CALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDADCALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDADauxsoporte
 
ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...
ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...
ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...JAVIER SOLIS NOYOLA
 
Sesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docxSesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docxMaritzaRetamozoVera
 
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptxACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptxzulyvero07
 
plan de capacitacion docente AIP 2024 clllll.pdf
plan de capacitacion docente  AIP 2024          clllll.pdfplan de capacitacion docente  AIP 2024          clllll.pdf
plan de capacitacion docente AIP 2024 clllll.pdfenelcielosiempre
 
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...Carlos Muñoz
 
proyecto de mayo inicial 5 añitos aprender es bueno para tu niño
proyecto de mayo inicial 5 añitos aprender es bueno para tu niñoproyecto de mayo inicial 5 añitos aprender es bueno para tu niño
proyecto de mayo inicial 5 añitos aprender es bueno para tu niñotapirjackluis
 
Dinámica florecillas a María en el mes d
Dinámica florecillas a María en el mes dDinámica florecillas a María en el mes d
Dinámica florecillas a María en el mes dstEphaniiie
 
Ejercicios de PROBLEMAS PAEV 6 GRADO 2024.pdf
Ejercicios de PROBLEMAS PAEV 6 GRADO 2024.pdfEjercicios de PROBLEMAS PAEV 6 GRADO 2024.pdf
Ejercicios de PROBLEMAS PAEV 6 GRADO 2024.pdfMaritzaRetamozoVera
 
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICABIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICAÁngel Encinas
 
La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...JonathanCovena1
 
La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.amayarogel
 
Programacion Anual Matemática5 MPG 2024 Ccesa007.pdf
Programacion Anual Matemática5    MPG 2024  Ccesa007.pdfProgramacion Anual Matemática5    MPG 2024  Ccesa007.pdf
Programacion Anual Matemática5 MPG 2024 Ccesa007.pdfDemetrio Ccesa Rayme
 
Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...Lourdes Feria
 
Criterios ESG: fundamentos, aplicaciones y beneficios
Criterios ESG: fundamentos, aplicaciones y beneficiosCriterios ESG: fundamentos, aplicaciones y beneficios
Criterios ESG: fundamentos, aplicaciones y beneficiosJonathanCovena1
 

Último (20)

Cuaderno de trabajo Matemática 3 tercer grado.pdf
Cuaderno de trabajo Matemática 3 tercer grado.pdfCuaderno de trabajo Matemática 3 tercer grado.pdf
Cuaderno de trabajo Matemática 3 tercer grado.pdf
 
Presentacion Metodología de Enseñanza Multigrado
Presentacion Metodología de Enseñanza MultigradoPresentacion Metodología de Enseñanza Multigrado
Presentacion Metodología de Enseñanza Multigrado
 
Valoración Crítica de EEEM Feco2023 FFUCV
Valoración Crítica de EEEM Feco2023 FFUCVValoración Crítica de EEEM Feco2023 FFUCV
Valoración Crítica de EEEM Feco2023 FFUCV
 
CALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDADCALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDAD
 
Sesión de clase: Fe contra todo pronóstico
Sesión de clase: Fe contra todo pronósticoSesión de clase: Fe contra todo pronóstico
Sesión de clase: Fe contra todo pronóstico
 
ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...
ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...
ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...
 
Sesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docxSesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docx
 
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptxACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
 
plan de capacitacion docente AIP 2024 clllll.pdf
plan de capacitacion docente  AIP 2024          clllll.pdfplan de capacitacion docente  AIP 2024          clllll.pdf
plan de capacitacion docente AIP 2024 clllll.pdf
 
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
 
proyecto de mayo inicial 5 añitos aprender es bueno para tu niño
proyecto de mayo inicial 5 añitos aprender es bueno para tu niñoproyecto de mayo inicial 5 añitos aprender es bueno para tu niño
proyecto de mayo inicial 5 añitos aprender es bueno para tu niño
 
Dinámica florecillas a María en el mes d
Dinámica florecillas a María en el mes dDinámica florecillas a María en el mes d
Dinámica florecillas a María en el mes d
 
Ejercicios de PROBLEMAS PAEV 6 GRADO 2024.pdf
Ejercicios de PROBLEMAS PAEV 6 GRADO 2024.pdfEjercicios de PROBLEMAS PAEV 6 GRADO 2024.pdf
Ejercicios de PROBLEMAS PAEV 6 GRADO 2024.pdf
 
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICABIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
 
La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...
 
La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.
 
Programacion Anual Matemática5 MPG 2024 Ccesa007.pdf
Programacion Anual Matemática5    MPG 2024  Ccesa007.pdfProgramacion Anual Matemática5    MPG 2024  Ccesa007.pdf
Programacion Anual Matemática5 MPG 2024 Ccesa007.pdf
 
Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...
 
Unidad 3 | Metodología de la Investigación
Unidad 3 | Metodología de la InvestigaciónUnidad 3 | Metodología de la Investigación
Unidad 3 | Metodología de la Investigación
 
Criterios ESG: fundamentos, aplicaciones y beneficios
Criterios ESG: fundamentos, aplicaciones y beneficiosCriterios ESG: fundamentos, aplicaciones y beneficios
Criterios ESG: fundamentos, aplicaciones y beneficios
 

Sitio web

  • 2. INDICE 1. Concepto de sitios Web y páginas Web 2. Concepto de Usabilidad y Accesibilidad de un sitio Web. 3. Aspectos de Usabilidad a tener en cuenta: a) Objetivos y público objetivo. b) Tipos de estructura de un sitio Web c) Niveles en un sitio Web d) Navegación en un sitio Web. Consejos e) Tipos de enlaces Web f) Diseño lógico de un sitio g) Prototipación
  • 3. Sitios Web y Páginas Web Sitio Web: Es un conjunto de archivo llamados páginas Web generalmente vinculadas entre si por enlaces, con un mismo contenido temático, y organizadas jerárquicamente. Generalmente tiene una página principal que se llama index.html Página Web: Es parte de un sitio Web y es un único archivo con nombre propio. Página Web Sitio Web Página principal: Index.html
  • 4. Similitudes CCoommeerrcciioo // SSiittiioo WWeebb Comercio Un Sitio Web necesita •Un Nombre •Una dirección física en determinado lugar •Un espacio físico (Local) •Organizar las mercaderías dentro del local •Una Vidriera (Primera cara visible) •Accesos internos a las distintas ofertas que se comercializan •Un Nombre • Una dirección virtual (Dominio) •Un espacio físico de alojamiento (Hosting) •Organizar la información dentro del Sitio Web •Una Página Principal (Primera cara visible) •Hipervínculos a las distintas Páginas publicadas.
  • 5. Elementos de una página Web Fuente: www.vectoralia.com/manual/html/elementos_web.html
  • 6. ¿Qué hace que un sitio Web sea fácil de usarlo e intuitivo para la mayoría de las personas? DDooss ccoonncceeppttooss ccllaavveess UUssaabbiilliiddaadd AAcccceessiibbiilliiddaadd Es la capacidad de un sitio Web de ser comprendido, aprendido y usado por un usuario. Conjunto de técnicas orientadas a tal fin (diseño grafico, estructura, publico objetivo, navegación y enlaces entre otros Es la capacidad de acceso a un sitio Web y sus contenidos por parte de todas las personas independientemente de la discapacidad (física, intelectual o técnica) que tengan o las relacionadas al contexto de uso. Por ejemplo: textos alternativos en imágenes (ALT), enlaces significativos, etc
  • 7. Objetivo y público objetivo Implica A. Conocer cómo son Edad de la mayoría de los usuarios que podrían B. Para qué usan el sitio C. Qué necesitan Usos del sitio Web trabajo, divulgación, comercial, educativo D. Testar el sitio con los propios usuarios E. Investigar cómo reaccionan ante el diseño F. Cómo es su experiencia de uso G. Cómo es el contexto de uso MODELADO DEL USUARIO Uso intuitivo y efectivo. “Amigable” Capacidad de adaptación al sistema de navegación. Es determinar perfiles de usuarios en relación a atributos comunes Enlace: Perfiles de usuarios acceder al sitio. Necesidades de información. Conocimientos informáticos. Ubicación geográfica.Idioma.Equipo de cómputo
  • 8. Diseño lógico de un sitio Web Luego de saber los objetivos se establece la organización lógica de las páginas del sitio Web y la información que irá en cada una de ellas. Para el diseño lógico se aplico metáforas que implica utilizar ejemplos concretos y familiares de la vida que me sirvan luego en la estructura del sitio. Por ejemplo un árbol, libro, tienda entre otras. De la estructura lógica de un sitio surgen los mapas de navegación es decir la estructura que tiene mi sitio Web y sus interconexiones
  • 9. EEssttrruuccttuurraa ddee uunn ssiittiioo WWeebb Es la forma que tendrá el Sitio Web con sus secciones, funcionalidades y sistemas de navegación Tipos Arbol Listas Existe una página principal y de ahí se accede a otro grupo de páginas y estas a su vez son nodo de otras (niveles). Es jerarquizada, compleja, y algo difícil para navegar.Consejo no mas de 3 niveles. La organización del sitio es totalmente opuesto al anterior.No existe una página raíz o principal. Ideal para manuales o guías. Mixta Tiene las ventajas de las 2 anteriores. Las páginas están jerarquizadas en niveles, y en cada nivel se organizan como listas. Red Páginas todas conectadas entre si. Algo anárquica. ¡Ojo! no dejar enlaces inexistentes y que el usuario se pierda
  • 10. Niveles de un Sitio Web Se refiere a distancia máxima para alcanzar un determinado documento dentro de un sitio Web. Es aconsejable no mas de 3 niveles. Nivel 1 Nivel 2 Nivel 3 Nivel 4 Nivel 5
  • 11. Navegación en los sitios Web Se refiere a las formas de acceder a los distintos contenidos del sitio Debe tener las siguientes características: A-Consistente: El sistema de navegación debe ser similar en todo el sitio en su ubicación y disposición en las páginas. B- Uniforme: Deben de usarse los mismos términos en todas las páginas para que el usuario se sienta seguro que va donde desea. C-Visible: El sistema debe distinguirse claramente dentro del sitio También hay que considerar 2 elementos claves para la navegación: 1- Textual: La navegación se hace con elementos concretos: menú, guías y botones que digan con claridad la acción que van realizar 2- Contextual: Elementos relevantes que permitan mostrar la navegación en pantalla
  • 12. Tipos de enlaces Web Enlaces semánticos: Son enlaces entre páginas que tienen una relación de contenidos entre sí “De una importancia igual o superior a la conquista militar, la evangelización de los pueblos indígenas recayó en manos de los Frailes dominicos, quienes mandaron construir, con mano de obra esclava de origen indígena, numerosos templos iglesias y conventos.” Enlace semántico Enlaces de navegación: Solo sirven para conectar páginas entre sí sin un relación explícita. Ej.: El enlace “Volver” o “Página inicial” o el camino recorrido en el sitio Enlace de navegación
  • 13. Prototipado Significa elaborar modelos o prototipos del sitio Web y por lo tanto no es el producto final, pero sirve para observar si se van cumpliendo los objetivos de usabilidad y accesibilidad. Luego de implementado se desecha. Según el grado de fidelidad o calidad del prototipo se distingue entre: Prototipado de alta fidelidad: El prototipo será muy parecido al sitio Web una vez terminado. Prototipado de baja fidelidad: El aspecto del prototipo distará bastante del que tenga el sitio Web final