Your SlideShare is downloading. ×
0
Diseño de páginas web Victor Juan González
Conceptos básicos <ul><li>Página web </li></ul><ul><li>Servidor </li></ul><ul><li>Cliente </li></ul><ul><li>Servidor web <...
Páginas web <ul><li>Son documentos normalmente en formato html o htm, que se desarrollan según un lenguaje denominado html...
Cliente - Servidor
Servidores web <ul><li>Es el ordenador que contendrá nuestra página web para que cualquiera pueda verla en internet. Tambi...
Servidores y clientes ftp <ul><li>Mediante ftp, podemos subir nuestra página web a internet mediante la empresa de hosting...
Hosting <ul><li>El término hosting se refiere a dónde, en qué empresa, vamos a tener nuestra página web para que se pueda ...
Dominios <ul><li>Un dominio es por ejemplo www.elmundo.es </li></ul><ul><li>Se suelen contratar junto con la empresa con l...
Tecnologías web <ul><li>Html: el lenguaje de las páginas web </li></ul><ul><li>Java y Javascript: lenguaje de programación...
El código html <ul><li><HTML> </li></ul><ul><li><HEAD>   </li></ul><ul><li><TITLE>Primer ejemplo de JavaScript</TITLE> </l...
El código html
Ejemplo de javascript <ul><li><HTML> </li></ul><ul><li><HEAD>  </li></ul><ul><li><TITLE>Primer ejemplo de JavaScript</TITL...
Ejemplo de Flash
Diseñar en Flash <ul><li>Ventajas:  </li></ul><ul><li>Videos que ocupan muy poco espacio </li></ul><ul><li>Programación fl...
Ejemplo de php <ul><li><html>  <head>     <title>Ejemplo de PHP</title>  </head>  <body>  <?php     echo strlen(&quot;1234...
Ejemplo de Mysql <ul><li>mysql> SELECT t1.name, t2.salary FROM employee AS t1, info AS t2 -> WHERE t1.name = t2.name; mysq...
Tipos de páginas web <ul><li>Blogs </li></ul><ul><li>Galerías fotográficas </li></ul><ul><li>Páginas web  </li></ul><ul><l...
Los Blogs <ul><li>No se requiere pagar por ningún servicio, ni contratar ninguna empresa de hosting, pues ya te ofrecen es...
Partes de un blog
Galerías de fotografías <ul><li>http://www.turismochile.cl/isladepascua/isla.htm </li></ul><ul><li>http://www.galeriade.co...
Páginas web
Cómo crear nuestras primeras páginas web en html con el bloc de notas
Escribir el código html en el bloc de notas
Guardar el archivo en formato html
Nuestra primera página web (en blanco)
Nuestra segunda página web
Guardar el archivo en formato html
Nuestra segunda página web
Upcoming SlideShare
Loading in...5
×

Diseño de paginas Web

4,358

Published on

Introduccion al diseño de paginas web ofrecida por
http://1000trucosparaahorrar.com

Published in: Internet, Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,358
On Slideshare
0
From Embeds
0
Number of Embeds
10
Actions
Shares
0
Downloads
267
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "Diseño de paginas Web"

  1. 1. Diseño de páginas web Victor Juan González
  2. 2. Conceptos básicos <ul><li>Página web </li></ul><ul><li>Servidor </li></ul><ul><li>Cliente </li></ul><ul><li>Servidor web </li></ul><ul><li>Servidor ftp </li></ul><ul><li>Cliente ftp </li></ul><ul><li>Hosting </li></ul><ul><li>Dominio </li></ul>
  3. 3. Páginas web <ul><li>Son documentos normalmente en formato html o htm, que se desarrollan según un lenguaje denominado html </li></ul><ul><li>Se puede conseguir la última versión del lenguaje html en español en el siguiente enlace: </li></ul><ul><li>http://html.conclase.net/w3c/html401-es/cover.html </li></ul>
  4. 4. Cliente - Servidor
  5. 5. Servidores web <ul><li>Es el ordenador que contendrá nuestra página web para que cualquiera pueda verla en internet. También se refiere al programa que responde ante peticiones de visionado de páginas web. Normalmente habrá que pagar para tener este servicio. El servidor web más popular es el Apache </li></ul>
  6. 6. Servidores y clientes ftp <ul><li>Mediante ftp, podemos subir nuestra página web a internet mediante la empresa de hosting que hayamos contratado. </li></ul><ul><li>Desde nuestro equipo utilizaremos un cliente ftp que se conectará a un servidor ftp </li></ul><ul><li>El funcionamiento es similar al del explorador de windows </li></ul><ul><li>Uno de los clientes ftp más populares es el Filezilla (gratuito) </li></ul>
  7. 7. Hosting <ul><li>El término hosting se refiere a dónde, en qué empresa, vamos a tener nuestra página web para que se pueda visitar por cualquiera en internet </li></ul><ul><li>Ejemplos de hosting </li></ul><ul><ul><li>Galeon: http://galeon.hispavista.com/ </li></ul></ul><ul><ul><li>1 y 1: http:// www .1and1.es </li></ul></ul>
  8. 8. Dominios <ul><li>Un dominio es por ejemplo www.elmundo.es </li></ul><ul><li>Se suelen contratar junto con la empresa con la que hemos contratado el hosting. </li></ul><ul><li>Tenemos antes que comprobar que ese dominio actualmente no pertenece a nadie </li></ul><ul><li>Se pueden comprar, vender y especular con dominios. </li></ul><ul><li>En el caso de los blogs, ya nos asignan automáticamente un subdominio de forma gratuita. </li></ul><ul><li>Ejemplo: pepitogrillo . blogspot.com </li></ul>
  9. 9. Tecnologías web <ul><li>Html: el lenguaje de las páginas web </li></ul><ul><li>Java y Javascript: lenguaje de programación que se ejecuta en un cliente </li></ul><ul><li>Flash: video </li></ul><ul><li>Php: leguaje de programación que se ejecuta en un servidor </li></ul><ul><li>Asp: lenguaje de programación que se ejecuta en un servidor </li></ul><ul><li>Mysql: base de datos en internet </li></ul><ul><li>Css: estilos de diseño web </li></ul>
  10. 10. El código html <ul><li><HTML> </li></ul><ul><li><HEAD> </li></ul><ul><li><TITLE>Primer ejemplo de JavaScript</TITLE> </li></ul><ul><li></HEAD> </li></ul><ul><li><BODY> </li></ul><ul><li><b>Esto es texto normal de un documento HTML</b> </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul>
  11. 11. El código html
  12. 12. Ejemplo de javascript <ul><li><HTML> </li></ul><ul><li><HEAD> </li></ul><ul><li><TITLE>Primer ejemplo de JavaScript</TITLE> </li></ul><ul><li></HEAD> </li></ul><ul><li><BODY> <b>Esto es texto norrnal de un documento HTML</b> <P> </li></ul><ul><li><SCRIPT LANGUAGE=&quot;JavaScript&quot;> docurnent.write(&quot;Texto generado desde JavaScript&quot;) </SCRIPT> <P> <b>Esto es, de nuevo, HTML</B> </li></ul><ul><li></body> </li></ul><ul><li></HTML> </li></ul>
  13. 13. Ejemplo de Flash
  14. 14. Diseñar en Flash <ul><li>Ventajas: </li></ul><ul><li>Videos que ocupan muy poco espacio </li></ul><ul><li>Programación flash que permite interactuar al usuario </li></ul><ul><li>Inconvenientes </li></ul><ul><li>El usuario necesita tener instalado un componente para ver la página web </li></ul><ul><li>Los buscadores de internet no pueden indexar normalmente el contenido en flash </li></ul>
  15. 15. Ejemplo de php <ul><li><html> <head>    <title>Ejemplo de PHP</title> </head> <body> <?php    echo strlen(&quot;12345&quot;),&quot;<br>&quot;;        $palabras=split(&quot; &quot;,&quot;Esto es una prueba&quot;);    for($i=0;$palabras[$i];$i++)       echo $palabras[$i],&quot;<br>&quot;;           $resultado=sprintf(&quot;8x5 = %d <br>&quot;,8*5);    echo $resultado,&quot;<br>&quot;;        echo substr(&quot;Devuelve una subcadena de otra&quot;,9,3),&quot;<br><br>&quot;;    if (chop(&quot;Cadena &quot;) == &quot;Cadena&quot;)       echo &quot;Iguales<br><br>&quot;;    echo strpos(&quot;Busca la palabra dentro de la frase&quot;, &quot;palabra&quot;),&quot;<br><br>&quot;;        echo str_replace(&quot;verde&quot;,&quot;rojo&quot;,&quot;Un pez de color verde, como verde es la hierba.&quot;),&quot;<br>&quot;;     ?> </body> </html> </li></ul>
  16. 16. Ejemplo de Mysql <ul><li>mysql> SELECT t1.name, t2.salary FROM employee AS t1, info AS t2 -> WHERE t1.name = t2.name; mysql> SELECT t1.name, t2.salary FROM employee t1, info t2 -> WHERE t1.name = t2.name; </li></ul>
  17. 17. Tipos de páginas web <ul><li>Blogs </li></ul><ul><li>Galerías fotográficas </li></ul><ul><li>Páginas web </li></ul><ul><li>Otras </li></ul>
  18. 18. Los Blogs <ul><li>No se requiere pagar por ningún servicio, ni contratar ninguna empresa de hosting, pues ya te ofrecen ese servicio de forma gratuita </li></ul><ul><li>Ejemplos de blogs contratados mediante Blogger, el servicio de blogs de Google: </li></ul><ul><li>Fogonazos ( http://fogonazos.blogspot.com ) </li></ul><ul><li>Visión Beta ( http://matiascallone.blogspot.com ) </li></ul>
  19. 19. Partes de un blog
  20. 20. Galerías de fotografías <ul><li>http://www.turismochile.cl/isladepascua/isla.htm </li></ul><ul><li>http://www.galeriade.com/angel/ </li></ul><ul><li>http://www.adyma.com/ </li></ul>
  21. 21. Páginas web
  22. 22. Cómo crear nuestras primeras páginas web en html con el bloc de notas
  23. 23. Escribir el código html en el bloc de notas
  24. 24. Guardar el archivo en formato html
  25. 25. Nuestra primera página web (en blanco)
  26. 26. Nuestra segunda página web
  27. 27. Guardar el archivo en formato html
  28. 28. Nuestra segunda página web
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×