Entradas

Tipos de listas en HTML

Imagen
Listas HTML  (no ordenadas) y (ordenadas) El lenguaje HTML, ya sea la versión HTML4 o la versión HTML5, posee tres tipos de listas. Las listas no ordenadas , las listas ordenadas y las listas de descripción. ( la veremos más adelante) Cada una de estas listas se crea con una etiqueta específica de HTML: <ul> para la lista no ordenada, <ol> para la lista ordenada   Los elementos de las listas se definen de la siguiente forma. Para la lista no ordenada y la lista ordenada se emplea el elemento <li>. Ul es el acrónimo de unordered list , lista no ordenada. En una lista no ordenada, el orden de aparición de los elementos no es importante. Cada elemento de la lista se define con <li> , que es el acrónimo de list item. Los elementos de la lista se indican con símbolos, como círculos, cuadrados o rombos. En el siguiente ejemplo, vemos el código HTML que produce como resultado la lista no ordenada que figura a continuación       El estilo de u...
Publicar un comentario
Leer más

Introducción a HTML ejercicios con etiquetas fundamentales

Imagen
Etiquetas en HTML estructura principal  En base a las etiquetas fundamentales para formatear texto de encabezados y párrafo se deben realizar los siguientes 2 ejercicios tal cuál la referencia que aparecen debajo con formato .jpg Recordar que la estructura de un documento en HTML es dado por las siguientes etiquetas  <!Doctype html>, <html>, <head>, <title>, y  <body> Son encargadas de enmarcar la estructura. <!Doctype html> es encargada de declarar el documento <html> sigue a continuación y dentro de ella va el lenguaje ej:  <html lang="es"> luego sigue la etiqueta: <head> que es la cabecera del documento (parte no visible en el cuerpo del navegador) Dentro de la cabecera o head aparece la etiqueta  <title> que dará título a nuestra página (comúnmente lleva el nombre "índex.html" página de inicio o de llegada. Cabe agregar que esta información se ve en la url del n...
Publicar un comentario
Leer más

Maquetación Web

Imagen
Diseño de elementos HTML Los sitios web suelen mostrar contenido en múltiples columnas (como una revista o periódico). HTML ofrece varios elementos semánticos que definen las diferentes partes de una página web: <Header> - Define un encabezado de un documento o una sección <Nav> - Define un contenedor de enlaces de navegación <Section> - Define una sección de un documento <Artículo> - Define un artículo independiente autónomo <Aside> - Define el contenido aparte del contenido (como una barra lateral) <Pie de página> - Define un pie de página de un documento o una sección <Detalles> - Define detalles adicionales <Summary> - Define un título del <detalles> elemento Técnicas de diseño HTML Hay cuatro maneras diferentes para crear diseños de varias columnas.  Cada forma tiene sus ventajas y desventajas: propiedad CSS float FlexBox CSS marco CSS rejilla CSS La propiedad float para diseño fi...
Publicar un comentario
Leer más

Resumen de CSS

CONCEPTOS BÁSICOS DE CSS (HOJA DE ESTILOS EN CASCADA) Supongo que te habrás encontrado en más de una ocasión con el problema de que ciertos elementos de tu página web aparecen en un color que no deseas, en un tamaño o tipo de letra diferente al que esperabas o incluso alineados hacia donde no deberían. La razón de estos cambios se debe a la  hoja de estilos en cascada , o más comúnmente conocido,  CSS .  Aquí un repaso por lo más primordial para que entiendas  qué es una hoja de estilos, cómo está estructurada y cómo puedes aplicar cambios que te interesen en la misma. ¿Qué es CSS? ¿Por qué usar CSS? Tres formas de insertar CSS Orden en cascada Sintaxis CSS Los selectores CSS Comentarios CSS Conclusión ¿Qué es CSS? CSS significa Cascading Style Sheets (Hoja de Estilos en Cascada). El lenguaje CSS describe cómo se mostrarán los elementos HTML en la pantalla. El lenguaje CSS ahorra mucho trabajo, ya que permite controlar...
Publicar un comentario
Leer más

Clases HTML y atributo de id

Imagen
Utilizando el atributo de Id El  id atributo especifica un identificador único para un elemento HTML (el valor debe ser único dentro del documento HTML). El valor id puede ser usado por CSS y JavaScript para realizar ciertas tareas para el elemento con el valor de ID específica. En CSS, para seleccionar un elemento con un ID específico , escribe un carácter almohadilla (#) , seguido por el id del elemento: Ejemplo: Consejo:  El atributo id puede ser usado en  cualquier  elemento HTML. Nota:  El valor id entre mayúsculas y minúsculas. Nota:  El valor de ID debe contener al menos  un  carácter, y debe  no  contener espacios en blanco (espacios, tabulaciones, etc.). Diferencia entre clase y ID Un elemento HTML sólo puede tener un identificador único que pertenece a ese solo elemento, mientras que un nombre de clase puede ser utilizado por varios elementos: Ejemplo: Ejercicio: Esc...
Publicar un comentario
Leer más

Diferencias básicas entre el diseño gráfico y el diseño web

Imagen
El diseño web El  diseño y creación de páginas web  reúne todas aquellas actividades necesarias para la creación de una identidad online para un individuo o empresa. En este proceso participan diseñadores gráficos, programadores, maquetadores, especialistas en experiencia de usuario, SEOs entre otros profesionales, implica la realización de tareas como la arquitectura de información, estructura del sitio web, interfaz de usuario, la ergonomía de navegación, selección de colores, tipografías, imágenes y fotografías buscando una adecuada experiencia del usuario o usuarios finales del sitio y que sobre todo este espacio cumpla con los objetivos de negocio.  Tres diferencias básicas entre el diseño gráfico y el diseño web A pesar de que en el diseño encontramos ciertas pauta comunes, también hay que saber que a la hora de trabajar,  l os distintos tipos de diseño (gráfico, web…) presentan muchas diferencias .  En esta entrada analizaremos estos aspe...
Publicar un comentario
Leer más