SlideShare una empresa de Scribd logo
1 de 5
Descargar para leer sin conexión
TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 1 de 5
1. FUNCIONAMIENTO DE LA WEB
La World Wide Web (WWW), comúnmente conocida como la web, se
compone de un sistema de páginas web o sitios web, compuestas a su vez de
documentos relacionados entre sí mediante hipervínculos que permiten así su
localización y acceso. Los documentos que constituyen un sitio web son archivos
organizados en carpetas, que contienen texto, fotografías, botones, iconos,
animaciones, hipervínculos, multimedia, gráficos, tablas, etc.
TÉRMINOS ASOCIADOS A INTERNET
Servidor web: ordenador remoto que tiene
instalados los programas necesarios para
enviar los documentos requeridos por un
ordenador cliente.
Cliente: ordenador conectado a Internet que
realiza la petición de documentos incluidos en
una página web para visualizarlos mediante
programas navegadores.
Navegador web: software instalado en el ordenador del cliente
que se encarga de comunicar el ordenador cliente con los servidores que albergan las
páginas web, descargar las páginas y mostrarlas en nuestro equipo visualizando
los documentos en formato web (HTML) y permitiendo el funcionamiento de
los hiperenlaces. Los navegadores más utilizados son Internet Explorer,
Google Chrome, Opera, Safari, Mozilla Firefox y Netscape.
URL: dirección textual de un servidor web determinado.
IP: código identificativo de un equipo informático o servidor en Internet, formado por cuatro
números, separados por puntos, cuyo valor no puede exceder de 255.
TEMA Nº 6
Diseño de páginas web.
I.E.S. Cruz Santa
2º Bachillerato
Criterios de Evaluación
8. Elaborar y publicar información en Internet con la calidad requerida.
Este criterio pretende determinar la capacidad de los alumnos y alumnas para crear páginas web tanto en entornos
a base de asistentes, configurando gestores de contenidos, o mediante aplicaciones específicas para su diseño, y
publicarlas en un alojamiento web. Todo ello con el nivel de calidad de diseño y contenido que se especifique.
TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 2 de 5
DNS: base de datos que relaciona una dirección textual de un servidor (URL) con su dirección IP.
Esta base de datos se encuentra en unos servidores de dominios que deben ser especificados en
nuestra conexión a Internet.
HTTP: Protocolo de transferencia de hipertexto. Al encabezar una URL con este término, el
servidor reconocerá que se le está solicitando un documento web.
HTML: acrónimo inglés del término Hipertext Markup Language, que se traduce como “Lenguaje
de marcado de hipertextos”. Los archivos creados en este formato tienen extensiones .html o .htm.
Funcionamiento de la web: el sistema de visualización de documentos en la World Wide
Web sigue los siguientes pasos:
o Paso 1. Desde nuestro ordenador ejecutamos el programa navegador de Internet y escribimos
la dirección de una página web. La dirección que insertamos es la URL (por ejemplo, tecleamos
la dirección http://www.google.es/).
o Paso 2. El servidor DNS que tenemos configurado en nuestra conexión a Internet localiza la
dirección IP que corresponde con el ordenador servidor donde se encuentran los archivos web
requeridos.
o Paso 3. Como la URL que hemos tecleado comienza por http://, el ordenador servidor reconoce
que le estamos solicitando algún documento web y nos envía un documento con extensión html.
Si en la dirección URL no se especifica un documento html concreto, el servidor buscará en la
carpeta de la web y nos enviará por defecto el archivo denominado Index.html.
o Paso 4. Nuestro navegador estudia el documento html recibido y solicita al servidor los
archivos con los que esté enlazado, como imágenes.
o Paso 5. Finalmente, nuestro programa navegador compone la página con los textos, enlaces,
imágenes y animaciones. Es importante que al elaborar una página web comprobemos que se
visualiza correctamente en los distintos navegadores, ya que la página está compuesta por ellos
y puede ocurrir que no se visualice de igual manera en todos.
2. PÁGINAS WEB.
Lo que habitualmente llamamos página web es un sitio web (website) constituido por distintos documentos
enlazados entre sí a los que se accede a través de una dirección común. Los documentos que constituyen un sitio web
son archivos, organizados en carpetas, que contienen texto, fotografías, botones, iconos, animaciones, hipervínculos,
multimedia, gráficos, tablas, etc., y que se han creado para ser vistos por usuarios con ordenadores y navegadores de
distintas características.
El lenguaje que se usa para crear los documentos que
conforman el sitio web es el HTML (hipertext markup language,
lenguaje de marcas hipertextuales). Una página web se puede crear
(ya que se puede optar por otros métodos como utilizar los editores
WYSIWYG o gestores online), directamente escribiendo en este
código en cualquier editor de textos y guardándolo con la extensión
.html o .htm.
TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 3 de 5
Las páginas web se clasifican en estáticas y dinámicas:
 Estáticas. Son aquellas que no cambian, que muestran siempre el mismo contenido cada vez que las
cargamos. Se realizan en lenguaje HTML.
 Dinámicas. Son páginas interpretadas por el servidor de forma que, sin realizar cambios en el código,
devolverán diferentes resultados en función de la actuación del usuario. Por ejemplo, un buscador es una
página web dinámica que devuelve diferentes resultados según la petición del usuario. Se realizan
combinando HTML con lenguajes dinámicos (considerados lenguajes de programación), como ASP,
ASP.NET (Active Server Pages), JAVA, PHP o JavaScript.
3. PLANIFICACIÓN. OBJETIVOS. ELEMENTOS DE UNA WEB.
El primer paso para diseñar una web es la fase que podemos llamar prediseño.
Debemos analizar qué objetivos queremos conseguir con nuestra web y
posteriormente construirla según la planificación marcada para que se cumplan esos
objetivos.
A grandes rasgos, debemos preguntarnos:
1. Objetivo ¿Qué se pretende conseguir con la web?
2. Público ¿A quién se dirige?
3. Contenidos ¿Qué contenidos se quieren mostrar?
4. Directrices ¿Qué especificaciones se usarán en cuanto a forma, organización y
estructura?
5. Tecnología ¿Con qué medios técnicos se cuenta para realizarla?
6. Tiempo ¿De cuánto tiempo se dispone?
7. Presupuesto ¿De cuánto dinero se dispone?
De modo que, en esta etapa debemos escribir nuestros objetivos, recopilar y organizar contenidos, escribir
las directrices de organización y diseño y establecer un código de colores para los distintos elementos.
Debemos también:
 Crear una jerarquía visual clara en cada página.
 Utilizar las convenciones (lo que se usa de forma general y mayoritaria en las páginas web).
 Dividir las páginas en áreas claramente definidas.
 Facilitar el acceso a los enlaces.
 Omitir contenidos innecesarios, es decir, simplificar.
TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 4 de 5
Una web tipo tendrá, generalmente, los siguientes elementos y dispuestos según el esquema que se muestra
a continuación:
ENCABEZAMIENTO
MARCA O
LOGOTIPO
TITULAR
MENÚ DE
NAVEGACIÓN
CONTENIDOS (texto, fotografías, botones, iconos, animaciones,
hipervínculos, multimedia, gráficos, tablas, etc.
PIE DE PÁGINA
4. ELEMENTOS DE DISEÑO
A la hora de diseñar una web hay que atender a cuestiones tan elementales como el contraste del texto con el fondo,
el tamaño de los caracteres o la elección de los colores. Cuestiones que, evidentemente, dependen del gusto del
diseñador pero que hay que cuidar y analizar. Cuando un visitante llega a una página, no debería hacerse preguntas
como “¿dónde estoy?”, “¿por dónde empiezo?”,”¿qué es esto?”, “¿dónde está lo que busco?”,…
En esta fase entran en juego dos conceptos:
Maquetación: se encarga de organizar espacios y contenidos escritos, visuales y audiovisuales. Abarca los
aspectos semánticos y formales de una aplicación digital (tipografía, el punto, la línea, la forma, el color, fotografías,
símbolos, iconos...).
Interfaz: es el conjunto de comandos y métodos que facilitan la interacción entre el usuario y el sistema (el
sitio web).
TIC – 2º Bachilllerato Diseño Páginas Web. HTML.
Página 5 de 5
5. ACCESIBILIDAD
Los Criterios de Accesibilidad surgen de un compromiso que se adopta para que los
sitios web cumplan unas normas que les permitan ser visitados y utilizados por el mayor
número posible de personas, minimizando el efecto de las limitaciones físicas y técnicas
de los posibles visitantes.
Estos Criterios están recogidos por el Wold Wide Web Consortium (W3C). La WAI
(web accessibility initiative) es una rama del W3C que establece niveles de accesibilidad
(A, AA y AAA) para las webs en función del grado de cumplimiento de dichos criterios,
desde los más básicos hasta los más exigentes.
La adopción de criterios de accesibilidad a la hora de diseñar una web, no sólo intentar conseguir aumentar el
número de visitantes, sino también, reducir el tiempo de carga de la página o disminuir el número de errores. Algunas
acciones que se pueden llevar a cabo para aumentar el nivel de accesibilidad son:
Utilizar hojas de estilo.
Asegurarse de que la página se ve bien en distintos navegadores.
Usar las etiquetas de texto alternativo para describir la función de los elementos visuales.
Facilitar la trascripción de los ficheros de sonido y la descripción de los vídeos.
Organizar las páginas usando encabezados, listas y una estructura consistente.
Realizar tablas de manera que se puedan leer línea a línea.
Revisar y validar el código HTML.

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Juan sebastian
Juan sebastianJuan sebastian
Juan sebastian
 
4 ta bitacor aa
4 ta bitacor aa4 ta bitacor aa
4 ta bitacor aa
 
Jhohan nicolai
Jhohan nicolaiJhohan nicolai
Jhohan nicolai
 
Bitacora de la unidad 4
Bitacora de la unidad 4Bitacora de la unidad 4
Bitacora de la unidad 4
 
Bitacora william
Bitacora williamBitacora william
Bitacora william
 
Jheison urbano
Jheison urbanoJheison urbano
Jheison urbano
 
Fundamentos de Desarrollo Web
Fundamentos de Desarrollo Web Fundamentos de Desarrollo Web
Fundamentos de Desarrollo Web
 
Páginas web
Páginas webPáginas web
Páginas web
 
Caracteristicas de las Web
Caracteristicas de las WebCaracteristicas de las Web
Caracteristicas de las Web
 
Presentacion de informatica
Presentacion de informaticaPresentacion de informatica
Presentacion de informatica
 
paginas web
paginas web paginas web
paginas web
 
ACTIVIDAD UNO
ACTIVIDAD UNO ACTIVIDAD UNO
ACTIVIDAD UNO
 
PAGINA WEB
PAGINA WEBPAGINA WEB
PAGINA 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
 
Arquitectura- Programacion WEB
Arquitectura- Programacion WEBArquitectura- Programacion WEB
Arquitectura- Programacion WEB
 
Paginas Web Blogs Foros
Paginas Web Blogs ForosPaginas Web Blogs Foros
Paginas Web Blogs Foros
 
Recursos página web 2.0
Recursos página web 2.0Recursos página web 2.0
Recursos página web 2.0
 
HTML
HTMLHTML
HTML
 
Tecnologias de desarrollo web
Tecnologias de desarrollo webTecnologias de desarrollo web
Tecnologias de desarrollo web
 
Presentación evolución de la web 10-05
Presentación evolución de la web 10-05Presentación evolución de la web 10-05
Presentación evolución de la web 10-05
 

Destacado

Unidad Didactica
Unidad DidacticaUnidad Didactica
Unidad DidacticaCabra94
 
Postais Páscoa 2011 ESCM
Postais Páscoa 2011 ESCMPostais Páscoa 2011 ESCM
Postais Páscoa 2011 ESCMESCM
 
Trabajo grupal,,
Trabajo grupal,,Trabajo grupal,,
Trabajo grupal,,Galoxavier
 
Casa d'Eulàlia Ollé- Ruta Modernista de Sant Feliu de Llobregat
Casa d'Eulàlia Ollé- Ruta Modernista de Sant Feliu de LlobregatCasa d'Eulàlia Ollé- Ruta Modernista de Sant Feliu de Llobregat
Casa d'Eulàlia Ollé- Ruta Modernista de Sant Feliu de LlobregatNOSENSENAME96
 
Comecio electronico en latinoamerica
Comecio electronico en latinoamericaComecio electronico en latinoamerica
Comecio electronico en latinoamericaAna Guioth
 
La lata de conservas M.
La lata de conservas M.La lata de conservas M.
La lata de conservas M.Isabel Lozano
 
Maria Eduarda
Maria EduardaMaria Eduarda
Maria Eduardaaurea100
 
Divorcio proyecto final op
Divorcio proyecto final opDivorcio proyecto final op
Divorcio proyecto final opPepe Guzman
 

Destacado (10)

Unidad Didactica
Unidad DidacticaUnidad Didactica
Unidad Didactica
 
Postais Páscoa 2011 ESCM
Postais Páscoa 2011 ESCMPostais Páscoa 2011 ESCM
Postais Páscoa 2011 ESCM
 
Trabajo grupal,,
Trabajo grupal,,Trabajo grupal,,
Trabajo grupal,,
 
Casa d'Eulàlia Ollé- Ruta Modernista de Sant Feliu de Llobregat
Casa d'Eulàlia Ollé- Ruta Modernista de Sant Feliu de LlobregatCasa d'Eulàlia Ollé- Ruta Modernista de Sant Feliu de Llobregat
Casa d'Eulàlia Ollé- Ruta Modernista de Sant Feliu de Llobregat
 
Ercros
ErcrosErcros
Ercros
 
Comecio electronico en latinoamerica
Comecio electronico en latinoamericaComecio electronico en latinoamerica
Comecio electronico en latinoamerica
 
La lata de conservas M.
La lata de conservas M.La lata de conservas M.
La lata de conservas M.
 
Maria Eduarda
Maria EduardaMaria Eduarda
Maria Eduarda
 
Divorcio proyecto final op
Divorcio proyecto final opDivorcio proyecto final op
Divorcio proyecto final op
 
Presentación11
Presentación11Presentación11
Presentación11
 

Similar a APUNTES

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
 
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
 
Tics 4º eso bloque 5 publicacion y difusión de contenidos. ed donostiarra
Tics 4º eso bloque 5 publicacion y difusión de contenidos. ed donostiarraTics 4º eso bloque 5 publicacion y difusión de contenidos. ed donostiarra
Tics 4º eso bloque 5 publicacion y difusión de contenidos. ed donostiarrablogjuan2012
 
Que es una web !!!!
Que es una web !!!!Que es una web !!!!
Que es una web !!!!YOGHANS5
 
Que es una pagina web
Que es una pagina  webQue es una pagina  web
Que es una pagina webjorge0608
 
Introducción Diseño Web
Introducción Diseño WebIntroducción Diseño Web
Introducción Diseño WebVladimir
 
Publicacion de contenidos web
Publicacion de contenidos webPublicacion de contenidos web
Publicacion de contenidos webjoseanymonica
 
Publicacion de contenidos webs
Publicacion de contenidos websPublicacion de contenidos webs
Publicacion de contenidos websjoseanymonica
 
Arquitectura web 2
Arquitectura web 2Arquitectura web 2
Arquitectura web 2vekerly
 
Silvana castellanos 10 4
Silvana castellanos 10 4Silvana castellanos 10 4
Silvana castellanos 10 4castellanossl
 

Similar a APUNTES (20)

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
 
Publicación de contenidos en Web
Publicación de contenidos en Web Publicación de contenidos en Web
Publicación de contenidos en Web
 
Diseño de paginas y buscadores
Diseño de paginas y buscadores Diseño de paginas y buscadores
Diseño de paginas y buscadores
 
Tics 4º eso bloque 5 publicacion y difusión de contenidos. ed donostiarra
Tics 4º eso bloque 5 publicacion y difusión de contenidos. ed donostiarraTics 4º eso bloque 5 publicacion y difusión de contenidos. ed donostiarra
Tics 4º eso bloque 5 publicacion y difusión de contenidos. ed donostiarra
 
Que es una web !!!!
Que es una web !!!!Que es una web !!!!
Que es una web !!!!
 
Que es una pagina web
Que es una pagina  webQue es una pagina  web
Que es una pagina web
 
Introducción Diseño Web
Introducción Diseño WebIntroducción Diseño Web
Introducción Diseño Web
 
Presentacion herramientas
Presentacion herramientasPresentacion herramientas
Presentacion herramientas
 
Tercera evaluacion
Tercera evaluacionTercera evaluacion
Tercera evaluacion
 
Publicacion de contenidos web
Publicacion de contenidos webPublicacion de contenidos web
Publicacion de contenidos web
 
Publicacion de contenidos webs
Publicacion de contenidos websPublicacion de contenidos webs
Publicacion de contenidos webs
 
Recursos Web 2.0
Recursos Web 2.0Recursos Web 2.0
Recursos Web 2.0
 
Dinamicas
DinamicasDinamicas
Dinamicas
 
Unidad II
Unidad IIUnidad II
Unidad II
 
Pagina web
Pagina webPagina web
Pagina web
 
paginas web
paginas web paginas web
paginas web
 
Creación de pagina web
Creación de pagina webCreación de pagina web
Creación de pagina web
 
Dinamicas
DinamicasDinamicas
Dinamicas
 
Arquitectura web 2
Arquitectura web 2Arquitectura web 2
Arquitectura web 2
 
Silvana castellanos 10 4
Silvana castellanos 10 4Silvana castellanos 10 4
Silvana castellanos 10 4
 

Último

5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.docGLADYSPASTOR
 
explicacionsobrelasemanasanta-190411100653.ppt
explicacionsobrelasemanasanta-190411100653.pptexplicacionsobrelasemanasanta-190411100653.ppt
explicacionsobrelasemanasanta-190411100653.pptjosemanuelcremades
 
EL BRILLO DEL ECLIPSE (CUENTO LITERARIO). Autor y diseñador JAVIER SOLIS NOYOLA
EL BRILLO DEL ECLIPSE (CUENTO LITERARIO). Autor y diseñador JAVIER SOLIS NOYOLAEL BRILLO DEL ECLIPSE (CUENTO LITERARIO). Autor y diseñador JAVIER SOLIS NOYOLA
EL BRILLO DEL ECLIPSE (CUENTO LITERARIO). Autor y diseñador JAVIER SOLIS NOYOLAJAVIER SOLIS NOYOLA
 
plan espacios inspiradores para nivel primaria
plan espacios inspiradores para nivel primariaplan espacios inspiradores para nivel primaria
plan espacios inspiradores para nivel primariaElizabeth252489
 
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didácticaLa poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didácticaIGNACIO BALLESTER PARDO
 
Tema 4 Rocas sedimentarias, características y clasificación
Tema 4 Rocas sedimentarias, características y clasificaciónTema 4 Rocas sedimentarias, características y clasificación
Tema 4 Rocas sedimentarias, características y clasificaciónIES Vicent Andres Estelles
 
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍAPROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍAJoaqunSolrzano
 
Escrito administrativo técnico y comerciales
Escrito administrativo técnico y comercialesEscrito administrativo técnico y comerciales
Escrito administrativo técnico y comercialesmelanieteresacontrer
 
La Congregación de Jesús y María, conocida también como los Eudistas, fue fun...
La Congregación de Jesús y María, conocida también como los Eudistas, fue fun...La Congregación de Jesús y María, conocida también como los Eudistas, fue fun...
La Congregación de Jesús y María, conocida también como los Eudistas, fue fun...Unidad de Espiritualidad Eudista
 
U2_EA2_descargable TICS PRESENCIAL 2.pdf
U2_EA2_descargable TICS PRESENCIAL 2.pdfU2_EA2_descargable TICS PRESENCIAL 2.pdf
U2_EA2_descargable TICS PRESENCIAL 2.pdfJavier Correa
 
Adoración sin fin al Dios Creador por sus bendiciones
Adoración sin fin al Dios Creador por sus bendicionesAdoración sin fin al Dios Creador por sus bendiciones
Adoración sin fin al Dios Creador por sus bendicionesAlejandrino Halire Ccahuana
 
Presentación del tema: tecnología educativa
Presentación del tema: tecnología educativaPresentación del tema: tecnología educativa
Presentación del tema: tecnología educativaricardoruizaleman
 
sociales ciencias segundo trimestre tercero
sociales ciencias segundo trimestre tercerosociales ciencias segundo trimestre tercero
sociales ciencias segundo trimestre terceroCEIP TIERRA DE PINARES
 
CIENCIAS SOCIALES SEGUNDO TRIMESTRE TERCERO
CIENCIAS SOCIALES SEGUNDO TRIMESTRE TERCEROCIENCIAS SOCIALES SEGUNDO TRIMESTRE TERCERO
CIENCIAS SOCIALES SEGUNDO TRIMESTRE TERCEROCEIP TIERRA DE PINARES
 
U2_EA1_descargable TIC 2 SEM VIR PRE.pdf
U2_EA1_descargable TIC 2 SEM VIR PRE.pdfU2_EA1_descargable TIC 2 SEM VIR PRE.pdf
U2_EA1_descargable TIC 2 SEM VIR PRE.pdfJavier Correa
 
UNIDAD DE APRENDIZAJE MARZO 2024.docx para educacion
UNIDAD DE APRENDIZAJE MARZO 2024.docx para educacionUNIDAD DE APRENDIZAJE MARZO 2024.docx para educacion
UNIDAD DE APRENDIZAJE MARZO 2024.docx para educacionCarolVigo1
 
Presentación: Actividad de Diálogos adolescentes.pptx
Presentación: Actividad de  Diálogos adolescentes.pptxPresentación: Actividad de  Diálogos adolescentes.pptx
Presentación: Actividad de Diálogos adolescentes.pptxNabel Paulino Guerra Huaranca
 
Los escritos administrativos, técnicos y comerciales
Los escritos administrativos, técnicos y comercialesLos escritos administrativos, técnicos y comerciales
Los escritos administrativos, técnicos y comercialeshanda210618
 

Último (20)

5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
 
explicacionsobrelasemanasanta-190411100653.ppt
explicacionsobrelasemanasanta-190411100653.pptexplicacionsobrelasemanasanta-190411100653.ppt
explicacionsobrelasemanasanta-190411100653.ppt
 
EL BRILLO DEL ECLIPSE (CUENTO LITERARIO). Autor y diseñador JAVIER SOLIS NOYOLA
EL BRILLO DEL ECLIPSE (CUENTO LITERARIO). Autor y diseñador JAVIER SOLIS NOYOLAEL BRILLO DEL ECLIPSE (CUENTO LITERARIO). Autor y diseñador JAVIER SOLIS NOYOLA
EL BRILLO DEL ECLIPSE (CUENTO LITERARIO). Autor y diseñador JAVIER SOLIS NOYOLA
 
plan espacios inspiradores para nivel primaria
plan espacios inspiradores para nivel primariaplan espacios inspiradores para nivel primaria
plan espacios inspiradores para nivel primaria
 
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didácticaLa poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
 
Tema 4 Rocas sedimentarias, características y clasificación
Tema 4 Rocas sedimentarias, características y clasificaciónTema 4 Rocas sedimentarias, características y clasificación
Tema 4 Rocas sedimentarias, características y clasificación
 
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍAPROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
 
Escrito administrativo técnico y comerciales
Escrito administrativo técnico y comercialesEscrito administrativo técnico y comerciales
Escrito administrativo técnico y comerciales
 
Power Point E. Sab: Adoración sin fin...
Power Point E. Sab: Adoración sin fin...Power Point E. Sab: Adoración sin fin...
Power Point E. Sab: Adoración sin fin...
 
La Congregación de Jesús y María, conocida también como los Eudistas, fue fun...
La Congregación de Jesús y María, conocida también como los Eudistas, fue fun...La Congregación de Jesús y María, conocida también como los Eudistas, fue fun...
La Congregación de Jesús y María, conocida también como los Eudistas, fue fun...
 
U2_EA2_descargable TICS PRESENCIAL 2.pdf
U2_EA2_descargable TICS PRESENCIAL 2.pdfU2_EA2_descargable TICS PRESENCIAL 2.pdf
U2_EA2_descargable TICS PRESENCIAL 2.pdf
 
Adoración sin fin al Dios Creador por sus bendiciones
Adoración sin fin al Dios Creador por sus bendicionesAdoración sin fin al Dios Creador por sus bendiciones
Adoración sin fin al Dios Creador por sus bendiciones
 
Presentación del tema: tecnología educativa
Presentación del tema: tecnología educativaPresentación del tema: tecnología educativa
Presentación del tema: tecnología educativa
 
Tema 6.- La identidad visual corporativa y el naming.pdf
Tema 6.- La identidad visual corporativa y el naming.pdfTema 6.- La identidad visual corporativa y el naming.pdf
Tema 6.- La identidad visual corporativa y el naming.pdf
 
sociales ciencias segundo trimestre tercero
sociales ciencias segundo trimestre tercerosociales ciencias segundo trimestre tercero
sociales ciencias segundo trimestre tercero
 
CIENCIAS SOCIALES SEGUNDO TRIMESTRE TERCERO
CIENCIAS SOCIALES SEGUNDO TRIMESTRE TERCEROCIENCIAS SOCIALES SEGUNDO TRIMESTRE TERCERO
CIENCIAS SOCIALES SEGUNDO TRIMESTRE TERCERO
 
U2_EA1_descargable TIC 2 SEM VIR PRE.pdf
U2_EA1_descargable TIC 2 SEM VIR PRE.pdfU2_EA1_descargable TIC 2 SEM VIR PRE.pdf
U2_EA1_descargable TIC 2 SEM VIR PRE.pdf
 
UNIDAD DE APRENDIZAJE MARZO 2024.docx para educacion
UNIDAD DE APRENDIZAJE MARZO 2024.docx para educacionUNIDAD DE APRENDIZAJE MARZO 2024.docx para educacion
UNIDAD DE APRENDIZAJE MARZO 2024.docx para educacion
 
Presentación: Actividad de Diálogos adolescentes.pptx
Presentación: Actividad de  Diálogos adolescentes.pptxPresentación: Actividad de  Diálogos adolescentes.pptx
Presentación: Actividad de Diálogos adolescentes.pptx
 
Los escritos administrativos, técnicos y comerciales
Los escritos administrativos, técnicos y comercialesLos escritos administrativos, técnicos y comerciales
Los escritos administrativos, técnicos y comerciales
 

APUNTES

  • 1. TIC – 2º Bachilllerato Diseño Páginas Web. HTML. Página 1 de 5 1. FUNCIONAMIENTO DE LA WEB La World Wide Web (WWW), comúnmente conocida como la web, se compone de un sistema de páginas web o sitios web, compuestas a su vez de documentos relacionados entre sí mediante hipervínculos que permiten así su localización y acceso. Los documentos que constituyen un sitio web son archivos organizados en carpetas, que contienen texto, fotografías, botones, iconos, animaciones, hipervínculos, multimedia, gráficos, tablas, etc. TÉRMINOS ASOCIADOS A INTERNET Servidor web: ordenador remoto que tiene instalados los programas necesarios para enviar los documentos requeridos por un ordenador cliente. Cliente: ordenador conectado a Internet que realiza la petición de documentos incluidos en una página web para visualizarlos mediante programas navegadores. Navegador web: software instalado en el ordenador del cliente que se encarga de comunicar el ordenador cliente con los servidores que albergan las páginas web, descargar las páginas y mostrarlas en nuestro equipo visualizando los documentos en formato web (HTML) y permitiendo el funcionamiento de los hiperenlaces. Los navegadores más utilizados son Internet Explorer, Google Chrome, Opera, Safari, Mozilla Firefox y Netscape. URL: dirección textual de un servidor web determinado. IP: código identificativo de un equipo informático o servidor en Internet, formado por cuatro números, separados por puntos, cuyo valor no puede exceder de 255. TEMA Nº 6 Diseño de páginas web. I.E.S. Cruz Santa 2º Bachillerato Criterios de Evaluación 8. Elaborar y publicar información en Internet con la calidad requerida. Este criterio pretende determinar la capacidad de los alumnos y alumnas para crear páginas web tanto en entornos a base de asistentes, configurando gestores de contenidos, o mediante aplicaciones específicas para su diseño, y publicarlas en un alojamiento web. Todo ello con el nivel de calidad de diseño y contenido que se especifique.
  • 2. TIC – 2º Bachilllerato Diseño Páginas Web. HTML. Página 2 de 5 DNS: base de datos que relaciona una dirección textual de un servidor (URL) con su dirección IP. Esta base de datos se encuentra en unos servidores de dominios que deben ser especificados en nuestra conexión a Internet. HTTP: Protocolo de transferencia de hipertexto. Al encabezar una URL con este término, el servidor reconocerá que se le está solicitando un documento web. HTML: acrónimo inglés del término Hipertext Markup Language, que se traduce como “Lenguaje de marcado de hipertextos”. Los archivos creados en este formato tienen extensiones .html o .htm. Funcionamiento de la web: el sistema de visualización de documentos en la World Wide Web sigue los siguientes pasos: o Paso 1. Desde nuestro ordenador ejecutamos el programa navegador de Internet y escribimos la dirección de una página web. La dirección que insertamos es la URL (por ejemplo, tecleamos la dirección http://www.google.es/). o Paso 2. El servidor DNS que tenemos configurado en nuestra conexión a Internet localiza la dirección IP que corresponde con el ordenador servidor donde se encuentran los archivos web requeridos. o Paso 3. Como la URL que hemos tecleado comienza por http://, el ordenador servidor reconoce que le estamos solicitando algún documento web y nos envía un documento con extensión html. Si en la dirección URL no se especifica un documento html concreto, el servidor buscará en la carpeta de la web y nos enviará por defecto el archivo denominado Index.html. o Paso 4. Nuestro navegador estudia el documento html recibido y solicita al servidor los archivos con los que esté enlazado, como imágenes. o Paso 5. Finalmente, nuestro programa navegador compone la página con los textos, enlaces, imágenes y animaciones. Es importante que al elaborar una página web comprobemos que se visualiza correctamente en los distintos navegadores, ya que la página está compuesta por ellos y puede ocurrir que no se visualice de igual manera en todos. 2. PÁGINAS WEB. Lo que habitualmente llamamos página web es un sitio web (website) constituido por distintos documentos enlazados entre sí a los que se accede a través de una dirección común. Los documentos que constituyen un sitio web son archivos, organizados en carpetas, que contienen texto, fotografías, botones, iconos, animaciones, hipervínculos, multimedia, gráficos, tablas, etc., y que se han creado para ser vistos por usuarios con ordenadores y navegadores de distintas características. El lenguaje que se usa para crear los documentos que conforman el sitio web es el HTML (hipertext markup language, lenguaje de marcas hipertextuales). Una página web se puede crear (ya que se puede optar por otros métodos como utilizar los editores WYSIWYG o gestores online), directamente escribiendo en este código en cualquier editor de textos y guardándolo con la extensión .html o .htm.
  • 3. TIC – 2º Bachilllerato Diseño Páginas Web. HTML. Página 3 de 5 Las páginas web se clasifican en estáticas y dinámicas:  Estáticas. Son aquellas que no cambian, que muestran siempre el mismo contenido cada vez que las cargamos. Se realizan en lenguaje HTML.  Dinámicas. Son páginas interpretadas por el servidor de forma que, sin realizar cambios en el código, devolverán diferentes resultados en función de la actuación del usuario. Por ejemplo, un buscador es una página web dinámica que devuelve diferentes resultados según la petición del usuario. Se realizan combinando HTML con lenguajes dinámicos (considerados lenguajes de programación), como ASP, ASP.NET (Active Server Pages), JAVA, PHP o JavaScript. 3. PLANIFICACIÓN. OBJETIVOS. ELEMENTOS DE UNA WEB. El primer paso para diseñar una web es la fase que podemos llamar prediseño. Debemos analizar qué objetivos queremos conseguir con nuestra web y posteriormente construirla según la planificación marcada para que se cumplan esos objetivos. A grandes rasgos, debemos preguntarnos: 1. Objetivo ¿Qué se pretende conseguir con la web? 2. Público ¿A quién se dirige? 3. Contenidos ¿Qué contenidos se quieren mostrar? 4. Directrices ¿Qué especificaciones se usarán en cuanto a forma, organización y estructura? 5. Tecnología ¿Con qué medios técnicos se cuenta para realizarla? 6. Tiempo ¿De cuánto tiempo se dispone? 7. Presupuesto ¿De cuánto dinero se dispone? De modo que, en esta etapa debemos escribir nuestros objetivos, recopilar y organizar contenidos, escribir las directrices de organización y diseño y establecer un código de colores para los distintos elementos. Debemos también:  Crear una jerarquía visual clara en cada página.  Utilizar las convenciones (lo que se usa de forma general y mayoritaria en las páginas web).  Dividir las páginas en áreas claramente definidas.  Facilitar el acceso a los enlaces.  Omitir contenidos innecesarios, es decir, simplificar.
  • 4. TIC – 2º Bachilllerato Diseño Páginas Web. HTML. Página 4 de 5 Una web tipo tendrá, generalmente, los siguientes elementos y dispuestos según el esquema que se muestra a continuación: ENCABEZAMIENTO MARCA O LOGOTIPO TITULAR MENÚ DE NAVEGACIÓN CONTENIDOS (texto, fotografías, botones, iconos, animaciones, hipervínculos, multimedia, gráficos, tablas, etc. PIE DE PÁGINA 4. ELEMENTOS DE DISEÑO A la hora de diseñar una web hay que atender a cuestiones tan elementales como el contraste del texto con el fondo, el tamaño de los caracteres o la elección de los colores. Cuestiones que, evidentemente, dependen del gusto del diseñador pero que hay que cuidar y analizar. Cuando un visitante llega a una página, no debería hacerse preguntas como “¿dónde estoy?”, “¿por dónde empiezo?”,”¿qué es esto?”, “¿dónde está lo que busco?”,… En esta fase entran en juego dos conceptos: Maquetación: se encarga de organizar espacios y contenidos escritos, visuales y audiovisuales. Abarca los aspectos semánticos y formales de una aplicación digital (tipografía, el punto, la línea, la forma, el color, fotografías, símbolos, iconos...). Interfaz: es el conjunto de comandos y métodos que facilitan la interacción entre el usuario y el sistema (el sitio web).
  • 5. TIC – 2º Bachilllerato Diseño Páginas Web. HTML. Página 5 de 5 5. ACCESIBILIDAD Los Criterios de Accesibilidad surgen de un compromiso que se adopta para que los sitios web cumplan unas normas que les permitan ser visitados y utilizados por el mayor número posible de personas, minimizando el efecto de las limitaciones físicas y técnicas de los posibles visitantes. Estos Criterios están recogidos por el Wold Wide Web Consortium (W3C). La WAI (web accessibility initiative) es una rama del W3C que establece niveles de accesibilidad (A, AA y AAA) para las webs en función del grado de cumplimiento de dichos criterios, desde los más básicos hasta los más exigentes. La adopción de criterios de accesibilidad a la hora de diseñar una web, no sólo intentar conseguir aumentar el número de visitantes, sino también, reducir el tiempo de carga de la página o disminuir el número de errores. Algunas acciones que se pueden llevar a cabo para aumentar el nivel de accesibilidad son: Utilizar hojas de estilo. Asegurarse de que la página se ve bien en distintos navegadores. Usar las etiquetas de texto alternativo para describir la función de los elementos visuales. Facilitar la trascripción de los ficheros de sonido y la descripción de los vídeos. Organizar las páginas usando encabezados, listas y una estructura consistente. Realizar tablas de manera que se puedan leer línea a línea. Revisar y validar el código HTML.