SlideShare una empresa de Scribd logo
1 de 42
ANATOMÍA DE UNA
  PÁGINA WEB




         Noemí Camarena 2012
La composición de una página web como ésta puede
considerarse desde el punto de vista de su diseño o
atendiendo a las partes y tipos de fichero que la
componen.

Es preciso entender bien de qué está formada una
página para poder aprender con éxito como crearlas
y modificarlas.


                           Noemí Camarena 2012
Una página web es superficialmente parecida a
cualquier otro documento: un texto, unas
imágenes, todo compuesto de una determinada
manera.

Se trata simplemente de un fichero de texto, con
una extensión HTML (de hypertext markup
language - lenguaje de hipertexto.).

El fichero contiene el texto más una serie de
códigos que permiten dar formato a la página en
el navegador.
                          Noemí Camarena 2012
Así que la página web, vista con un editor de texto,
contiene una mezcla de texto normal y una serie de
códigos. Estos códigos del lenguaje HTML son siempre
del estilo <head> y </head>, por ejemplo.


 Siempre van entre llaves, y cada código tiene una forma
inicial y otra de cierre que indican el intervalo de texto o
imágenes que reciben el formato correspondiente.

                                  Noemí Camarena 2012
EJEMPLOS

<body background="rosa.jpg"><body
bgcolor="text="black">
<center><h1>"Nuestra gira al Volcán
Barú"</h1></center>
<center><h2> El propósito de esta gira
fue obtener fotos reales del Volcán
Barú</h2>

                     Noemí Camarena 2012
<body   background="rosa.jpg">




               Noemí Camarena 2012
Title
            <center><h1>"Nuestra gira al Volcán Barú"</h1></center>


<center><h2> El propósito de esta gira fue obtener fotos reales del Volcán Barú</h2>




                               "Nuestra gira al Volcán Barú"

            El propósito de esta gira fue obtener fotos reales del Volcán Barú




                                                Noemí Camarena 2012
Principales componentes de una página web




                     Texto

El texto editable se muestra en pantalla con
alguna de las fuentes que el usuario tiene
instaladas (a veces se utiliza una tecnología de
fuentes incrustadas, con lo que vemos en el
monitor una fuente que realmente no
poseemos, pero es poco frecuente.)
                         Noemí Camarena 2012
TEXTO




    Noemí Camarena 2012
Noemí Camarena 2012
GRÁFICOS

 Son ficheros enlazados desde el fichero
de la página propiamente dicho. Se puede
hablar de dos formatos casi
exclusivamente: GIF y JPG.




                      Noemí Camarena 2012
Gráficos para la web




           Noemí Camarena 2012
FORMULARIOS




  Son una mezcla de texto y a veces
gráficos, que permiten enviar información
por parte del visitante, por ejemplo,
consultando un catálogo, solicitando más
información, comunicando su opinión,
votando en una encuesta.
                        Noemí Camarena 2012
FORMULARIOS




      Noemí Camarena 2012
Java script




 Es un tipo de lenguaje de programación que se
interpreta y ejecuta por parte del navegador;
muy utilizado para diferentes efectos visuales,
en especial los efectos de cambio de imagen.




                         Noemí Camarena 2012
Noemí Camarena 2012
El código Java está también escrito en un
lenguaje de programación independiente de
plataforma (válido para cualquier tipo de
ordenador) que también permite diferentes
efectos, interactividad. por sus comandos.

                       Noemí Camarena 2012
Noemí Camarena 2012
Shockwave/Flash


 Con este programa podemos confeccionar imágenes
fijas o animaciones interactivas de tipo vectorial,
extremadamente compactas.


 Es preciso un plug-in para poder ver las imágenes en
el navegador, aunque las versiones más recientes lo
incluyen y es gratis.
                              Noemí Camarena 2012
Noemí Camarena 2012
Organización de un Sitio Web



Para hacer una buena presentación Web
lo ideal es crear un boceto inicial de la
estructura.




                        Noemí Camarena 2012
Objetivos




Lo primero que debemos hacer es fijarnos los
objetivos que queremos alcanzar según la
información que vayamos a aportar. Para crear
nuestra primera página, estos objetivos deberían
no ser muy pretenciosos o tener un sentido
únicamente personal.
                          Noemí Camarena 2012
Una vez que tenemos los objetivos, hay que organizar el
contenido por temas o secciones, Es conveniente que
los temas sean razonablemente cortos y si fuera
necesario divida en subtemas.




                              Noemí Camarena 2012
ESTRUCTURA




La estructura de un conjunto de páginas web es muy
importante, ya que una buena estructura permitirá al
lector visualizar todos los contenidos de una manera fácil
y clara.

 Mientras que un conjunto de páginas web con una mala
estructura producirá en el lector una sensación de estar
perdido, no encontrará rápidamente lo que busca y
terminará por abandonar nuestro sitio.

                                Noemí Camarena 2012
No confeccione páginas que sean un callejón sin
salida.
Al menos cada página Web ha de tener un enlace por
el cual se pueda continuar la navegación.
                            Noemí Camarena 2012
Para poder navegar por un Sitio web es necesario
que sus páginas estén relacionadas. Para ello
debemos crear una barra de navegación
Su función es permitirle al visitante navegar por
un mismo Sitio.



                           Noemí Camarena 2012
Noemí Camarena 2012
Noemí Camarena 2012
Navegación

Un buen sistema de navegación es imprescindible
en toda página web. Es una parte importante de la
organización de la estructura de la web.


Que el usuario sea capaz de moverse con soltura
y facilidad por las distintas páginas del sitio, que
encuentre lo que busca rápidamente, que no se
pierda yendo de un enlace a otro sin saber donde
está.
                            Noemí Camarena 2012
TIPOS DE
NAVEGADORES




      Noemí Camarena 2012
Puntos importantes en la navegación




                 La página de inicio

La página de inicio de tu web es la puerta
principal de acceso a tu web. Por ella entrarán la
mayor parte de visitantes, por lo que hay que
cuidar al máximo cada detalle.
                            Noemí Camarena 2012
PÁGINA DE
  INICIO




      Noemí Camarena 2012
El menú de una página web es la principal
herramienta de navegación que le podemos
facilitar al visitante para que encuentre lo que
busca.


Es imprescindible para que las personas
encuentren las demás páginas de la web.
                            Noemí Camarena 2012
TIPOS DE MENÚS DE NAVEGACIÓN




           Noemí Camarena 2012
Menú de navegación




 Pie de página de la web también puede usarse
para mejorar la navegación del sitio. Normalmente
no se utiliza para poner enlaces a todas las
secciones

por ejemplo información legal sobre tu empresa,
direcciones de contacto, políticas de uso del sitio,
etc.
                            Noemí Camarena 2012
EVITAR PÁGINAS HUÉRFANAS



Una página huérfana es aquella desde la cual
no se puede acceder a ninguna otra. Cuando el
usuario se encuentra con una de estas páginas
la confusión y el enfado pueden ser
importantes.



                         Noemí Camarena 2012
PÁGINAS
HUÉRFANAS




     Noemí Camarena 2012
JERARQUÍAS

La estructura de un conjunto de
pagina web muy importante, ya que
una buena estructura permite al
lector visualizar todos los
contenidos de una manera fácil y
clara, entre estas existen las
siguientes:

                   Noemí Camarena 2012
Lineal: el usuario navega
secuencialmente, en un cuadro o
fragmento de la información a otro.



Jerárquica: el usuario navega a través
de las ramas de la estructura de árbol
que se forma, dada la lógica natural del
contenido.
                       Noemí Camarena 2012
No lineal: el usuario navega libremente
a través del contenido del proyecto, sin
limitarse a vías predeterminadas.




                       Noemí Camarena 2012
Compuesta: los usuarios pueden navegar
libremente (no linealmente), pero también están
limitados, en ocasiones por presentaciones
lineales de película o de información crítica y de
datos que se organizan con más lógica en una
forma jerárquica.




                            Noemí Camarena 2012
Noemí Camarena 2012

Más contenido relacionado

La actualidad más candente

ENSAYO DREANWAVER
ENSAYO DREANWAVERENSAYO DREANWAVER
ENSAYO DREANWAVER
guest803786
 
Presentacion Diseño Web
Presentacion Diseño WebPresentacion Diseño Web
Presentacion Diseño Web
Nicida Malca
 

La actualidad más candente (20)

Diseño Web 02
Diseño Web 02Diseño Web 02
Diseño Web 02
 
Presentación sobre Diseño Web
Presentación sobre Diseño WebPresentación sobre Diseño Web
Presentación sobre Diseño Web
 
Teoría del Diseño Web
Teoría del Diseño WebTeoría del Diseño Web
Teoría del Diseño Web
 
Fundamentos del diseño gráfico para web e interactivos
Fundamentos del diseño gráfico para web e interactivosFundamentos del diseño gráfico para web e interactivos
Fundamentos del diseño gráfico para web e interactivos
 
ENSAYO DREANWAVER
ENSAYO DREANWAVERENSAYO DREANWAVER
ENSAYO DREANWAVER
 
Dreamwever
DreamweverDreamwever
Dreamwever
 
Tipos de Sitios Web
Tipos de Sitios WebTipos de Sitios Web
Tipos de Sitios Web
 
Diseño y maquetación de sitios web.ppt
Diseño y maquetación de sitios web.pptDiseño y maquetación de sitios web.ppt
Diseño y maquetación de sitios web.ppt
 
Diseño Web
Diseño WebDiseño Web
Diseño Web
 
Presentacion Desarrollo Web 2013
Presentacion Desarrollo Web 2013Presentacion Desarrollo Web 2013
Presentacion Desarrollo Web 2013
 
Luis palacio
Luis palacioLuis palacio
Luis palacio
 
Presentacion Diseño Web
Presentacion Diseño WebPresentacion Diseño Web
Presentacion Diseño Web
 
Diseño de paginas web clase 1 lista
Diseño de paginas web clase 1 listaDiseño de paginas web clase 1 lista
Diseño de paginas web clase 1 lista
 
02 introducción al diseño web
02 introducción al diseño web02 introducción al diseño web
02 introducción al diseño web
 
Evolución del diseño web
Evolución del diseño webEvolución del diseño web
Evolución del diseño web
 
Tipos de sitio web
Tipos de sitio webTipos de sitio web
Tipos de sitio web
 
Actividad uno web blog
Actividad uno  web blogActividad uno  web blog
Actividad uno web blog
 
tutorial de dreamweaver
tutorial de dreamweavertutorial de dreamweaver
tutorial de dreamweaver
 
Diseño de páginas web
Diseño de páginas webDiseño de páginas web
Diseño de páginas web
 
Samanta2
Samanta2Samanta2
Samanta2
 

Destacado

Impacto tecnologia-educacion
Impacto tecnologia-educacionImpacto tecnologia-educacion
Impacto tecnologia-educacion
Akatherin
 
Anatomía de un Sitio Web
Anatomía de un Sitio WebAnatomía de un Sitio Web
Anatomía de un Sitio Web
buciosinai
 
Introducción a websites
Introducción a websitesIntroducción a websites
Introducción a websites
Rubens Yanes
 
Composición en Web
Composición en WebComposición en Web
Composición en Web
Rubens Yanes
 
Cuales son los elementos de una pagina web
Cuales son los elementos de una pagina webCuales son los elementos de una pagina web
Cuales son los elementos de una pagina web
katherinviviana
 
Cuales son los elementos de una pagina web
Cuales son los elementos de una pagina webCuales son los elementos de una pagina web
Cuales son los elementos de una pagina web
2012diego
 
Elementos básicos y estructura de una página web
Elementos básicos y estructura de una página webElementos básicos y estructura de una página web
Elementos básicos y estructura de una página web
adri9610
 
"Ejemplos de Diagrama y Elementos de las Paginas WEB"
"Ejemplos de Diagrama y Elementos de las Paginas WEB""Ejemplos de Diagrama y Elementos de las Paginas WEB"
"Ejemplos de Diagrama y Elementos de las Paginas WEB"
ogms
 
Pasos tecnicos para crear un sitio web
Pasos tecnicos para crear un sitio webPasos tecnicos para crear un sitio web
Pasos tecnicos para crear un sitio web
Juan Flores
 
Pasos para crear un sitio web
Pasos para crear un sitio webPasos para crear un sitio web
Pasos para crear un sitio web
tomyycerr
 

Destacado (16)

Estretagias de comunicacion para diseño web
Estretagias de comunicacion para diseño webEstretagias de comunicacion para diseño web
Estretagias de comunicacion para diseño web
 
Impacto tecnologia-educacion
Impacto tecnologia-educacionImpacto tecnologia-educacion
Impacto tecnologia-educacion
 
Anatomía de un Sitio Web
Anatomía de un Sitio WebAnatomía de un Sitio Web
Anatomía de un Sitio Web
 
Introducción a websites
Introducción a websitesIntroducción a websites
Introducción a websites
 
Las Animaciones Para La Web
Las Animaciones Para La WebLas Animaciones Para La Web
Las Animaciones Para La Web
 
Composición en Web
Composición en WebComposición en Web
Composición en Web
 
Anatomia de una pagina web
Anatomia de una pagina webAnatomia de una pagina web
Anatomia de una pagina web
 
Composicion de paginas web
Composicion de paginas webComposicion de paginas web
Composicion de paginas web
 
Analisis Sitios Web Ramo
Analisis Sitios Web RamoAnalisis Sitios Web Ramo
Analisis Sitios Web Ramo
 
Cuales son los elementos de una pagina web
Cuales son los elementos de una pagina webCuales son los elementos de una pagina web
Cuales son los elementos de una pagina web
 
Cuales son los elementos de una pagina web
Cuales son los elementos de una pagina webCuales son los elementos de una pagina web
Cuales son los elementos de una pagina web
 
Elementos básicos y estructura de una página web
Elementos básicos y estructura de una página webElementos básicos y estructura de una página web
Elementos básicos y estructura de una página web
 
"Ejemplos de Diagrama y Elementos de las Paginas WEB"
"Ejemplos de Diagrama y Elementos de las Paginas WEB""Ejemplos de Diagrama y Elementos de las Paginas WEB"
"Ejemplos de Diagrama y Elementos de las Paginas WEB"
 
Pasos tecnicos para crear un sitio web
Pasos tecnicos para crear un sitio webPasos tecnicos para crear un sitio web
Pasos tecnicos para crear un sitio web
 
Estructura y diseño de un sitio web
Estructura y diseño de un sitio webEstructura y diseño de un sitio web
Estructura y diseño de un sitio web
 
Pasos para crear un sitio web
Pasos para crear un sitio webPasos para crear un sitio web
Pasos para crear un sitio web
 

Similar a Anatomia de una página web

Mi primera pagina_web[1]
Mi primera pagina_web[1]Mi primera pagina_web[1]
Mi primera pagina_web[1]
estaseylugo1992
 
Diseño de Páginas Web
Diseño de Páginas WebDiseño de Páginas Web
Diseño de Páginas Web
8vivi8
 
Guia html2
Guia html2Guia html2
Guia html2
ljds
 

Similar a Anatomia de una página web (20)

Actividad uno
Actividad unoActividad uno
Actividad uno
 
tic
tictic
tic
 
13.diseño de web apps
13.diseño de web apps13.diseño de web apps
13.diseño de web apps
 
1 introduccion a dreamweaver
1 introduccion a dreamweaver1 introduccion a dreamweaver
1 introduccion a dreamweaver
 
Mi primera pagina_web[1]
Mi primera pagina_web[1]Mi primera pagina_web[1]
Mi primera pagina_web[1]
 
Páginas web (1)
Páginas web (1)Páginas web (1)
Páginas web (1)
 
Paginas web
Paginas web Paginas web
Paginas web
 
DISEÑO WEB.pdf
DISEÑO WEB.pdfDISEÑO WEB.pdf
DISEÑO WEB.pdf
 
Miprimerapagina
MiprimerapaginaMiprimerapagina
Miprimerapagina
 
Miprimerapagina
MiprimerapaginaMiprimerapagina
Miprimerapagina
 
pagina web
pagina webpagina web
pagina web
 
Diseño de Páginas Web
Diseño de Páginas WebDiseño de Páginas Web
Diseño de Páginas Web
 
Clase no 3
Clase no 3Clase no 3
Clase no 3
 
Andrea Olivera
Andrea OliveraAndrea Olivera
Andrea Olivera
 
Actividad uno
Actividad uno Actividad uno
Actividad uno
 
DREMWEAVER
DREMWEAVERDREMWEAVER
DREMWEAVER
 
Preparativos web
Preparativos webPreparativos web
Preparativos web
 
Guia html2
Guia html2Guia html2
Guia html2
 
Ejercicio Sitios Web
Ejercicio Sitios WebEjercicio Sitios Web
Ejercicio Sitios Web
 
Informe de informatica kleiver y laura
Informe de informatica kleiver y lauraInforme de informatica kleiver y laura
Informe de informatica kleiver y laura
 

Último

TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
jlorentemartos
 

Último (20)

Actividades para el 11 de Mayo día del himno.docx
Actividades para el 11 de Mayo día del himno.docxActividades para el 11 de Mayo día del himno.docx
Actividades para el 11 de Mayo día del himno.docx
 
Biografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdfBiografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdf
 
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESOPrueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
 
PLAN LECTOR 2024 integrado nivel inicial-miercoles 10.pptx
PLAN LECTOR 2024  integrado nivel inicial-miercoles 10.pptxPLAN LECTOR 2024  integrado nivel inicial-miercoles 10.pptx
PLAN LECTOR 2024 integrado nivel inicial-miercoles 10.pptx
 
La Evaluacion Formativa SM6 Ccesa007.pdf
La Evaluacion Formativa SM6  Ccesa007.pdfLa Evaluacion Formativa SM6  Ccesa007.pdf
La Evaluacion Formativa SM6 Ccesa007.pdf
 
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptxLA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
 
Sesión de clase APC: Los dos testigos.pdf
Sesión de clase APC: Los dos testigos.pdfSesión de clase APC: Los dos testigos.pdf
Sesión de clase APC: Los dos testigos.pdf
 
Tema 19. Inmunología y el sistema inmunitario 2024
Tema 19. Inmunología y el sistema inmunitario 2024Tema 19. Inmunología y el sistema inmunitario 2024
Tema 19. Inmunología y el sistema inmunitario 2024
 
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
 
Prueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESOPrueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESO
 
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
 
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docxPLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
 
La Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración AmbientalLa Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración Ambiental
 
Usos y desusos de la inteligencia artificial en revistas científicas
Usos y desusos de la inteligencia artificial en revistas científicasUsos y desusos de la inteligencia artificial en revistas científicas
Usos y desusos de la inteligencia artificial en revistas científicas
 
Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024
 
Supuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docxSupuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docx
 
Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024
 
Revista Apuntes de Historia. Mayo 2024.pdf
Revista Apuntes de Historia. Mayo 2024.pdfRevista Apuntes de Historia. Mayo 2024.pdf
Revista Apuntes de Historia. Mayo 2024.pdf
 
Factores que intervienen en la Administración por Valores.pdf
Factores que intervienen en la Administración por Valores.pdfFactores que intervienen en la Administración por Valores.pdf
Factores que intervienen en la Administración por Valores.pdf
 
FICHA PROYECTO COIL- GLOBAL CLASSROOM.docx.pdf
FICHA PROYECTO COIL- GLOBAL CLASSROOM.docx.pdfFICHA PROYECTO COIL- GLOBAL CLASSROOM.docx.pdf
FICHA PROYECTO COIL- GLOBAL CLASSROOM.docx.pdf
 

Anatomia de una página web

  • 1. ANATOMÍA DE UNA PÁGINA WEB Noemí Camarena 2012
  • 2. La composición de una página web como ésta puede considerarse desde el punto de vista de su diseño o atendiendo a las partes y tipos de fichero que la componen. Es preciso entender bien de qué está formada una página para poder aprender con éxito como crearlas y modificarlas. Noemí Camarena 2012
  • 3. Una página web es superficialmente parecida a cualquier otro documento: un texto, unas imágenes, todo compuesto de una determinada manera. Se trata simplemente de un fichero de texto, con una extensión HTML (de hypertext markup language - lenguaje de hipertexto.). El fichero contiene el texto más una serie de códigos que permiten dar formato a la página en el navegador. Noemí Camarena 2012
  • 4. Así que la página web, vista con un editor de texto, contiene una mezcla de texto normal y una serie de códigos. Estos códigos del lenguaje HTML son siempre del estilo <head> y </head>, por ejemplo. Siempre van entre llaves, y cada código tiene una forma inicial y otra de cierre que indican el intervalo de texto o imágenes que reciben el formato correspondiente. Noemí Camarena 2012
  • 5. EJEMPLOS <body background="rosa.jpg"><body bgcolor="text="black"> <center><h1>"Nuestra gira al Volcán Barú"</h1></center> <center><h2> El propósito de esta gira fue obtener fotos reales del Volcán Barú</h2> Noemí Camarena 2012
  • 6. <body background="rosa.jpg"> Noemí Camarena 2012
  • 7. Title <center><h1>"Nuestra gira al Volcán Barú"</h1></center> <center><h2> El propósito de esta gira fue obtener fotos reales del Volcán Barú</h2> "Nuestra gira al Volcán Barú" El propósito de esta gira fue obtener fotos reales del Volcán Barú Noemí Camarena 2012
  • 8. Principales componentes de una página web Texto El texto editable se muestra en pantalla con alguna de las fuentes que el usuario tiene instaladas (a veces se utiliza una tecnología de fuentes incrustadas, con lo que vemos en el monitor una fuente que realmente no poseemos, pero es poco frecuente.) Noemí Camarena 2012
  • 9. TEXTO Noemí Camarena 2012
  • 11. GRÁFICOS Son ficheros enlazados desde el fichero de la página propiamente dicho. Se puede hablar de dos formatos casi exclusivamente: GIF y JPG. Noemí Camarena 2012
  • 12. Gráficos para la web Noemí Camarena 2012
  • 13. FORMULARIOS Son una mezcla de texto y a veces gráficos, que permiten enviar información por parte del visitante, por ejemplo, consultando un catálogo, solicitando más información, comunicando su opinión, votando en una encuesta. Noemí Camarena 2012
  • 14. FORMULARIOS Noemí Camarena 2012
  • 15. Java script Es un tipo de lenguaje de programación que se interpreta y ejecuta por parte del navegador; muy utilizado para diferentes efectos visuales, en especial los efectos de cambio de imagen. Noemí Camarena 2012
  • 17. El código Java está también escrito en un lenguaje de programación independiente de plataforma (válido para cualquier tipo de ordenador) que también permite diferentes efectos, interactividad. por sus comandos. Noemí Camarena 2012
  • 19. Shockwave/Flash Con este programa podemos confeccionar imágenes fijas o animaciones interactivas de tipo vectorial, extremadamente compactas. Es preciso un plug-in para poder ver las imágenes en el navegador, aunque las versiones más recientes lo incluyen y es gratis. Noemí Camarena 2012
  • 21. Organización de un Sitio Web Para hacer una buena presentación Web lo ideal es crear un boceto inicial de la estructura. Noemí Camarena 2012
  • 22. Objetivos Lo primero que debemos hacer es fijarnos los objetivos que queremos alcanzar según la información que vayamos a aportar. Para crear nuestra primera página, estos objetivos deberían no ser muy pretenciosos o tener un sentido únicamente personal. Noemí Camarena 2012
  • 23. Una vez que tenemos los objetivos, hay que organizar el contenido por temas o secciones, Es conveniente que los temas sean razonablemente cortos y si fuera necesario divida en subtemas. Noemí Camarena 2012
  • 24. ESTRUCTURA La estructura de un conjunto de páginas web es muy importante, ya que una buena estructura permitirá al lector visualizar todos los contenidos de una manera fácil y clara. Mientras que un conjunto de páginas web con una mala estructura producirá en el lector una sensación de estar perdido, no encontrará rápidamente lo que busca y terminará por abandonar nuestro sitio. Noemí Camarena 2012
  • 25. No confeccione páginas que sean un callejón sin salida. Al menos cada página Web ha de tener un enlace por el cual se pueda continuar la navegación. Noemí Camarena 2012
  • 26. Para poder navegar por un Sitio web es necesario que sus páginas estén relacionadas. Para ello debemos crear una barra de navegación Su función es permitirle al visitante navegar por un mismo Sitio. Noemí Camarena 2012
  • 29. Navegación Un buen sistema de navegación es imprescindible en toda página web. Es una parte importante de la organización de la estructura de la web. Que el usuario sea capaz de moverse con soltura y facilidad por las distintas páginas del sitio, que encuentre lo que busca rápidamente, que no se pierda yendo de un enlace a otro sin saber donde está. Noemí Camarena 2012
  • 30. TIPOS DE NAVEGADORES Noemí Camarena 2012
  • 31. Puntos importantes en la navegación La página de inicio La página de inicio de tu web es la puerta principal de acceso a tu web. Por ella entrarán la mayor parte de visitantes, por lo que hay que cuidar al máximo cada detalle. Noemí Camarena 2012
  • 32. PÁGINA DE INICIO Noemí Camarena 2012
  • 33. El menú de una página web es la principal herramienta de navegación que le podemos facilitar al visitante para que encuentre lo que busca. Es imprescindible para que las personas encuentren las demás páginas de la web. Noemí Camarena 2012
  • 34. TIPOS DE MENÚS DE NAVEGACIÓN Noemí Camarena 2012
  • 35. Menú de navegación Pie de página de la web también puede usarse para mejorar la navegación del sitio. Normalmente no se utiliza para poner enlaces a todas las secciones por ejemplo información legal sobre tu empresa, direcciones de contacto, políticas de uso del sitio, etc. Noemí Camarena 2012
  • 36. EVITAR PÁGINAS HUÉRFANAS Una página huérfana es aquella desde la cual no se puede acceder a ninguna otra. Cuando el usuario se encuentra con una de estas páginas la confusión y el enfado pueden ser importantes. Noemí Camarena 2012
  • 37. PÁGINAS HUÉRFANAS Noemí Camarena 2012
  • 38. JERARQUÍAS La estructura de un conjunto de pagina web muy importante, ya que una buena estructura permite al lector visualizar todos los contenidos de una manera fácil y clara, entre estas existen las siguientes: Noemí Camarena 2012
  • 39. Lineal: el usuario navega secuencialmente, en un cuadro o fragmento de la información a otro. Jerárquica: el usuario navega a través de las ramas de la estructura de árbol que se forma, dada la lógica natural del contenido. Noemí Camarena 2012
  • 40. No lineal: el usuario navega libremente a través del contenido del proyecto, sin limitarse a vías predeterminadas. Noemí Camarena 2012
  • 41. Compuesta: los usuarios pueden navegar libremente (no linealmente), pero también están limitados, en ocasiones por presentaciones lineales de película o de información crítica y de datos que se organizan con más lógica en una forma jerárquica. Noemí Camarena 2012