Activa JavaScript para disfrutar de los vídeos de la Mediateca.
Nueva web Antares
Ajuste de pantallaEl ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:
Buenos días familias delantares, voy a elaborar este video tutorial para explicaros una breve
00:00:01
reestructuración de información de los menús que vamos a hacer en la página web del centro.
00:00:09
Globalmente vais a ver que todo es igual, visualmente no vais a notar mucho cambio,
00:00:15
pero lo que vamos a hacer realmente es reestructurar ciertos menús y llevarlos a otra parte de la web.
00:00:21
¿Con qué finalidad? Pues si os fijáis en esta parte central que es donde aparece toda la información de los artículos pues no tiene mucho ancho de pantalla y a veces cuando queremos ofrecer cierta información, tablas o bueno, información de múltiples tipos pues no aparece muy bien porque no tiene mucho espacio aquí.
00:00:29
Entonces, ¿qué es lo que hemos pensado? Pues estos dos menús que aparecen en la barra lateral de la izquierda, que son el menú principal y las enseñanzas, los vamos a reestructurar y los vamos a pasar a tres subespacios, ¿de acuerdo?
00:00:52
Tres submenús del menú principal, que es este que está aquí en la parte superior. Entonces, lo que vamos a hacer es lo siguiente. Este primer menú principal que aparece en la barra lateral izquierda, los submenús los vamos a desvegar de la siguiente forma.
00:01:07
Vamos a crear aquí en la parte superior un submenú que se va a llamar el centro, que va a contener lo que aquí pone localización y contacto, las instalaciones, el horario general, la comunidad educativa y la política de privacidad.
00:01:22
Todo eso lo vamos a mandar aquí arriba a un submenú en la parte superior que se va a llamar el centro.
00:01:39
Y los restantes que serían el calendario escolar, el horario de atención a los tutores, los documentos institucionales e información a las familias y otro pequeño submenú que cuando ya esté hecho en la parte final del tutorial os lo mostraré, lo vamos a subir aquí arriba en un submenú que se va a llamar información a las familias, ¿de acuerdo?
00:01:45
Y luego, este segundo menú que había en la parte lateral izquierda, que era el de enseñanzas, que si recordáis, pues contenía, por ejemplo, si pinchamos en primero de la ESO, un cuadro con la estructura de todos los tipos de materias que había en el nivel y las horas que tenían.
00:02:10
Todo esto va a permanecer exactamente igual, todo lo que estáis viendo es igual, pero lo vamos a pasar aquí arriba en un apartado que se va a llamar enseñanzas y todo esto que está aquí a bloque iría aquí arriba.
00:02:26
con lo que toda esta parte lateral izquierda la vamos a ganar para la parte central
00:02:37
que es donde realmente aparece toda la información
00:02:42
si os fijáis aquí pues esta tabla por ejemplo queda muy alargada
00:02:44
hay mucho scroll, hay que pasar mucho con el ratón hacia abajo
00:02:47
y eso a veces cuando hay mucha información en el artículo o en la subpágina
00:02:51
es un poco engorroso, pesado
00:02:55
entonces si hubiese más ancho el scroll sería menor y es mucho más cómodo y es mucho más visible
00:02:58
entonces cuando haya hecho la reestructuración os muestro cómo va a quedar finalmente
00:03:04
y os hago hincapié en varios sitios que siempre tenéis dudas de dónde aparece esa información
00:03:10
pues lo voy a recalcar aprovechando que estoy haciendo el video tutorial
00:03:16
finalmente la otra reestructuración, el otro cambio que vamos a hacer
00:03:19
y que luego vais a ver en el producto final es que este menú gráfico de la izquierda
00:03:26
Este banner que teníamos creado desde nuestra página inicial de Elie Santares y que encajaba muy bien en la plantilla que teníamos hace años, ¿de acuerdo? Pues con la plantilla que hay en las nuevas páginas web, como la que tenemos ahora mismo, ¿de acuerdo? De WordPress de Duca Madrid, pues queda un poquito ahí desactualizado, como una isla, ¿no? No encaja muy bien con lo que es la plantilla de la web.
00:03:32
Entonces todo esto que está aquí, todo este menú gracio que llamábamos
00:03:58
Lo vamos a pasar aquí arriba al menú superior, el único menú que va a quedar en la nueva estructura de la web
00:04:03
En este menú superior que se va a llamar proyectos
00:04:10
Porque al fin y al cabo todo lo que está aquí integrado son proyectos
00:04:13
Entonces todo esto estará aquí en una parte del menú
00:04:17
Insisto que se llamará proyectos con submenús con cada uno de estos proyectos que tiene el centro
00:04:20
Programa Bilingüe, Convivencia, Biblioteca, Erasmus+, Blog Antares, Revista Antares
00:04:25
Proba Plus, Galería de Imágenes, Cuarto de Somas Empresa
00:04:31
y el Programa Regional contra las Drogas
00:04:36
y lo único que realmente no son proyectos que son el aula virtual de EducaMadrid
00:04:40
este icono que enlaza nuestra aula virtual y que lo tenemos aquí sobre todo por un acceso fácil a vosotros, a las familias
00:04:45
pues este icono que enlaza la aula virtual de EducaMadrid del centro lo vamos a colocar aquí, en el menú de arriba, en el apartado el centro,
00:04:50
que al fin y al cabo, perdón, en información de las familias, disculpad, porque al fin y al cabo es de uso para vosotros, tener un acceso rápido y directo.
00:05:03
Y el otro icono de este menú gráfico que no va a estar en la parte de proyecto porque no lo es, es la agenda escolar, ¿de acuerdo?
00:05:12
Y esta agenda escolar también va a estar aquí en la parte del menú de información a las familias porque, bueno, al fin y al cabo es toda la agenda escolar, todas las actividades que se hacen extraescolares y demás, ¿de acuerdo?
00:05:20
Es para información para vosotros, para las familias, por tanto va a estar ahí en la parte del menú superior de información de las familias.
00:05:32
Y ahora ya sí, finalmente, cuando esté el producto final ya reestructurado, pues os lo mostraré.
00:05:40
Bueno, y este sería el producto final, ¿no? ¿Cómo quedaría la, entre comillas, nueva página de lantares, no?
00:05:49
Entonces, bueno, si os fijáis, pues así a primera vista, pues llama mucho la atención, ¿no? En la cabecera, pues veis aquí ahora tenemos, ya tenemos el icono entero, tenemos la parte principal que es nuestro símbolo, ¿no?
00:05:56
aquí una serie de iconos del Instituto Bilingüe y de la Comunidad de Madrid
00:06:09
diferentes fondos, proyectos europeos que están invertidos en el centro
00:06:14
luego uno de los cambios más grandes es este vídeo, entre comillas promocional
00:06:23
que es un vídeo que hizo un compañero nuestro en pandemia
00:06:29
para poder mostrarle el centro a los padres que venían nuevos al instituto,
00:06:34
ya que no se le podía hacer la visita guiada habitual, ¿de acuerdo?
00:06:39
Entonces, yo creo que es una forma muy potente de mostrar el centro mediante el vídeo, está muy chulo.
00:06:43
Hay una pequeña, es un pequeño resumen, como habéis visto, luego se para,
00:06:48
y si queréis verlo entero, pues hay que pinchar aquí.
00:06:51
Y luego debajo del vídeo, pues están lo que antes llamábamos las últimas noticias,
00:06:53
esas noticias importantes que acaban de ofrecerse
00:06:59
mediante la web para que la tengáis siempre presente
00:07:06
y si os fijáis, aparte de que ahora ya se muestra
00:07:09
mediante un icono, que tiene aquí sombreado
00:07:13
al pasar el ratón, que está chulo
00:07:15
otra cosa que llama también mucho la atención es el color
00:07:17
yo creo que la web, los sitios
00:07:20
tienen que tener cosas identificativas de ellos
00:07:24
y una de ellas de cara a la web es el color
00:07:27
entonces pues hemos elegido como color principal este morado
00:07:29
asociado a nuestro icono que durante muchos años
00:07:33
las cabeceras de documentos por su parte de dividir el icono
00:07:36
iba con este color morado, algo identificativo de siempre centro
00:07:41
entonces nuestro color principal va a ser el morado y el color secundario en la web va a ser el negro
00:07:44
¿de acuerdo? entonces debajo del vídeo siempre tendréis las últimas noticias
00:07:49
como están ahora el calendario de actividades de comienzo de curso, calendario de entrada al programa
00:07:52
accede, bueno, diferente información que vais a ir viendo. Luego si nos vamos
00:07:57
al menú, lo que os decía en la página antigua, aquí está el menú principal
00:08:01
y el de enseñanzas y ese menú principal lo hemos disgregado
00:08:05
en dos partes, aquí ya en el único menú que va a ver que es este superior
00:08:09
que es el centro de información a las familias, ¿de acuerdo? Aquí en el centro
00:08:12
pues tenéis cosas que ya había en ese menú principal que es la localización y contacto del centro
00:08:17
instalaciones con fotos, el horario general del centro,
00:08:21
quién forma la comunidad educativa
00:08:24
el programa bilingüe
00:08:26
somos un centro bilingüe, un instituto bilingüe
00:08:28
esta parte del programa bilingüe estaba
00:08:30
en el banner del menú gráfico de aquí
00:08:31
de la izquierda que ya os dije
00:08:33
que iba a desaparecer y bueno como es
00:08:35
algo identificativo de lo que es el centro
00:08:37
está aquí ahora y luego la política de privacidad
00:08:39
de la web
00:08:42
y luego pues
00:08:43
hemos creado esta
00:08:45
parte importante en el menú que al fin y al cabo
00:08:47
insisto la web está creada para vosotros
00:08:49
para que os sea útil a vosotros
00:08:51
las familias, ¿de acuerdo? Entonces hemos quedado en esta parte, te consta del calendario escolar, oficial de la Comunidad de Madrid, estos documentos institucionales, ¿de acuerdo?
00:08:53
Que ya estaban en la otra web, en esa parte del menú lateral izquierdo, lo que pasa es que, bueno, yo creo que está más chulo, esto tiene un acordeón aquí para que podáis desplegar
00:09:04
y tenéis los iconos también gráficos, bueno, es bastante visual todo, ¿de acuerdo? Luego tenéis el área de atención a tutores, que también estaba en la página antigua,
00:09:13
en la parte lateral izquierda, la parte de la asociación de familias de alumnos
00:09:22
para que podáis contactar con ellos y esto también
00:09:26
es muy importante, esta parte de raíces roble, de acuerdo
00:09:30
que voy a pinchar sobre ella, antes la tenía en mi parte, la de coordinación TIC
00:09:33
pero al fin y al cabo, esa parte está para vosotros, de acuerdo
00:09:38
entonces esa página tiene información a la cual vais a acceder vosotros, con lo cual que mejor
00:09:41
que esté en esta parte del menú, entonces en la columna de la izquierda
00:09:46
tenéis la información de todo lo que es Raíces Roble, cómo acceder a la información, problemas que pueden surgir
00:09:49
y un par de tutoriales aquí al final de la página web de Raíces, no están hechos por mí
00:09:55
y luego lo importante, en esos mails que anteriormente me mandabais a la coordinación TIC
00:10:01
no me ponía y muchas veces prácticamente nada de información, a mí no era imposible poder acceder para poder daros las credenciales
00:10:08
Con lo cual os he creado un formulario con la información que yo necesito realmente para poder acceder a vuestras credenciales en raíces y mandárosla por mail.
00:10:15
Solo tenéis que ir rellenando, nombre y apellidos del tutor solicitante, vuestro mail, seleccionar el curso de vuestro hijo o hija, el grupo,
00:10:22
y luego un cuadro de texto de observaciones que no es obligatorio, los anteriores sí, si me queréis indicar algo, si me queréis subir algún archivo o la razón que sea, podéis, pinchando aquí.
00:10:30
Luego tenéis que obligatoriamente leer y aceptar la política de privacidad, si no pincháis aquí no os va a dejar enviarlo.
00:10:39
un captcha para que vea el ordenador que no sois una máquina
00:10:44
que no son envíos automáticos y lo voy a pinchar
00:10:47
en enviar, a mí me llega
00:10:49
y automáticamente os
00:10:50
os reenvío las credenciales
00:10:52
¿vale? esta es una parte novedosa que la vais a utilizar
00:10:55
bastante, así
00:10:57
ya me va a ser más sencillo mandaros
00:10:58
las credenciales, luego tenéis
00:11:01
cosas que ya había, el transporte escolar
00:11:03
el aula virtual de EducaMadrid que antes también estaba
00:11:04
en ese banner de la derecha, en ese menú gráfico
00:11:07
al fin y al cabo está creado esa pizarrita
00:11:08
esta pizarrita para que podáis acceder vosotros
00:11:10
rápidamente, ¿no? Y vuestros hijos e hijas a las aulas virtuales de los diferentes departamentos.
00:11:13
Entonces, pues lo he colocado aquí. La agenda escolar, ¿vale? Con todas las actividades que va a ir habiendo
00:11:20
en el centro y demás, también estará aquí. Y luego también estaba antes en el bloque de coordinación TIC
00:11:27
un apartado de EducaMadrid, ¿de acuerdo? De qué servicios ofrece, problemas con la contraseña, ¿de acuerdo?
00:11:33
entonces, bueno, al fin y al cabo también es una página que estaba creada para vosotros
00:11:40
al fin y al cabo nosotros como profesores ya lo sabemos
00:11:43
entonces pues lo he recolocado aquí, me pareció más intuitivo que pudiese acceder por este menú
00:11:46
enseñanzas, que son todos los niveles educativos que hay
00:11:52
que ya estaban en el otro menú que había en la parte izquierda, la página web antigua
00:11:55
pues lo mismo, en cualquiera de estas páginas tenéis las materias que se imparten en dicho nivel
00:11:59
y los links de estas asignaturas os mandan a los departamentos, ¿vale?
00:12:04
De cada una de estas materias, en las cuales podéis ver criterios de evaluación,
00:12:09
recuperación de pendientes e información relevante del departamento.
00:12:13
El antiguo aquí abajo estaban los libros de texto, si os acordáis.
00:12:17
Me parece más natural, ¿de acuerdo?
00:12:20
Que los libros de texto estén al fin y al cabo en una parte de secretaría, ¿de acuerdo?
00:12:22
Lo he indicado aquí en texto, como antiguamente estaba aquí para recordarlo.
00:12:26
Y van a estar aquí en secretaría, ¿de acuerdo?
00:12:31
En Secretaría, Libros de Texto, ¿de acuerdo? Pues fijaos, os he puesto aquí, tenéis también esta de forma gráfica, con el color identificativo granate, pincháis y ahí tenéis los libros de texto del año que se está cursando.
00:12:33
En Secretaría, pues tenéis lo mismo que había antes, esta parte del menú ya está, ahora la información, los documentos oficiales de Secretaría, ¿de acuerdo? También con los mismos acordeones que os mostré anteriormente, que está más agrupado, más bonito también.
00:12:46
Y luego tenéis la actividad de las taquillas para principio de curso y los libros de texto. Departamentos es lo mismo que había en la anterior, información de los departamentos, las extraescolares que ya existía esta parte del menú, veis, lo he subdividido por los viajes de larga duración, bueno, son los que hubo el año pasado que en teoría podrían surgir también este año y actividades complementarias que son actividades de cierta forma también extraescolares pero que se realizan dentro del centro, ¿de acuerdo?
00:12:58
con cursos, etc
00:13:27
y luego lo que os decía, ese menú
00:13:28
gráfico de la derecha, ese banner
00:13:31
que había antes, que estaba ahí como un poco una isla
00:13:33
¿de acuerdo? pues lo he puesto aquí
00:13:35
en una parte del menú que se llama proyectos
00:13:37
y está pues lo mismo, la convivencia
00:13:39
la biblioteca, Erasmus+,
00:13:41
la prensa, ProvaPlus, bueno
00:13:43
todo lo que son proyectos del centro que estaban
00:13:44
en ese menú gráfico de la derecha pues lo he estructurado aquí
00:13:47
y ahora parece, yo creo que la página
00:13:49
está mucho más compacta
00:13:51
no está ahí como en partes separadas
00:13:52
y bueno
00:13:55
espero que, ah y para acabar
00:13:56
si queréis volver siempre al inicio
00:13:59
antes en el menú había aquí una, ponía inicio
00:14:00
pero es que ya en la página antigua
00:14:03
si pincháis en el logo
00:14:05
vais al inicio, entonces bueno pues por
00:14:06
resumir un poco el menú de arriba
00:14:08
y que no quedara tan extenso, pues bueno
00:14:11
se ha quitado y si pincháis siempre en el logo
00:14:12
pues vais al inicio
00:14:14
así que nada, espero que realmente os haya gustado
00:14:15
y que os sea útil, de acuerdo
00:14:18
y que bueno, que tengamos una
00:14:20
web moderna acorde a
00:14:22
al centro
00:14:24
moderno que somos
00:14:26
así que nada, un saludo
00:14:28
- Etiquetas:
- Desarrollo de Aplicaciones Web
- Subido por:
- Isidro H.
- Licencia:
- Dominio público
- Visualizaciones:
- 345
- Fecha:
- 6 de septiembre de 2025 - 11:06
- Visibilidad:
- Público
- Centro:
- IES ANTARES
- Duración:
- 14′ 32″
- Relación de aspecto:
- 16:9 Es el estándar usado por la televisión de alta definición y en varias pantallas, es ancho y normalmente se le suele llamar panorámico o widescreen, aunque todas las relaciones (a excepción de la 1:1) son widescreen. El ángulo de la diagonal es de 29,36°.
- Resolución:
- 1704x964 píxeles
- Tamaño:
- 372.38 MBytes
