| |
|
|
|
Introducción a HTML
Hace algún tiempo después de aprender HTML leyendo y leyendo, practicando y practicando llegue a la conclusión que seria conveniente crear una guía simple, siquiera básica (no quiero complicar ni asustar a nadie) que animara a que los usuarios vean lo fácil que se puede creer una pagina Web usando HTML (no quiero ahondar aun no con Javascript, ni PHP, ni Servlets, ajax, ni flash u otros, tal vez si un poco de CSS).
Aquí el primer Capitulo.
1.- Introducción al Html
El html es un acrónimo del inglés HyperText Markup Language, es decir un Lenguaje de Marcado de Hipertextos (o de Marcas Hipertextuales) el cual se basa en el uso de etiquetas (o tags en inglés). Una etiqueta alterando un contenido tiene la sintaxis siguiente:
Code:
Aquí podemos observar dos clases de etiquetas:
<tag>: Esta es llamada etiqueta de apertura
</tag>: Esta es llamada etiqueta de cerradura
;D Observación:
Las letras de la etiqueta pueden estar en mayúsculas o minúsculas, indiferentemente. Recomiendo usar minúsculas en el uso de las etiquetas y si aquí se escriben en algunos casos en mayúsculas será por cuestiones de notoriedad.
Todo lo que este entre las etiquetas será influenciada por las mismas, por ejemplo:
Code:
<b>Este texto esta en negrita</b>
Dará como resultado:
Este texto esta en negrita
;D Observación:
La etiqueta b nos permite mostrar el texto interior en negrita, esto es solo un ejemplo, así que si no entendiste aun bien, no te preocupes, lo veremos todo conforme avancemos.
Un documento html es un documento con la terminación .html o también .htm, en el caso nuestro usaremos html (a menos que se diga lo contrario), la extension *.*html nos informa que se trata de un documento en html el cual es fácilmente visualizable por nuestro navegador de internet.
Ahora analizaremos la estructura básica de un documento en html. Para denotar que estamos tratando un documento en html, usaremos las etiquetas <html> y </html> al inicio y final del documento respectivamente. Asimismo analizaremos las dos partes principales de este documento, el cual se divide en:
Encabezado: Comprendido entre las etiquetas <head> y <head>.
Cuerpo: Comprendido entre las etiquetas <body> y <body>.
;D Observación:
Dentro del encabezado se inserta la información del documento (la cual analizaremos mas adelante) entre la que destaca el titulo (el cual se encuentra comprendido entre las etiquetas <title> y <title>).
Dentro del cuerpo se encuentra toda la parte que es visible y que queremos que aparezca dentro de nuestra pantalla principal.
Con esto obtenemos una estructura general y básica de un documento en html:
Code:
<html>
<head>
<title> Título de mi pagina </title>
</head>
<body>
Este es el contenido de la página
[Aquí además se insertan las demás etiquetas que alteraran el contenido.
</body>
</html>
;D Observación:
Una recomendación que siempre doy es intentar en lo posible usar sangrías para enmarcar los espacios internos del documento, así:
Code:
<html>
<head>
<title> Título de mi pagina </title>
</head>
<body>
Este es el contenido de la página
[Aquí además se insertan las demás etiquetas que alteraran el contenido]
</body>
</html>
o así:
Code:
<html>
<head>
<title> Título de mi pagina </title>
</head>
<body>
Este es el contenido de la pagina
[Aquí además se insertan las demás etiquetas que alteraran el contenido]
</body>
</html>
CONFIGURANDO NUESTRO SISTEMA
En el siguiente capitulo construiremos nuestra primera pagina web usando html, para esto necesitamos antes configurar unos detalles en nuestra PC.
1.- Recomiendo crear una carpeta: Curso html, para mantener aquí todos nuestros documentos en html y mantener un orden jerárquico, esto nos servirá luego cuando subamos nuestra pagina Web a un servidor o Web hosting, así que habituémonos a mantener un orden.
2.- Luego configuraremos nuestra PC para que podamos ver las extensiones de nuestros documentos html:
:!: Para Windows 95/98:
Seleccione Mi PC, Menú Ver, Opciones (u Opciones de carpetas).
:!: Para Windows Me/XP:
Seleccione Mi PC, Menú Herramientas, Opciones de carpetas.
Luego:
Luego, en la lengüeta "Ver" de esa opción, DESMARQUE(uncheck) la opción "Ocultar extensiones para los tipos de archivos conocidos" o similar.
;DInteresante Pro-tip:
Esta modificación no solo le ayudará a realizar sus trabajos con mayor seguridad y conocimiento de extensiones sino que al menos le informará de variedad de virus como virus escritos en VBS los cuales contienen una doble extensión, por ejemplo .TXT.VBS, donde el sistema solo visualiza *.*txt y puede dejar creer que se trata de un documento de texto, también un .TXT.EXE, etc.
3.- Verificar la ruta de acceso al block de notas. La cual es por defecto: INICIO > Programas > Accesorios > Block de notas.
En caso el block de notas no se encuentre aquí busque el programa en MI PC y cree un acceso directo en el escritorio.
;DInteresante Pro-tip:
Tambien se puede acceder al block de notas mediante el menu INICIO > Ejecutar > tipear "notepad" > Aceptar.
En modo abreviado:
1.- Tecla Windows+R.
2.- Tipear "notepad".
3.- Enter.
... Ahora estamos listos para crear nuestra primera página Web. 
PD: Este texto ha sido escrito íntegramente por quien escribe y constituye un manual básico de HTML para usuarios iniciantes.
Agradecimientos Del Tutorial a: tecnologiadiaria
|
|
|
