1. S.E.P. TECNOLÓGICO NACIONAL DE MÉXICO
INSTITUTO TECNOLÓGICO
de Tuxtepec
INFORME TÉCNICO DE RESIDENCIA
PROFESIONAL
PROYECTO:
“IMPLEMENTACIÓN DE UN PORTAL WEB
PARA EL BACHILLERATO TECNOLÓGICO
MOISES SÁENZ DE SAN JUAN BAUTISTA
TUXTEPEC OAXACA”
PRESENTAN
AGUILAR ORTIZ JULISSA 13350415
CÁLIZ RIVERA JESÚS E. 14350477
CASTILLO HERNÁNDEZ CARLOS E. 13350395
CRISTÓBAL JOAQUIN ALEJANDRO 13350289
GARCÍA CARRILLO JUAN CARLOS 14350260
SOLIS CASTRO NORA B. 14350476
VELASCO SANTIAGO SINDY J. 13350567
CARRERA:
INGENIERIA INFORMÁTICA
ASESOR:
L.I. MARÍA DE LOS ÁNGELES MARTÍNEZ
MORALES
MAYO / 2017.
2. Preliminares
ii
AGRADECIMIENTOS
Primeramente le doy gracias a Dios por acompañarme y guiarme cada día, por ser
mi fortaleza en los momentos de debilidad. Le doy gracias mi madre por ser la
persona que me ha apoyado en todo momento, por los valores que me ha inculcado.
Sobre todo por ser un excelente ejemplo de vida a seguir. A mis amigos, que gracias
al equipo que formamos logramos llegar hasta el final del camino. A mi profesora,
gracias por ayudarnos, por su paciencia y enseñanza. -Nora.
“Agradezco a mis amigos de equipo por darme la oportunidad de participar
en este proyecto, a la institución BATEMS por abrirnos las puertas, confiar en
nosotros y brindarnos su apoyo”. – CECH.
Agradezco a Dios estar con vida, viviendo este momento, a mi madre y
familia por su apoyo y guía, al equipo que formamos por unirnos pese a
las diferentes formas de ser, y por terminar agradeciendo a la guía de
la profesora que en la justa medida nos apoyó para terminar este ciclo.
– Julissa.
Agradezco a mis padres por el apoyo por cuidarme a mis hijos así facilitándome a reunirme
con mis compañeros y avanzar con este proyecto agradecer a mis compañeros de equipo
por qué gracias a ellos entre todos nos ayudamos a resolver dudas y por compartir una
experiencia muy bonita a la maestra por enseñarnos a cómo llevar a cabo este proyecto,
muchas gracias. –Sindy.
A MI PROFESORA MARIA DE LOS ANGELES MARTINEZ MORALES POR LA GRAN
AYUDA Y COLABORACION QUE NOS BRINDO PARA DAR CONSULTA Y SOPORTE EN
ESTE TRABAJO DE INVESTIGACION. A MIS PADRES Y NOVIA QUE CON SU GRAN
APOYO NO PODRIA REALIZAR ESTE TRABAJO, GRACIAS POR ESCUCHARME,
AGUANTARME Y ANIMARME A SEGUIR ADELANTE. GRACIAS NO SOLO POR ESTAR EN
LOS MOMENTOS BUENOS. –JUAN.
Para mi familia
Suponen los cimientos de mi desarrollo, todos y cada uno de ustedes, mi
pequeña familia: Reyna y Christian, pues se han tomado el tiempo y la
paciencia para enseñarme nuevas cosas y para brindarme
conocimientos que me servirán para toda la vida.
Para mi pareja
Nora, la ayuda que me has brindado ha sido sumamente importante,
estuviste a mi lado hasta en los momentos más difíciles, siempre
3. Preliminares
iii
apoyándome. Sin duda fue invaluable tu cariño y comprensión para
culminar con éste proyecto.
Me ayudaste incluso más de lo que pensé, muchas gracias, amor.
Para mis amigos
Los verdaderos amigos son aquellos que no te abandonan cuando las
cosas van por mal camino, te brindan su apoyo y no te traicionan de
ninguna manera. Les agradezco por todas sus excelentes ayudas y
aportes a éste proyecto.
Muchas gracias por ser así conmigo, nunca cambien. –Jesús E.
“Un proyecto de investigación, es un trabajo que no sólo es fruto del esfuerzo personal,
sino que necesita de la ayuda de muchas personas, tanto en lo profesional como en lo
personal. Con estas líneas quisiera mostrar mi agradecimiento a todas ellas”. -
Alejandro Cristóbal.
4. Preliminares
iv
RESUMEN
En la comunidad educativa Bachillerato Tecnológico Moisés Sáenz no contaban con
una herramienta que contribuya con la organización, por lo que en este proyecto como
finalidad es implementar un portal web para optimizar tiempo y procesos para los
estudiantes y docentes y así puedan hacer uso del mismo. Para la creación de la
página se utilizó Drupal como gestor de contenido, además la aplicación del Sistema
Académico de notas fue desarrollada en PHP y HTML con base de datos MYSQL bajo
un entorno web. Para llevarse a cabo el proyecto se utilizó la metodología para la
creación de sitios web que cuenta con fase de análisis, fase de planificación, que
software se utilizará, como será la estructura de navegación, la fase de contenido, fase
de diseño, fase de programación y la fase de testeo. Se hizo una selección de la
muestra en la que se utilizará la técnica de aleatoria simple en la cual se realizó por
tómbola que consiste en numerar todos los elementos muestrales de la población, los
números elegidos al azar conformará la muestra y los números obtenidos se verificaran
con los nombres y direcciones de nuestra lista, para precisar a los seleccionados que
serán participantes del estudio. La técnica a utilizar es la encuesta que permitirá
recopilar la información en la muestra de estudio y se elaborará un cuestionario para
considerar las variables determinadas, utilizando un conjunto sistematizado de
cuestiones que va dirigido a un grupo predeterminado de personas que nos permitirán
obtener la información relevante.
5. Preliminares
v
ÍNDICE DE CONTENIDO
Agradecimientos...........................................................................................................ii
Resumen.....................................................................................................................iv
Índice de contenido ......................................................................................................v
Índice de tablas ...........................................................................................................ix
Índice de figuras...........................................................................................................x
Introducción................................................................................................................. 1
II. Generalidades del proyecto..................................................................................... 3
1.1. Descripción del problema ................................................................................. 3
1.2. Planteamiento del problema ............................................................................. 4
1.3. Objetivos........................................................................................................... 6
1.3.1. Objetivo General ........................................................................................ 6
1.3.2. Objetivos específicos ................................................................................. 6
1.4. Hipótesis o supuestos....................................................................................... 7
1.5. Justificación ...................................................................................................... 8
II. Marco Teórico ....................................................................................................... 10
2.1. Antecedentes o marco histórico...................................................................... 10
2.1.1 Historia de la Web..................................................................................... 10
2.1.2 Historia breve de los Sitios Web................................................................ 11
2.1.3 Sitio Web................................................................................................... 12
2.1.4 Internet...................................................................................................... 13
2.1.5 World Wide Web. ...................................................................................... 14
2.1.6 Historia de los Servidores Web. ................................................................ 15
2.2. Marco conceptual ........................................................................................... 17
Identificación y operacionalización de las variables ........................................... 17
6. Preliminares
vi
2.3. Marco referencial ............................................................................................ 19
2.3.1 Conceptualización de los Sitios Web............................................................ 19
2.3.1.1 Que es un sitio web................................................................................ 19
2.3.1.2 Clasificación de Sitios Web. ................................................................... 19
2.3.1.3 Blogs. ..................................................................................................... 21
2.3.1.4 Sitios e-commerce.................................................................................. 21
2.3.1.5 Portal...................................................................................................... 21
2.3.2.1 Hypertext Markup Language. ................................................................. 22
2.3.2.2 Hypertext Transfer Protocol. .................................................................. 23
2.3.2.3 Uniform Resource Locutor. .................................................................... 24
2.3.2.4 Dominios. ............................................................................................... 25
2.3.2.5 Dominios Territoriales. ........................................................................... 26
2.3.2.6 Dominios Genéricos............................................................................... 27
2.3.2.7 Dominios Estatales................................................................................. 27
2.3.2 Lenguajes más Usuales para la Creación de un Sitio Web. ......................... 28
2.3.2.1 Lenguaje HTML...................................................................................... 28
2.3.2.2 Lenguaje JavaScript............................................................................... 30
2.3.2.3 Lenguaje PHP. ....................................................................................... 31
2.3.4 Elementos Básicos de un Sitio Web. ............................................................ 33
2.3.4.1 Elementos que componen una Página Web. ......................................... 34
2.3.5 Metodología para la creación de sitios web. ................................................. 38
2.3.5.1 Fase de Análisis..................................................................................... 38
2.3.5.2 Fase de Planificación. ............................................................................ 40
2.3.5.3 Fase de Contenido................................................................................. 47
2.3.5.4 Fase de Diseño. ..................................................................................... 48
7. Preliminares
vii
2.3.5.5 Fase de Programación........................................................................... 49
2.3.5.6 Fase de Testeo. ..................................................................................... 49
2.3.5.7 Fase de Mercado y Publicidad. .............................................................. 50
2.3.6 Sistemas Gestores de Contenido. ................................................................ 51
2.3.6.1 Características. ...................................................................................... 52
2.3.6.2 SGC comerciales. .................................................................................. 54
2.3.6.3 SGC gratuitos con licencia de código abierto......................................... 55
2.3.6.4 Drupal..................................................................................................... 58
2.3.7 MYSQL ......................................................................................................... 64
2.3.7.1 Comprensión de los Fundamentos de Mysql. ........................................ 65
2.3.7.2 Concepto de una Base de Datos............................................................ 65
2.3.7.3 Terminología sobre Bases de Datos. ..................................................... 66
2.3.7.4 Conexión a una Base de Datos.............................................................. 67
2.3.7.5 Creación y Uso de nuestra primera Base de Datos. .............................. 70
III. Metodología.......................................................................................................... 78
3.1. Población o universo/ muestra........................................................................ 78
Muestra probabilística ........................................................................................ 78
Muestra Estratificada.......................................................................................... 79
Selección de la muestra..................................................................................... 80
3.2. Tipo de estudio ............................................................................................... 81
3.3. Descripción del Instrumento ........................................................................... 82
3.4. Procedimiento de recolección......................................................................... 83
Fase 1. Fase de Planificación ............................................................................ 83
Fase 2. Análisis................................................................................................. 88
Fase 3. Contenido.............................................................................................. 89
8. Preliminares
viii
Fase 4. Diseño................................................................................................... 89
Fase 5. Programación........................................................................................ 90
Fase 6. Testeo ................................................................................................... 94
Fase 7. Mercado y Publicidad............................................................................ 94
3.5. Procedimiento de manejo estadístico de la información................................. 95
IV. Resultados obtenidos y discusión...................................................................... 101
V. Conclusiones y recomendaciones ...................................................................... 102
FUENTES DE INFORMACIÓN ............................................................................... 103
Anexos .................................................................................................................... 105
9. Preliminares
ix
ÍNDICE DE TABLAS
Tabla 1. Definición de variables ................................................................................ 17
Tabla 2. Tabla Product .............................................................................................. 66
Tabla 3. Tabla Invoice ............................................................................................... 66
10. Preliminares
x
ÍNDICE DE FIGURAS
Figura 1. Cliente/Servidor.......................................................................................... 16
Figura 2. Organización .............................................................................................. 34
Figura 3. Dominios .................................................................................................... 35
Figura 4. Estructura Lineal ........................................................................................ 44
Figura 5. Estructura Jerárquica ................................................................................. 45
Figura 6. Estructura Radial........................................................................................ 46
Figura 7. Estructura de Red ...................................................................................... 46
Figura 8. Nuestro equipo tiene instalado el Cliente y el Servidor de MYSQL............ 68
Figura 9. Nuestro equipo tiene instalado el cliente de MYSQL. El servidor MYSQL tiene
instalado en otro equipo al que se conecta el nuestro. ............................................. 68
Figura 10. En este caso la terminal puede ser cualquier equipo capaz de conectarse a
otro, ya que ni si quiera lleva instalado el cliente MYSQL......................................... 68
Figura 11. Momento en el que se asiste a la oficina de Administración para poder entrar
a las aulas a realizar la encuesta ............................................................................ 106
Figura 12. Entrega de cuestionario a personal administrativo................................. 107
Figura 13. Entrega de cuestionario a personal administrativo................................. 107
Figura 14. Breve explicación dada a los alumnos para que resuelvan el cuestionario
................................................................................................................................ 108
Figura 15. Entrega de cuestionario a alumnos........................................................ 108
Figura 16. Se recopilan los cuestionarios dados..................................................... 109
Figura 17. Finalización de la encuesta realizada en el BATEMS (Nora, Julissa, Sindy)
................................................................................................................................ 109
Figura 18. Finalización de la encuesta realizada en el BATEMS (Carlos E, Juan C,
Jesús E) .................................................................................................................. 110
11. Preliminares
1
INTRODUCCIÓN
En la actualidad si las empresas, instituciones y dependencias quieren ser
competitivos; es importante crear programas innovadores de difusión y promoción del
quehacer de cada institución.
La Web fue creada alrededor de 1990 por el inglés Tim Berners-Lee y el belga Robert
Cailliau mientras trabajaban en el CERN en Ginebra, Suiza. Desde entonces, Berners-
Lee ha jugado un papel activo guiando el desarrollo de estándares Web (como los
lenguajes de marcado con los que se crean las páginas Web), y en los últimos años
ha abogado por su visión de una Web Semántica.
Es por ello que en el Bachillerato Tecnológico Moisés Sáenz (BATEMS) se optó por
la implementación de un portal web. Se vio en la necesidad de implementar un
mecanismo de comunicación para proporcionar información y tener un mejor servicio
a la comunidad educativa. Los mismos que se detallan a continuación.
Los docentes llevaban manualmente el proceso de ingreso de notas y cálculos de
promedios, lo que provocaba retraso en la entrega de las mismas, en ciertas ocasiones
errores en los promedios, también se indicaban y confundían las fechas de los
exámenes. Esto último también se difunde de manera oral por los profesores al
momento de dar sus clases. Pero no se cuenta con un espacio especialmente para
dar a conocer las noticias, fechas, eventos o cursos acerca de la escuela.
El proyecto muestra como el estudiante, puede valorar, reconocer cada una las
actividades que la institución realiza, dar sus opiniones y tener una comunicación
mediante actividades por área que cada uno de los docentes dejan en el portal web,
dicho proyecto se realizara por medio de una herramienta virtual llamada Drupal. Es
una página para los padres de familia, alumnos y toda la comunidad educativa.
Se podrá dar a conocer de una manera fácil, la Institución, horarios, directores de
curso, proyectos, actividades que se realizan, facilitando así la comunicación entre la
Institución y la comunidad estudiantil.
12. Preliminares
2
Un propósito que motiva este proyecto es dar a conocer a los estudiantes una manera
diferente de interactuar con las nuevas tecnologías, no solo de reconocimiento de cada
una de las actividades que la Institución desarrolla con los estudiantes, sino también
la participación y la opinión de cada uno de ellos.
Uno de los puntos que se abordaran en el tema es el sitio web, que se puede entender
como la colección de páginas web relacionadas y comunes a un dominio de internet
o subdominio en la World Wide Web (red mundial) dentro de Internet. También se
encuentra Internet que es la red de Información y publicidad más grande del mundo,
sus emprendimientos o su empresa deben lograr presencia en internet, y para
pertenecer a esta red de información, deben hacerlo a través de un sitio web. Por otro
lado los sitios web se pueden clasificar en dos tipos; sitios web estáticos y sitios web
dinámicos, se puede entender que un sitio web estático son aquellos que no acceden
a una base de datos para obtener el contenido por el contrario los sitios web dinámicos,
son aquellos que acceden a una base de datos para obtener los contenidos y reflejar
los resultados obtenidos de la base de datos, en las páginas del sitio web. Un portal
puede referirse a un sitio web que sirve o pretende servir como un sitio principal de
partida para las personas que se conectan al World Wide Web Son sitios que los
usuarios tienden a visitar como sitios ancla. También están los sistemas de gestor de
contenido que debe proporcionar un ambiente que permita a uno o varios autores
(creadores de contenidos) generar sus documentos o artículos, de manera amigable.
14. Generalidades del proyecto
4
1.2. Planteamiento del problema
El Bachillerato Tecnológico Moisés Sáenz de San Juan Bautista Tuxtepec Oaxaca
(BATEMS) desde hace años empezó a brindar sus servicios escolares y hasta la
actualidad continua y es reconocida a nivel local, se encuentra ubicada en boulevard
sostenes bravo #100 esquina calzado Dr. Víctor Bravo Ahuja previo al paraíso
Tuxtepec.
Anteriormente la escuela contaba con alrededor de 300 alumnos y casi 20 docentes.
Actualmente cuenta con más de 800 alumnos y 40 docentes, con el aumento del
alumnado y personal trabajador se vio la necesidad de implementar un mecanismo de
comunicación para proporcionar información a la comunidad del BATEMS.
Para difundir noticias al interior de la comunidad, la escuela lo hace por medio de: el
acto cívico, a través de las anotaciones en un mural en el que se indican las fechas de
los exámenes. Esto último también se difunde de manera oral por los profesores al
momento de dar sus clases. Pero no se cuenta con un espacio especialmente para
dar a conocer las noticias, fechas, eventos o cursos acerca de la escuela.
A continuación se enlistan los problemas detectados:
No optimizan tiempo y recursos.
No cuenta con un medio de difusión único para dar a conocer información a la
comunidad escolar.
Retardo en la entrega de calificaciones.
No disponen de cursos para la capacitación docente.
Limitación en los horarios para acceder a la información.
Por lo que para agilizar estas actividades se tendrá que hacer uso de algunas
tecnologías, ya que en la actualidad es más común para los diferentes ámbitos que
existen.
PREGUNTAS DE INVESTIGACIÓN
15. Generalidades del proyecto
5
¿A qué comunidad va dirigido el portal web?
¿Qué beneficios traerán la implementación del portal web?
¿Se requiere que el personal que tenga acceso al portal, reciba capacitación?
¿Qué tipo de contenido contendrá el portal web?
¿Se Cuenta con los conocimientos y la experiencia suficientes sobre metodología de
la investigación?
¿Se Dispone de los recursos humanos y materiales necesarios para completar el
estudio?
¿Se tiene acceso al lugar dónde se desarrolla el estudio?
16. Generalidades del proyecto
6
1.3. Objetivos
1.3.1. Objetivo General
Implantar un portal web para los usuarios de Bachillerato Tecnológico Moisés Sáenz
de San Juan Bautista Tuxtepec, Oaxaca. Utilizando el gestor de contenido (CMS)
Drupal con la finalidad de optimizar tiempo y procesos para los estudiantes y docentes
que hagan uso del mismo, y dar a conocer información acerca de la institución a dicha
comunidad y personas en general.
1.3.2. Objetivos específicos
Adquirir un dominio y hosting.
Instalar los gestores de contenido necesarios.
Compara el portal web con otros.
Diseñar la estructura de navegación.
Presentar un contenido acorde a los objetivos plateados.
Precisar aspectos de usabilidad y accesibilidad.
Gestionar la compatibilidad del sitio en diferentes navegadores.
Verificar las soluciones de los tipos de equipos electrónicos para la correcta
visualización del sitio.
Anexar los créditos de los desarrolladores que permita a los usuarios
contactarlos.
17. Generalidades del proyecto
7
1.4. Hipótesis o supuestos
Hipótesis de trabajo
Con la implementación del portal web en el Bachillerato Tecnológico Moisés Sáenz, la
comunidad educativa tendrá acceso a un aula virtual de aprendizaje; los maestros
podrán realizar alta de calificaciones y darse de alta en cursos de capacitación, los
alumnos consultarán sus calificaciones, visualizaran anuncios y descargarán archivos,
así mismo tanto maestros como alumnos tendrán acceso a Moodle y galería de
imágenes sobre la escuela, y los administradores realizarán la gestión de la
información relevante de la institución.
Hipótesis nula
Sin la implementación del portal web en el Bachillerato Tecnológico Moisés Sáenz, la
comunidad educativa no tendrá acceso a un aula virtual de aprendizaje; los maestros
podrán realizar alta de calificaciones y darse de alta en cursos de capacitación, los
alumnos consultarán sus calificaciones, visualizar anuncios y descargar archivos, así
mismo tanto maestros como alumnos tendrán acceso a Moodle y galería de imágenes
sobre la escuela, y los administradores realizarán la gestión del portal web y publicarán
información relevante de la institución.
18. Generalidades del proyecto
8
1.5. Justificación
En éste proyecto se realizará un portal web que constará de enlaces web, buscadores,
foros, documentales, páginas web, diversos widgets e incluso con una plataforma
Moodle.
Dicho portal se hará con el objetivo de agilizar la mayoría de las labores escolares,
tales como entrega de calificaciones, subir archivos a la red, enterarse de noticias de
última hora, cursos de capacitación para docentes, entre otros; de igual forma
optimizar el tiempo que se ocupa en estas actividades.
Para llevar a cabo éste proyecto, primeramente deberemos contratar un hosting y
dominio para ser reconocido por la World Wide Web (www.), seguido de esto se deberá
configurar el portal para que pueda enlazarse con diferentes enlaces web y se editará
con el gestor de contenido Drupal. Hecho todo esto el portal pasará a través de una
revisión para garantizar que se elaboró de forma correcta y que cumplirá con las
necesidades de sus usuarios.
Dicho proyecto va enfocado para personal del instituto, como docentes, trabajadores
administrativos, alumnado en general y personas ajenas a la escuela que requieran
conocer información general acerca de ésta o posibles futuros estudiantes que estén
interesados en inscribirse.
Los beneficios son: optimizar tiempo tanto para dar a conocer información como para
la interacción entre estudiante/maestro, acceso a Moodle, acceso a galerías, cursos
de capacitación para docentes, alta y consulta de calificaciones, etc.
Impacto social
El portal web ayudará a la comunidad en general a conocer información de la
institución (BATEMS), así como ayudar a la comunidad escolar a tener acceso a
noticias relevantes de la escuela, contar con acceso a Moodle e interacción facilitada
entre alumnos y docentes.
19. Generalidades del proyecto
9
Impacto económico
Los usuarios podrán acceder al portal de manera gratuita, siendo esto una gran
oportunidad ya que la plataforma estará disponible a los usuarios a cualquier hora y a
cualquier momento sin importar su ubicación, así mismo poder ahorrar recursos que
se gastaban antes de manejar dicho portal.
Impacto tecnológico
Se podrá acceder al portal web desde cualquier ubicación geográfica usando distintas
herramientas que cuenten con acceso a internet, ya que hoy en día la tecnología es
indispensable y podemos aprovecharla dándole uso a los dispositivos tales como las
computadoras, laptops, tabletas, teléfonos móviles (Smartphone) etc. para hacer el
uso acuerdo al portal web.
Impacto ambiental
El portal web afecta de manera indirecta al medio ambiente, puesto que solo se
utilizarán tecnologías que ya están implementadas, esto significa un importante ahorro
de materia y uso de energía, esto quiere decir que no habrá ningún daño ecológico.
20. Marco Teórico
10
II. MARCO TEÓRICO
2.1. Antecedentes o marco histórico
2.1.1 Historia de la Web.
La Web fue creada alrededor de 1989 por el inglés Tim Berners-Lee y el belga Robert
Cailliau mientras trabajaban en el CERN en Ginebra, Suiza, y publicada en 1992.
Desde entonces, Berners-Lee ha jugado un papel activo guiando el desarrollo de
estándares Web (como los lenguajes de marcado con los que se crean las páginas
web), y en los últimos años ha abogado por su visión de una Web Semántica, según
(Evolucion de la Web, 2011).
La idea subyacente de la Web se remonta a la propuesta de Vannevar Bush en los
años 40 sobre un sistema similar: a grandes rasgos, un entramado de información
distribuida con una interfaz operativa que permitía el acceso tanto a la misma como a
otros artículos relevantes determinados por claves. Este proyecto nunca fue
materializado, quedando relegado al plano teórico bajo el nombre de Memex. Es en
los años 50 cuando Ted Nelson realiza la primera referencia a un sistema de
hipertexto, donde la información es enlazada de forma libre. Pero no es hasta 1980,
con un soporte operativo tecnológico para la distribución de información en redes
informáticas, cuando Tim Berners-Lee propone ENQUIRE al CERN (refiriéndose a
Enquire Within Upon Everything, en castellano Preguntando de Todo Sobre Todo),
donde se materializa la realización práctica de este concepto de incipientes nociones
de la Web según (Evolucion de la Web, 2011).
En marzo de 1989, Tim Berners Lee, ya como personal de la división DD del CERN,
redacta la propuesta, que referenciaba a ENQUIRE y describía un sistema de gestión
de información más elaborado. No hubo un bautizo oficial o un acuñamiento del
término web en esas referencias iniciales utilizándose para tal efecto el término mesh.
Sin embargo, el World Wide Web ya había nacido. Con la ayuda de Robert Cailliau, se
publicó una propuesta más formal para la world wide web el 12 de noviembre de 1990.
Berners-Lee usó un NeXTcube como el primer servidor web del mundo y también
escribió el primer navegador web, WorldWideWeb en 1990, según (Evolucion de la
Web, 2011).
21. Marco Teórico
11
En las Navidades del mismo año, Berners-Lee había creado todas las herramientas
necesarias para que una web funcionase: el primer navegador web (el cual también
era un editor web), el primer servidor web y las primeras páginas web que al mismo
tiempo describían el proyecto según (Evolucion de la Web, 2011).
El 6 de agosto de 1991, envió un pequeño resumen del proyecto World Wide Web al
newsgroup alt.hypertext. Esta fecha también señala el debut de la web como un
servicio disponible públicamente en Internet según (Evolucion de la Web, 2011).
2.1.2 Historia breve de los Sitios Web.
Tim Berners-Lee, en sus ratos libres, investigaba un sistema de difusión
descentralizada de información basado en el hipertexto y en el que cooperaban una
red de centros de investigación (Lapuente, 2013).
Durante 1989 se realizaron varios experimentos para crear un sistema de
comunicación entre los científicos de física nuclear de todo el mundo en el Centre
Europé en de Recherche Nucléaire (CERN) en Ginebra, donde se probaron varias
técnicas sobre redes para conectarse a Internet, llegándose a estandarizar
los protocolos de conexión TCP/IP. En marzo de ese mismo año, Tim Berners-Lee,
investigador especializado en telecomunicaciones y colaborador del Laboratorio
Europeo de Física de Partículas (CERN), propone al CERN utilizar un sistema de
comunicación basado en el hipertexto para lograr ese flujo de información entre los
científicos (Lapuente, 2013).
En noviembre de 1990 Tim Berners-Lee puso en marcha el sistema de hipertexto
llamado Enquire que permitía almacenar piezas de información y conectarlas, y que
se ejecutaba en un entorno multiusuario que permitía acceder a la información a
varias personas a la vez. En marzo de 1991, Berners-Lee escribió el primer
programa visualizador para un servidor y cliente, que se convirtió en el origen de la
World Wide Web. Este sistema duró hasta 1993, cuando la International Standards
Organization (ISO) estandarizó el lenguaje Hypertext Markup Language
(HTML). Hasta entonces, los documentos se editaban mediante TeX y PostScript,
22. Marco Teórico
12
pero estos lenguajes eran demasiado complicados teniendo en cuenta que debían ser
leídos por todo tipo de ordenadores, desde simples terminales hasta estaciones de
trabajo gráficas X-Windows. Antes de 1990, Internet era un archipiélago
de ordenadores inconexos y no se podía cruzar de una dirección a otra pulsando
un enlace como ahora. Tampoco existían los buscadores, ni se podían
integrar imágenes en la pantalla puesto que no habían nacido las interfaces gráficas
(Lapuente, 2013).
La idea que movió a Tim Berners-Lee, fue desarrollar un método eficiente y rápido para
intercambiar datos entre la comunidad científica. Para ello, combinó dos tecnologías
ya existentes (el hipertexto y el protocolo de comunicaciones de Internet), creando un
nuevo modelo de acceso a la información intuitivo e igualitario: la Web que hace
posible que cualquiera pueda utilizar Internet. Esta fue la propuesta de Berners-Lee:
Actualmente, Tim Berners-Lee dirige el World Wide Web Consortium, la organización
que coordina estándares y añade nuevas funcionalidades y desarrollos a la Web. Este
Consorcio se fundó en 1994, a raíz de las negociaciones entre los países que
conformaban el CERN y las instituciones estadounidenses interesadas en el proyecto
web. El W3 tiene su sede en Boston (Massachussetts) y en él participan el CERN,
el Institut National de Recherche en Informatique et en Automatique de Francia
(INRIA) y el Massachusetts Institute of Technology (MIT) (Lapuente, 2013).
2.1.3 Sitio Web.
Es una colección de ficheros, denominados lugares de Web o páginas de Web, que
incluyen información en forma de textos, gráficos, sonidos y vídeos, además de
vínculos con otros ficheros. Los ficheros son identificados por un localizador universal
de recursos (URL, siglas en inglés) que específica el protocolo de transferencia, la
dirección de Internet de la máquina y el nombre del fichero. Los programas
informáticos denominados exploradores como Navigator, de Netscape, o Internet
Explorer se utilizan el protocolo http para recuperar esos ficheros. Continuamente se
desarrollan nuevos tipos de ficheros para la WWW, que contienen por ejemplo
animación o realidad virtual (VRML). Hasta hace poco había que programar
23. Marco Teórico
13
especialmente los lectores para manejar cada nuevo tipo de archivo. Los nuevos
lenguajes de programación (como Java, de Sun Microsystems) permiten que los
exploradores puedan cargar programas de ayuda capaces de manipular esos nuevos
tipos de información.
2.1.4 Internet.
Los inicios de Internet nos remontan a los años 60. En plena guerra fría, Estados
Unidos crea una red exclusivamente militar, con el objetivo de que, en el hipotético
caso de un ataque ruso, se pudiera tener acceso a la información militar desde
cualquier punto del país. Esta red se creó en 1969 y se llamó ARPANET. En principio,
la red contaba con 4 ordenadores distribuidos entre distintas universidades del país.
Dos años después, ya contaba con unos 40 ordenadores conectados. Tanto fue el
crecimiento de la red que su sistema de comunicación se quedó obsoleto. Entonces
dos investigadores crearon el Protocolo TCP/IP, que se convirtió en el estándar de
comunicaciones dentro de las redes informáticas (actualmente seguimos utilizando
dicho protocolo).
ARPANET siguió creciendo y abriéndose al mundo, y cualquier persona con fines
académicos o de investigación podía tener acceso a la red.
Las funciones militares se desligaron de ARPANET y fueron a parar a MILNET, una
nueva red creada por los Estados Unidos.
La NSF (National Science Fundation) crea su propia red informática llamada NSFNET,
que más tarde absorbe ARPANET, creando así una gran red con propósitos científicos
y académicos.
El desarrollo de las redes fue abismal, y se crean nuevas redes de libre acceso que
más tarde se unen a NSFNET, formando el embrión de lo que hoy conocemos
como INTERNET.
En 1985 la Internet ya era una tecnología establecida, aunque conocida por unos
pocos. El autor William Gibson hizo una revelación: el término "ciberespacio".
24. Marco Teórico
14
En ese tiempo la red era básicamente textual, así que el autor se basó en los
videojuegos. Con el tiempo la palabra "ciberespacio" terminó por ser sinónimo de
Internet. El desarrollo de NSFNET fue tal que hacia el año 1990 ya contaba con
alrededor de 100.000 servidores.
En el Centro Europeo de Investigaciones Nucleares (CERN), Tim Berners Lee dirigía
la búsqueda de un sistema de almacenamiento y recuperación de datos. Berners Lee
retomó la idea de Ted Nelson (un proyecto llamado "Xanadú") de usar hipervínculos.
Robert Caillau quien cooperó con el proyecto, cuanta que en 1990 deciden ponerle un
nombre al sistema y lo llamarón World Wide Web (WWW) o telaraña mundial.
La nueva fórmula permitía vincular información en forma lógica y a través de las redes.
El contenido se programaba en un lenguaje de hipertexto con "etiquetas" que
asignaban una función a cada parte del contenido. Luego, un programa de
computación, un intérprete, eran capaz de leer esas etiquetas para desplegar la
información. Ese intérprete sería conocido como "navegador" o "browser".
En 1993 Marc Andreesen produjo la primera versión del navegador "Mosaic", que
permitió acceder con mayor naturalidad a la WWW.
La interfaz gráfica iba más allá de lo previsto y la facilidad con la que podía manejarse
el programa abría la red a los legos. Poco después Andreesen encabezó la creación
del programa Netscape.
A partir de entonces Internet comenzó a crecer más rápido que otro medio de
comunicación, convirtiéndose (C.V., 2014) en lo que hoy todos conocemos.
2.1.5 World Wide Web.
El servicio Web o WWW es una nueva forma de representar la información en Internet
basada en páginas. Una página WWW puede incluir tres tipos de información: texto,
gráficos e hipertexto. Un hipertexto es texto resaltado que el usuario puede activar para
cargar otra página WWW. La diferencia entre un documento hipertexto y un documento
normal consiste en que el hipertexto contiene, además de la información, una serie de
enlaces o conexiones con otros documentos relacionados, de manera que el lector
25. Marco Teórico
15
puede pasar de un tema a otro y volver al documento original en el momento en que
le interese (EcuRed, 2016).
2.1.6 Historia de los Servidores Web.
Los Servicios Web surgieron ante una necesidad de estandarizar la comunicación
entre distintas plataformas (PC, Mainframe, Mac, etc.) y lenguajes de programación
(PHP, C, Java, etc.).
En la década de los 90's Internet permitió conectar computadoras en una escala global.
En principio la conexión fue entre PCs y servidores por medio del explorador de
Internet. A comienzos de este siglo es clara la necesidad de permitir a las
computadoras conectadas a Internet comunicarse entre ellas. Desde entonces se va
dando forma al nuevo modelo de computación distribuida llamado servicios Web
basados en XML. El objetivo es permitir comunicarse entre sí a sistemas heterogéneos
dentro y fuera de la empresa. Esta comunicación es independiente del Sistema
Operativo, lenguaje o modelo de programación. Para conseguir esto se desarrollaron
estándares. El consorcio de Internet http://www.w3c.org fue el encargado de crear y
mantener estos estándares.
Un servidor web es un programa que sirve datos en forma de Páginas Web, hipertextos
o páginas HTML (HyperText Markup Language): textos complejos con enlaces, figuras,
formularios, botones y objetos incrustados como animaciones o reproductores de
sonidos. La comunicación de estos datos entre cliente y servidor se hace por medio
un protocolo, concretamente del protocolo Http. Con esto, un servidor Web se
mantiene a la espera de peticiones HTTP, que son ejecutadas por un cliente HTTP; lo
que solemos conocer como un Navegador Web. A modo de ejemplo: al teclear
(http://www.cnice.mec.es) en un navegador, éste realizará una petición HTTP al
servidor que tiene asociada dicha URL.
El servidor responde al cliente enviando el código HTML de la página; el navegador
cuando recibe el código, lo interpreta y lo muestra en pantalla. El Cliente es el
encargado de interpretar el código HTML, es decir, de mostrar las fuentes, los colores
26. Marco Teórico
16
y la disposición de los textos y objetos de la página. El servidor se encarga de transferir
el código de la página sin llevar a cabo ninguna interpretación de la misma.
Servidor Web Local.
Tener un servidor Web local debería ser fundamental para todas aquellas
personas que no disponen de un Sitio Web online. El Servidor local nos va a
permitir comprobar que todas las modificaciones que se van a realizar en
nuestro diseños Web, no provoquen algún error que pueda afectar a todos
aquellos usuarios que naveguen por la red. Otro aspecto positivo de un Servidor
local, es que no hará falta tener que subir ficheros al servidor Ftp para hacer
nuestras pruebas con lo cual, la espera se hace más corta.
Como es de suponer, también se permite el acceso a nuestro servidor a
cualquier usuario de Internet. Para ello, se configura correctamente el Router y
sería de mucha ayuda tener una dirección IP estática, mediante la cual cualquier
usuario podría conectarse a nuestro servidor desde un navegador.
Figura 1. Cliente/Servidor.
27. Marco Teórico
17
2.2. Marco conceptual
Identificación y operacionalización de las variables
Las variables de la hipótesis de trabajo son:
Variable independiente
Con la implementación del portal web en el Bachillerato Tecnológico Moisés Sáenz.
Variable dependiente
La comunidad educativa tendrá acceso a un aula virtual de aprendizaje; los maestros
podrán realizar alta de calificaciones y darse de alta en cursos de capacitación, los
alumnos consultarán sus calificaciones, visualizaran anuncios y descargarán archivos,
así mismo tanto maestros como alumnos tendrán acceso a Moodle y galería de
imágenes sobre la escuela, y los administradores realizarán la gestión de la
información relevante de la institución.
Definición conceptual
Tabla 1. Definición de variables
VARIABLES DEFINICIONES
IMPLEMENTACIÓN Poner en funcionamiento la solución
del problema.
PORTAL WEB Es un sitio dinámico el cual cuenta con
soporte para imágenes, video, audio y
conexión a base de datos.
ENTORNO VIRTUAL DE
APRENDIZAJE
Es un espacio educativo alojado en la
web, un conjunto de herramientas
informáticas que posibilitan la
interacción didáctica de manera que el
alumno pueda llevar a cabo las labores
propias de la docencia como son
28. Marco Teórico
18
conversar, leer documentos, realizar
ejercicios, formular preguntas al
docente, trabajar en equipo, etc. Todo
ello de forma simulada sin que medie
una interacción física entre docentes y
alumnos.
GESTIÓN DEL PORTAL WEB Realizar altas, bajas, modificaciones y
consulta de calificaciones y del portal
en general.
Definición operativa de las variables
Variables Dimensión Indicador
Variable
independiente
Con la implementación del
portal web en el Bachillerato
Tecnológico Moisés Sáenz.
Necesidad de un portal web.
Necesidad de optimizar
tiempo y procesos.
Variables
dependiente
Mejorar la calidad de
enseñanza a los alumnos y
facilitar los procesos
educativos a los maestros.
Plataforma Moodle.
Cursos de capacitación.
Sección de noticias en orden
de publicación.
Los administradores tendrán
mayor gestión de portal.
Gestión del portal web
29. Marco Teórico
19
2.3. Marco referencial
2.3.1 Conceptualización de los Sitios Web.
2.3.1.1 Que es un sitio web.
Un sitio web es un conjunto de páginas web desarrolladas en código html, relacionadas
a un dominio de Internet el cual se puede visualizar en la World Wide Web (www)
mediante los navegadores web o también llamados browser como ser Chrome, Firefox,
Edge, Opera entre otros. Cada página web perteneciente al sitio web tiene como
objetivo publicar contenido, y este contenido podrá ser visible o no al público.
(Galeon.com, 2009)
2.3.1.2 Clasificación de Sitios Web.
Los sitios web se pueden clasificar en dos tipos:
Sitios Web Estáticos: Se denomina sitio web estático a aquellos que no acceden a
una base de datos para obtener el contenido. Por lo general un sitio web estático es
utilizado cuando el propietario del sitio no requiere realizar un continuo cambio en la
información que contiene cada página. (Galeon.com, 2009)
Sitios Web Dinámicos: Por el contrario los sitios web dinámicos son aquellos que
acceden a una base de datos para obtener los contenidos y reflejar los resultados
obtenidos de la base de datos, en las páginas del sitio web. El propietario del sitio web
podrá agregar, modificar y eliminar contenidos del sitio web a través de un “sistema
web”, generalmente con acceso restringido al público mediante usuario y contraseña,
el cual se denomina BACK END. (Galeon.com, 2009)
Se asume que a la hora de contratar el desarrollo de un sitio web, el propietario,
especificará al desarrollador web, la cantidad de páginas que contendrá el sitio,
discriminando si son dinámicas o estáticas.
30. Marco Teórico
20
El tener un Sitio Web puede incidir positivamente en los resultados de todas las áreas
funcionales de la empresa como marketing y comercial, ventas, compras, recursos
humanos, y administración entre otras; ofreciendo al navegante todo tipo de
información y servicios de valor agregado para sus clientes, tales como:
Información institucional, servicios ofrecidos, catálogo de productos,
actividades, fotos, videos, formas de contacto, etcétera.
Promocionar producto o servicios mediante cupones de ventas online, banners,
publicidad, sponsors, inscripciones, cursos.
y toda información necesaria para el interesado, que sean relevantes para la
persona que está navegando.
Sitios Web Institucionales.
Son denominados así, aquellos sitios web sencillos que contienen información básica
de la empresa. (Galeon.com, 2009)
No suelen contener grandes volúmenes de información, al tratarse de algo institucional
debería contener:
Home o página Principal
Acerca de (Misión, visión, valores, objetivos )
Servicios (Detalle de cada servicio ofrecidos por la empresa)
Ubicación (mapa de ubicación de la oficina comercial y sucursales)
Contacto (dirección, teléfonos y formulario de contacto)
Sitios Onepage.
Son aquellos sitios que concentran toda su información en una sola página y el usuario
va accediendo al contenido a medidas que va desplazando hacia abajo con el mouse
o el teclado. (Galeon.com, 2009)
Es un concepto relativamente nuevo que se está utilizando bastante y es de bajo costo.
31. Marco Teórico
21
La información contenida suele ser bastante reducida pero no deja de ser efectiva si
está bien lograda y segmentada la información.
2.3.1.3 Blogs.
Los blogs son sitios web generalmente de carácter personal, con publicaciones que
contienen un orden cronológico, de actualización dinámica y continua.
Los blogs tienen la particularidad de almacenar artículos escritos por uno o más
autores, de diferentes temáticas y buscan lograr un feedback (intercambio de
opiniones) entre los escritores y los lectores a través de comentarios (Galeon.com,
2009).
Los blogs están comprendidos dentro de los sitios web dinámicos.
2.3.1.4 Sitios e-commerce.
Son aquellos sitios que permiten realizar un comercio electrónico mediante el sitio web,
también llamados como carritos de compras o ventas
Estos sitios web permiten realizar transacciones entre comprador y vendedor permitiendo:
Realizar compra-venta mediante tarjeta de crédito.
Realizar un pedido online.
Reserva de producto o servicio.
2.3.1.5 Portal.
La palabra portal se forma a partir de raíces latinas, compuesta lexicalmente por “porta”
que quiere decir “puerta”, además del sufijo “al” que significa “relativo a”. El uso más
común que existe hoy en día para el termino portal, yace en el ámbito tecnológico,
para ser exactos en la internet, donde ser refiere al sitio o página web, que gracias a
su gran cantidad de información, servicios y enlaces, puede llegar, o trata de satisfacer
las necesidades de los usuarios, que quieran o necesiten acceder a cualquier tipo de
información (Tecnología, 2014).
32. Marco Teórico
22
En un sentido general los portales web, ofrecen tales servicios como buscadores,
juegos online, noticias, chat, tiendas virtuales donde pueden adquirir productos y
diferentes servicios, directorios, servicios de correo electrónico, entre otros.
El portal es como un intermediario, que trasmite la información, cuya fuente de ingreso
es tener una forma sencilla de acceder a toda la información sobre un tema en
particular; es decir a toda esa información que está contenida en el portal, puesto que
este se encarga de centralizar los enlaces de una manera más fácil y organizada con
el fin de facilitar la navegación de un contexto.
2.3.2.1 Hypertext Markup Language.
HTML es el lenguaje con el que se define el contenido de las páginas web.
Básicamente se trata de un conjunto de etiquetas que sirven para definir el texto y
otros elementos que compondrán una página web, como imágenes, listas, vídeos, etc.
El HTML se creó en un principio con objetivos divulgativos de información con texto y
algunas imágenes. No se pensó que llegara a ser utilizado para crear área de ocio y
consulta con carácter multimedia (lo que es actualmente la web), de modo que, el
HTML se creó sin dar respuesta a todos los posibles usos que se le iba a dar y a todos
los colectivos de gente que lo utilizarían en un futuro. Sin embargo, pese a esta
deficiente planificación, sí que se han ido incorporando modificaciones con el tiempo,
estos son los estándares del HTML. Numerosos estándares se han presentado ya. El
HTML 4.01 es el último estándar a febrero de 2001. Actualización a mayo de 2005, en
estos momentos está a punto de presentarse la versión 5 de HTML, de la que ya se
tiene un borrador casi definitivo (Alvarez, 2001).
El HTML es un lenguaje de marcación de elementos para la creación de documentos
hipertexto, muy fácil de aprender, lo que permite que cualquier persona, aunque no
haya programado en la vida, pueda enfrentarse a la tarea de crear una web. HTML es
fácil y pronto podremos dominar el lenguaje. Más adelante se conseguirán los
resultados profesionales gracias a nuestras capacidades para el diseño y nuestra vena
33. Marco Teórico
23
artista, así como a la incorporación de otros lenguajes para definir el formato con el
que se tienen que presentar las webs, como CSS.
2.3.2.2 Hypertext Transfer Protocol.
HTTP es un protocolo usado para acceder a la Web (WWW). Se trata de la base para
la comunicación de datos en la WWW. El hipertexto es texto estructurado que usa
enlaces lógicos (llamados hipervínculos) entre nodos que contienen texto. El HTTP es
el protocolo para intercambiar o transferir hipertexto. HTTP se encarga de procesar y
dar respuestas a las peticiones para visualizar una página web. Además sirve para el
envío de información adicional como el envío de formularios con mensajes, etc.
Luego de finalizada la transacción, HTTP no guarda ninguna información sobre la
misma, por lo tanto es considerado un protocolo "sin estado". Para guardar la
información entre distintas peticiones, los webmasters suelen utilizar cookies o pasos
de parámetros.
El protocolo HTTP generalmente utiliza el puerto 80. El HTTP está basado en el
modelo cliente-servidor, en donde un cliente HTTP (un navegador por ejemplo) abre
una conexión y realizar una solicitud al servidor. Este responde a la petición con un
recurso (texto, gráficos, etc) o un mensaje de error, y finalmente se cierra la conexión
(Alegsa, 2014).
El desarrollo de HTTP iniciado por Tim Berners-Lee en el CERN en el año 1989. El
desarrollo de estándares HTTP era coordinado por el Internet Engineering Task Force
(IETF) y la World Wide Web Consortium (W3C), culminando con la publicación de los
llamados RFC (Requests for Comments), son documentos que describen diversos
aspectos del funcionamiento de Internet y otras redes de computadoras, como
protocolos, procedimientos, etc. HTTP está diseñado para permitir elementos de red
intermedios para mejorar o permitir las comunicaciones entre clientes y servidores
(Alegsa, 2014).
34. Marco Teórico
24
2.3.2.3 Uniform Resource Locutor.
URL significa Uniform Resource Locutor, es decir, localizador uniforme de recurso. Es
una secuencia de caracteres, de acuerdo a un formato estándar, que se usa para
nombrar recursos, como documentos e imágenes en Internet, por su localización
(Lopéz, 2011).
Las URL [RFC 1738] fueron una innovación fundamental en la historia de Internet.
Fueron usadas por primera vez por Tim Berners-Lee en 1991, para permitir a los
autores de documentos establecer hiperenlaces en la World Wide Web (WWW o Web).
Desde 1994, en los estándares Internet, el concepto de URL ha sido incorporado
dentro del más general de URI (Uniform Resource Identifier - Identificador Uniforme de
Recurso), pero el término URL aún se utiliza ampliamente.
Aunque nunca fueron mencionadas como tal en ningún estándar, mucha gente cree
que las iniciales URL significan Universal Resource Locator (Localizador Universal de
Recurso). Esta interpretación puede ser debida al hecho de que, aunque la U en URL
siempre ha significado Uniforme, la U de URI significó en un principio Universal, antes
de la publicación del [RFC 2396].
La URL es la cadena de caracteres con la cual se asigna una dirección única a cada
uno de los recursos de información disponibles en Internet. Existe un URL único para
cada página de cada uno de los documentos de la World Wide Web, para todos los
elementos de Gopher y todos los grupos de debate USENET, y así sucesivamente.
El URL de un recurso de información es su dirección en Internet, la cual permite que
el navegador la encuentre y la muestre de forma adecuada. Por ello el URL combina
el nombre del ordenador que proporciona la información, el directorio donde se
encuentra, el nombre del fichero y el protocolo a usar para recuperar los datos. Y
reemplaza la dirección numérica o IP de los servidores haciendo de esta manera más
fácil la navegación (Lopéz, 2011).
35. Marco Teórico
25
2.3.2.4 Dominios.
Un dominio de Internet es un nombre base que agrupa a un conjunto de equipos o
dispositivos y que permite proporcionar nombres de equipo más fácilmente
recordables en lugar de una dirección IP numérica. Permiten a cualquier servicio (de
red) moverse a otro lugar diferente en la topología de Internet, que tendrá una dirección
IP diferente. Técnicamente, es un recurso nemotécnico que se asocia a nodos de la
red Internet con el objeto de facilitar su identificación, constituido por expresiones
alfanuméricas concatenadas en varios niveles organizados de forma jerárquica
(Galeon.com, 2009).
Un Dominio es el nombre que registra para identificar un lugar en Internet. En la red
opera como la dirección virtual y escaparate de marca.
Es el único identificador que tenemos para ser localizados en Internet, es como nuestro
domicilio virtual.
Podemos definir al dominio como: Nombre que se asigna al conjunto de equipos o
dispositivos y que permite proporcionar nombres de equipo más fácilmente
recordables en lugar de una dirección IP numérica (Galeon.com, 2009).
Tipos de Dominios.
Web, Web es un dominio de Internet de nivel superior.
aero, para la Industria del transporte aéreo.
asia, la región de Asia + Oceanía.
biz, para los Negocios.
cat, para páginas en catalán.
com, para fines comerciales.
coop, para Cooperativas.
edu, para Educación.
es, para páginas españolas.
eu, la región de Europa.
gov y .gob, para Gobierno y Entidades Públicas.
36. Marco Teórico
26
info, para Información.
int, para Entidades Internacionales, organizaciones como la ONU.
jobs, para Departamentos de empleo y recursos humanos en empresas.
mil, para el Departamento de Defensa de los Estados Unidos (Único país con
dominio de primer nivel para el ejército).
mobi, para empresas de telefonía móvil o servicios para móvil.
museum, para los Museos.
name, para Nombres de personas.
net, para Infraestructura de red.
org, para organizaciones.
pro, para profesionales con una titulación universitaria.
tel, para servicios de comunicación por Internet.
travel, para páginas de la industria de viajes y turismo (Galeon.com, 2009).
2.3.2.5 Dominios Territoriales.
Son los dominios mantenidos por cada país. Para proteger la identidad de tu marca o
proyecto personal en un país es importante registrar tu dominio con este tipo de
extensión (Galeon.com, 2009).
Este tipo de Dominios se componen de dos letras; por ejemplo .mx se utiliza para
México, .es para España, .co para Colombia, etc.
Ejemplo
www.___________.com.mx
Existen diferentes Dominios Territoriales como son:
com.mx
gob.mx
net.mx
edu.mx
37. Marco Teórico
27
2.3.2.6 Dominios Genéricos.
Son todos aquellos dominios básicos que no tienen registrado el lugar de origen del
Dominio, y pueden ser registrados por cualquier persona o empresa de cualquier parte
del mundo.
com - Se usa para sitios comerciales y personales
org - Recomendado para organizaciones no lucrativas
net - Se recomienda para compañías relacionadas con la infraestructura de
Internet
Pueden ser registrados por todo tipo de personas físicas y jurídicas de cualquier parte
del mundo sin requerimientos especiales. Este tipo de dominios son económicos y de
registro muy rápido. En Guidom.com recomendamos este tipo de registro de dominios,
son los que tienen más uso en la red (Galeon.com, 2009).
.com: Son los más acertados para empresas u organizaciones con ánimo de
lucro. La red está llena de .com, por lo que registrando un dominio.
Este tipo, su organización adquirirá un aspecto de globalidad.
.eu: Dominios relativos a Europa. Son asignados por EURID.
.org: Para todo tipo de organizaciones sin ánimo de lucro.
.net: Usados mayoritariamente por empresas de Internet y
Telecomunicaciones.
.edu: Usados para fines educativos.
.mil: Exclusivamente para todo tipo de organizaciones militares.
.gov: Para los gobiernos.
2.3.2.7 Dominios Estatales.
.es: Relativos al territorio español. Son asignados por ESNIC. Recientemente
liberalizados.
38. Marco Teórico
28
.au: Australia.
.fr: Francia.
.de: Alemania.
.mx: México.
.uk: Reino Unido.
(Galeon.com, 2009)
2.3.2 Lenguajes más Usuales para la Creación de un Sitio Web.
2.3.2.1 Lenguaje HTML.
HTML es el lenguaje que se emplea para el desarrollo de páginas de internet. Está
compuesto por una serie de etiquetas que el navegador interpreta y da forma en la
pantalla. HTML dispone de etiquetas para imágenes, hipervínculos que nos permiten
dirigirnos a otras páginas, saltos de línea, listas, tablas, etc (Rancel, 2010).
Es un lenguaje estático para el desarrollo de sitios web (acrónimo en inglés de
HyperText Markup Language, en español Lenguaje de Marcas Hipertextuales).
Desarrollado por el World Wide Web Consortium (W3C). Los archivos pueden tener
las extensiones (htm, html).
Sintaxis:
<html> (Inicio del documento HTML)
<head>
( Cabecera )
</head>
<body>
( Cuerpo )
</body>
39. Marco Teórico
29
</html>
<b> </b> Negrita.
<p> </p> Definir párrafo.
<etiqueta> Apertura de la etiqueta.
</etiqueta> Cierre de la etiqueta.
Ventajas:
Sencillo que permite describir hipertexto.
Texto presentado de forma estructurada y agradable.
No necesita de grandes conocimientos cuando se cuenta con un editor de
páginas web o WYSIWYG.
Archivos pequeños.
Despliegue rápido.
Lenguaje de fácil aprendizaje.
Lo admiten todos los exploradores.
Desventajas:
Lenguaje estático.
La interpretación de cada navegador puede ser diferente.
Guarda muchas etiquetas que pueden convertirse en “basura” y dificultan la
corrección.
El diseño es más lento.
Las etiquetas son muy limitadas.
40. Marco Teórico
30
2.3.2.2 Lenguaje JavaScript.
JavaScript es un lenguaje de programación que se utiliza principalmente para crear
páginas web dinámicas. Una página web dinámica es aquella que incorpora efectos
como texto que aparece y desaparece, animaciones, acciones que se activan al pulsar
botones y ventanas con mensajes de aviso al usuario (Pérez, 2015).
Técnicamente, JavaScript es un lenguaje de programación interpretado, por lo que no
es necesario compilar los programas para ejecutarlos. En otras palabras, los
programas escritos con JavaScript se pueden probar directamente en cualquier
navegador sin necesidad de procesos intermedios. A pesar de su nombre, JavaScript
no guarda ninguna relación directa con el lenguaje de programación Java. Legalmente,
JavaScript es una marca registrada de la empresa Sun Microsystems (Pérez, 2015).
El código Javascript puede ser integrado dentro de nuestras páginas web. Para evitar
incompatibilidades el World Wide Web Consortium (W3C) diseño un estándar
denominado DOM (en inglés Document Object Model, en su traducción al español
Modelo de Objetos del Documento).
Sintaxis:
<script type="text/javascript"> ... </script>
Ventajas:
Lenguaje de scripting seguro y fiable.
Los script tienen capacidades limitadas, por razones de seguridad.
El código Javascript se ejecuta en el cliente.
Desventajas:
Código visible por cualquier usuario. Todas as imágenes deben de llevar
nombre y número.
El código debe descargarse completamente.
41. Marco Teórico
31
Puede poner en riesgo la seguridad del sitio, con el actual problema llamado
XSS (significa en inglés Cross Site Scripting renombrado a XSS por su similitud
con las hojas de estilo CSS).
2.3.2.3 Lenguaje PHP.
Es un lenguaje de programación utilizado para la creación de sitio web. PHP es un
acrónimo recursivo que significa “PHP Hypertext Pre-processor”, (inicialmente se llamó
Personal Home Page). Surgió en 1995, desarrollado por PHP Group (Galeon.com,
2009).
PHP es un lenguaje de script interpretado en el lado del servidor utilizado para la
generación de páginas web dinámicas, embebidas en páginas HTML y ejecutadas en
el servidor. PHP no necesita ser compilado para ejecutarse (Galeon.com, 2009).
Para su funcionamiento necesita tener instalado Apache o IIS con las librerías de PHP.
La mayor parte de su sintaxis ha sido tomada de C, Java y Perl con algunas
características específicas. Los archivos cuentan con la extensión (php).
La sintaxis utilizada para incorporar código PHP es la siguiente:
<?
$mensaje = “Hola”;
echo $mensaje;
?>
También puede usarse:
<?php
$mensaje = “Hola”;
echo $mensaje;
42. Marco Teórico
32
?>
Ventajas:
Muy fácil de aprender.
Se caracteriza por ser un lenguaje muy rápido.
Soporta en cierta medida la orientación a objeto. Clases y herencia.
Es un lenguaje multiplataforma: Linux, Windows, entre otros.
Capacidad de conexión con la mayoría de los manejadores de base de datos:
MysSQL, PostgreSQL, Oracle, MS SQL Server, entre otras.
Capacidad de expandir su potencial utilizando módulos.
Posee documentación en su página oficial la cual incluye descripción y ejemplos
de cada una de sus funciones.
Es libre, por lo que se presenta como una alternativa de fácil acceso para todos.
Incluye gran cantidad de funciones.
No requiere definición de tipos de variables ni manejo detallado del bajo nivel.
Desventajas:
Se necesita instalar un servidor web.
Todo el trabajo lo realiza el servidor y no delega al cliente. Por tanto puede ser
más ineficiente a medida que las solicitudes aumenten de número.
La legibilidad del código puede verse afectada al mezclar sentencias HTML y
PHP.
La programación orientada a objetos es aún muy deficiente para aplicaciones
grandes.
Dificulta la modularización.
Dificulta la organización por capas de la aplicación.
43. Marco Teórico
33
Seguridad:
PHP es un poderoso lenguaje e intérprete, ya sea incluido como parte de un servidor
web en forma de módulo o ejecutado como un binario CGI separado, es capaz de
acceder a archivos, ejecutar comandos y abrir conexiones de red en el servidor. Estas
propiedades hacen que cualquier cosa que sea ejecutada en un servidor web sea
insegura por naturaleza.
PHP está diseñado específicamente para ser un lenguaje más seguro para escribir
programas CGI que Perl o C, y con la selección correcta de opciones de configuración
en tiempos de compilación y ejecución, y siguiendo algunas prácticas correctas de
programación (Galeon.com, 2009).
2.3.4 Elementos Básicos de un Sitio Web.
Un sitio Web debe ser sobre todo accesible y agradable. La organización inicial es muy
importante para poder utilizar eficazmente las herramientas y tomar decisiones
oportunas (Rodríguez D. H., 2014).
Un sitio Web es una localización en la Web que contiene varias páginas Web
organizadas jerárquicamente.
Cada sitio tiene una página de inicio que corresponde a la página principal, llamada en
inglés Home Page.
Es la primera página que se visualiza cuando se accede a un sitio tecleando el nombre
del dominio en la barra del navegador.
Un sitio tiene generalmente más de una página Web y su objetivo principal es ofrecer
la información que necesitan los usuarios y proporcionársela de manera que puedan
asignarla fácilmente. (Rodríguez H. A., s.f.)
44. Marco Teórico
34
Figura 2. Organización
2.3.4.1 Elementos que componen una Página Web.
Las principales características que constituyen una página en Internet son: texto en un
sitio web, imágenes, nombre de dominio, hipervínculos, video, entre otros elementos
más, los cuales se describirán a continuación. (Rodríguez H. A., s.f.)
Texto en un sitio web.
El texto es el elemento más significativo de cualquier sitio Web porque los usuarios
navegan por la Web fundamentalmente en busca de información expresada en texto
(Rodríguez H. A., s.f.).
Imágenes.
Aunque no debe abusar de las imágenes por el riesgo de aumentar el peso de la
página, y por lo tanto, los tiempos de descarga, las imágenes constituyen un elemento
esencial para ofrecer información visual del contenido y mostrar un diseño atractivo y
personal. (Rodríguez H. A., s.f.)
Espacio Servidor de Páginas Web.
Para que nuestro sitio Web sea visible ante todos necesitamos colocarlo en un
servidor. (Rodríguez H. A., s.f.)
45. Marco Teórico
35
Nombre de Dominio.
Es la primera parte de una dirección Web que identifica al servidor que almacena y
sirve su sitio. (Rodríguez H. A., s.f.)
Figura 3. Dominios
Hipervínculos.
Por sí misma, una página Web no puede hacer mucho. La magia de verdad comienza
cuando relaciona varias páginas mediante enlaces. (Rodríguez H. A., s.f.)
Video.
Mientras Internet es cada vez más asequible, confiable y veloz, los programas de
edición de video se hacen más cercanos a los usuarios.
Ahora es más fácil realizar un video desde una cámara digital o un teléfono móvil con
cámara incorporada y que termine subiendo a la Web para ponerlo al alcance de todos.
(Rodríguez H. A., s.f.)
46. Marco Teórico
36
Animaciones en Flash.
Es una imagen animada, fácil de crear y sobre todo que ocupa poca memoria. Tiene
diferentes usos, desde la creación de dibujos animados hasta el despliegue de dibujos
interactivos. (Rodríguez H. A., s.f.)
Sonidos.
Un elemento cada vez más importante. La comercialización de nuevos dispositivos
digitales móviles como el iPhone ha potencializado este elemento.
Además de incorporar sonido a las páginas Web puede descargar de ellas archivos de
audio para sus dispositivos móviles.
El formato MP3 es el más conocido y más usado por su calidad y nivel de compresión.
(Rodríguez H. A., s.f.)
Otros elementos.
Banner: Una imagen fija o animada utilizada generalmente para publicidad.
Marcos: También llamados frames, son una especie de recuadro independiente en el
que puede cargar una página Web. De esta forma es posible dividir una página Web
en diferentes partes o ventanas, cada una con sus propios bordes y barras de
desplazamiento, cargando dentro de cada una de ellas una página web externa
independiente.
Los marcos se usaron mucho en un momento determinado, pero además de crear
algunos inconvenientes en el diseño, es una opción que no recomiendo ya que
los motores de búsqueda no indexan correctamente los sitios realizados con marcos.
Actualmente se pueden obtener los mismos resultados con CSS.
Formulario: Zona para introducir datos o comentarios. Una plantilla o página con
espacios vacíos para llenarse con alguna finalidad.
47. Marco Teórico
37
También se utiliza para referirse al conjunto de campos solicitados por un determinado
programa, los cuales se almacenan para su manipulación y uso posterior. (Rodríguez
H. A., s.f.)
Diseño Web.
La Web se ha convertido en el medio de comunicación más importante del mundo
gracias a su facilidad para ofrecer información con una rapidez nunca antes alcanzada
por ningún otro medio.
Esta información puede ser consumida por cualquiera que tenga una conexión a
Internet desde cualquier parte del mundo.
El desarrollo Web es una mezcla de tecnología, contenidos, arquitectura del sitio,
diseño e interactividad.
El éxito de un sitio depende de la forma en que se combinan estos cinco factores que
determinan en gran medida la rapidez con que se genera y ofrece la información, y por
supuesto el éxito de un sitio.
Antes de analizar estos factores independientemente, debe considerar que ellos deben
garantizar que el sitio sea fácil de mantener, flexible para cambiar de tamaño y realizar
actualizaciones, atractivo y visualmente para los usuarios, interesante para su
audiencia, práctico para realizar descargas rápidas y búsquedas efectivas; también sin
vínculos rotos, ni comportamientos inadecuados.
En el contenido Web influyen la presentación, los conceptos de diseño y algunas
estrategias comunes del trabajo en Internet.
Los elementos visuales como el calor, el diseño de tipografía y las imágenes,
conforman la personalidad de un sitio y generan un impacto emocional que determina
que el sitio sea atractivo.
48. Marco Teórico
38
Aunque el objetivo final de todo diseñador sea transmitir un mensaje a una audiencia
determinada, ser un buen diseñador gráfico no significa necesariamente ser un buen
diseñador para la Web.
Cualquiera independientemente de su nivel artístico, puede conseguir un diseño
funcional con buena apariencia.
Un poco de experiencia y conocimiento de algunos principios básicos de diseño más
cierto grado de inspiración, originalidad y buen gusto harán que tenga parte de la
batalla ganada. Observe los detalles de su entorno, la naturaleza el arte y sobre todo
el trabajo de otros creadores que hay en la Web.
Parece muy elemental, pero muchos olvidan las principales fuentes más asequibles
de enriquecimiento estético (Rodríguez H. A., s.f.).
2.3.5 Metodología para la creación de sitios web.
La "Metodología para Creación de Sitios Web" comprende las fases siguientes, que a
continuación se presentan. (Rodríguez D. H., 2014)
2.3.5.1 Fase de Análisis.
A la hora del desarrollo de un sitio Web se debe comenzar por dar respuesta a un
grupo muy concreto de interrogantes, que permitirán aclarar y definir de manera básica
las expectativas existentes en torno a la aplicación Web e Interacción que se va a
generar. (Rodríguez D. H., 2014)
Selección de Objetivos.
Todo proyecto debe contar con objetivos definidos, contra los cuales puede medirse la
efectividad de las acciones que se desarrollen.
49. Marco Teórico
39
Green, chilcoott y Flick (2003) denominan esta etapa, resumen de objetivos, donde
establecen tres puntos primordiales para esta selección, los cuales son definir los
usuarios, lo que los usuarios esperan de la visita, y qué se pretende comunicar a través
del sitio Web.
También podemos denominarlos: selección de usuarios, expectativas de usuario y
expectativas de la organización; se describe a continuación:
Selección de usuarios.
Los usuarios o la audiencia se refieren a aquella parte de la población a la que
se pretende alcanzar o influir con el sitio Web; esto está estrechamente
vinculado con la naturaleza del sitio que se propone. Toda la información que
se obtenga servirá para establecer parte de los criterios de diseño de contenido,
lenguajes, estética, entre otros.
"El modelado del usuario se basa en definir clases o perfiles de los usuarios y
así poder diseñar con el objetivo de satisfacer las necesidades propias de cada
grupo de usuarios" (Montero, Y. y Martón, F., 2003).
Expectativas de Usuario.
La organización puede o no, ser conocida por los usuarios en potencia del sitio.
Al plantearse la puesta en marcha de un sitio Web es necesario conocer hacia
quién va dirigido éste y qué podrían esperar dichos usuarios al visitarlo.
"Tómese un tiempo para contactar con sus clientes, proveedores y amigos, con
el fin de averiguar cómo harían ellos para encontrar su sitio Web y qué les
gustaría ver en él" (Morris, S. y Dickison, P. 2002).
Expectativas de la organización.
Es vital establecer o fijar qué resultados pretenden conseguir la organización
con la creación del sitio Web. Con ello se busca definir el propósito del sitio
Web, y se deben incluir aspectos que van desde los más generales,
relacionados con el público de destino, hasta los más específicos relacionados
con la organización.
Morrin y Dickson (2001) indican que se debe decidir si lo que se busca con el
sitio Web es: aumentar ventas, ofrecer servicios especializados y
50. Marco Teórico
40
conocimientos, publicidad y patrocinio, incentivos (productos gratis para
promoción), o para publicitar. (Rodríguez D. H., 2014)
2.3.5.2 Fase de Planificación.
Todo proyecto posee una fase de planificación. En ella se deben definir cuáles son los
requerimientos técnicos para este fin, quiénes serán los miembros del equipo,
seleccionar la estructura, planear un sitio bien organizado, y realizar estudios de
mercadeo comparativo (Rodríguez D. H., 2014).
Selección de Software.
En esta etapa de la metodología se busca determinar los requerimientos en cuanto al
software que se utilizará para el desarrollo de la aplicación; es decir, sistemas
operativos, servidor (software), editores para diseño Web, lenguajes de programación,
animaciones y otros componentes.
Esta definición dependerá de muchos aspectos como la existencia de licencias de
software o los recursos técnicos y hardware. (Rodríguez D. H., 2014)
Selección de Hardware.
Antes de emprender el desarrollo de una aplicación Web, se deben determinar los
requerimientos de hardware de la aplicación, el equipo servidor, la capacidad de
respuesta, terminales, requerimientos de red si la aplicación ha de disponerse de una
intranet o extranet.
En el caso que la aplicación vaya a estar publicada en Internet, se debe reservar el
dominio y ubicar el servicio de hospedaje de empresas que se especializan en este
servicio (Morrison y Dickinson). (Rodríguez D. H., 2014)
51. Marco Teórico
41
Selección del Equipo Adecuado.
"El entorno de trabajo en equipos surge de la necesidad de segmentar el proceso de
producción en varias funciones diferentes" (Green, Chilcott y Flick, 2003).
Parte de la planificación de un sitio Web consiste en pensar en términos de equipo de
trabajo.
Se trata del conjunto de técnicos que estarán a cargo de la concepción, construcción,
evaluación y mantenimiento del sitio.
Los miembros del equipo Web serán los responsables de todas aquellas estructuras
no visibles que hacen a la operatividad de un sitio.
El equipo se basará en la convergencia de saberes y experiencias. Debe estar
integrado por técnicos de muy diversas disciplinas, capaces de contemplar los distintos
aspectos que están en juego.
Inicialmente, la mayoría de las organizaciones tenían a cargo del sitio Web un
Webmaster que trabajaba solo, preparaba el servidor, editaba las páginas, hacía el
diseño gráfico, y escribía o reunía los textos. Con el tiempo, se ha comprendido la
complejidad de estos proyectos.
Es muy importante que el equipo tenga un líder (que puede en un futuro ser el
Webmaster o no) porque formar un equipo Web requiere un gran compromiso personal
e institucional.
Los equipos no se construyen de la noche a la mañana, ni a partir de una decisión
administrativa o un mandato. Requieren un proceso de consolidación, que pasa por
tiempos de búsqueda, acuerdos y adecuación.
Un equipo Web debe estar en constante comunicación tanto con aquellos que le han
asignado su misión, como con sus destinatarios (clientes o usuarios). Su éxito se basa
además, en una estrecha colaboración y comunicación entre sus miembros.
52. Marco Teórico
42
Cada miembro del equipo Web debe estar capacitado en su campo de trabajo (la
presencia o el nivel de experiencia de ciertos miembros del equipo puede variar
dependiendo del proyecto).
Se sugiere una lista de miembros que podrían ser parte de este equipo, de esta lista
se extrajeron los siguientes:
Jefe de proyecto: Encargado de la supervisión y control del resto del equipo. Actúa
como enlace entre el usuario y los demás miembros.
Productor: Este se encarga de establecer el aspecto, percepción y funcionalidad del
sitio.
Editor: Ayuda a establecer y mantener el estilo, además de la integridad del sitio. Tiene
la responsabilidad de controlar la corrección y el flujo de texto y en algunos casos el
contenido multimedia del sitio.
Escritor: Los escritores deben interesarse por los detalles técnicos y la incorporación
al desarrollo de estándares con ro al sitio, utilización de las palabras apropiadas,
ortografía y gramática. Es necesario que el escritor tenga conocimiento de HTML, o de
herramientas con FrontPage u otra aplicación.
Diseñador de bases de datos: Desarrolla las bases de datos que gestiona el sitio
Web, se ocupa de definir sus relaciones.
Diseñador de scripts: Trabajar en conjunto con el diseñador de base de datos.
Desarrolla y depura los scripts, los componentes ActiveX y otros elementos interactivos
en la Web.
Diseñador Gráfico: Se encarga de crear los archivos visuales del sitio, también puede
encargarse de la creación de los archivos de sonido y de película. Trabaja con
imágenes y pequeñas labores de programación
Técnico de Hardware: Configura, prueba, opera y mantiene las computadoras,
impresoras y máquinas necesarias para la ejecución y mantenimiento del sitio.
53. Marco Teórico
43
Técnico de pruebas: Si se dispone de un sitio grande o complejo puede resultar
provechoso la incorporación de un Técnico de prueba al equipo. Su labor consiste en
garantizar que todo funcione como debería, se encarga de probar los elementos de
todas las páginas.
Aunque estas funciones podrían tomarse como esenciales, la estructura siempre
vendrá determinada por el alcance del proyecto.
Benchmarking.
Es una manera de detallar, observar y evaluar todas aquellas páginas Web calificadas
como las mejores que se encuentre en la red, con la finalidad de diseñar una forma
que permita crear un producto de alta calidad, productividad y competitividad.
(Rodríguez D. H., 2014)
Una manera práctica de realizar el benchmarking es plantearse una serie de preguntas
al momento de visitar las páginas que se han seleccionado como las mejores del ramo,
Morris y Dickson (2002) sugieren las siguientes:
1. ¿Cuáles son los objetivos del sitio?
2. ¿Cuánto tiempo tardo en cargar?
3. ¿Se descargó en un orden lógico?
4. ¿Es un sitio Web interesante?
5. ¿Cómo son los gráficos?
6. ¿Refleja el género de la empresa o compañía?
7. ¿Es de fácil uso y es cómodo navegar en él?
8. ¿El contenido está estructurado de manera lógica?
9. ¿Hay demasiados o insuficientes niveles de información?
10.En conjunto ¿el sitio es un éxito?
54. Marco Teórico
44
Estructura de Navegación.
“La base de un sitio bien diseñado es una estructura definida con precisión” (Green,
Chilcott y Flick, 2003)
Las relaciones de las páginas entre sí configuran la estructura del sitio. A partir de la
página principal se vinculan mediante enlaces al resto de las páginas, esto es bastante
sencillo mediante código HTML, pero es más complicado decidir el orden, de qué
manera y con qué configuración se establecerán los vínculos.
La estructura de un conjunto de páginas Web es muy importante, ya que permitirá al
lector visualizar todos los contenidos de una manera fácil y clara (buena estructura), o
provocar en el lector una sensación de estar perdido, por lo cual no encontrará
rápidamente lo que busca y terminará por abandonar el sitio (mala estructura).
Los autores Green, Chilcott y Flick (2003), destacan los tipos de estructura de
navegación, se verán a continuación.
ESTRUCTURA LINEAL.
Esta estructura consiste en una línea recta que recorre el sitio desde la página de inicio
hasta la página final. Es muy útil cuando se desea que el lector siga un camino fijo y
guiado, además el de impedir que se distraiga con enlaces a otras páginas. Por otra
parte se puede causar al lector la sensación de estar encerrado si el camino es muy
largo o poco interesante. Este tipo de estructura sería válido para tutoriales de
aprendizaje o tours de visita guiada.
Figura 4. Estructura Lineal
55. Marco Teórico
45
ESTRUCTURA JERÁRQUICA.
La estructura jerárquica, como se observa en la siguiente ilustración:
Figura 5. Estructura Jerárquica
Es la típica estructura de árbol, en el que la raíz es la página de bienvenida, ésta se
puede también sustituir por la de contenido, en la que se exponen las diferentes
secciones que contiene el sitio.
La ventaja de esta estructura es que el usuario siempre está ubicado y puede moverse
fácilmente por el sitio. Gracias a que la mayoría de las páginas secundarias permiten
regresar a la página de inicio, los visitantes controlan completamente la navegación.
(Rodríguez D. H., 2014)
ESTRUCTURA RADIAL.
En este modelo las páginas secundarias no se conectan entre sí, y se debe navegar
por la página principal para ir de una secundaria a otra, es decir, la principal contiene
enlaces a todas las secundarias, pero las secundarias sólo contienen un entorno a la
principal, tal cual se aprecia en la figura que sigue:
56. Marco Teórico
46
Figura 6. Estructura Radial
La ventaja de esta estructura es que facilita la navegación, los visitantes sólo tendrán
que efectuar uno o dos clics para retornar a la página principal; sin embargo, esto
podría también ser un inconveniente porque obliga al usuario a regresar siempre a la
página de inicio. (Rodríguez D. H., 2014)
ESTRUCTURA DE RED.
En ella se plantea un modelo en el que todas las páginas están relacionadas entre sí.
Es una estructura ideal para sitios especializados en un tema, en la que se le permite
al usuario una navegación libre y sin limitaciones como la que vemos a continuación:
Figura 7. Estructura de Red
57. Marco Teórico
47
Costos de Inversión.
A la hora de planificar un sitio Web, se debe realizar un estudio de viabilidad que refleje
el costo financiero a invertir, y que abarque tiempo, personal, hospedaje Web, el
dominio, licencias en caso de necesitarse, y mantenimiento.
Contar con un método de control de tiempo se hace pertinente en el desarrollo Web,
al igual que en otros proyectos, ya que el tiempo implica dinero. Una técnica para el
control del costo de cierta actividad, es el sistema de agenda, que consiste en dividir
cada hora en segmentos de seis minutos llamadas unidades, y es a partir de la
cantidad de unidades por actividad que se medirá el costo de ésta (Rodríguez D. H.,
2014).
Beneficios a Obtener.
La puesta en marcha del sitio no lo es todo, la planificación del desarrollo de un sitio
Web debe abarcar aspectos como beneficios a adquirir con el funcionamiento del
mismo. Antes de establecer el desarrollo de un sitio Web se debe estimar el tiempo de
retorno de la inversión, ya que de esa forma tangible, como por ejemplo un retorno
monetario, o intangible como la mejora de las relaciones interpersonales de la
organización (Rodríguez D. H., 2014).
2.3.5.3 Fase de Contenido.
Básicamente el éxito de un sitio Web se debe a su contenido. El contenido del sitio
será probablemente una combinación de la información que actualmente se posee y
de la que se tendrá que crear.
Es conveniente presentar un contenido acorde a los objetivos planteados para
desarrollar el sitio, y que la información a plasmar cubra las necesidades e intereses
del público a quien va dirigido. (Rodríguez D. H., 2014)
58. Marco Teórico
48
2.3.5.4 Fase de Diseño.
El diseño Web supone un trabajo extenso un trabajo extenso y detallado, puesto que
abarca no sólo la interacción de múltiples elementos, como tecnología multimedia
(audio, sonido, imágenes, animaciones, entre otros); sino, que abarca también su
integración con una estructura lógica basada en el propósito del sitio. Representando
una labor que va más allá de la simple necesidad e inquietudes de sus potenciales
usuarios.
Al momento de diseñar sitios Web, es necesario tener en cuenta aspectos como la
usabilidad y accesibilidad.
Usabilidad.
Referido al tiempo, esfuerzo y capacidad requerido por el visitante, para que alcance
un determinado nivel de adaptación al sistema, esta puede estar vinculada en
ocasiones al número de pasos necesarios para lograr determinada actividad, y a nivel
de conocimientos que requieran los usuarios para el uso de la aplicación.
Accesibilidad.
Un sitio Web se desarrolla con la idea de que sea visto por el mayor número de
visitantes, pero hay que tener presente que cada uno de estos puede acceder a la
información con equipos, navegadores e idiomas distintos, estos factores pueden
impedir que el sitio no pueda ser apreciado en su totalidad.
Romero (1999) señala tres áreas fundamentales para determinar la accesibilidad de
un sitio Web, estas son:
Accesibilidad a la computadora: Referida a la capacidad de hardware con la
que se debe contar para el uso de la aplicación Web, lo ideal en esta área es
que la aplicación se adapte a la computadora cualquiera que este sea.
59. Marco Teórico
49
Accesibilidad del navegador utilizado: En ocasiones mismos contenidos se
visualizan de distintas maneras en diferentes navegadores Web, se
recomienda utilizar un diseño que se pueda visualizar en la mayoría de los
navegadores y apegado al estándar.
Accesibilidad del diseño de las páginas Web: Los usuarios pueden tener
desactivadas algunas funcionalidades de los navegadores Web, lo que podría
incidir en la correcta visualización del contenido del sitio Web. (Rodríguez D. H.,
2014)
2.3.5.5 Fase de Programación.
Esta etapa corresponde a la utilización de las herramientas de programación Web. En
este punto es primordial seleccionar los lenguajes de programación en los que se
desarrollará el sitio Web, la base de datos definir qué contenido del sitio será estático
y cuál será dinámico.
Una vez definidos estos criterios se pasa a una etapa denominada Arquitectura de tres
fases, la cual expone lo siguiente:
Bases de datos: Se diseña y crea la base de datos.
Programación intermediaria: Programas o códigos que se ejecutarán en el servidor
Web. Acá se establecerá la comunicación entre la base de datos y la interfaz.
Interfaz: Programas y códigos que desplegarán el contenido a los usuarios a través
del navegador Web. Se refiere aplicaciones que el usuario visualizará y a través de la
cual operará con ella. (Rodríguez D. H., 2014)
2.3.5.6 Fase de Testeo.
Se ejecutan pruebas exhaustivas para asegurar el perfecto funcionamiento del sitio
Web con usuarios que vayan a utilizar el sitio:
60. Marco Teórico
50
Comprobación en navegadores: El primer paso y también el más importante, es
comprobar que las páginas se pueden visualizar de forma correcta en diferentes
navegadores.
Detectar los vínculos rotos: Es necesario detectar documentos que existen en el
sitio pero que no están conectados a través de vínculos; ellos deben ser reparados o
eliminados en caso de no ser necesarios puesto que ocupan espacio en el servidor y
tienden a crear confusión.
Comprobar tiempo de descarga: Uno de los puntos clave en el éxito de un sitio Web
es su rapidez de descarga, en base a ello se recomienda un tiempo mínimo descarga.
En este punto los administradores deben reciben la capacitación para el desarrollo de
sus tareas. (Rodríguez D. H., 2014)
2.3.5.7 Fase de Mercado y Publicidad.
En esta fase se debe tomar en cuenta los Derechos Internacionales del Autor, por el
cual:
Todas las copias realizadas incluyen derecho de autor.
Se anexa en el sitio los créditos de los desarrolladores, o un enlace que les
permita a los usuarios contactarlos.
Luego se define el dominio del sitio, se verifica que esté disponible para poder
registrarlo, y se transfieren los archivos al servidor remoto por FTP, o desde la
página del servidor. Se debe verificar que todos los archivos estén en su carpeta
correspondiente de la Web.
Después de publicada la Web, su difusión depende de la publicidad que se le
pueda dar mediante papelería de la organización, mediante banners en sitios
específicos, por medio de buscadores y otros. (Rodríguez D. H., 2014).
61. Marco Teórico
51
2.3.6 Sistemas Gestores de Contenido.
Los Sistemas Gestores de Contenidos SGC (Content Management Systems, CMS,
por su título en inglés) o Gestor de Contenidos Web GCW (Web Content Management,
WCM, por sus siglas en inglés), ayudan a mejorar la calidad de las páginas en Internet,
además de que facilitan la producción, la administración, la actualización y el
mantenimiento de los sitios web; desde uno muy simple, hasta un portal con una
considerable cantidad de elementos.
El Sistema Gestor de Contenidos debe proporcionar un ambiente que permita a uno o
varios autores (creadores de contenidos) generar sus documentos o artículos, de
manera amigable (Forcontu, 2011).
Actualmente, gracias a la evolución de algunas herramientas para la creación de
páginas web, y sin ser un experto en editores de código HTML, ni en diseño gráfico,
se generan sitios con mayor funcionalidad y presentación visual. Estas herramientas,
denominadas Sistemas Gestores de Contenidos SGC (Content Management Systems,
CMS, por su título en inglés) o Gestor de Contenidos Web GCW (Web Content
Management, WCM, por sus siglas en inglés), ayudan a mejorar la calidad de las
páginas, además de que facilitan la producción, la administración, la actualización y el
mantenimiento de los sitios web; desde uno muy simple, hasta un portal con una
considerable cantidad de elementos.
Un SGC es un software que se encuentra en un servidor web al que se le incorporan,
comúnmente, una o varias bases de datos, lo que permite al desarrollador crear,
administrar y actualizar páginas o sitios web de manera simple y dinámica, a través de
interfaces gráficas y plantillas de diseño predefinidas, según (Enterate en Línea Unam,
2008).
62. Marco Teórico
52
2.3.6.1 Características.
Las características que ofrecen los SGC son las siguientes.
Seguridad.
En Internet, los sitios o portales pueden sufrir distintos tipos de ataques que afectan la
información que contienen o la estabilidad del propio sistema. Por ello, la mayoría de
los sistemas SCG poseen diferentes niveles de seguridad configurables, es decir,
proporcionan mecanismos de autenticación que ayudan a establecer distintos niveles
de acceso a los contenidos:
Acceso a contenidos públicos. No requiere autenticación y cualquier persona puede
navegar por los contenidos (artículos, publicaciones) que no son restringidos.
Acceso a contenidos restringidos. Permite visualizar los contenidos públicos, pero
requiere autenticación para acceder y navegar por los contenidos en los que se tienen
privilegios de acceso. Además, se pueden establecer distintos niveles de acceso
(secciones o sólo algunos artículos) y diferentes niveles de contenidos restringidos
(noticias, publicaciones y comentarios).
Acceso al mantenimiento de los contenidos. Permite ver los contenidos públicos y
requiere autenticación para acceder y editar los contenidos donde se tienen privilegios.
Se pueden establecer distintos niveles de contenidos restringidos y de acceso.
Acceso administrativo. Requiere la autenticación. En este nivel se tiene permitido
todo, tanto el manejo de los contenidos como el de la presentación del sitio y su
administración. Se pueden crear distintos tipos de usuarios con diferentes privilegios
de administración (como administrador de usuarios, secciones o categorías, respaldos
de configuración del portal, entre otros).
Para el manejo de la información en los SGC se debe disponer de herramientas para
realizar copias de seguridad y efectuar la restauración de las bases de datos del
sistema. También se requieren parches de corrección de vulnerabilidades y bugs.
63. Marco Teórico
53
Escalabilidad.
En los SGC la escalabilidad es un aspecto sumamente importante, a través de ella el
sistema que se esté desarrollando podrá adecuarse a las futuras necesidades. La
forma como los SGC cubren este punto es con la separación de los contenidos,
presentación, estructura y manejo de módulos que permitan la modificación de alguno
de ellos o la inclusión de uno nuevo, sin afectar a los otros, lo que se logra a través del
manejo de los siguientes estándares:
CSS. Permite la creación de hojas de estilo para definir la presentación de un
documento.
XML. Lenguaje de marcas que permite estructurar un documento con ciertas
reglas.
WAI (Web Accessibility Initiative o Iniciativa de Accesibilidad para Web del
W3C). Asegura la accesibilidad al sistema a personas con alguna discapacidad.
RSS. Sirve para sindicar contenidos y ver las actualizaciones de algún
contenido sin tener que entrar en él.
La mayoría de los SGC toman en cuenta las aplicaciones existentes en torno a nuestro
sistema como son las bases de datos, el servidor web, los lenguajes de programación
utilizados y los sistemas operativos en los que pueda trabajar o ser migrado sin muchas
modificaciones.
Estabilidad.
La mayoría de los SGC cubren este aspecto, ya que al abarcar los puntos anteriores
y estar en constante actualización, permiten la solución y la disponibilidad de las
nuevas funcionalidades, las cuales cubren las nuevas necesidades de los usuarios.
De acuerdo con la información que manejan, los SGC se clasifican en:
Blogs. Contienen noticias o artículos organizados de forma cronológica, que no
pueden ser editados, pero sí hacerse comentarios acerca de ellos. Un ejemplo es
BLOGSMÈXICO: http://www.blogsmexico.com/
64. Marco Teórico
54
Foros. Incorporan foros de discusión en línea, donde las personas opinan sobre temas
de su interés. Un ejemplo es Foros México:
http://foros.forosmexico.com/
Portales. Son sitios que combinan los blogs, foros, artículos, noticias, buscadores,
etcétera, los cuales tienen un gran tráfico de personas que persiguen fines comunes
(pueden ser centros de atención a clientes, revistas, empresas que ofrecen servicios,
etcétera). Un portal importante con algunas de las características mencionadas es el
Portal México Nación Multicultural:
http://www.nacionmulticultural.unam.mx/
Wiki. En este tipo de SGC cualquier persona puede colaborar o escribir sobre algún
tema en el que es posible aportar sus conocimientos. También pueden contener
espacios de discusión (foros). El ejemplo más conocido es Wikipedia:
http://es.wikipedia.org/wiki/Portada
Los SGC se clasifican en dos grandes tipos: los comerciales y los gratuitos, con
licencia de código abierto.
2.3.6.2 SGC comerciales.
De los más conocidos en esta categoría, se encuentran Content Management Server
2002, de Microsoft http://www.microsoft.com/
cmserver/evaluation/overview/default.mspx; Iweb
http://www.iweb.com.es y Kentico, un CMS hecho en C# y Visual Basic.NET
http://www.kentico.com/
Entre sus principales ventajas se podría mencionar que ofrecen soporte profesional y
proveen los manuales correspondientes al sistema; con la contraparte de que no
65. Marco Teórico
55
incluyen el código fuente del sistema, su soporte es muy costoso y el precio de las
licencias es elevado.
2.3.6.3 SGC gratuitos con licencia de código abierto.
En esta categoría existe una importante cantidad de SGC, de los cuales algunos muy
conocidos son: Drupal (PHP) http://www.drupal.org.es/;
Joomla (PHP), versión surgida de Mambo
http://www.joomlaos.net; Mambo (PHP) CMS
http://www.mamboserver.com; PHP-Nuke (PHP)
http://www.phpnuke-espanol.org/; SPIP (PHP)
http://www.spip.net/es y TikiWiki (PHP)
http://tikiwiki.org/.
El software mencionado tiene disponible el código fuente, además de que su licencia
no tiene costo (salvo excepciones que ofrecen servicios añadidos), aunado al hecho
de que existen muchas comunidades en Internet que comparten soluciones a los
problemas que llegara a tener un SGC. No obstante, en caso de contener
documentación, no es muy completa y no ofrecen soporte como tal.
¿Cómo elegir un SGC?
Las características deseables de un SGC son variables y se desprenden,
principalmente, de los requerimientos de aplicación. Sin embargo, se pueden tener
algunos criterios generales que deben reunirse, para satisfacer las principales
necesidades de un sitio web. Según James Robertson, se pueden considerar los
siguientes: