domingo, 1 de agosto de 2010

Curso html gratis






¿Que es el html?



El html es un lenguaje de programacion de paginas, el estandar de html es xhtml.



¿Como hago mi pagina web?



Pues muy facil primero debes tener un hoster, luego debes saber html que es lenguaje de programacion de pagina .



Los hoster son las paginas dedicadas a brindar espacio y te permite hacer tu propia pagina aqui les dejo algunas paginas que brindan este servicio gratis:


http://www.paginawebgratis.es/ <-- esta en español




http://www.007sites.com/ <-- esta en ingles y brinda 700 mb de espacio



http://www.piczo.com/?cr=3 <-- Esta en español



http://webs.com/ <---Esta en ingles y brinda de 40 mb de almacenamiento



----------------------------------------------------------------------------------------------------------



HTML



Html es un lenguaje de programacion de paginas. Lo unico necesario para los codigos html es un bloc de notas ahi es donde pondras los codigos que estaras aprendiendo y una vez finalizado el codigo lo guardaras con el nombre que le quieras dar a la pagina y con la terminacion html o htm. Por ejemplo :




pagina.html o pagina htm



Cuando quieres que una pagina sea la pagina principal debes guardarla de la siguiente forma:



index.html o index.htm



Luego lo debes subir por ftp que es un servidores donde subes todo lo de la pagina.



Lo subes al hoster las paginas que les di anteriormente no es necesario un servidor ftp ya que les brinda espacio (es limitado).



Para dar ordenes de que hacer en la pagina se usan las etiquetas, las etiquetas tienen dos estructura:



La primera estructuctura



<nombredelaetiqueta>




La segunda estructura



<nombredelaetiqueta> Texto</nombredelaetiqueta>



Quiero que tengan algo claro toda etiqueta debe estar encerrado entre estos dos simbolos < >.


En la primera estructura es de una solo instruccion




En la segunda estructura es dos instruccion una del inicio de la instruccion y la otra de la final de la instruccion. Cuando se usa las segunda estructura siempre debes poner el signo de barra para cerrar la etiqueta. Por ejemplo:


<h1>Titulo</h1>



Como ven la etiqueta esta encerrada en los dos simbolos < > el nombre de la etiqueta es h1 como es doble instruccion sigue el texto y alfinal le ponemos los simbolos de </elnombredelaetiqueta> recuerda poner siempre la barra antes de la etiqueta en la segunda instruccion.




¿Que son los atributos?



Pues los atributos son los especifican o se podria decir que aclaran como va a ser la etiqueta.


La estructura de los atributos es la siguiente:



<nombredeetiqueta atributo="valor">



Ok primero va el signo < luego seguido por el nombre de la etiqueta, luego dejamos un espacio y sigue el atributo seguido por el signo = abriendo comillas siguiendo el valor que se le da a ese atributo se encierra en comillas y termina con el signo mayor



Ok ahora les voy a explicar las bases de html


Ya que es el lenguaje html se debe usar la etiqueta html al inicio y al final de nuestro codigo html asi:



<html>



Codigo



</html>



Como ves la etiqueta html es doble instruccion lo cual dentro de ella debe estar el contenido. Luego de la etiqueta html sigue la etiqueta head que en español significa cabezera:



<html>



<head>



Los elemento de la cabezera



</head>



El resto del codigo



</html>




como ves la etiqueta cabezera es : <head> los elementos de la cabezera </head>



Dentro de la cabezera estara todos los elementos que aparecen en la ventanilla del navegador no dentro del contenido de la pagina.



Para ponerle titulo a la ventanilla del navegador se usa la etiqueta :


<title> Texto </title>




Como es doble instruccion primero va la etiqueta luego se pone el titulo de la venanilla y se cierra la etiqueta. Como es el titulo de la ventanilla debe estar dentro de la etiqueta de la siguiente manera:



<html>



<head>



<title> mi pagina </title>



</head>


el resto del codigo de la pagina



</html>



Luego de la cabezera sigue el cuerpo que en ingles es body el cuerpo es donde se coloca el contenido que saldra en la pagina como imagenes, texto, juegos, etc.


<html>



<head>




<title>Mi otra pagina</title>



</head>



<body>



el resto del codigo



</body>




</html>



Pues esa es la base de html.


Primeros aprenderemos las etiqueta del titular.



Para poner un titular en la pagina se usan las etiquetas siguiente:



<h1> titulo </h1>




<h2> titulo </h2>



<h3> titulo </h3>



<h4> titulo </h4>




<h5> titulo </h5>



<h6> titulo </h6>



Les explico la etiqueta es de h1 a h6 el h1 es de mayor importancia lo cual lo resalta mas y el h6 es de menor importancia pues aqui les dejo un ejemplo de como quedaria








Como ven el h1 es mas grande y h6 es el mas pequeño recuerda que aunque titulo se presento en ejemplo anterior en negrita no en todos los navegadores se presenta igual



Para hacer una linea horizontal como esta --------------------- se usa la etiqueta siguiente:



<hr>



Para espesificar de tamaño quieres que sea se usaria un atributo que es size de la siguiente manera:



<hr size="5">



como ven primero va la etiqueta seguido por el atributo que es size sigueel signo igual abriendo comillas y el valor que se le da ese atributo que en este caso es 5




Les quiero dejar algo bien claro cuando estas haciendo el codigo html y estas escribiendo y derrepente pusiste punto y te quieres saltar a otra linea aunque tu lo agas en el texto que escribes el navegador lo leera en una sola linea no saltara. Para que lo aga debes poner la etiqueta :



<br>



Un ejemplo de esto es el siguiente:



<h1> hola este es titulo de mi pagina



como ven es tal.</h1>



Aunque lo aya pasado a la otra linea el navegador lo tomara como si no tendria que haber espacio aqui les dejo la imagen de como queda.







Como ven no cambio de linea pero si en cambio usas la etiqueta <br> se cambiara de linea.


Para hacer parrafos se usa la etiqueta:



<p> </p>




Dentro de la etiqueta puede hacer un parrafo de la siguiente manera:









Como ven al poner la etiqueta de parrafo los separa simbolizar que es un parrafo pero recuerda es un gran error usar la etiqueta p para dejar un espacio para dejar uno se usa la etiqueta siguiente:



<br>&nbsp



Entre mas lo pongas mas lineas en blanco dejara.



Ahora aprenderemos como vamos centrar y otras opciones de colocacion de los parrafos.



La etiqueta de los parrafos es la etiqueta es <p> </p> y el atributo que se le da para indicar la caracteristica de la colocacion del texto es "align" sin las comillas seguido por el signo igual abriendo comillas y poniendo el valor de colocacion del texto para hacerlo en el valor se puede poner cualquier de estos tres valores:




* left

* right

* center



El primer valor left significa que sera colocado el texto a lado izquiero.



right significa que sera colocado al lado derecho.


center el texto estara centrado.



Aqui les dejo un ejemplo de lo anterior explicado:




<p align="left">Una computadora (del latín computare -calcular-), también denominada ordenador o computador, es una máquina electrónica que recibe y procesa datos para convertirlos en información útil. </p>


Quedara de la siguiente manera:







Como ven el texto queda al lado izquierdo.




Para centrarlo se usa el valor "center" aqui esta un ejemplo:



<p align="center">Una computadora (del latín computare -calcular-), también denominada ordenador o computador, es una máquina electrónica que recibe y procesa datos para convertirlos en información útil. </p>



Quedara centrada como en la siguiente imagen:







Como ven el texto queda centrado



Para poner al lado derecho se usa el valor right. Por ejemplo:




<p align="right">Una computadora (del latín computare -calcular-), también denominada ordenador o computador, es una máquina electrónica que recibe y procesa datos para convertirlos en información útil. </p>



Quedara al lado derecho como en la siguiente imagen:







Como ven el parrafo quedo al lado derecho.



Ahora les explico algunos atributos de apariencia:




align este atributo se utiliza y sirve para alinear



width

0 comentarios:

Publicar un comentario