El desconocimiento de realizar páginas web
con navegación fluida entre las interfaces trae
como consecuencia, mucho contenido en un solo documento, por la falta de
enlaces hacia otros.
Debido a ello, describiremos el
procedimiento para enlazar un documento con otro. Crearemos hipervÃnculos entre los mismos con HTML, según las
recomendaciones oficiales de este lenguaje de marcado.
Cuando ingresamos al incio de una
red social disponible en internet, apreciamos la posibibilidad de hacer clic en un lugar especÃfico y abrir una hoja
de registro, a fin de ingresar los datos personales. El mencionado procedimiento,
normalmente, se realiza en hojas diferentes, con extensión HTML.
El procedimiento a seguir para
agregar hipervÃnculos entre documentos diferentes es:
- Creamos
una carpeta con el nombre proyecto, en este caso, lo definimos como proyecto ejemplo.
- Ingresamos
en la carpeta creada y definimos dos documentos con extensión HTML, los cuales
deben tener nombres distintos, en este caso inicio
y contacto.
061-01_1003_ilu01. Creación de carpetas y documentos
- Definimos
una estructura básica de HTML en el documento inicio, con la cabecera, cuerpo y un encabezado.
- Agregamos
el enlace con la etiqueta a y su
referencia será el documento creado anteriormente con el nombre contacto.
Cuando agregamos hipervÃnculos es necesario
escribir la extensión HTML, asà el navegador ubica el documento correcto, debido
a la posibilidad de existir un documento llamado contacto.ccs, en el cual se especifique el estilo del proyecto.
061-01_1003_ilu02. Creación del hipervÃnculo al documento
inicio
- Definimos
una estructura básica de HTML en el documento llamado contacto, con la cabecera, cuerpo y un encabezado.
- Agregamos
el enlace con la etiqueta a, y su
referencia será el documento llamado inicio,
asà el usuario cuando presione con el mouse,
vuelva a lo anterior.
061-01_1003_ilu03. Creación del hipervinculo al segundo
documento
Mediante la vista del usuario se
muestra el funcionamiento a seguir. Con el documento inicio abierto, al presionar en el enlace expuesto, se muestra la
segunda hoja, después, cuando presionamos en el link de la segunda pantalla, de inmediato dirige al otro documento.
061-01_1003_ilu04. Prueba mediante el navegador web
Existe el atributo llamado target en español objetivo, mediante el
cual si especificamos como valor _blank
los enlaces son abiertos por el navegador web
en una pestaña nueva. Al visualizar en la parte superior de la pantalla de
inicio se encontrarÃa una sola pestaña, sin embargo, al hacer clic en el enlace
se abrirÃa una segunda pestaña.
061-01_1003_ilu05. Creación de la etiqueta target
Keynotes
- Cuando ingresamos al inicio de una red social
disponible en internet, apreciamos la posibilidad de hacer clic en un lugar especÃfico y abrir una hoja
de registro, a fin de ingresar los datos personales. El mencionado
procedimiento, normalmente, se realiza en hojas diferentes, con extensión HTML.
- Cuando agregamos hipervÃnculos es necesario
escribir la extensión HTML, asà el navegador ubica el documento correcto, debido
a la posibilidad de existir un documento llamado contacto.ccs, en el cual se especifique el estilo del proyecto.
- Existe el atributo llamado target en español objetivo, mediante el
cual si especificamos como valor _blank
los enlaces son abiertos por el navegador web
en una pestaña nueva.
RetoCrea tres hipervÃnculos entre documentos con el
lenguaje HTML, según las recomendaciones oficiales de este lenguaje. Utiliza en
dos de ellos el elemento target.
¡Comparte el resultado final del reto en tu vPages y contacta a un especialista del
área para obtener un comentario de optimización!
Tiempo disponible: entre 15 y 30 minutos.
CierreA través de la creación de hipervÃnculos entre documentos con el lenguaje HTML, según las
recomendaciones oficiales de este lenguaje de marcado, creamos páginas web con contenido fluido para el usuario.
Las interfaces estarán unidas con armonÃa para acceder a ellas fácilmente. La
organización y creatividad permiten unir con excelencia varios documentos HTML,
mediante la etiqueta a.
