SITIO WEB, MAPA CONCEPTUAL

Nodos de los diagramas

• 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