Manual básico de creación de páginas web



Descargar 357 Kb.
Fecha de conversión05.04.2018
Tamaño357 Kb.
Vistas95
Descargas0





MANUAL BÁSICO DE CREACIÓN DE PÁGINAS WEB




MANUAL BÁSICO DE CREACIÓN DE PÁGINAS WEB 1

Manual básico de creación de páginas web 7

Introducción 7

El LENGUAJE HTML. 8

MI PRIMER DOCUMENTO HTML. 8

CARACTERÍSTICAS GENERALES DEL LENGUAJE HTML.. 9

Marcas y atributos. 9

Concatenación de marcas. 10

CUATRO NORMAS FUNDAMENTALES 10

HTML es simplemente texto 10

Igualdad de mayúsculas y minúsculas. 11

No importan los tabuladores, ni los saltos de línea 11

Caracteres especiales 11

ESTRUCTURA DE UN DOCUMENTO HTML. 12

COMANDOS BÁSICOS DE HTML 13

Definición de párrafos: P 13

Ruptura de líneas: BR. 13

Titulos de encabezamiento 13

Dando estilo al texto 14

Tipos de letras 14

Tamaño del texto. 14

Colores del texto. 16



Listas 16

Listas ordenadas: OL. 16

Listas desordenadas: UL. 17

Listas de definición: DL. 17



Texto preformateado: PRE. 18

Centrando texto. 18

Líneas horizontales. 19

Comentarios no visibles en la pantalla 19

ENLACES: A. 20

Enlaces a otras zonas de la misma página 21

Enlaces a otras páginas 23

Enlaces a una zona de otra página 24

IMÁGENES 24

Principales formatos gráficos en Internet. 25

Formato GIF. 25

Formato JPEG. 25

Inclusión de imágenes 26

Tamaño de las imágenes. 26

Escalado de imágenes. 26

Bordes de la imagen. 26

Alineación de texto con las imágenes. 27

Imágenes con texto alternativo. 27

Uso de imágenes como enlaces. 27

Imágenes como fondo de un documento. 27

Mapas sensitivos. 28

TABLAS 29

Título de la tabla. 29

Bordes de la tabla. 30

Cabeceras de filas y de columnas. 30

Tamaño de la tabla. 30

Justificación de la tabla. 31

Espacio dentro de las celdas. 31

Forma de las celdas individuales. 31

Justificación del texto de las celdas. 31

Celdas de diferentes tamaños. 32

Celdas irregulares. 32

Color de cada celda. 33

Texto en una solo línea. 33



EDITORES Y CONVERSORES 33

Editores 34

Conversores 35

PUBLICAR LAS PÁGINAS EN INTERNET. 35

DIRECCIONES INTERNET DE INTERÉS. 36

BIBLIOGRAFÍA. 36



Manual básico de creación de páginas web

Introducción


Este manual está pensado para aprender los conceptos básicos necesarios para construir sus propias páginas Web. Para quien quiera ampliar sus conocimientos se suministran también unas referencias de consulta a otros sitios del Web.
En su confección se ha procurado seguir siempre un criterio eminentemente práctico. Para mejor asimilar los conceptos tratados, se propone al final de cada apartado un ejemplo práctico.
Primeras herramientas: Para comenzar sólo son necesarios dos elementos:


  • Un editor de texto. Vale cualquiera, siempre que no formatee el texto. Por ello, los más adecuados son los más sencillos (como por ej., El block de notas de). Si se utilizan procesadores como el Word, se deben guardar los ficheros como 'Sólo Texto', para que no introduzca órdenes de formateo, que pueden provocar errores al cargarlo en el navegador.

  • Un visualizador o navegador del Web: Netscape, MSI Explorer, Mosaic, etc.

El editor de texto lo usaremos para ir escribiendo los documentos HTML, que será posteriormente interpretado por el navegador, con lo que iremos comprobando los cambios y añadidos que vayamos efectuando.


Existen ciertos programas que nos ayudan a automatizar este proceso, pero es muy conveniente comenzar a hacerlo de una manera manual, para comprender bien la estructura del lenguaje HTML
Método de trabajo: Con el editor de texto crearemos un fichero con el nombre que queramos (p. ej. ejemplo1), pero que debe tener necesariamente la extensión .html (o .htm si nuestro sistema operativo no soporta extensiones de más de tres letras).
Habrá un fichero distinto para cada apartado; conviene crear un directorio específico en su ordenador e irlos guardando en él, para poder repasar lo aprendido, aparte de que pueden ser necesarios para ejecutar otros ejemplos prácticos.

El LENGUAJE HTML.


HTML es un lenguaje que se utiliza para la creación de páginas en la WWW. Por página entenderemos el documento que aparece en el visualizador.
HTML se compone de una serie de comandos, que son interpretados por el visualizador, o programa que utilizamos para navegar por el WWW. En última instancia es el visualizador el que ejecuta todas las órdenes contenidas en el código HTML, de forma que un visualizador puede estar capacitado para unas prestaciones, pero no para otras. Así, podremos especificar que una página tenga una imagen de fondo, o un texto parpadeando, pero si nuestro visualizador no está capacitado para esas funciones, no podremos verlas.
En esta guía se expondrán los comandos fundamentales de HTML.

MI PRIMER DOCUMENTO HTML.


Siga las siguientes instrucciones atentamente; ellas le permitirán crear un documento HTML en su ordenador; este archivo no será visible para otros usuarios de Internet.
Le recomiendo que cree un directorio en su ordenador para almacenar las páginas web que vaya haciendo al aprender; y que practique un tiempo antes de poner páginas en Internet.


  1. Abra el editor de textos: en Windows abra el Block de Notas

  2. Teclee lo siguiente:





Ejemplo 1 - Mi <a href="/pgina-web-nmero.html">primera pagina Web</a>




Mi primera pagina Web




Esta es mi primera pagina, aunque todavia es muy sencilla.


Como el lenguaje HTML no es dificil, pronto estare en condiciones de hacer cosas mas interesantes.

Aquí va un segundo parrafo.


Contenido del documento



y se termina con el comando para interpretar un documento HTML. Sin embargo, cuando diseñemos un página Web debemos tener en cuenta a la mayoría de usuarios posibles, por lo que es muy recomendable incluir estas marcas.

COMANDOS BÁSICOS DE HTML


A continuación se describen las marcas básicas de HTML que se pueden incluir en el cuerpo de un documento HTML.

Definición de párrafos: P


La marca
sirve para separar párrafos en HTML. Además de introducir un retorno de carro, fuerza un segundo retorno de carro para dejar una línea en blanco entre un párrafo y el siguiente. De esta manera los párrafos quedan más espaciados y el texto se vuelve más legible
En esta marca la etiqueta de fin es opcional.
Por defecto, el párrafo de un documento HTML está justificado a la izquierda. Pero podemos modificar la alineación horizontal de un párrafo mediante el atributo ALIGN de la marca
, que puede tomar los valores siguientes.


  • LEFT: el párrafo es justificado a la izquierda. Valor por defecto.

  • CENTER: el párrafo es centrado.

  • RIGHT: el párrafo es justificado a la derecha.

Ruptura de líneas: BR.


La marca
introduce un retorno de carro (o salto de línea) en el punto del documento en el que es colocada. Es equivalente al punto y aparte de un texto normal.
Esta marca es vacía de manera que no necesita de la etiqueta de fin de marca.

Titulos de encabezamiento


HTML dispone de seis cabeceras, o tipos de letra predefinidos de distinto tamaño, que se utilizan para marcar los títulos o resaltes en las páginas. Se activan con el comando y se desactivan con , donde n es un número de 1 a 6. siendo el número indicativo del tamaño. El tamaño mayor es el correspondiente al número 1.

Nivel de encabezado 1



Nivel de encabezado 2



Nivel de encabezado 3



Nivel de encabezado 4



Nivel de encabezado 5


Nivel de encabezado 6

Puede experimentar en el ejemplo anterior, cambiando el número para comprobar el efecto que se logra.
Los títulos de encabezado requieren la marca de fin, y siempre provocan un salto de línea, aunque no se le indique.

Dando estilo al texto


Las marcas de estilo de texto especifican el tipo de letra (negrita, cursiva, ..), tamaño, color que se desea que aparezca el texto.

Tipos de letras


Algunas de las marcas que permiten especificar la tipografía de los caracteres son las siguientes:
Negrita (Bold)

Cursiva (Italic)

Parpadeante (Blink)

Tamano fijo (TypeWriter)

énfasis (Emphasis)

Gran énfasis (Strong)

Subrayado (Underline)
Todas estas marcas requieren etiquetas de comienzo y fin, y se pueden anidar.

Tamaño del texto.


Para modificar el tamaño se utiliza el atributo SIZE de la marca , de la manera siguiente:
Texto
El comando requiere la etiqueta de cierre.
HTML define siete tamaños de letra distintos, siendo el tamaño 3 el que se adopta por defecto. Sin embargo, la mayoría de los navegadores permiten establecer cuál es la correspondencia real del tamaño 3. Así, se puede hacer que el tamaño 3 corresponda a una fuente Arial de 16, o a una Times de 8.
Existen dos formas de establecer el tamaño de un trozo de texto.


  • Tamaño de texto absoluto.

Texto


donde argumento es un número entre 1 y 7


  • Tamaño de letra relativos.

Texto


donde argumento es una cadena de caracteres que nos indica, con un signo + ó -, el número de veces que esa fuente va ser mayor o menor que el tamaño de la fuente por defecto
El uso de tamaños relativos nos permite olvidarnos de cual es el tamaño de letra que se está utilizando en el momento actual, por lo que, en general, será preferible a utilizar tamaños de letra absolutos.
Si queremos modificar el tamaño de todo el texto del documento, una forma de hacerlo sería englobar todo el cuerpo del documento en una etiqueta con el tamaño de letra que queremos utilizar. Así escribiremos algo parecido a lo que sigue:


...........





........


(contenido del documento)

.......



Para especificar el color de fondo del documento deberemos utilizar:

Listas


Las listas en HTML proporcionan una forma de clasificar la información, y hacer que ésta sea más inteligible por parte del visitante de las páginas.

Listas ordenadas: OL.


También llamadas listas numeradas son aquellas en las que cada elemento tiene delante un número que indica el orden del elemento dentro del conjunto de la lista.
La marca para crear una lista ordenada es
    ....
. Son obligatorias las etiquetas de comienzo y fin de estas marcas.
Cada elemento de la lista ordenada se identifica escribiéndolo dentro de la marca
  • ....
  • . La etiqueta de fin puede ser omitida.
    Con la marca LI no es necesario introducir un retorno de carro detrás de cada elemento de la lista.
    Es posible especificar el tipo de numeración que se dará (números arábigos, números romanos, letras, etc.), por defecto se sigue la numeración árabe.
    Las listas numeradas pueden ser anidadas una dentro de otra.

    Listas desordenadas: UL.


    También llamadas listas no numeradas son listas en las que no es necesario numerar de alguna manera los elementos que la componen, sino que cada elemento tiene delante un símbolo (un punto, un cuadrado, etc..).
    La forma de especificar una lista desordenada es mediante la marca


    La base de datos está protegida por derechos de autor ©psicolog.org 2019
    enviar mensaje

    enter | registro
        Página principal


    subir archivos