Entradas

Mostrando las entradas etiquetadas como HTML

Conceptos básicos de HTML: Enlaces

Imagen
La etiqueta <a> Los enlaces en las paginas web son muy comunes ya sea en textos o imágenes para ser dirigidos a otro sitio web o un archivo. Esto se logra con la etiqueta <a> y agregandole el atributo href  el cual nos indica hacia donde nos dirige el enlace. Para hacer que una imagen funcione como un enlace simplemente ponemos la etiqueta <img> entre las etiquetas <a>: Cuando damos clic a los enlaces que hemos creado estos nos redirigen en la misma pagina lo que para muchos es muy molesto, pero si a la etiqueta <a> le agregamos el atributo target y le damos un valor _blank el enlace nos redirigirá en una nueva pestaña

Conceptos básicos de HTML: Imágenes

Imagen
La etiqueta <img> Esta etiqueta se usa cuando queremos insertar una imagen y esta solo contiene atributos, tampoco hay una etiqueta de apertura y otra de cierre y se ve así: El atributo src se utiliza para encontrar la URL (dirección) de la imagen. Ubicación de la imagen La imagen que queramos insertar en nuestra pagina debe de estar en la misma ubicación que nuestro archivo HTML, especificandolo con el atributo src y poniendo el nombre de la imagen entre las casillas junto su extensión. En caso de que la imagen no pueda mostrarse, el atributo alt  especifica en palabras el porque no se mostró. Este atributo es importante. Cambio del tamaño de las imagenes. Para cambiar el tamaño de las imagenes se usan los atributos de largo y ancho (height y widht): Borde de la imagen Las etiquetas por defecto no tienen borde, si queremos agregar un borde lo podemos hacer con la etiqueta border :

Conceptos básicos HTML: Atributos

Imagen
Atributos Los atributos se encargan de darle información a los elementos al mismo tiempo que pueden modificarlos, ya que casi todos los atributos tienen un valor y este valor a su vez modifica el atributo. En este ejemplo podemos observar el atributo align y le damos al valor center para que nos de el siguiente resultado: Los atributos siempre deben de especificarse en la etiqueta de apertura del elemento que queremos modificar. Mediciones de atributos Por ejemplo podemos modificar una linea para que tenga un ancho de 60 pixeles. Esto se hace con el atributo width: Esto de igual manera se puede hacer en porcentaje. Atributo de  alineación Estos atributos como su titulo lo dice son aquellos que usamos para alinear nuestro texto de la manera que lo necesitemos. Por ejemplo podemos hacer un texto alineado al centro y una linea alineada hacia la izquierda, así: Dando esto como resultado:

Conceptos básicos de HTML: Elementos

Imagen
Elementos HTML Podemos decir en pocas palabras que los elementos HTML son todas sus etiquetas. Hay algunos elementos pequeños que no tienen etiquetas de apertura y cierre, son elementos individuales como es el caso de la etiqueta <br>. Ejemplo:

Conceptos básicos de HTML: Encabezados, líneas, comentarios

Imagen
Encabezados HTML Para los encabezados en HTML tenemos seis etiquetas que van desde mayor a menor según su importancia: <h1>, <h2>, <h3>, <h4>, <h5>, <h6>. Este es el resultado en el navegador: No se recomienda usar encabezados para hacer la letra grande y en negrita ya que los motores de busqueda los usan para indexar la pagina. Si quieres agregar propiedades a tu texto puedes ver la entrada donde explico cuales son aquí . Lineas horizontales Para hacer una linea se usa la etiqueta <hr>, esto es HTML significa una roptura temática. Así se ve en el navegador: Comentarios Los comentarios no afectan en absoluto el archivo HTML y de igualmanera los navegadores tampoco lo muestran. Se usan para hacer de tu archivo un codigo legible dandole recordatorios, indicaciones y lo que quieras ponerle. La etiqueta para comentarios es esta: <!- Aquí va el comentario -> (el signo de exclamación solo esta e...

Visión General: ¿Qué es HTML?

Bienvenido a HTML HTML significa Hyper Text Markup Language (Lenguaje de marcado de hipertexto) A diferencia de un lenguaje de programación que usa scripts para hacer sus funciones, HTML usa etiquetas para identificar el contenido de sus funciones. Un ejemplo seria algo como esto: <p>Esto es un párrafo</p> Estructura Web La capacidad que se puede alcanzar codificando con HTML es fundamental para cualquier profesional. Si alguien quiere empezar a crear paginas web tiene que tener el conocimiento sobre esta habilidad ya que podríamos decir que es el punto de partida para cualquier desarrollador. Estructura: HTML = Estructura CSS = Presentación JavaScript = Comportamiento

Conceptos básicos de HTML: Formatos de texto

Imagen
Elementos de formato En HTML hay varias etiquetas para especificar el tipo de texto en el contenido de nuestra página. Este es el resultado de cada una de las etiquetas para formato de texto, ahora es tu decisión saber cual debes usar en tu página.

Conceptos básicos de HTML: Párrafos

Imagen
La etiqueta <p> Para crear un párrafo, como cualquier otra etiqueta, se escribe el elemento <p> con sus etiquetas de apertura y cierre. Este es el resultado en el navegador: Salto de linea <br> El elemento <br> es una etiqueta vacia asi que no tienen etiqueta de cierre. Usar esta etiqueta se genera un salto de linea sin dejar espacio entre lineas asi: (Herramienta Sublime Text 3) El resultado en el navegador es este:

Visión General: Creando tu primera página web

Imagen
El archivo HTML Los archivos HTML son archivos de texto, por lo que puedes usar cualquier editor de texto para crear tu primera página web. Hay algunos de editores de texto para HTML que pueden facilitar el trabajo como por ejemplo SublimeText, pero por ahora podemos utilizar el bloc de notas para nuestra primera página web. Vamos a crear entonces el archivo HTML agregando a la etiqueta   cuerpo   una linea que diga "Esto es una linea de texto" y lo guardaremos como Primera Página.html Cuando abrimos el archivo en el navegador este seria el resultado. Etiqueta <title> Con esta etiqueta se coloca un titulo en la pestaña el cual describe la página. El resultado que queda en el navegador es el siguiente. Esto es muy importante ya que con ese titulo es que los motores de búsqueda podrán encontrar nuestra página.

Visión General: Estructura del documento HTML básico

La etiqueta <html> Una explicación muy fácil de un documento HTML es la de compararlo con un sándwich o un hamburguesa los cuales tienen dos rebanadas de pan, así mismo el documento HTML abre y cierra sus etiquetas. <html> ... </html> Todo el documento esta rodeado con esta etiqueta. La etiqueta <head> Inmediatamente después de abrir la etiqueta <html> encontrara el encabezado, que se identifica con la etiqueta <head> (encabezado). <html>       <head>....</head> </html> El encabezado contiene los elementos no visuales que ayudan a que la pagina funcione correctamente. La etiqueta <body> Esta es la etiqueta que sigue después del encabezado, en ella van todos los elementos visuales del documento. los párrafos, imágenes, vídeos, listas y enlaces son solo algunos de los elementos que contiene esta etiqueta. <html>       <head>.......