martes, 21 de agosto de 2012

Introduccion a la programacion web: HTML...




Buenas mis queridos seguidores de "the secret files" espero que la pasen bien y que tengan todos sus sentidos preparados para este articulo de "the secret files".

El dia de hoy hablaremos acerca de la programacion de paginas web...pero empezaremos con lo mas basico o sea la programacion de paginas web y todos sus elementos (contenido, titulos,etc) atraves del codigo llamado "HTML".

"HTML" significa: HyperText Markup Language (Lenguaje de Marcado de Hipertexto) este permite la "programacion" del diseño de paginas webs atraves de texto (etiquetas (palabras entre "< y >")).

Gracias a "HTML" podemos programar el diseño de una pagina web por medio de imagenes, contenido, fondos, colores, fuentes, tablas, videos, musica, animaciones, formularios, etc etc para luego subirlas a un servidor de internet y asi aprovechar sus funciones.

Las paginas HTML se guardan en archivos con extension .html o .htm y se pueden crear en cualquier editor de texto que permita guardarlas con dichas extensiones de archivo aunque generalmente se usa el bloc de notas incluido por defecto en el windows pero tambien se pueden usar programas especializados en esta tarea tales como Dreamweaver, Php designer, etc dichos programas tambien permiten el diseño de paginas webs (paginas HTML) en modo diseño lo cual le facilita al ususurio "novato" la creacion de paginas web sin tener que escribir codigo.

Para efectos de aprendizaje avanzado siempre es recomendable aprender al menos lo basico en la programacion HTML para programar paginas futuras por ejemplo en editores de texto simple (como el ya dicho bloc de notas).

Bueno iendo ya al grano explicare el funcionamiento de las etiquetas HTML:



Etiquetas HTML

Las etiquetas HTML siempre iran encerradas entre corchetes angulares (< y >) a excepcion de que se trate de codigo php , javascript o cualquier otro codigo relacionado (dichos codigos o scripts para paginas webs no se explicaran en este articulo debido a su funcionamiento avanzado el cual escapa a los limites de este articulo).

Tambien ciertas etiquetas se cerraran y abriran como si se trataran de parentesis usando el caracter diagonal ( / ) y este se incluira dentro de las delimitaciones de la etiqueta (< y >) pero detras de la palabra de la etiqueta...para un entendimiento mas claro os dare un ejemplo:

"<html> contenido de la pagina web </html>"

Como vemos la pagina web ha sido delimitada por las etiquetas "<html>" pero la segunda eqtiqueta tiene algo diferenete a la primera...lo ves? XD tiene incluido el carater diagonal "/" que significa que la etiqueta se cierra o en simples palabras "ahi se acabo la funcion de la etiqueta" tal como si fueran parentesis que separan o limitan las funciones del codigo.



Las etiquetas basicas de HTML son:

"<html></html>": estas etiquetas sirven para delimitar TODO el codigo HTML o sea que todo lo que este dentro de estas etiquetas sera incluido en la pagina (aca dentro estaran todas las demas etiquetas y funciones a agregar a la pagina web).

"<head></head>": estan etiquetas delimitan el encabezado de la pagina web el cual incluira el titulo interno de la pagina web al ser abierta por un navegador.

"<title></title>": estas etiquetas delimitan el titulo interno de la pagina, estas etiquetas iran dentro de las etiquetas de "head" o el encabezado de la pagina web.

"<body></body>": estas etiquetas delimitan el "contenido" de la pagina o sea las palabras, las imagenes, los videos, las animaciones, los formularios, etc etc de los cuales estara conformado la pagina.

   Esta etiqueta permite en sus interior todos los diseños, cambios de fuentes, etc etc de la pagina web
   Los mas basicos son:

   "<form></form>": esta etiqueta permite ingresar un formulario para el ingreso de informacion a la
      pagina web, esto es muy util para cuando se requieran informacion para un registro en la pagina web o
      alguna operacion la cual puede ser realizada por un script para HTML.
    
     para ingresar los distintos campos dentro de esta etiqueta se usara la siguiente etiqueta:

            "<input type=""></input>": esta etiqueta permite ingresar campos como ser textbox
                 , botones, radiobotones, checkboxes , etc con solo cambiar el atributo type ingresando estos
                  comandos en medio de las comillas: textbox, radio, checkbox, submit, reset, etc.

   "<br>": esta etiqueta permite bajar a la siguiente linea de un parrafo o texto.

   "<p></p>": esta etiqueta permite separar un parrafo de otro.

   "<b></b>": esta etiqueta permite establecer negrita.

   "<a href="ejemplo.com"></a>": esta etiqueta permite establecer un enlace o vinculo a
    otra pagina web.

   "<img src="ejemplo.jpg">": esta etiqueta permite ingresar una imagen a la pagina web la
    cual debe ser preferiblemente JPEG, PNG o GIF.

   "<li><ol><ul>": cada una con su propia etiqueta de cierre ( con / ) permite crear listas.

Estas son todas las etiquetas basicas para HTML cabe decir que las comillas ("") no deben incluirse con las etiquetas pero (en el caso de ciertas etiquetas con ATRIBUTOS) las comillas que estan dentro de las comillas principales SI deben incluirse debido a que son atributos y los valores de los msmos deben incluirse entre comillas ("").

esto es todo...en caso de preguntas pueden usar los comentarios.


Laharis Lobo 

No hay comentarios:

Publicar un comentario