El uso de las herramientas

 

La creación de páginas para ser publicadas en servidores de Internet, requiere la utilización de un convenio estándar y un procedimiento para que los navegadores tales como Internet Explorer o Netscape entre los más usados los entienda. En general se trata de la creación de archivos del tipo HTML (Lenguaje hipertexto para la elaboración de páginas Web). El editor que vamos a usar para crear nuestra página es el FrontPage Express.  En el caso de no tenerlo instalado, lo puedes bajar desde aquí e instalarlo siguiendo las instrucciones. Aquí veremos lo esencial para crear nuestra primera página.

Esto es : Un archivo con extensión HTML o HTM contiene todas las ordenes para que las interprete el navegador instalado en tu ordenador.

Ejemplo de archivos: mi_pagina.html

El archivo es editable con cualquier procesador de texto cambiando su extensión de HTML por el de txt. Pero existen herramientas con las que podemos editarlas mas cómodamente. Por ejemplo, Front Page de Microsoft entre las mas comunes y fácilmente adquirible. Claro está que también podemos comprar otras mas sofisticadas en el mercado.

Una vez que editamos nuestra mi_pagina.html que estará en blanco, esto quiere decir que cuando el navegador la abra. solo se verá una página en blanco, puesto que las ordenes para la presentación de objetos y textos todavía no están puestas.

El aspecto que tendría en el cuadro de edición inicialmente sería como se refleja en este ejemplo:

mi_pagina.html

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<meta name="GENERATOR" content="Microsoft FrontPage Express 2.0">

<title>Sin título Página normal</title>

</head>

<body bgcolor="#FFFFFF">

</body>

</html>

Como observarás existen algunas palabras en inglés, estos son los comandos HTML. En general los comandos de HTML se introducen con un <menor que y se clausuran con un mayor que>, es decir , utilizan lo que se conoce como container, algo que comienza y termina, como es < y >.

Prestemos atención al primer comando y el último de nuestra pagina HTML

<html>  y  </HTML>

Con esto el navegador sabe donde empieza la página y donde termina, y ejecutará todo lo que se encuentra entre estos dos comandos. 

Lo siguiente que viene es: <head> y </head> A esto se le llama Cabecera del documento. Entre estos dos comandos se coloca los parámetros que queremos que tenga en cuenta el navegador a la hora de presentar nuestra página en pantalla, así como, los datos relativos a nuestra página.

 Esto es:
Tipo de codificación de caracteres que utilizará el navegador.

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

El editor con el que hemos generado nuestra página.
<meta name="GENERATOR" content="Microsoft FrontPage Express 2.0">.

El título que tendrá nuestra página cuando el navegador la presente y se registre en el historial o en la lista de favoritos del navegador.
<title>Sin titulo Página normal</title>. 

El cual podemos cambiar Sin titulo Página normal por Mi Primera Página.

Después de la cabecera viene el cuerpo . <body> y </body>

Aquí es donde se concentrará todo lo que aparecerá en la página cuando la presente el navegador. Todo lo que incluiremos entre estos dos comandos será  visible en la página HTML.  Como notarás, está vacío en el ejemplo anterior y es por eso que la página se mostrará en blanco. El comando de color de fondo es bgcolor="#FFFFFF". = blanco.

Microsoft FrontPage es un editor de páginas HTML y su manejo facilita mucho la labor de creación. Aquí podemos ver su aspecto cuando se abre para crear una página. Como se ve en la ilustración en el modo normal el área blanca es la visualización de los objetos y textos . Pero al inicio obviamente está en blanco.

ilustración en el modo normal

La siguiente ilustración es en modo HTML.

ilustración es en modo HTML

El uso y manejo de todos los botones del FrontPage express se irán viendo a medida que se vayan usando en la creación de nuestra página web.

Como principio inicial, lo que haremos a continuación es darle un nombre al archivo el cúal voy a nombrar como mi_pagina . La extensión HTML lo pondrá el editor automáticamente y por defecto.

Observa la siguiente ilustración.

En la barra de menú de FrontPage express, a presionar sobre Archivo se despliega otro menú hacia abajo con la opsión de Guardar como. También esta acción la podemos realizar con Guardar en el mismo menú y de tres maneras distintas. Una es la descrita anteriormente sobre la barra de menú. Otra es localizando el icono o figura que representa un disquete en la zona de iconos, y por ultimo y más práctico es pulsando la tecla Ctrl y G al mismo tiempo. 

Inmediatamente aparecerá un cuadro de dialogo como el que sigue, y seleccionemos Como archivo.

Luego nos aparecerá otra ventana en la cual tendremos que escoger la carpeta donde queramos poner nuestras páginas ordenadamente y darle un nombre. Es aconsejable ser ordenado en esto, ya que sin no, podemos perdernos a medida que vallásemos creando páginas.

Es decir , dentro de la carpeta Mis Documentos creamos Mis Webs  y luego yo para ordenar mis paginas, creo otra carpeta dentro de Mis Webs que la llamo por el nombre del servidor donde las voy a colocar. En este caso eresmas.net. De esta manera siempre tendré localizada las páginas. 

En la siguiente ilustración aparece el cuadro de díalogo para guardar nuestra página.

Como verás en la casilla de Nombre de archivo  ya he nombrado mi archivo con el nombre mi_pagina, cuando se trata de nombrar archivos, siempre tendremos que tener presente que no utilizaremos palabras acentuadas, ni con espacios y evitar en todo lo posible las mayusculas..Esto es muy importante ya que todos lo servidores no son iguales y aparecen conflictos de normalización y puede que cuando vayamos a ver nuestra página no la encontremos en Internet. La extensión HTML la agrega FrontPage express automáticamente al aceptar guardar el archivo.

Ya podemos decir que tenemos una pagina guardada en la carpeta de Mis Webs creada por nosotros mismo. A continuación será cuestión de colocar imágenes, texto, animaciones y enlaces.

 
Siguiente hoja

Crerra esta ventana