Entradas

Multimedia

Imagen
Multimedia Vamos a  ver  cómo insertar  elementos multimedia . En concreto, veremos cómo insertar una  animación Flash , un  sonido  y un  vídeo , que son los más empleados. Utilizaremos dos métodos, usando las nuevas etiquetas de HTML 5 y mediante los plug-in. 10.1. Películas Flash (SWF) Las  películas Flash  son animaciones, cuyo archivo tiene la extensión  SWF . Es frecuente verlas en las páginas iniciales de los sitios web, a modo de presentación hacia los usuarios, como banners publicitarios, como botones... Hasta hace pocos años, Flash era uno de los elementos multimedia más empleados en las páginas web, aunque su uso fue decreciendo con la llegada de HTML 5 y el vídeo en mp4. Es importante añadir que el formato de las películas Flash no es soportado por un buen número de dispositivos móviles, como tabletas y smartphones, por lo que no debe ser utilizado en páginas web dirigidas a estos dispositivos. Estas películas pued...

Formularios

Imagen
Formularios Los formularios se utilizan para recoger datos de los usuarios. Nos pueden servir para realizar un pedido en una tienda virtual, crear una encuesta, conocer las opiniones de los usuarios, recibir preguntas, etc. Una vez el usuario rellena los datos y pulsa el botón para enviar el formulario se arrancará un programa que recibirá los datos y hará el tratamiento correspondiente. Aquí vamos a ver cómo crear el formulario, (insertar campos y botones en el formulario y validarlos), pero no la parte de tratamiento de los datos, ya que para ello se necesitan nociones de programación, ya sea en PHP, en JavaScript o en otro lenguaje de programación, y esto no entra en los objetivos del curso. A continuación tienes un ejemplo de formulario simple. Un formulario está formado, entre otras cosas, por etiquetas, campos de texto, menús desplegables, y botones. Los elementos de formulario pueden insertarse en una página a través del menú  Insertar , opción  Formu...

Tablas

Imagen
Tablas La finalidad de las tablas es presentar una serie de datos de forma clara y organizada, dividiéndolos en filas y columnas. Esta característica de las tablas provocó que fueran muy utilizadas para basar en ellas el diseño de una página web. Aún hoy en día es fácil encontrar páginas cuya estructura está basada en una tabla. Sin embargo, gracias al desarrollo de nuevas etiquetas de HTML 5(como <article>, <section>), de capas (<div>) y propiedades CSS, esto no sólo ya no es necesario, sino además no es una práctica recomedable. Las tablas no fueron pensadas para servir como base para el diseño, por lo que no crean una estructura clara y pueden ocasionar problemas al analizar nuestra web con herramientas automáticas, como los  bots(robots)  que indexan el contenido para los buscadores. Más adelante veremos cómo maquetar correctamente una página web utilizando las herramientas adecuadas para ello. Las tablas están formadas por un conjunto de celdas,...

Imagenes

Imagen
Imagenes 7.1. Introducción Las imágenes son un aspecto muy importante de la web. Ya sea como complementos a la información o parte del diseño, la hacen mucho más atractiva a ojos del visitante. No obstante, no conviene abusar, ya que aumentarán mucho el tamaño final de la web. Existen una serie de formatos de imagen más recomendables que otros para ser introducidos en una página web. Esta información puedes consultarla en el avanzado  Formatos de imagen para web   . 7.2. Insertar una imagen Para insertar una imagen hay que dirigirse al menú  Insertar , después a la opción  Imagen  y dentro de ésta,  Imagen  otra vez. Después de esto, ya es posible seleccionar una imagen a través de la nueva ventana. Cuando te acostumbres, te será más cómodo acceder con la combinación de teclas  Ctrl  +  Alt  +  I . En  Relativa a  es posible especificar si la imagen será relativa al documento o a la carpeta ra...

Hiperenlaces

Imagen
Hiperenlaces.  Introducción  Introducción Un hiperenlace, hipervínculo, o vínculo, no es más que un enlace, que al ser pulsado lleva de una página o archivo a otra página o archivo. Es posible asignar un vínculo a un texto, a una imagen, o a parte de una imagen. Cuando creemos un enlace, lo que realmente haremos será crear una etiqueta  <a></a>  que es la que en HTML se encarga de definir los enlaces. Esto podrás observarlo en la barra de estado: 6.2. Tipos de referencia Existen diferentes clases de rutas de acceso a la hora de definir los vínculos. Estas referencias no se limitan a los enlaces, se comportarán igual cuando indiquemos la ubicación de una imagen, de un archivo Flash, de la hoja de estilo, etc.   Referencia absoluta: Conduce al sitio en el que se encuentra el documento utilizando la ruta completa del archivo, incluyendo el protocolo http://. Por ejemplo,  http://www.aulaclic.com , o  http://www.misitio.c...

EL TEXTO: PROPÌEDADES Y FORMATOS

Imagen
EL TEXTO: PROPÌEDADES Y FORMATOS 4.1. Características del texto Las características del  texto seleccionado  pueden ser definidas a través del menú  Formato , y a través del  inspector de propiedades . Vamos a ver las posibilidades que se nos ofrecen a través del  inspector de propiedades , que están clasificadas en dos categorías  HTML  y  CSS .  Comenzamos viendo las propiedades  HTML Todas estas propiedades generan etiquetas HTML, que tienen un estilo por defecto en el navegador. Pero al final, podremos personalizarlas con CSS para que se vean exactamente como queramos. Formato:   Permite seleccionar un formato de párrafo ya definido para HTML, que puede ser encabezado, párrafo o formato predeterminado. Los encabezados se utilizan para establecer títulos dentro de un documento. El formato predeterminado sirve para que el texto aparezca tal cual ha sido escrito, por ejemplo, si entre dos palabras se introducen vari...