Archivo de la categoría: Creación de página web

Prueba de Kompozer


En esta prueba vamos a realizar una página web sobre monumentos de Córdoba, utilizando el programa Kompozer.

  • En primer lugar crea una carpeta con el nombre WEBMONUMENTOS, que nos servirá para incluir todos los archivos que van a formar parte de nuestro sitio web. Dentro de esta carpeta crea otra con el nombre IMAGES, para almacenar las imágenes que necesitas para la web.
  • Descarga las imágenes para la web en los siguientes enlaces: FOTO PORTADA FOTO MEZQUITA FOTO MEDINA AZAHARA FOTO ALCÁZAR FOTO PUENTE ROMANO
  • Descarga el archivo pdf que incluye el texto necesario para incluir en el sitio web: TEXTOS PARA WEB MONUMENTOS DE CÓRDOBA
  • Crea un archivo en Kompozer con el título MONUMENTOS DE CÓRDOBA y con nombre index. Esta página servirá de portada a nuestro sitio web. Deberá tener el formato que aparece en la imagen de abajo, es decir, el fondo de página de color rojo, el color de la letra blanco y el tipo de fuente Ubuntu condensed. En esta página aparece la foto de portada y unos botones para navegar al resto de páginas de la web. Para crear estos botones tendremos que usar el programa GIMP, teniendo fondo blanco, y el tipo de fuente Ubuntu condensed de color rojo.

  • Crea un archivo en Kompozer con el título MEZQUITA y con nombre mezquita. Esta página mostrará información sobre la Mezquita. Deberá tener el formato que aparece en la imagen de abajo, es decir, el fondo de página de color rojo, el color de la letra blanco y el tipo de fuente Ubuntu condensed. En esta página aparece la foto de la Mezquita, texto sobre el monumento y la frase Volver a página inicial en la parte inferior.

  • Crea un archivo en Kompozer con el título MEDINA AZAHARA y con nombre medina. Esta página mostrará información sobre Medina Azahara. Deberá tener el formato que aparece en la imagen de abajo, es decir, el fondo de página de color rojo, el color de la letra blanco y el tipo de fuente Ubuntu condensed. En esta página aparece la foto de Medina Azahara, texto sobre el monumento y la frase Volver a página inicial en la parte inferior.

  • Crea un archivo en Kompozer con el título ALCÁZAR y con nombre alcazar. Esta página mostrará información sobre el Alcázar de los Reyes Cristianos. Deberá tener el formato que aparece en la imagen de abajo, es decir, el fondo de página de color rojo, el color de la letra blanco y el tipo de fuente Ubuntu condensed. En esta página aparece la foto del Alcázar, texto sobre el monumento y la frase Volver a página inicial en la parte inferior.

  • Crea un archivo en Kompozer con el título PUENTE ROMANO y con nombre puente. Esta página mostrará información sobre el Puente Romano. Deberá tener el formato que aparece en la imagen de abajo, es decir, el fondo de página de color rojo, el color de la letra blanco y el tipo de fuente Ubuntu condensed. En esta página aparece la foto del Puente Romano, texto sobre el monumento y la frase Volver a página inicial en la parte inferior.

  • Inserta un enlace a cada una de las páginas correspondientes del sitio en los botones dispuestos en la página de portada o principal. Asimismo, inserta un enlace en las frases Volver a página inicial, que se han establecido en cada página correspondiente a un monumento, para que se vuelva a la página de portada o inicial.
  • Comprime la carpeta WEBMONUMENTOS, y envíame este archivo a través del Aula Virtual.
Anuncios

Publicación de página web


En una práctica anterior hemos creado una página web con el programa Kompozer.

Una vez confeccionado nuestro sitio web, si queremos que sea visible en la red, deberemos buscar un servidor donde alojarlo. Hay una oferta amplia de sitios que ofrecen alojamiento gratuito. De entre los que comprobado, me ha gustado Hostinger, ya que podemos publicar en poco tiempo nuestro trabajo y además no incluyen publicidad.

Una vez que entremos en la web de Hostinger tendremos que crear un nuevo usuario, seleccionando siempre el plan gratuito, con el que dispondremos de 2 GB de espacio.

Cuando ya tengamos un usuario, en nuestro tablero se podrá gestionar la subida de los archivos de nuestro sitio web. Hostinger ofrece un gestor de subida, pero no está disponible en el plan gratuito. Así, al hacer click en Acceso FTP nos proponen gestores FTP (File Tranfer Protocol), como FileZilla.

Al abrir FileZilla, hay que completar los datos de servidor, usuario, contraseña y puerto que nos muestra la pantalla de Acceso FTP de Hostinger.

Es muy importante que mantengamos en el servidor la estructura de carpetas configurada en nuestro equipo.

 

Edición de páginas web. Kompozer


Kompozer es un editor de páginas web de código abierto WYSIWYG, es decir, what you see is what you get. Esto hace que sea muy sencillo e intuitivo elaborar una página web, puesto que trabajaremos como si estuviéramos ante un procesador de textos.

Para trabajar este programa seguiremos los apuntes propuestos por el IES María de Molina. En los siguientes enlaces se pueden descargar tanto el pdf como los documentos e imágenes para realizar las actividades.

APUNTES DE KOMPOZER

DEFINICIONES DE MECANISMOS PARA LAS ACTIVIDADES

IMÁGENES PARA LAS ACTIVIDADES

Por último, si no tenemos instalado en Linux el programa, tendremos que ejecutar las siguientes órdenes en el terminal:

sudo apt-get install libatk1.0-0 libc6 libcairo2 libfontconfig1 libfreetype6 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk2.0-0  libidl0 libnspr4 libnss3 libpango1.0-0 libpng12-0 libstdc++6 libx11-6 libxft2 libxinerama1 libxrender1 libxt6 zlib1g

wget https://launchpad.net/ubuntu/+archive/primary/+files/kompozer-data_0.8%7Eb3.dfsg.1-0.1ubuntu2_all.deb

wget https://launchpad.net/ubuntu/+archive/primary/+files/kompozer_0.8%7Eb3.dfsg.1-0.1ubuntu2_i386.deb

sudo dpkg -i kompozer-data_0.8~b3.dfsg.1-0.1ubuntu2_all.deb

sudo dpkg -i kompozer_0.8~b3.dfsg.1-0.1ubuntu2_i386.deb

Para ponerlo en español hay que descargar este .xpi:
http://kompozer.sourceforge.net/l10n/langpacks/kompozer-0.8b3/
A continuación, abriendo KompoZer en inglés, en Tools, abrir Add-ons y allí eligimos el .xpi descargado.

Finalmente, para alojar gratuitamente nuestro sitio web podemos usar el servicio que ofrece www.hostinger.es,

El programa FileZilla nos servirá para subir los archivos que componen nuestro sitio web al servidor.

Creación de página web


El alumnado de 4º de Diversificación realizará esta práctica para evaluar su aprendizaje en la unidad didáctica dedicada a creación de páginas web. Se trabajará con el editor de páginas web NVU.

Así, deberéis hacer una web sobre cualquier tema con las siguientes condiciones:

a) La web tendrá como mínimo cinco páginas.

b) Cada página mostrará al menos una imagen.

c) La web incluirá tres hiperenlaces relacionados con el tema de la misma.

d) Las páginas de tu sitio web estarán enlazadas entre sí.

Recuerda que debes crear una carpeta que contenga todos los archivos html. Nombra esta carpeta como WEBAPELLIDOS. La página principal debe tener el nombre de index y te recomiendo que las imágenes las guardes en una subcarpeta de recursos. Una vez terminado, comprime la carpeta y envíala a la dirección de correo josempanadero@gmail.com

Los criterios de evaluación son los siguientes:

– Contenido (redacción propia y originalidad). 4 puntos.

– Formato……………………………………………….. 3 puntos.

– Inclusión de imágenes ……………………………. 1 punto.

– Enlaces externos……………………………………. 1 punto.

– Enlace entre páginas ………………………………. 1 punto.

Finalmente, si queréis publicar vuestra web, el siguiente enlace os puede ser de utilidad: http://www.awardspace.com

Editor de página web.


Para los alumnos y alumnas de 3º os propongo esta pequeña práctica de iniciación en creación de sitios web. Así, vamos a crear una web sobre Espejo siguiendo los pasos que expongo a continuación.

1º Crea en el escritorio una carpeta con el nombre apellidosweb.

2º Abre NVU.

3º Abre el menú Archivo y selecciona la opción Nuevo.

4º Activa la opción Un documento vacío y haz click sobre el botón Crear.

Inserta una tabla que tenga una anchura del 100% de la ventana y borde 0, con el objetivo de que te sirva para estructurar la información que vas a exponer.

6º Añade a esta página texto sobre la historia de Espejo, insertando al menos una imagen y encabezándola con un título. Selecciona los colores de fondo, de texto, así como todas las posibilidades que tiene el programa para que el diseño de la web sea atractivo. Recuerda que la imagen o imágenes que incluyas en la web debes incluirlas en la carpeta apellidosweb creada anteriormente.

7º Inserta un enlace o link a otra web que aborde la historia de Espejo.

8º Guarda la página creada con el título Historia de Espejo y con el nombre index en la carpeta apellidosweb.

9º Comprime la carpeta apellidosweb y envíala a mi mail a través del aula virtual.

Recursos.

http://espejo.egeneracion.info/index.php/mod.pags/mem.detalle/idpag.17/idmenu.117/chk.8cc53d7a57e6392c24d25ea55fea6710.html

http://es.wikipedia.org/wiki/Espejo_(C%C3%B3rdoba)

http://www.pueblos-espana.org/andalucia/cordoba/espejo/

http://www.ucubi.com/index.html