Diseño web

116 visualizaciones

Publicado el

0 comentarios
0 recomendaciones
Estadísticas
Notas
  • Sé el primero en comentar

  • Sé el primero en recomendar esto

Sin descargas
Visualizaciones
Visualizaciones totales
116
En SlideShare
0
De insertados
0
Número de insertados
1
Acciones
Compartido
0
Descargas
1
Comentarios
0
Recomendaciones
0
Insertados 0
No insertados

No hay notas en la diapositiva.

Diseño web

  1. 1.  Aproximación a internet Alojamiento web y contratación de dominios. Diseño Web y creación de sitios web  Generación de sitio web utilizando Google Sites.  Dreamweaver CS 5  Creación del sitio  Creación de las páginas web  Viñetas, tablas, sangrías  Inserción de imágenes etiquetas, hipervínculos  Photoshop nivel usuario para poder manejarse con las fotos en internet  Etiquetas, menús  Spry  utilizando Javascript
  2. 2. Una Aproximación a Internet
  3. 3.  El protocolo TCP/IP proporciona la estructura básica del software para la transmisión de datos entre ordenadores, ejemplo de dirección IP  66.34.237.94
  4. 4.  INTERNET EXPLORER MOZILLA FIREFOX GOOGLE CHROME
  5. 5.  http:// Los sitios web se alojan en servidores que funcionan con software especializado, llamado servidores web, y para su funcionamiento implementan el protocolo HTTP (hipertext transfer protocol) HTML (Hipertext markup languaje) Lenguaje de programación. El servidor envía el código HTML de la página y el navegador lo interpreta y lo muestra en pantalla. No es necesario conocer HTML para diseñar una página web
  6. 6. Ejemplos de Protocolo ftp  transferencia de archivos telnet  accesos remoto
  7. 7.  Es un ordenador intermediario que intercepta las conexiones que un cliente hace a un servidor de destino. Permite el acceso a internet a todos los equipos teniendo un equipo conectado o sea, una dirección IP, protegiendo los PC clientes.
  8. 8.  La gente teme ingresar información personal como puede ser el número de la tarjeta de crédito. Afortunadamente existen métodos de encriptación de la información que se envía:  Secure sockets layer  SSL  Transport Layer Security  TLS
  9. 9.  Permite interactuar y colaborar entre sí como creadores de contenido generado por usuarios en una comunidad virtual, a diferencia de sitios web estáticos donde los usuarios se limitan a la observación pasiva de los contenidos . Ejemplos son las comunidades web, los servicios web, las aplicaciones Web, los servicios de red social, los servicios de alojamiento de videos, las wikis, blogs.
  10. 10.  Hay miles de proveedores de dominio y alojamiento Web. Ejemplo : arsys, dhapcenter Hacer prueba, simulacro de contratación de dominio, en ambos proveedores.
  11. 11.  LA SINTAXIS DE HTML  SINTAXIS BÁSICA:  <HTML>  <HEAD>  TÍTULO Y METATAGS  </HEAD>  <BODY>  Es el contenido de la web, dentro del body puede haber decenas o cientos de líneas.  </BODY>  </HTML En todas las páginas web encontrareis esta estructura
  12. 12.  Javascriptpermite realizar muchas acciones:  Ejemplo: Menús dinámicos desplegables, cálculos, determinadas acciones.  En Dreamweaver se pueden implementar diversas acciones javascript sin necesidad de tener conocimientos. Y se pueden descargar aplicaciones preparadas y usarlas.  Después de este curso se recomienda curso javascript PHP y Mysql  Ambos lenguajes combinados nos permite crear y actualizar bases de datos dinámicas para el sitio web  Ejemplo: listado de productos de la empresa, listado de clientes.
  13. 13.  Flash y action script: en este curso se hace un aintroducción a flash ya que es recomendable tener conocimientos básicos para hacer una web. Hacer toda la web en flash dificulta y complica el posicionamiento de la página web. Pero se utiliza mucho para aportar contenidos multimedia a la web.
  14. 14.  Cuando normalmente decimos que hay una página web, nos referimos a un sitio web que es lo que contiene el conjunto de páginas web. Por ejemplo cuando hacemos una página web con Dreamweaver hacemos un sitio web que contiene páginas web. Dentro del servidor el sitio web es una carpeta.
  15. 15.  Como posicionar nuestro sitio Web en los buscadores. ( Conceptos básicos)  Colocar correctamente los metadatos del head, de la cabecera de la página Web.  Contenidos que cambian con frecuencia y se actualizan.  Publicidad por campaña o en el momento de lanzar el sitio en Google adwords.  Se hará un simulacro de campaña en google adwords
  16. 16.  Metatags en HTML: etiquetas con información sobre el propio documento web: autor, editor… Etiquetas META mas usuales:  Descripción<meta name="description" content="Es mi página " />Mediante esta etiqueta podemos incluir como metadato una descripción de nuestra página.  keywords<meta name="keywords" content="mp3, f ree, FREE, download, britney, spears" />Las palabras clave son aquellas que resumen de forma significativa el contenido de la página.
  17. 17.  Google  más  mucho más En la parte superior de tú página de sites tienes dos iconos que te permiten hacer prácticamente de todo, por ejemplo nuevas páginas, diseño de las página creación de menú . Modificar página Nueva página Administrador sitio 1 Página web Administración del sitio Actividad reciente del sitio Páginas Archivos adjuntos Plantillas de páginas Dirección web Presentación del sitio 2 Archivador 3 Lista Navegación Editar Desde el menú página se pueden hacer páginas y desde la opción de menú, se puede enlazar, a la página creada. O se pueden hacer enlaces a páginas Web.
  18. 18.  TRUCO  CUANDO CREE UNA PÁGINA NUEVA NO LA VAN A VER EN EL MENÚ DE FORMA AUTOMÁTICA, PERO HAY UNA FORMA DE HACERLO  Dentro de PRESENTACIÓN DEL SITIO  HACER CLICK EN NAVEGACIÓN (EDITAR) Se recomienda la opción  ORGANIZAR AUTOMÁTICAMENTE MI NAVEGACIÓN  DE ESA FORMA CUALQUIER PÁGINA QUE CREES APARECERÁ EN EL MENÚ IZQUIERDO DE FORMA AUTOMÁTICA. Práctica de clase Intentar hacer un sitio web dentro de google Sites  Hacer un sitio Web en blanco y probar a crear páginas dentro de ese sitio, y a su vez observar si aparecen en el menú con el truco aprendido en clase. (Preparación de sitio navegación organizar automáticamente.

×