SlideShare ist ein Scribd-Unternehmen logo
1 von 21
CREACIÓNCREACIÓN
DE UNADE UNA
PÁGINAPÁGINA
WebWeb
INDICEINDICE
11.. NTRODUCCIÓNNTRODUCCIÓN
2. ¿QUÉ ES NECESARIO PARA ELABORAR UNA PÁGINA WEB?2. ¿QUÉ ES NECESARIO PARA ELABORAR UNA PÁGINA WEB?
 ORDENADORORDENADOR
 MÓDEMMÓDEM
 INTENETINTENET
 PÁGINA WEBPÁGINA WEB
 HTMLHTML
 FRONTPAGEFRONTPAGE
 ELEMENTOS DE LA PÁGINAELEMENTOS DE LA PÁGINA WEBWEB
 WWWWWW
 DOCUMENTO DE HIPERTEXTODOCUMENTO DE HIPERTEXTO
 DIRECCIÓN URLDIRECCIÓN URL
 MARCOS (FRAMES)MARCOS (FRAMES)
 OPERACIONES DESDE LA BARRA DE HERRAMIENTAOPERACIONES DESDE LA BARRA DE HERRAMIENTA
 CRITERIOS PARA LA ELABORACIÓN DE PÁGINASCRITERIOS PARA LA ELABORACIÓN DE PÁGINAS WEBWEB
3. PRESENTADO POR:3. PRESENTADO POR:
INTRODUCCIÓN
Las páginas Web se crean utilizando el lenguaje
de Marcas Hipertexto (HTML)
Este lenguaje es un conjunto de instrucciones que
se insertan en un editor de texto convencional.
Se pueden crear páginas Web utilizando
programas especiales denominados “editores
Web”
ORDENADORESORDENADORES
Ordenador MARK I (1944 por Howard Aitken)Ordenador MARK I (1944 por Howard Aitken)
Ordenador ENIAC (1945 por el Ministerio de Defensa de loOrdenador ENIAC (1945 por el Ministerio de Defensa de lo
EE.UUEE.UU
Ordenador 286 (Princicipios de los 80)Ordenador 286 (Princicipios de los 80)
Ordenador portatilOrdenador portatil
Ordenador Multimedia (actual)Ordenador Multimedia (actual)
MÓDEM:MÓDEM: El módem es un dispositivo que permite aEl módem es un dispositivo que permite a
través de la línea telefónica, intercambiar informacióntravés de la línea telefónica, intercambiar información
entre ordenadores.entre ordenadores.
El módem se puede clasificar en:El módem se puede clasificar en:
 Interno:Interno: se colocan en el interior de la carcasa quese colocan en el interior de la carcasa que
contiene el ordenadorcontiene el ordenador
 Externo:Externo: se sitúa fuera de ella y por tanto es necesariose sitúa fuera de ella y por tanto es necesario
conectarlo a un puerto de comunicación.conectarlo a un puerto de comunicación.
 INTERNET:INTERNET: Es una red mundial de redes deEs una red mundial de redes de
ordenadores que permiten a éstos aordenadores que permiten a éstos a
comunicarse y compartir información. No escomunicarse y compartir información. No es
una red “típica” de ordenadores, sino una reduna red “típica” de ordenadores, sino una red
de redes, donde cada una de ellas esde redes, donde cada una de ellas es
independiente y autónomaindependiente y autónoma
Se puede hacer de dos formas:Se puede hacer de dos formas:
 HTMLHTML: Simplemente es un fichero de texto que se: Simplemente es un fichero de texto que se
desea mostrar en la pantalla. Además deberádesea mostrar en la pantalla. Además deberá
introducir ciertosintroducir ciertos comandoscomandos oo etiquetasetiquetas para quepara que
visualice el documento en la pantalla.visualice el documento en la pantalla.
EstosEstos comandos o etiquetascomandos o etiquetas son:son:
• Etiquetas se escriben cerradas entre los símbolosEtiquetas se escriben cerradas entre los símbolos “<“<
y>y>
• Las ordenes finalizan con un etiqueta (de cierre) queLas ordenes finalizan con un etiqueta (de cierre) que
incorpora la barraincorpora la barra “/”“/”
Por ejemploPor ejemplo
En cuanto a su estructura esta dividido enEn cuanto a su estructura esta dividido en
una serie de bloque:una serie de bloque:
1) <HTML> y </HTML>1) <HTML> y </HTML>
2) <HEAD> y </HEAD>2) <HEAD> y </HEAD>
3) <BODY> y </BODY>3) <BODY> y </BODY>
Ejemplo de un documento HTMLEjemplo de un documento HTML
Front page: es la herramienta de la suiteFront page: es la herramienta de la suite
Internet Explorer para crear páginas Web.Internet Explorer para crear páginas Web.
La creación de documentos de hipertextoLa creación de documentos de hipertexto
es similar a cualquier documento en loses similar a cualquier documento en los
que aparecen en los procesadoresque aparecen en los procesadores
habituales.habituales.
Para abrir este documento es muy simple:Para abrir este documento es muy simple:
Inicio / Programa / FrontPage ExpressInicio / Programa / FrontPage Express
Ejemplo de FrontPageEjemplo de FrontPage
 Los elementos queLos elementos que
componen la página Webcomponen la página Web
 WWW:WWW: conocida como W3 o Web proviene de laconocida como W3 o Web proviene de la
palabra World Wide Web que se puedepalabra World Wide Web que se puede
traducirse como trama mundialtraducirse como trama mundial
 Documento de hipertexto:Documento de hipertexto: es una combinaciónes una combinación
de texto, imágenes, elementos multimedia ende texto, imágenes, elementos multimedia en
general y, lo más importante, hiperenlaces ogeneral y, lo más importante, hiperenlaces o
también llamadas hipervínculos, vínculos otambién llamadas hipervínculos, vínculos o
enlaces.enlaces.
Característica de los hiperenlacesCaracterística de los hiperenlaces
o Palabras o frases destacadas enPalabras o frases destacadas en
distintos color o subrayadas, tambiéndistintos color o subrayadas, también
puede ser gráficospuede ser gráficos
o Documentos que pueden estarDocumentos que pueden estar
situados en el mismo ordenador u otrosituados en el mismo ordenador u otro
de cualquier parte del mundode cualquier parte del mundo
o Cuando se hace clic sobre uno de ellosCuando se hace clic sobre uno de ellos
y aparece en la pantalla el documentoy aparece en la pantalla el documento
que hacia referencia,que hacia referencia,
EjemploEjemplo
 Dirección URL:Dirección URL: la forma de escribir lasla forma de escribir las
direcciones de los distintos servicios Internet.direcciones de los distintos servicios Internet.
La estructura de una dirección URL, seLa estructura de una dirección URL, se
compone de tres partes:compone de tres partes:
http://http://www.anayamultimedia.eswww.anayamultimedia.es/catalogo/index.htm/catalogo/index.htm
Metodo
de
Acceso
Dirección del ordenador Es opcional
 Marco (Frame):Marco (Frame): esta subdividas en áreasesta subdividas en áreas
rectangulares o ventanas, cada una de lasrectangulares o ventanas, cada una de las
cuales contiene un documento de hipertextocuales contiene un documento de hipertexto
independiente de los demás.independiente de los demás.
 Operaciones desde la barra deOperaciones desde la barra de
herramienta estándar:herramienta estándar: contiene todos loscontiene todos los
botones que permiten efectuar,botones que permiten efectuar,
rápidamente, las operaciones habitualesrápidamente, las operaciones habituales
en navegación.en navegación.
 Criterios para laCriterios para la
elaboración de páginas Webelaboración de páginas Web
 Criterios generalesCriterios generales
1.1. Elegir los fondosElegir los fondos
2.2. Dejar claro el conjunto de sitio de la páginaDejar claro el conjunto de sitio de la página
abierta y como se puede llegar a otros lugares.abierta y como se puede llegar a otros lugares.
Indicar:Indicar:
a) dónde estaa) dónde esta
b) cómo llegar al lugarb) cómo llegar al lugar
c) Confirmación de que se está en el buenc) Confirmación de que se está en el buen
caminocamino
3.3. Cuidar la página inicialCuidar la página inicial
4.4. Diseñar la página con una información claraDiseñar la página con una información clara
5.5. Facilitar herramientas para imprimir el texto oFacilitar herramientas para imprimir el texto o
guardarlo en la Web con facilidadguardarlo en la Web con facilidad
6.6. Fechar las páginas. Facilita su actualizaciónFechar las páginas. Facilita su actualización
AVILÉS MARTÍN, Raúl
CALDERÓN TORRES, Mª del Mar
GARCÍA BALLESTERO, Jesús DavidGALLARDO LARA, Elena
RODRÍGUEZ ARROYO, Mª Juana SANCHEZ ESPINOSA, Roberto
3º ED. Primaria
NNTT

Weitere ähnliche Inhalte

Was ist angesagt? (18)

Introducción a HTML5
Introducción a HTML5Introducción a HTML5
Introducción a HTML5
 
Maquetado con HTML y CSS
Maquetado con HTML y CSSMaquetado con HTML y CSS
Maquetado con HTML y CSS
 
Diseño web
Diseño webDiseño web
Diseño web
 
Microsoft Frontpage
 Microsoft Frontpage Microsoft Frontpage
Microsoft Frontpage
 
mS FP1
mS FP1mS FP1
mS FP1
 
Apuntes de HTML 1
Apuntes de HTML 1Apuntes de HTML 1
Apuntes de HTML 1
 
Manual de introducción a CSS3
Manual de introducción a CSS3Manual de introducción a CSS3
Manual de introducción a CSS3
 
HTML5 y CSS3
HTML5 y CSS3HTML5 y CSS3
HTML5 y CSS3
 
HTML 5 para SEO
HTML 5 para SEOHTML 5 para SEO
HTML 5 para SEO
 
Publicar presentaciones PowerPoint
Publicar presentaciones PowerPointPublicar presentaciones PowerPoint
Publicar presentaciones PowerPoint
 
Desarrollo de aplicaciones con HTML5
Desarrollo de aplicaciones con HTML5 Desarrollo de aplicaciones con HTML5
Desarrollo de aplicaciones con HTML5
 
Introducción HTML5 y CSS3
Introducción HTML5 y CSS3Introducción HTML5 y CSS3
Introducción HTML5 y CSS3
 
HTML5 la revolución!
HTML5 la revolución!HTML5 la revolución!
HTML5 la revolución!
 
Introducción a HTML y CSS
Introducción a HTML y CSSIntroducción a HTML y CSS
Introducción a HTML y CSS
 
Guia html2
Guia html2Guia html2
Guia html2
 
Las Ventajas de usar HTML5 Y CSS3
Las Ventajas de usar HTML5 Y CSS3Las Ventajas de usar HTML5 Y CSS3
Las Ventajas de usar HTML5 Y CSS3
 
Guia html 1
Guia html 1Guia html 1
Guia html 1
 
MANUAL BASICO EN HTML
MANUAL BASICO EN HTMLMANUAL BASICO EN HTML
MANUAL BASICO EN HTML
 

Ähnlich wie Crea una página web en 40 pasos

U7 d. p. web
U7 d. p. webU7 d. p. web
U7 d. p. webisabbg
 
Diseño y edición de páginas web 1
Diseño y edición de páginas web 1Diseño y edición de páginas web 1
Diseño y edición de páginas web 1mpgandreu
 
PresentacióN Final
PresentacióN FinalPresentacióN Final
PresentacióN Finalheridas
 
PresentacióN Final
PresentacióN FinalPresentacióN Final
PresentacióN Finalheridas
 
Diseño de paginas y buscadores
Diseño de paginas y buscadores Diseño de paginas y buscadores
Diseño de paginas y buscadores Santos Hau Kuyoc
 
Conceptos básicos sobre internet y páginas web
Conceptos básicos sobre internet y páginas webConceptos básicos sobre internet y páginas web
Conceptos básicos sobre internet y páginas webKoldo Parra
 
Como nace el internet
Como nace el internetComo nace el internet
Como nace el internetkatiistefha
 
Como nace el internet
Como nace el internetComo nace el internet
Como nace el internetkatiistefha
 
Publicacion de contenidos webs
Publicacion de contenidos websPublicacion de contenidos webs
Publicacion de contenidos websjoseanymonica
 
Publicacion de contenidos web
Publicacion de contenidos webPublicacion de contenidos web
Publicacion de contenidos webjoseanymonica
 
Diseño de Páginas Web
Diseño de Páginas WebDiseño de Páginas Web
Diseño de Páginas Web8vivi8
 
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
 

Ähnlich wie Crea una página web en 40 pasos (20)

U7 d. p. web
U7 d. p. webU7 d. p. web
U7 d. p. web
 
Diseño y edición de páginas web 1
Diseño y edición de páginas web 1Diseño y edición de páginas web 1
Diseño y edición de páginas web 1
 
CONCEPTOS WEB
CONCEPTOS WEBCONCEPTOS WEB
CONCEPTOS WEB
 
PresentacióN Final
PresentacióN FinalPresentacióN Final
PresentacióN Final
 
PresentacióN Final
PresentacióN FinalPresentacióN Final
PresentacióN Final
 
PresentacióN Final
PresentacióN  FinalPresentacióN  Final
PresentacióN Final
 
HTML.pdf
HTML.pdfHTML.pdf
HTML.pdf
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Losdelsur
LosdelsurLosdelsur
Losdelsur
 
Diseño de paginas y buscadores
Diseño de paginas y buscadores Diseño de paginas y buscadores
Diseño de paginas y buscadores
 
Conceptos básicos sobre internet y páginas web
Conceptos básicos sobre internet y páginas webConceptos básicos sobre internet y páginas web
Conceptos básicos sobre internet y páginas web
 
Como nace el internet
Como nace el internetComo nace el internet
Como nace el internet
 
Como nace el internet
Como nace el internetComo nace el internet
Como nace el internet
 
Publicacion de contenidos webs
Publicacion de contenidos websPublicacion de contenidos webs
Publicacion de contenidos webs
 
Publicacion de contenidos web
Publicacion de contenidos webPublicacion de contenidos web
Publicacion de contenidos web
 
Diseño de Páginas Web
Diseño de Páginas WebDiseño de Páginas Web
Diseño de Páginas Web
 
Html
HtmlHtml
Html
 
Html1
Html1Html1
Html1
 
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
 

Kürzlich hochgeladen

Fundamentos y Principios de Psicopedagogía..pdf
Fundamentos y Principios de Psicopedagogía..pdfFundamentos y Principios de Psicopedagogía..pdf
Fundamentos y Principios de Psicopedagogía..pdfsamyarrocha1
 
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJOTUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJOweislaco
 
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADODECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADOJosé Luis Palma
 
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARONARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFAROJosé Luis Palma
 
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024gharce
 
Tarea 5_ Foro _Selección de herramientas digitales_Manuel.pdf
Tarea 5_ Foro _Selección de herramientas digitales_Manuel.pdfTarea 5_ Foro _Selección de herramientas digitales_Manuel.pdf
Tarea 5_ Foro _Selección de herramientas digitales_Manuel.pdfManuel Molina
 
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfMapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfvictorbeltuce
 
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptxc3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptxMartín Ramírez
 
VOLUMEN 1 COLECCION PRODUCCION BOVINA . SERIE SANIDAD ANIMAL
VOLUMEN 1 COLECCION PRODUCCION BOVINA . SERIE SANIDAD ANIMALVOLUMEN 1 COLECCION PRODUCCION BOVINA . SERIE SANIDAD ANIMAL
VOLUMEN 1 COLECCION PRODUCCION BOVINA . SERIE SANIDAD ANIMALEDUCCUniversidadCatl
 
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdfLA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdfNataliaMalky1
 
Tarea 5-Selección de herramientas digitales-Carol Eraso.pdf
Tarea 5-Selección de herramientas digitales-Carol Eraso.pdfTarea 5-Selección de herramientas digitales-Carol Eraso.pdf
Tarea 5-Selección de herramientas digitales-Carol Eraso.pdfCarol Andrea Eraso Guerrero
 
Unidad II Doctrina de la Iglesia 1 parte
Unidad II Doctrina de la Iglesia 1 parteUnidad II Doctrina de la Iglesia 1 parte
Unidad II Doctrina de la Iglesia 1 parteJuan Hernandez
 
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptxPresentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptxYeseniaRivera50
 
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxPPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxOscarEduardoSanchezC
 
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).pptPINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).pptAlberto Rubio
 
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptxSINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptxlclcarmen
 
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptxLINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptxdanalikcruz2000
 
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdfOswaldoGonzalezCruz
 

Kürzlich hochgeladen (20)

VISITA À PROTEÇÃO CIVIL _
VISITA À PROTEÇÃO CIVIL                  _VISITA À PROTEÇÃO CIVIL                  _
VISITA À PROTEÇÃO CIVIL _
 
Fundamentos y Principios de Psicopedagogía..pdf
Fundamentos y Principios de Psicopedagogía..pdfFundamentos y Principios de Psicopedagogía..pdf
Fundamentos y Principios de Psicopedagogía..pdf
 
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJOTUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
 
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADODECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
 
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARONARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
 
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
SISTEMA INMUNE FISIOLOGIA MEDICA UNSL 2024
 
Tarea 5_ Foro _Selección de herramientas digitales_Manuel.pdf
Tarea 5_ Foro _Selección de herramientas digitales_Manuel.pdfTarea 5_ Foro _Selección de herramientas digitales_Manuel.pdf
Tarea 5_ Foro _Selección de herramientas digitales_Manuel.pdf
 
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfMapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
 
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptxc3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
 
VOLUMEN 1 COLECCION PRODUCCION BOVINA . SERIE SANIDAD ANIMAL
VOLUMEN 1 COLECCION PRODUCCION BOVINA . SERIE SANIDAD ANIMALVOLUMEN 1 COLECCION PRODUCCION BOVINA . SERIE SANIDAD ANIMAL
VOLUMEN 1 COLECCION PRODUCCION BOVINA . SERIE SANIDAD ANIMAL
 
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdfLA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
 
Tarea 5-Selección de herramientas digitales-Carol Eraso.pdf
Tarea 5-Selección de herramientas digitales-Carol Eraso.pdfTarea 5-Selección de herramientas digitales-Carol Eraso.pdf
Tarea 5-Selección de herramientas digitales-Carol Eraso.pdf
 
Unidad II Doctrina de la Iglesia 1 parte
Unidad II Doctrina de la Iglesia 1 parteUnidad II Doctrina de la Iglesia 1 parte
Unidad II Doctrina de la Iglesia 1 parte
 
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptxPresentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
Presentación de Estrategias de Enseñanza-Aprendizaje Virtual.pptx
 
DIA INTERNACIONAL DAS FLORESTAS .
DIA INTERNACIONAL DAS FLORESTAS         .DIA INTERNACIONAL DAS FLORESTAS         .
DIA INTERNACIONAL DAS FLORESTAS .
 
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxPPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
 
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).pptPINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
 
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptxSINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
SINTAXIS DE LA ORACIÓN SIMPLE 2023-2024.pptx
 
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptxLINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
 
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
 

Crea una página web en 40 pasos

  • 2. INDICEINDICE 11.. NTRODUCCIÓNNTRODUCCIÓN 2. ¿QUÉ ES NECESARIO PARA ELABORAR UNA PÁGINA WEB?2. ¿QUÉ ES NECESARIO PARA ELABORAR UNA PÁGINA WEB?  ORDENADORORDENADOR  MÓDEMMÓDEM  INTENETINTENET  PÁGINA WEBPÁGINA WEB  HTMLHTML  FRONTPAGEFRONTPAGE  ELEMENTOS DE LA PÁGINAELEMENTOS DE LA PÁGINA WEBWEB  WWWWWW  DOCUMENTO DE HIPERTEXTODOCUMENTO DE HIPERTEXTO  DIRECCIÓN URLDIRECCIÓN URL  MARCOS (FRAMES)MARCOS (FRAMES)  OPERACIONES DESDE LA BARRA DE HERRAMIENTAOPERACIONES DESDE LA BARRA DE HERRAMIENTA  CRITERIOS PARA LA ELABORACIÓN DE PÁGINASCRITERIOS PARA LA ELABORACIÓN DE PÁGINAS WEBWEB 3. PRESENTADO POR:3. PRESENTADO POR:
  • 3. INTRODUCCIÓN Las páginas Web se crean utilizando el lenguaje de Marcas Hipertexto (HTML) Este lenguaje es un conjunto de instrucciones que se insertan en un editor de texto convencional. Se pueden crear páginas Web utilizando programas especiales denominados “editores Web”
  • 4. ORDENADORESORDENADORES Ordenador MARK I (1944 por Howard Aitken)Ordenador MARK I (1944 por Howard Aitken) Ordenador ENIAC (1945 por el Ministerio de Defensa de loOrdenador ENIAC (1945 por el Ministerio de Defensa de lo EE.UUEE.UU
  • 5. Ordenador 286 (Princicipios de los 80)Ordenador 286 (Princicipios de los 80) Ordenador portatilOrdenador portatil Ordenador Multimedia (actual)Ordenador Multimedia (actual)
  • 6. MÓDEM:MÓDEM: El módem es un dispositivo que permite aEl módem es un dispositivo que permite a través de la línea telefónica, intercambiar informacióntravés de la línea telefónica, intercambiar información entre ordenadores.entre ordenadores. El módem se puede clasificar en:El módem se puede clasificar en:  Interno:Interno: se colocan en el interior de la carcasa quese colocan en el interior de la carcasa que contiene el ordenadorcontiene el ordenador  Externo:Externo: se sitúa fuera de ella y por tanto es necesariose sitúa fuera de ella y por tanto es necesario conectarlo a un puerto de comunicación.conectarlo a un puerto de comunicación.
  • 7.  INTERNET:INTERNET: Es una red mundial de redes deEs una red mundial de redes de ordenadores que permiten a éstos aordenadores que permiten a éstos a comunicarse y compartir información. No escomunicarse y compartir información. No es una red “típica” de ordenadores, sino una reduna red “típica” de ordenadores, sino una red de redes, donde cada una de ellas esde redes, donde cada una de ellas es independiente y autónomaindependiente y autónoma
  • 8. Se puede hacer de dos formas:Se puede hacer de dos formas:  HTMLHTML: Simplemente es un fichero de texto que se: Simplemente es un fichero de texto que se desea mostrar en la pantalla. Además deberádesea mostrar en la pantalla. Además deberá introducir ciertosintroducir ciertos comandoscomandos oo etiquetasetiquetas para quepara que visualice el documento en la pantalla.visualice el documento en la pantalla. EstosEstos comandos o etiquetascomandos o etiquetas son:son: • Etiquetas se escriben cerradas entre los símbolosEtiquetas se escriben cerradas entre los símbolos “<“< y>y> • Las ordenes finalizan con un etiqueta (de cierre) queLas ordenes finalizan con un etiqueta (de cierre) que incorpora la barraincorpora la barra “/”“/”
  • 10. En cuanto a su estructura esta dividido enEn cuanto a su estructura esta dividido en una serie de bloque:una serie de bloque: 1) <HTML> y </HTML>1) <HTML> y </HTML> 2) <HEAD> y </HEAD>2) <HEAD> y </HEAD> 3) <BODY> y </BODY>3) <BODY> y </BODY>
  • 11. Ejemplo de un documento HTMLEjemplo de un documento HTML
  • 12. Front page: es la herramienta de la suiteFront page: es la herramienta de la suite Internet Explorer para crear páginas Web.Internet Explorer para crear páginas Web. La creación de documentos de hipertextoLa creación de documentos de hipertexto es similar a cualquier documento en loses similar a cualquier documento en los que aparecen en los procesadoresque aparecen en los procesadores habituales.habituales. Para abrir este documento es muy simple:Para abrir este documento es muy simple: Inicio / Programa / FrontPage ExpressInicio / Programa / FrontPage Express
  • 14.  Los elementos queLos elementos que componen la página Webcomponen la página Web  WWW:WWW: conocida como W3 o Web proviene de laconocida como W3 o Web proviene de la palabra World Wide Web que se puedepalabra World Wide Web que se puede traducirse como trama mundialtraducirse como trama mundial  Documento de hipertexto:Documento de hipertexto: es una combinaciónes una combinación de texto, imágenes, elementos multimedia ende texto, imágenes, elementos multimedia en general y, lo más importante, hiperenlaces ogeneral y, lo más importante, hiperenlaces o también llamadas hipervínculos, vínculos otambién llamadas hipervínculos, vínculos o enlaces.enlaces.
  • 15. Característica de los hiperenlacesCaracterística de los hiperenlaces o Palabras o frases destacadas enPalabras o frases destacadas en distintos color o subrayadas, tambiéndistintos color o subrayadas, también puede ser gráficospuede ser gráficos o Documentos que pueden estarDocumentos que pueden estar situados en el mismo ordenador u otrosituados en el mismo ordenador u otro de cualquier parte del mundode cualquier parte del mundo o Cuando se hace clic sobre uno de ellosCuando se hace clic sobre uno de ellos y aparece en la pantalla el documentoy aparece en la pantalla el documento que hacia referencia,que hacia referencia,
  • 17.  Dirección URL:Dirección URL: la forma de escribir lasla forma de escribir las direcciones de los distintos servicios Internet.direcciones de los distintos servicios Internet. La estructura de una dirección URL, seLa estructura de una dirección URL, se compone de tres partes:compone de tres partes: http://http://www.anayamultimedia.eswww.anayamultimedia.es/catalogo/index.htm/catalogo/index.htm Metodo de Acceso Dirección del ordenador Es opcional
  • 18.  Marco (Frame):Marco (Frame): esta subdividas en áreasesta subdividas en áreas rectangulares o ventanas, cada una de lasrectangulares o ventanas, cada una de las cuales contiene un documento de hipertextocuales contiene un documento de hipertexto independiente de los demás.independiente de los demás.
  • 19.  Operaciones desde la barra deOperaciones desde la barra de herramienta estándar:herramienta estándar: contiene todos loscontiene todos los botones que permiten efectuar,botones que permiten efectuar, rápidamente, las operaciones habitualesrápidamente, las operaciones habituales en navegación.en navegación.
  • 20.  Criterios para laCriterios para la elaboración de páginas Webelaboración de páginas Web  Criterios generalesCriterios generales 1.1. Elegir los fondosElegir los fondos 2.2. Dejar claro el conjunto de sitio de la páginaDejar claro el conjunto de sitio de la página abierta y como se puede llegar a otros lugares.abierta y como se puede llegar a otros lugares. Indicar:Indicar: a) dónde estaa) dónde esta b) cómo llegar al lugarb) cómo llegar al lugar c) Confirmación de que se está en el buenc) Confirmación de que se está en el buen caminocamino 3.3. Cuidar la página inicialCuidar la página inicial 4.4. Diseñar la página con una información claraDiseñar la página con una información clara 5.5. Facilitar herramientas para imprimir el texto oFacilitar herramientas para imprimir el texto o guardarlo en la Web con facilidadguardarlo en la Web con facilidad 6.6. Fechar las páginas. Facilita su actualizaciónFechar las páginas. Facilita su actualización
  • 21. AVILÉS MARTÍN, Raúl CALDERÓN TORRES, Mª del Mar GARCÍA BALLESTERO, Jesús DavidGALLARDO LARA, Elena RODRÍGUEZ ARROYO, Mª Juana SANCHEZ ESPINOSA, Roberto 3º ED. Primaria NNTT