SlideShare une entreprise Scribd logo
1  sur  15
David González

    Grado : 11
¿Quées Weebly?
   Es una página web gratuita , dedicada ala
    creación de otras páginas. Usa un estilo de
    formato Widget, dejando que los usuarios
    creen páginas con pocos clics. El usuario
    arrastra y suelta distintos elementos web en la
    página (imágenes,texto,GoogleMaps,ec.)Un
    widget es una pequeña aplicación o programa
    que permite de dar fácil acceso a funciones
    frecuentemente usadas y proveer de
    información visual distribuida en Internet
    ;como: vistosos relojes en
    pantalla,notas,calculadoras,calendarios,agend
    as,juegos,ventanas con información del tiempo
    en su ciudad,etcétera.
   Los widgets también se conocen como
    gadgets de escritorio , y son una nueva
    categoría de mini aplicaciones ;
    diseñadas para proveer de información
    o mejorar una aplicación o servicios de
    un ordenador o computadora .
   Una página web es una fuente de
    información adaptada para la World
    Wide Web (WWW) Red informática
    mundial y accesible mediante un
    navegador deI internet. Ésta información
    se presenta generalmente en formato
    HTML y puede contener hiperenlaces a
    otras páginas web, constituyendo la red
    enlazada de la World Wide Web.
Creación de una página web
            con Weebly
 - Entrar a Internet (Usar Mozilla Firefox)
 -Digitar : www.weebly.com

   Seleccione el idioma
    (si es necesario)

   Regístrese digite el nombre de usuario
   Minúscula sin espacio en blanco

   Correo electrónico y contraseña

   Pulse registrarse en gratis
 Active la opción
 de dominio
 Gratuito




                    pulse continuar
Para el diseño de páginas web debemos
tener en cuenta tres etapas:
La primera, es el diseño visual de la
información que se desea editar. En esta
etapa se trabaja distribuyendo el texto, los
gráficos, los vínculos a otros documentos y
otros objetos multimedia que se consideren
pertinentes. Es importante que antes de
trabajar sobre el computador se realice un
bosquejo o prediseño sobre el papel. Esto
facilitará tener un orden claro sobre el diseño.
   La segunda, es la estructura y relación
    jerárquica de las páginas del sitio web, una
    vez que se tiene este boceto se pasa a
    'escribir' la página web. Para esto, y
    fundamentalmente para manejar los vínculos
    entre documentos, se creó el lenguaje de
    marcación de hipertexto o HTML. Los enlaces
    que aparecen subrayados en este documento
    y otros de Wikipedia son ejemplos de
    hipertexto, puesto que al pulsar sobre ellos
    conducen a otras páginas con información
    relacionada. La importancia de la estructura y
    arborescencia web radica en que los visitantes
    no siempre entran por la página principal o
    incial y en ese caso el sitio debe darle la
    respuesta a lo que busca rápido, además
    permitirle navegar por el sitio.
   La tercera, etapa consiste en
    el posicionamiento en buscadores o SEO.
    Ésta consiste en optimizar la estructura del
    contenido para mejorar la posición en que
    aparece la página en determinada
    búsqueda. Etapa no gustosa por los
    diseñadores gráficos, porque a diferencia
    del texto, aún para el año 2012 no se
    pueden tener nuevos resultados en los
    buscadores con sitios muy gráficos.
Fundamentos

   Un correcto diseño web implica conocer cómo se
    deben utilizar cada uno de los elementos permitidos
    en el HTML, es decir, hacer un uso correcto de este
    lenguaje dentro de los estándaresestablecidos por
    la W3C y en lo referente a la web semántica. Debido
    a la permisibilidad de algunos navegadores web
    como Internet Explorer, esta premisa original se ha
    perdido. Por ejemplo, este navegador permite que
    no sea necesario cerrar las etiquetas del marcado,
    utiliza código propietario, etc. Esto impide que ese
    documento web sea universal e independiente del
    medio que se utilice para ser mostrado.
   La web semántica, por otra parte, aboga por
    un uso lógico de los elementos según el
    significado para el que fueron concebidas. Por
    ejemplo se utilizará el elemento <P> para
    marcar párrafos, y<TABLE> para tabular datos
    (nunca para disponer de manera visual los
    diferentes elementos del documento). En su
    última instancia, esto ha supuesto una
    auténtica revolución en el diseño web puesto
    que apuesta por separar totalmente el
    contenido del documento de la visualización.
   De esta forma se utiliza el documento
    HTML únicamente para contener, organizar
    y estructurar la información y las hojas de
    estilo CSS para indicar como se mostrará
    dicha información en los diferentes medios
    (como por ejemplo, una pantalla de
    computadora, un teléfono móvil, impreso
    en papel, leída por un sintetizador de voz,
    etc.). Por lógica, esta metodología
    beneficia enormemente la accesibilidad del
    documento.
   También existen páginas dinámicas, las
    cuales permiten interacción entre la web
    y el visitante, proporcionándole
    herramientas tales como
    buscadores, chat, foros, sistemas
    de encuestas, etc. y poseen de
    un Panel de Control de administración
    de contenidos. Este permite crear,
    actualizar y administrar cantidades
    ilimitadas de contenido en la misma.
Accesibilidad

   El diseño web debe seguir unos
    requerimientos mínimos
    de accesibilidad web que haga que sus
    sitios web o aplicaciones puedan ser
    visitados por el mayor número de
    personas. Para conseguir estos
    objetivos de accesibilidad se han
    desarrollado pautas como las del W3C:
    Pautas de accesibilidad al contenido
    Web 1.0 WCAG.
Fin



Contenu connexe

Tendances

Tendances (20)

Diseño web
Diseño webDiseño web
Diseño web
 
Evolución de la webs
Evolución de la websEvolución de la webs
Evolución de la webs
 
PresentacióN Web 2[1].0
PresentacióN Web 2[1].0PresentacióN Web 2[1].0
PresentacióN Web 2[1].0
 
Felipe web
Felipe webFelipe web
Felipe web
 
Ariel beitia
Ariel beitiaAriel beitia
Ariel beitia
 
WEB 2.0
WEB 2.0WEB 2.0
WEB 2.0
 
Presentaciones de diapositivas
Presentaciones de diapositivasPresentaciones de diapositivas
Presentaciones de diapositivas
 
Evoluciondelawebdc
EvoluciondelawebdcEvoluciondelawebdc
Evoluciondelawebdc
 
Web 6 credito
Web 6 creditoWeb 6 credito
Web 6 credito
 
Desarrollo en la pagina web
Desarrollo en la pagina webDesarrollo en la pagina web
Desarrollo en la pagina web
 
B L O Q U E A G R E G A R R E C U R S O S
B L O Q U E  A G R E G A R  R E C U R S O SB L O Q U E  A G R E G A R  R E C U R S O S
B L O Q U E A G R E G A R R E C U R S O S
 
tipos de web
tipos de web tipos de web
tipos de web
 
Diseño web informatica
Diseño web informatica Diseño web informatica
Diseño web informatica
 
darleny medina
darleny medinadarleny medina
darleny medina
 
Herramientas digitales
Herramientas digitalesHerramientas digitales
Herramientas digitales
 
Web 2.0 ok
Web 2.0 okWeb 2.0 ok
Web 2.0 ok
 
Bitacora de la unidad 4
Bitacora de la unidad 4Bitacora de la unidad 4
Bitacora de la unidad 4
 
Comparacion web
Comparacion webComparacion web
Comparacion web
 
4 ta bitacor aa
4 ta bitacor aa4 ta bitacor aa
4 ta bitacor aa
 
4 ta bitacora
4 ta bitacora4 ta bitacora
4 ta bitacora
 

En vedette

Seminario
SeminarioSeminario
Seminarionax26
 
Creaciòn de una pàgina web
Creaciòn de una pàgina webCreaciòn de una pàgina web
Creaciòn de una pàgina webNilson López
 
CREACIÓN DE PAGINA WEB EN ACTIWEB Y BLOG EN BLOGGER
CREACIÓN DE PAGINA WEB EN ACTIWEB Y BLOG EN BLOGGERCREACIÓN DE PAGINA WEB EN ACTIWEB Y BLOG EN BLOGGER
CREACIÓN DE PAGINA WEB EN ACTIWEB Y BLOG EN BLOGGERRicardo Cruz
 
Página web proyecto
Página web proyecto Página web proyecto
Página web proyecto marcoame
 
Presentacion para pagina web
Presentacion para pagina webPresentacion para pagina web
Presentacion para pagina webedwin_cano
 
PRESENTACIÓN PAGINA WEB
PRESENTACIÓN PAGINA WEB PRESENTACIÓN PAGINA WEB
PRESENTACIÓN PAGINA WEB gordo666
 
Creación de página web Weebly
Creación de página web WeeblyCreación de página web Weebly
Creación de página web Weeblyizasp
 

En vedette (8)

Seminario
SeminarioSeminario
Seminario
 
Creaciòn de una pàgina web
Creaciòn de una pàgina webCreaciòn de una pàgina web
Creaciòn de una pàgina web
 
Creacion Pagina WEB
Creacion Pagina WEBCreacion Pagina WEB
Creacion Pagina WEB
 
CREACIÓN DE PAGINA WEB EN ACTIWEB Y BLOG EN BLOGGER
CREACIÓN DE PAGINA WEB EN ACTIWEB Y BLOG EN BLOGGERCREACIÓN DE PAGINA WEB EN ACTIWEB Y BLOG EN BLOGGER
CREACIÓN DE PAGINA WEB EN ACTIWEB Y BLOG EN BLOGGER
 
Página web proyecto
Página web proyecto Página web proyecto
Página web proyecto
 
Presentacion para pagina web
Presentacion para pagina webPresentacion para pagina web
Presentacion para pagina web
 
PRESENTACIÓN PAGINA WEB
PRESENTACIÓN PAGINA WEB PRESENTACIÓN PAGINA WEB
PRESENTACIÓN PAGINA WEB
 
Creación de página web Weebly
Creación de página web WeeblyCreación de página web Weebly
Creación de página web Weebly
 

Similaire à Creación de pagina web

Instituto san antonio
Instituto san antonioInstituto san antonio
Instituto san antonioEsling Madrid
 
Informe Digitalizado
Informe DigitalizadoInforme Digitalizado
Informe DigitalizadoEduard1541
 
Tatiana presentacion slideshare
Tatiana presentacion slideshareTatiana presentacion slideshare
Tatiana presentacion slideshareced calasanz
 
Diseñador Web Carlos D. Baéz
Diseñador Web Carlos D. BaézDiseñador Web Carlos D. Baéz
Diseñador Web Carlos D. Baézcristorey2014
 
Herramientas telematicas
Herramientas telematicas Herramientas telematicas
Herramientas telematicas 008009
 
juan cruz Avance Tecnológico
juan cruz Avance Tecnológico juan cruz Avance Tecnológico
juan cruz Avance Tecnológico Jhon Kronick
 
Trabajo 10
Trabajo 10Trabajo 10
Trabajo 10Liz345
 
El origen-de-las-paginas-web-final
El origen-de-las-paginas-web-finalEl origen-de-las-paginas-web-final
El origen-de-las-paginas-web-finalLuis Wuicho Angeles
 
DISEÑO Y MANEJO DE PAGINAS WED
DISEÑO Y MANEJO DE PAGINAS WEDDISEÑO Y MANEJO DE PAGINAS WED
DISEÑO Y MANEJO DE PAGINAS WEDsaidi-12barcelo
 
Introducción Diseño Web
Introducción Diseño WebIntroducción Diseño Web
Introducción Diseño WebVladimir
 
Amanda andrea trabajo terminado diseño web
Amanda andrea  trabajo terminado diseño webAmanda andrea  trabajo terminado diseño web
Amanda andrea trabajo terminado diseño webAmnada14
 
Amanda andrea trabajo terminado diseño web
Amanda andrea  trabajo terminado diseño webAmanda andrea  trabajo terminado diseño web
Amanda andrea trabajo terminado diseño webmonacha30
 

Similaire à Creación de pagina web (20)

Instituto san antonio
Instituto san antonioInstituto san antonio
Instituto san antonio
 
Diseño y web 2
Diseño y web 2Diseño y web 2
Diseño y web 2
 
El internet
El internetEl internet
El internet
 
Pagina web
Pagina webPagina web
Pagina web
 
DISEÑO WEB
DISEÑO WEBDISEÑO WEB
DISEÑO WEB
 
Informe Digitalizado
Informe DigitalizadoInforme Digitalizado
Informe Digitalizado
 
Tatiana presentacion slideshare
Tatiana presentacion slideshareTatiana presentacion slideshare
Tatiana presentacion slideshare
 
PAGINA WEB
PAGINA WEBPAGINA WEB
PAGINA WEB
 
Diseñador Web Carlos D. Baéz
Diseñador Web Carlos D. BaézDiseñador Web Carlos D. Baéz
Diseñador Web Carlos D. Baéz
 
Herramientas telematicas
Herramientas telematicas Herramientas telematicas
Herramientas telematicas
 
Diseño web
Diseño webDiseño web
Diseño web
 
juan cruz Avance Tecnológico
juan cruz Avance Tecnológico juan cruz Avance Tecnológico
juan cruz Avance Tecnológico
 
Diseño de paginas web
Diseño de paginas webDiseño de paginas web
Diseño de paginas web
 
Trabajo 10
Trabajo 10Trabajo 10
Trabajo 10
 
Hist. diseño web
Hist. diseño webHist. diseño web
Hist. diseño web
 
El origen-de-las-paginas-web-final
El origen-de-las-paginas-web-finalEl origen-de-las-paginas-web-final
El origen-de-las-paginas-web-final
 
DISEÑO Y MANEJO DE PAGINAS WED
DISEÑO Y MANEJO DE PAGINAS WEDDISEÑO Y MANEJO DE PAGINAS WED
DISEÑO Y MANEJO DE PAGINAS WED
 
Introducción Diseño Web
Introducción Diseño WebIntroducción Diseño Web
Introducción Diseño Web
 
Amanda andrea trabajo terminado diseño web
Amanda andrea  trabajo terminado diseño webAmanda andrea  trabajo terminado diseño web
Amanda andrea trabajo terminado diseño web
 
Amanda andrea trabajo terminado diseño web
Amanda andrea  trabajo terminado diseño webAmanda andrea  trabajo terminado diseño web
Amanda andrea trabajo terminado diseño web
 

Creación de pagina web

  • 1. David González Grado : 11
  • 2. ¿Quées Weebly?  Es una página web gratuita , dedicada ala creación de otras páginas. Usa un estilo de formato Widget, dejando que los usuarios creen páginas con pocos clics. El usuario arrastra y suelta distintos elementos web en la página (imágenes,texto,GoogleMaps,ec.)Un widget es una pequeña aplicación o programa que permite de dar fácil acceso a funciones frecuentemente usadas y proveer de información visual distribuida en Internet ;como: vistosos relojes en pantalla,notas,calculadoras,calendarios,agend as,juegos,ventanas con información del tiempo en su ciudad,etcétera.
  • 3. Los widgets también se conocen como gadgets de escritorio , y son una nueva categoría de mini aplicaciones ; diseñadas para proveer de información o mejorar una aplicación o servicios de un ordenador o computadora .
  • 4. Una página web es una fuente de información adaptada para la World Wide Web (WWW) Red informática mundial y accesible mediante un navegador deI internet. Ésta información se presenta generalmente en formato HTML y puede contener hiperenlaces a otras páginas web, constituyendo la red enlazada de la World Wide Web.
  • 5. Creación de una página web con Weebly  - Entrar a Internet (Usar Mozilla Firefox)  -Digitar : www.weebly.com  Seleccione el idioma (si es necesario)  Regístrese digite el nombre de usuario  Minúscula sin espacio en blanco  Correo electrónico y contraseña  Pulse registrarse en gratis
  • 6.  Active la opción  de dominio  Gratuito  pulse continuar
  • 7. Para el diseño de páginas web debemos tener en cuenta tres etapas: La primera, es el diseño visual de la información que se desea editar. En esta etapa se trabaja distribuyendo el texto, los gráficos, los vínculos a otros documentos y otros objetos multimedia que se consideren pertinentes. Es importante que antes de trabajar sobre el computador se realice un bosquejo o prediseño sobre el papel. Esto facilitará tener un orden claro sobre el diseño.
  • 8. La segunda, es la estructura y relación jerárquica de las páginas del sitio web, una vez que se tiene este boceto se pasa a 'escribir' la página web. Para esto, y fundamentalmente para manejar los vínculos entre documentos, se creó el lenguaje de marcación de hipertexto o HTML. Los enlaces que aparecen subrayados en este documento y otros de Wikipedia son ejemplos de hipertexto, puesto que al pulsar sobre ellos conducen a otras páginas con información relacionada. La importancia de la estructura y arborescencia web radica en que los visitantes no siempre entran por la página principal o incial y en ese caso el sitio debe darle la respuesta a lo que busca rápido, además permitirle navegar por el sitio.
  • 9. La tercera, etapa consiste en el posicionamiento en buscadores o SEO. Ésta consiste en optimizar la estructura del contenido para mejorar la posición en que aparece la página en determinada búsqueda. Etapa no gustosa por los diseñadores gráficos, porque a diferencia del texto, aún para el año 2012 no se pueden tener nuevos resultados en los buscadores con sitios muy gráficos.
  • 10. Fundamentos  Un correcto diseño web implica conocer cómo se deben utilizar cada uno de los elementos permitidos en el HTML, es decir, hacer un uso correcto de este lenguaje dentro de los estándaresestablecidos por la W3C y en lo referente a la web semántica. Debido a la permisibilidad de algunos navegadores web como Internet Explorer, esta premisa original se ha perdido. Por ejemplo, este navegador permite que no sea necesario cerrar las etiquetas del marcado, utiliza código propietario, etc. Esto impide que ese documento web sea universal e independiente del medio que se utilice para ser mostrado.
  • 11. La web semántica, por otra parte, aboga por un uso lógico de los elementos según el significado para el que fueron concebidas. Por ejemplo se utilizará el elemento <P> para marcar párrafos, y<TABLE> para tabular datos (nunca para disponer de manera visual los diferentes elementos del documento). En su última instancia, esto ha supuesto una auténtica revolución en el diseño web puesto que apuesta por separar totalmente el contenido del documento de la visualización.
  • 12. De esta forma se utiliza el documento HTML únicamente para contener, organizar y estructurar la información y las hojas de estilo CSS para indicar como se mostrará dicha información en los diferentes medios (como por ejemplo, una pantalla de computadora, un teléfono móvil, impreso en papel, leída por un sintetizador de voz, etc.). Por lógica, esta metodología beneficia enormemente la accesibilidad del documento.
  • 13. También existen páginas dinámicas, las cuales permiten interacción entre la web y el visitante, proporcionándole herramientas tales como buscadores, chat, foros, sistemas de encuestas, etc. y poseen de un Panel de Control de administración de contenidos. Este permite crear, actualizar y administrar cantidades ilimitadas de contenido en la misma.
  • 14. Accesibilidad  El diseño web debe seguir unos requerimientos mínimos de accesibilidad web que haga que sus sitios web o aplicaciones puedan ser visitados por el mayor número de personas. Para conseguir estos objetivos de accesibilidad se han desarrollado pautas como las del W3C: Pautas de accesibilidad al contenido Web 1.0 WCAG.