jueves, 9 de enero de 2014

PHP y MySQL

Siguiendo uno de los ejemplos de moodle he creado una base de datos que contiene el contenido que quiero actualizar a la cual solo yo tengo acceso, de esta forma puedo actualizar el contenido de la pagina web de forma mas rápida.

En contacto he creado una sección con la dirección y el correo de contacto utilizando PHP

Analisis primer estilo


Como ya he explicado antes, me he descargado una plantilla de www.css3templates.co.uk y la he modificado a mi gusto, cambiando el fondo, las fotos, colores, etc. 

Cabecera:

Se encuentra el titulo de mi pagina y al lado el conmutador de estilos. Inicialmente había tres, pero he eliminado uno de ellos porque solo me interesan dos. El titulo tenia dos colores, yo he puesto solo uno porque me parece que da mas uniformidad a mi pagina.


Novedades:

Situado en un bloque a la izquierda de la pagina, contiene las ultimas actualizaciones que he hecho. Se encuentra en un recuadro del mismo color que el titulo y la barra superior para que la pagina web sea mas profesional. En novedades se incluyen las fotos de mis ultimas actualizaciones y una breve descripción.



Menú:

En la barra de menú he creado distintas secciones para clasificar las recetas según el tipo de ocasión. He dedicado la ultima sección a contacto, para que los interesados puedan contactar conmigo si tienen alguna duda.
No he creado ningún desglose en las secciones ya que no me parece necesario.


Contenido:

El contenido principal no lo he podido modificar todavía, porque necesito las recetas, así que lo modificare mas adelante de la siguiente forma. En la pagina inicial escribiré una introducción a mi pagina web, explicando a quien va dirigida y el tipo de recetas que contiene. En cada sección describiré las recetas una por una.


En la sección de contacta he añadido mi correo como ya he explicado anteriormente, y he facilitado una dirección aunque no creo que sea necesario.


Pie de pagina:

El pie de pagina no lo he modificado ya que me gusta la simplicidad que tiene el de la plantilla que me he descargado. Así pues he respetado el copyright que aparece en ella

Cambio de estilo

Gracias al cambio de estilo, podemos ver la pagina web con dos estilos distintos. Inicialmente había tres estilos distintos, pero he eliminado el ultimo ya que solo quiero poner dos. Como están instaladas las cookies, cuando entremos de nuevo en la pagina web aparecerá el ultimo estilo que hemos visitado. Si accedemos por primera vez, aparecerá el estilo azul por defecto.

Primer estilo:
El estilo del cuadrado azul tiene el siguiente diseño:


  • Color de fondo amarillo
  • Letra rosa
  • Barra superior recuadrada
  • Bloque de novedades a la izquierda 
Segundo estilo:
  • Imagen de fondo
  • Titulo a doble color
  • Letra gris
  • Barra superior no tiene recuadro
  • Bloque de novedades la derecha
En el segundo estilo he modificado únicamente la pagina de inicio, las otras secciones las modificare mas adelante , ya que este estilo no es permanente, lo modificare mas adelante cuando tenga el contenido de las recetas.


Creando la web

Para crear la web en primer lugar me he descargado una plantilla de "www.css3templateces.co.uk" y la he modificado a mi gusto. Para ello, he cambiado el color del fondo, el tipo de letra y el color, y he añadido fotos de las recetas y noticias. He modificado cada sección de mi pagina web de esta forma, y he clasificado las recetas según la sección a la que corresponden. En la pagina inicial he puesto una receta de cada, y una sección con noticias de las ultimas recetas publicadas. He comprimido las fotos con pixlr para que tarden menos en cargarse. No he cambiado el texto de la pagina inicial ni de las distintas secciones, ya que he preferido centrarme en el estilo de mi pagina. Mas adelante lo modificare con una introducción a mi pagina web y la explicación de las distintas recetas.

El footer no lo he modificado, he respetado el copyright de la plantilla.


En la sección de contacto he añadido una dirección cualquiera que modificare mas adelante, y he facilitado mi dirección de correo para que puedan contactar conmigo . Mas adelante explicare como lo he modificado


El cambio de estilos lo he colocado al lado del titulo de la pagina, para ello he seguido los pasos de un cambio de estilos que he encontrado.