1. ANATOMA DE UNAPGINA WEB Noem Camarena 2012 2. La composicin de una pgina web como sta puedeconsiderarse desde el punto de vista de su diseo oatendiendo a las partes y tipos de fichero que lacomponen.Es preciso entender bien de qu est formada unapgina para poder aprender con xito como crearlasy modificarlas. Noem Camarena 2012 3. Una pgina web es superficialmente parecida acualquier otro documento: un texto, unasimgenes, todo compuesto de una determinadamanera.Se trata simplemente de un fichero de texto, conuna extensin HTML (de hypertext markuplanguage - lenguaje de hipertexto.).El fichero contiene el texto ms una serie decdigos que permiten dar formato a la pgina enel navegador.Noem Camarena 2012 4. As que la pgina web, vista con un editor de texto,contiene una mezcla de texto normal y una serie decdigos. Estos cdigos del lenguaje HTML son siempredel estilo y , por ejemplo. Siempre van entre llaves, y cada cdigo tiene una formainicial y otra de cierre que indican el intervalo de texto oimgenes que reciben el formato correspondiente.Noem Camarena 2012 5. EJEMPLOS

"Nuestra gira al VolcnBar"

El propsito de esta girafue obtener fotos reales del VolcnBar Noem Camarena 2012 6. Noem Camarena 2012 7. Title

"Nuestra gira al Volcn Bar"

El propsito de esta gira fue obtener fotos reales del Volcn Bar "Nuestra gira al Volcn Bar"El propsito de esta gira fue obtener fotos reales del Volcn BarNoem Camarena 2012 8. Principales componentes de una pgina web TextoEl texto editable se muestra en pantalla conalguna de las fuentes que el usuario tieneinstaladas (a veces se utiliza una tecnologa defuentes incrustadas, con lo que vemos en elmonitor una fuente que realmente noposeemos, pero es poco frecuente.) Noem Camarena 2012 9. TEXTONoem Camarena 2012 10. Noem Camarena 2012 11. GRFICOS Son ficheros enlazados desde el ficherode la pgina propiamente dicho. Se puedehablar de dos formatos casiexclusivamente: GIF y JPG.Noem Camarena 2012 12. Grficos para la web Noem Camarena 2012 13. FORMULARIOSSon una mezcla de texto y a vecesgrficos, que permiten enviar informacinpor parte del visitante, por ejemplo,consultando un catlogo, solicitando msinformacin, comunicando su opinin,votando en una encuesta.Noem Camarena 2012 14. FORMULARIOSNoem Camarena 2012 15. Java script Es un tipo de lenguaje de programacin que seinterpreta y ejecuta por parte del navegador;muy utilizado para diferentes efectos visuales,en especial los efectos de cambio de imagen. Noem Camarena 2012 16. Noem Camarena 2012 17. El cdigo Java est tambin escrito en unlenguaje de programacin independiente deplataforma (vlido para cualquier tipo deordenador) que tambin permite diferentesefectos, interactividad. por sus comandos. Noem Camarena 2012 18. Noem Camarena 2012 19. Shockwave/Flash Con este programa podemos confeccionar imgenesfijas o animaciones interactivas de tipo vectorial,extremadamente compactas. Es preciso un plug-in para poder ver las imgenes enel navegador, aunque las versiones ms recientes loincluyen y es gratis.Noem Camarena 2012 20. Noem Camarena 2012 21. Organizacin de un Sitio WebPara hacer una buena presentacin Weblo ideal es crear un boceto inicial de laestructura.Noem Camarena 2012 22. ObjetivosLo primero que debemos hacer es fijarnos losobjetivos que queremos alcanzar segn lainformacin que vayamos a aportar. Para crearnuestra primera pgina, estos objetivos deberanno ser muy pretenciosos o tener un sentidonicamente personal.Noem Camarena 2012 23. Una vez que tenemos los objetivos, hay que organizar elcontenido por temas o secciones, Es conveniente quelos temas sean razonablemente cortos y si fueranecesario divida en subtemas.Noem Camarena 2012 24. ESTRUCTURALa estructura de un conjunto de pginas web es muyimportante, ya que una buena estructura permitir allector visualizar todos los contenidos de una manera fcily clara. Mientras que un conjunto de pginas web con una malaestructura producir en el lector una sensacin de estarperdido, no encontrar rpidamente lo que busca yterminar por abandonar nuestro sitio.Noem Camarena 2012 25. No confeccione pginas que sean un callejn sinsalida.Al menos cada pgina Web ha de tener un enlace porel cual se pueda continuar la navegacin.Noem Camarena 2012 26. Para poder navegar por un Sitio web es necesarioque sus pginas estn relacionadas. Para ellodebemos crear una barra de navegacinSu funcin es permitirle al visitante navegar porun mismo Sitio. Noem Camarena 2012 27. Noem Camarena 2012 28. Noem Camarena 2012 29. NavegacinUn buen sistema de navegacin es imprescindibleen toda pgina web. Es una parte importante de laorganizacin de la estructura de la web.Que el usuario sea capaz de moverse con solturay facilidad por las distintas pginas del sitio, queencuentre lo que busca rpidamente, que no sepierda yendo de un enlace a otro sin saber dondeest.Noem Camarena 2012 30. TIPOS DENAVEGADORESNoem Camarena 2012 31. Puntos importantes en la navegacin La pgina de inicioLa pgina de inicio de tu web es la puertaprincipal de acceso a tu web. Por ella entrarn lamayor parte de visitantes, por lo que hay quecuidar al mximo cada detalle.Noem Camarena 2012 32. PGINA DEINICIONoem Camarena 2012 33. El men de una pgina web es la principalherramienta de navegacin que le podemosfacilitar al visitante para que encuentre lo quebusca.Es imprescindible para que las personasencuentren las dems pginas de la web.Noem Camarena 2012 34. TIPOS DE MENS DE NAVEGACIN Noem Camarena 2012 35. Men de navegacin Pie de pgina de la web tambin puede usarsepara mejorar la navegacin del sitio. Normalmenteno se utiliza para poner enlaces a todas lasseccionespor ejemplo informacin legal sobre tu empresa,direcciones de contacto, polticas de uso del sitio,etc.Noem Camarena 2012 36. EVITAR PGINAS HURFANASUna pgina hurfana es aquella desde la cualno se puede acceder a ninguna otra. Cuando elusuario se encuentra con una de estas pginasla confusin y el enfado pueden serimportantes. Noem Camarena 2012 37. PGINASHURFANAS Noem Camarena 2012 38. JERARQUASLa estructura de un conjunto depagina web muy importante, ya queuna buena estructura permite allector visualizar todos loscontenidos de una manera fcil yclara, entre estas existen lassiguientes: Noem Camarena 2012 39. Lineal: el usuario navegasecuencialmente, en un cuadro ofragmento de la informacin a otro.Jerrquica: el usuario navega a travsde las ramas de la estructura de rbolque se forma, dada la lgica natural delcontenido. Noem Camarena 2012 40. No lineal: el usuario navega librementea travs del contenido del proyecto, sinlimitarse a vas predeterminadas. Noem Camarena 2012 41. Compuesta: los usuarios pueden navegarlibremente (no linealmente), pero tambin estnlimitados, en ocasiones por presentacioneslineales de pelcula o de informacin crtica y dedatos que se organizan con ms lgica en unaforma jerrquica.Noem Camarena 2012 42. Noem Camarena 2012