SITIO WEB, MAPA CONCEPTUAL

SITIO WEB

es un conjunto de archivos electrónicos y páginas web referentes a un tema en particular, incluyendo una página inicial de bienvenida generalmente denominada página de inicio o home page, a los cuales se puede acceder a través de un nombre de dominio y dirección en Internet específicos.

implica trabajo relacionado con el layout y diseño de páginas online, así como la producción de contenido, aunque generalmente se aplica a la creación de sitios web.

DISEÑO WEB

PAGINA WEB

es un documento accesible desde cualquier navegador con acceso a internet, y que puede incluir audio, vídeo, texto y sus diferentes combinaciones. Las primeras webs surgieron en el año 1992. Se trataban de páginas estáticas, y que sólo podían ser accesibles para ser modificadas a través de código html.

DOMINIO

Un dominio en Internet es el nombre exclusivo y único que se le da a un sitio web para que cualquier internauta pueda visitarlo e identificarlo.

URL

Una "URL" es la dirección única y específica de cada página, material, recurso e información que existe en la web. Cada página, va enlazado a una

Estas URL pueden ser imágenes, documentos o videos.

HOSTING

Un "hosting" es un servicio de "guardado"; en línea que nos sirve y permite publicar un sitio o aplicación web en Internet. Cuando tenemos un hosting, básicamente rentamos un espacio en un servidor que guarda y almacena todos los archivos y datos de tu sitio web para así trabaje correctamente.

TEXTO

Es el elemento más significativo de cualquier sitio Web porque los usuarios navegan por la Web fundamentalmente en busca de información expresada en hipertexto.

IMAGENES

Las imágenes constituyen un elemento esencial para ofrecer información visual del contenido y mostrar un diseño atractivo y personal.

NOMBRE DE DOMINIO

Es un nombre fácil de recordar asociado a una dirección IP física de Internet. Se trata del nombre único que se muestra después del signo @ en las direcciones de correo y después de www. en las direcciones web.

HIPERVINCULO

Un hipervínculo es un enlace, normalmente entre dos páginas web de un mismo sitio, pero un enlace también puede apuntar a una página de otro sitio web, a un fichero, a una imagen, etc. Para navegar al destino al que apunta el enlace, hemos de hacer clic sobre él. También se conocen como hiperenlaces, enlaces o links.

VIDEOS

Los videos son una herramienta muy poderosa, refuerza un contenido textual, posiciona muy bien por sí misma e impacta en el público. La esencia de ver una imagen en movimiento atrae y mantiene la atención de los usuarios.

ANIMACIONES

Las animaciones web, como su propio nombre indica, son una serie de efectos visuales que puedes aplicar en los diferentes elementos que componen tu web (bloques de texto, botones, banners, etc.) creando una sensación en ella de movimiento.

Por regla general, las animaciones web que se implementan en la actualidad se crean con una o varias de las siguientes tecnologías y/o lenguajes de programación:

HTML5

CSS3

Javascript / Jquery

Imágenes animadas (GIFS)

MARCOS

También llamados frames, son una especie de recuadro independiente en el que puede cargar una página Web.

SONIDOS

Los formatos de sonido que serán reproducidos por cualquier navegador son los WAV y MID. Aunque otros formatos también serán reproducidos previa carga del correspoindiente plugin, como Real Audio o Quicktime.

El formato MP3 es el más conocido y más usado por su calidad y nivel de compresión.

ESTANDARES

El W3C (world wide web) lanzo una iniciativa

en 1997 para lograr la accesibilidad web y que

surgieran una serie de estándares o normas.

A raíz de entonces de fueron desarrollando

diferentes estándares logrando que cada

página web se vea correctamente

independientemente del navegador o

dispositivo

FINALIDAD Y TRAYECTORIA.

Antes de los estándares web no existían

las reglas sobre como se debe crear el

contenido, ni requisitos en términos de

como un navegador debe entregar esa

información a las personas que lo

necesitan.

Los estándares web se introdujeron para

proteger el ecosistema web para

mantenerlo abierto, gratuito y accesible

para todos.

USO EN LA ACTUALIDAD.

Cuando se introdujeron los estándares

se alentó a los creadores de

navegadores a adherirse a una forma

estandarizada de hacer las cosas, lo

que resulta en una compatibilidad

cruzada, cada vez más fácil para los

creadores de contenido y no hubo

necesidad de crear múltiples del

mismo sitio web.

HTML

Por medio del código HTML podemos hacer que la estructura de la página web quede de la siguiente manera, cabecera o <header>, body, dentro de este se encuentra el <main> y el <aside> y finalmente está el pie de página o <footer>.

(El HTML es un código con el que puedes crear secciones de contenido basadas en su funcionalidad)

ENCABEZADO

Aquí suele incluirse la información básica de la empresa o marca y es consistente en todo el sitio, es decir, se repite en cada página de la web por la que navegas.

MENU DE NAVEGACION.

Representa una sección de una página cuyo propósito es proporcionar enlaces de navegación, ya sea dentro del documento actual o a otros documentos.

BARRA LATERAL

Normalmente se localiza a un lado del contenido de <main> y ocupa ¼ parte, siendo normalmente espacios para publicidad, contenido extra o explicativo, etc.

PIE DE PAGINA

Al igual que la cabecera (<header>), se repite y es consistente en cada página, es decir, su estructura no cambia mucho.

TITULO

el título en todas las páginas que conforman el sitio

web es una norma básica que aumenta

considerablemente la 'findability' de la información

contenida en cada página. Además, no definirlo

supone mostrar una imagen poco profesional del

sitio web y su diseño.

PARRAFOS

son elementos de bloque, por lo que siempre ocupan toda la anchura del elemento que los contiene (por defecto la ventana del navegador). La etiqueta crea un salto de línea de manera que el elemento siguiente se coloca siempre empezando una nueva línea.

IMAGENES

es una representación bidimensional de una imagen a partir de una matriz numérica, frecuentemente en binario (unos y ceros). Dependiendo de si la resolución de la imagen es estática o dinámica, puede tratarse de una imagen matricial (o mapa de bits) o de un gráfico vectorial.

TIPOS DE IMAGENES.

Usando este formato pueden almacenarse imágenes de hasta 24 bits de color.

PNG

Permite transparencias como los GIF y transparencia

graduada (colores cuya opacidad van desde el 0%,

opacos, hasta el 100%, transparente).

JPG

GIF

nos ofrece la posibilidad de definir zonas transparentes y además existe una variante que permite imágenes animadas, muy útil para llamar la atención sobre algo en concreto

MAQUETACION WEB

Es el proceso de planificación,

conceptualización y organización

de contenido de una página web, es

decir, asegura que los textos, las

imágenes, los vídeos, como todo lo

que quieras añadir a una página

web, estén estructurados para crear

una buena experiencia de usuario.

TIPOS

Maquetación web fija

Este tipo de maquetación web es

considerado como uno de los más

flexibles para diseñar una página web, ya

que te permite saber cómo aparecerá el

sitio online en diferentes navegadores

web.

Maquetación web escalado

Se trata de un tipo de maquetación web que

permite ajustar la orientación de una

página web, especialmente en dispositivos

móviles.

Maquetación web híbrida

Trata combinar lo mejor de todos los

mundos.

Maquetación web elástica

Es de los tipos de maquetación web más

utilizados para diseñar y estructurar los

elementos de una página web, debido a la forma

en que se flexiona al crecer y encogerse para

satisfacer las necesidades del contenido.

TIPOS BASICOS

font: para definir las propiedades del texto.

background: para definir las propiedades del fondo de un elemento.

border: para definir las propiedades del borde de un elemento.

margin: para definir la distancia que debe existir entre un elemento y los elementos que lo rodean.

padding: para definir la distancia que debe existir entre el borde de un elemento y su contenido.

TAMAÑO

Lo ideal es apostar por una resolución de 940 a 1000 pixeles, para el total del tamaño de la web, e idear la plantilla de trabajo de una resolución de 1200 px aproximadamente. Estamos hablando del ancho de la web, dado que la extensión vertical no es tan relevante, porque se podrá acceder al contenido vertical deslizando la pantalla tanto como se necesite, tal como estamos acostumbrados a hacerlo.

COLORES

Los colores son

capaces de establecer el tono

adecuado para llevar el mensaje a

los visitantes: pueden calmar,

excitar, estimular a las acciones.

Generalmente se aconseja separar

los colores para páginas web en

primario (o "dominante"),

FUENTES

Las fuentes son el estilo o apariencia de un grupo completo de

carácteres, números y signos, regidos por unas características

comunes. Típicamente, vienen preinstalados en cada Sistema

Operativo (OS).

Ejemplo de fuentes:

Arial.

Times New Roman.

Helvetica.

Calibri.

Georgia.

Cambria.

Veranda.

Tahoma.

USABILIDAD WEB

Se define como el grado de facilidad de uso que tiene una página web para los visitantes que entran e interactúan con ella.

Al teneruna buena usabilidad es aquella que permite a los usuarios una interacción sencilla, intuitiva, agradable y segura.

BRENDA GABRIEL FLORES 3º1 TURNO MAATUTINO,EPOEM 257