Creación de sitios Web a medida con CMS par un curso de profesorado de la Universidad de Zaragoza

1. Construcción de sitios web
a medida con CMS
Wordpress, Joomla y Drupal

2. Construcción de sitios web a medida con CMS
Presentación del curso

3. Construcción de sitios web a medida con CMS
Presentación del curso
¿Qué es un CMS?

4. Construcción de sitios web a medida con CMS
Presentación del curso
¿Qué es un CMS?
Ventajas de la utilización de un CMS en la creación
de sitios Web

5. Construcción de sitios web a medida con CMS
Presentación del curso
¿Qué es un CMS?
Ventajas de la utilización de un CMS en la creación
de sitios Web
Visión general de los CMS más conocidos:
Wordpress, Joomla, Drupal

6. Construcción de sitios web a medida con CMS
Presentación del curso
¿Qué es un CMS?
Ventajas de la utilización de un CMS en la creación
de sitios Web
Visión general de los CMS más conocidos:
Wordpress, Joomla, Drupal
Creación y personalización de un sitio Web con
Wordpress

7. Construcción de sitios web a medida con CMS
¿Qué es un CMS?

8. Construcción de sitios web a medida con CMS
¿Qué es un CMS?
Son las siglas en Inglés de: “Content Management
System”:

9. Construcción de sitios web a medida con CMS
¿Qué es un CMS?
Son las siglas en Inglés de: “Content Management
System”:
Sistema de Gestión de Contenidos

10. Construcción de sitios web a medida con CMS
¿Qué es un CMS?
Son las siglas en Inglés de: “Content Management
System”:
Sistema de Gestión de Contenidos
Una forma de crear y administrar sitios web de una
manera intuitiva

11. Construcción de sitios web a medida con CMS
Página web tradicional

12. Construcción de sitios web a medida con CMS
Página web tradicional

13. Construcción de sitios web a medida con CMS
Página web tradicional

14. Construcción de sitios web a medida con CMS
Página web tradicional

15. Construcción de sitios web a medida con CMS
Página web tradicional
INSERTAR UNA IMAGEN

16. Construcción de sitios web a medida con CMS
Página web tradicional
INSERTAR UNA IMAGEN
<img alt="Header image" src="http://misitio.es/cursos/
wp/wp-content/uploads/2008/06/banner03.jpg" />

17. Construcción de sitios web a medida con CMS
Página web tradicional
INSERTAR UNA IMAGEN
<img alt="Header image" src="http://misitio.es/cursos/
wp/wp-content/uploads/2008/06/banner03.jpg" />
CREAR UN ENLACE

18. Construcción de sitios web a medida con CMS
Página web tradicional
INSERTAR UNA IMAGEN
<img alt="Header image" src="http://misitio.es/cursos/
wp/wp-content/uploads/2008/06/banner03.jpg" />
CREAR UN ENLACE
<a class="feed" href="http://misitio.es/cursos/
wp/?">Enlace</a>

19. Construcción de sitios web a medida con CMS
Sitio web tradicional

20. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO

21. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
PÁGINAS

22. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
PÁGINAS

23. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
PÁGINAS

24. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
PÁGINAS

25. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
PÁGINAS
IMÁGENES

26. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
DOCUMENTOS
PÁGINAS
IMÁGENES

27. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
DOCUMENTOS
PÁGINAS
IMÁGENES

28. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
DOCUMENTOS
PÁGINAS
IMÁGENES

29. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
DOCUMENTOS
PÁGINAS
IMÁGENES

30. Construcción de sitios web a medida con CMS
Sitio web tradicional
INICIO
DOCUMENTOS
PÁGINAS
Administrador
IMÁGENES

31. Construcción de sitios web a medida con CMS
Problemas de un sitio
Web tradicional

32. Construcción de sitios web a medida con CMS
Problemas de un sitio
Web tradicional

33. Construcción de sitios web a medida con CMS
Problemas de un sitio
Web tradicional
Hay que conocer el lenguaje HTML para
componer la página, o tener un software que
convierta nuestra página a código HTML

34. Construcción de sitios web a medida con CMS
Problemas de un sitio
Web tradicional
Hay que conocer el lenguaje HTML para
componer la página, o tener un software que
convierta nuestra página a código HTML
El contenido y la forma están juntos

35. Construcción de sitios web a medida con CMS
Problemas de un sitio
Web tradicional
Hay que conocer el lenguaje HTML para
componer la página, o tener un software que
convierta nuestra página a código HTML
El contenido y la forma están juntos
La actualización de los sitios es una tarea
compleja

36. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS

37. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
USUARIO

38. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
USUARIO ADMINISTRADOR

39. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
USUARIO ADMINISTRADOR

40. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
USUARIO ADMINISTRADOR

41. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
USUARIO ADMINISTRADOR

42. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
USUARIO ADMINISTRADOR

43. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
BASE DE DATOS
USUARIO ADMINISTRADOR

44. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
BASE DE DATOS
USUARIO ADMINISTRADOR

45. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
BASE DE DATOS
PRESENTACIÓN
USUARIO ADMINISTRADOR

46. Construcción de sitios web a medida con CMS
Funcionamiento de un CMS
CONTENIDOS
BASE DE DATOS
PRESENTACIÓN
USUARIO ADMINISTRADOR

47. Construcción de sitios web a medida con CMS
Páginas dinámicas

48. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB

49. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB

50. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB

51. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB

52. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS

53. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS

54. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS

55. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS

56. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS

57. Construcción de sitios web a medida con CMS
Páginas dinámicas
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
PÁGINA DINÁMICA

58. Construcción de sitios web a medida con CMS
Esquema usuario

59. Construcción de sitios web a medida con CMS
Esquema usuario
PÁGINA WEB

60. Construcción de sitios web a medida con CMS
Esquema usuario
BASE DE DATOS
PÁGINA WEB

61. Construcción de sitios web a medida con CMS
Esquema usuario
BANNER-TÍTULO
BASE DE DATOS
PÁGINA WEB

62. Construcción de sitios web a medida con CMS
Esquema usuario
BANNER-TÍTULO
MENÚ
BASE DE DATOS
PÁGINA WEB

63. Construcción de sitios web a medida con CMS
Esquema usuario
BANNER-TÍTULO
MENÚ
CONTENIDO
BASE DE DATOS
PÁGINA WEB

64. Construcción de sitios web a medida con CMS
Esquema usuario
BANNER-TÍTULO
MENÚ
CONTENIDO
BASE DE DATOS
PÁGINA WEB

65. Construcción de sitios web a medida con CMS
Esquema administrador

66. Construcción de sitios web a medida con CMS
Esquema administrador
PÁGINA WEB

67. Construcción de sitios web a medida con CMS
Esquema administrador
BASE DE DATOS
PÁGINA WEB

68. Construcción de sitios web a medida con CMS
Esquema administrador
EDITOR DE
TEXTOS
BASE DE DATOS
PÁGINA WEB

69. Construcción de sitios web a medida con CMS
Esquema administrador
EDITOR DE
TEXTOS
BASE DE DATOS
PÁGINA WEB

70. Construcción de sitios web a medida con CMS
Esquema general
EDITOR DE
TEXTOS
BANNER-TÍTULO
MENÚ
CONTENIDO

71. Construcción de sitios web a medida con CMS
Esquema general
EDITOR DE
TEXTOS
BANNER-TÍTULO
MENÚ
BASE DE DATOS
CONTENIDO

72. Construcción de sitios web a medida con CMS
Esquema general
EDITOR DE
TEXTOS
BANNER-TÍTULO
MENÚ
BASE DE DATOS
CONTENIDO

73. Construcción de sitios web a medida con CMS
Esquema general
EDITOR DE
TEXTOS
BANNER-TÍTULO
MENÚ
BASE DE DATOS
CONTENIDO

74. Construcción de sitios web a medida con CMS
Requerimientos para la instalación

75. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB

76. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS

77. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS

78. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
ACCESO FTP

79. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
ACCESO FTP
PAQUETE DE INSTALACIÓN

80. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
ACCESO FTP
PAQUETE DE INSTALACIÓN

81. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
ACCESO FTP

82. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
ACCESO FTP

83. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
ACCESO FTP

84. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
ACCESO FTP

85. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
ACCESO FTP

86. Construcción de sitios web a medida con CMS
Requerimientos para la instalación
SERVIDOR DE PÁGINAS WEB SERVIDOR DE BASES DE DATOS
ACCESO FTP ACCESO MYSQL

87. Construcción de sitios web a medida con CMS
proceso de instalación

88. Construcción de sitios web a medida con CMS
proceso de instalación

89. Construcción de sitios web a medida con CMS
proceso de instalación

90. Construcción de sitios web a medida con CMS
proceso de instalación

91. Construcción de sitios web a medida con CMS
Programas
Wordpress Joomla Drupal

92. Construcción de sitios web a medida con CMS
Programas
Wordpress Joomla Drupal
Dificultad
Posibilidades

93. Construcción de sitios web a medida con CMS
Programas
Wordpress Joomla Drupal
Dificultad
Posibilidades

94. Construcción de sitios web a medida con CMS
Programas
Wordpress Joomla Drupal
Dificultad
Posibilidades

95. Construcción de sitios web a medida con CMS
Programas
Wordpress Joomla Drupal
Dificultad
Posibilidades

96. Construcción de sitios web a medida con CMS
Programas

97. Construcción de sitios web a medida con CMS
Programas
Utilizan licencia GPL que permita que sea libremente
usado por cualquiera.

98. Construcción de sitios web a medida con CMS
Programas
Utilizan licencia GPL que permita que sea libremente
usado por cualquiera.
Detrás de cada herramienta hay una comunidad de
desarrolladores que actualizan la herramienta así como
sus componentes.

99. Construcción de sitios web a medida con CMS
Programas
Utilizan licencia GPL que permita que sea libremente
usado por cualquiera.
Detrás de cada herramienta hay una comunidad de
desarrolladores que actualizan la herramienta así como
sus componentes.
Existe gran cantidad de recursos en la red para el
aprendizaje y el desarrollo de las plataformas.

100. Construcción de sitios web a medida con CMS
Programas

101. Construcción de sitios web a medida con CMS
Programas
WORDPRESS

102. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA

103. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL

104. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL
Página Web
Personales

105. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL
Página Web
Personales
Información de
asignaturas

106. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL
Página Web
Personales
Información de
asignaturas
Blogs

107. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL
Página Web Trabajo
Personales colaborativo
Información de
asignaturas
Blogs

108. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL
Página Web Trabajo
Personales colaborativo
Información de Grupos de
asignaturas estudiantes
Blogs

109. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL
Página Web Trabajo
Personales colaborativo
Información de Grupos de
asignaturas estudiantes
Blogs Sitios dinámicos
de trabajo

110. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL
Página Web Trabajo
Personales colaborativo Multisitio
Información de Grupos de
asignaturas estudiantes
Blogs Sitios dinámicos
de trabajo

111. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL
Página Web Trabajo
Personales colaborativo Multisitio
Información de Grupos de Comunidades de
asignaturas estudiantes usuarios
Blogs Sitios dinámicos
de trabajo

112. Construcción de sitios web a medida con CMS
Programas
WORDPRESS JOOMLA DRUPAL
Página Web Trabajo
Personales colaborativo Multisitio
Información de Grupos de Comunidades de
asignaturas estudiantes usuarios
Blogs Sitios dinámicos Intranets
de trabajo

113. Construcción de sitios web a medida con CMS
Wordpress

114. Construcción de sitios web a medida con CMS
Wordpress

115. Construcción de sitios web a medida con CMS
Wordpress
La empresa detrás de Wordpress se llama
Automatic

116. Construcción de sitios web a medida con CMS
Wordpress
La empresa detrás de Wordpress se llama
Automatic
La versión 1.5 fue lanzada a mediados de Febrero
del 2005 y la actual es la 2.8

117. Construcción de sitios web a medida con CMS
Wordpress
La empresa detrás de Wordpress se llama
Automatic
La versión 1.5 fue lanzada a mediados de Febrero
del 2005 y la actual es la 2.8
62,8 millones de sitios web en U.S y alrededor de
202 millones en todo el mundo (Datos de
Septiembre de 2009)

118. Construcción de sitios web a medida con CMS
Estructura de contenidos
PÁGINA

119. Construcción de sitios web a medida con CMS
Estructura de contenidos
PÁGINA PÁGINA

120. Construcción de sitios web a medida con CMS
Estructura de contenidos
PÁGINA PÁGINA PÁGINA

121. Construcción de sitios web a medida con CMS
Estructura de contenidos
PÁGINA PÁGINA PÁGINA PÁGINA

122. Construcción de sitios web a medida con CMS
Estructura de contenidos
..................
PÁGINA PÁGINA PÁGINA PÁGINA

123. Construcción de sitios web a medida con CMS
Estructura de contenidos
..................
PÁGINA PÁGINA PÁGINA PÁGINA

124. Construcción de sitios web a medida con CMS
Estructura de contenidos
..................
PÁGINA PÁGINA PÁGINA PÁGINA

125. Construcción de sitios web a medida con CMS
Estructura de contenidos
..................
PÁGINA PÁGINA PÁGINA PÁGINA
PÁGINA DE ENTRADAS

126. Construcción de sitios web a medida con CMS
Estructura de contenidos
..................
PÁGINA PÁGINA PÁGINA PÁGINA
PÁGINA DE ENTRADAS
DEFINIR LA PÁGINA DE INICIO

127. Construcción de sitios web a medida con CMS
Estructura de página

128. Construcción de sitios web a medida con CMS
Estructura de página
BANNER

129. Construcción de sitios web a medida con CMS
Estructura de página
BANNER
MENUS

130. Construcción de sitios web a medida con CMS
Estructura de página
BANNER
MENUS
WIDGET

131. Construcción de sitios web a medida con CMS
Estructura de página
BANNER
MENUS
CONTENIDO
WIDGET

132. Construcción de sitios web a medida con CMS
Aspecto visual de la página: temas

133. Construcción de sitios web a medida con CMS
Aspecto visual de la página: temas

134. Construcción de sitios web a medida con CMS
Aspecto visual de la página: temas

135. Construcción de sitios web a medida con CMS
Aspecto visual de la página: temas

136. Construcción de sitios web a medida con CMS
Aspecto visual de la página: temas

137. Construcción de sitios web a medida con CMS
Joomla

138. Construcción de sitios web a medida con CMS
Joomla

139. Construcción de sitios web a medida con CMS
Joomla
Joomla nace de otro proyecto llamado Mambot en
Agosto de 2005

140. Construcción de sitios web a medida con CMS
Joomla
Joomla nace de otro proyecto llamado Mambot en
Agosto de 2005
La versión actual es la 1.5

141. Construcción de sitios web a medida con CMS
Joomla
Joomla nace de otro proyecto llamado Mambot en
Agosto de 2005
La versión actual es la 1.5
Joomla se basa en los módulos y componentes. La
lista de estos crece día a día

142. Joomla
Construcción de sitios web a medida con CMS

143. Joomla
Construcción de sitios web a medida con CMS
COMPONENTE

144. Joomla
Construcción de sitios web a medida con CMS
TOP
COMPONENTE

145. Joomla
Construcción de sitios web a medida con CMS
TOP
COMPONENTE
LEFT

146. Joomla
Construcción de sitios web a medida con CMS
TOP
COMPONENTE
LEFT

147. Joomla
Construcción de sitios web a medida con CMS
TOP
COMPONENTE
LEFT

148. Joomla
Construcción de sitios web a medida con CMS
TOP
COMPONENTE
LEFT

149. Joomla
Construcción de sitios web a medida con CMS
TOP
COMPONENTE
LEFT

150. Joomla
Construcción de sitios web a medida con CMS
TOP
COMPONENTE
LEFT

151. Joomla
Construcción de sitios web a medida con CMS
TOP
COMPONENTE
LEFT

152. Joomla
Construcción de sitios web a medida con CMS
TOP
COMPONENTE
LEFT

153. Joomla
Construcción de sitios web a medida con CMS
TEXTO
TOP
COMPONENTE
LEFT

154. Joomla
Construcción de sitios web a medida con CMS
TEXTO
TOP
MENU
MENU
COMPONENTE
LEFT
MENU

155. Joomla
Construcción de sitios web a medida con CMS
TEXTO
TOP BUSCADOR
MENU
MENU
COMPONENTE
LEFT
MENU

156. Joomla
Construcción de sitios web a medida con CMS
TEXTO
TOP BUSCADOR
MENU
HTML
MENU
COMPONENTE
LEFT
MENU

157. Joomla
Construcción de sitios web a medida con CMS
TEXTO
TOP BUSCADOR
MENU
HTML
MENU
COMPONENTE
LEFT
MENU
IMAGEN

158. Joomla
Construcción de sitios web a medida con CMS

159. Joomla
Construcción de sitios web a medida con CMS

160. Joomla
Construcción de sitios web a medida con CMS

161. Joomla
Construcción de sitios web a medida con CMS

162. Joomla
Construcción de sitios web a medida con CMS

163. Joomla
Construcción de sitios web a medida con CMS

164. Joomla
Construcción de sitios web a medida con CMS

165. Joomla
Construcción de sitios web a medida con CMS
Al crear cada página hay que crear también el
correspondiente enlace en uno de los menús
porque estos no se crean automáticamente
como en Wordpress

166. Construcción de sitios web a medida con CMS
Drupal

167. Construcción de sitios web a medida con CMS
Drupal

168. Construcción de sitios web a medida con CMS
Drupal
Drupal se crea como un proyecto de distribución
libre (open source) en 2001

169. Construcción de sitios web a medida con CMS
Drupal
Drupal se crea como un proyecto de distribución
libre (open source) en 2001
La versión actual es la 6.14

170. Construcción de sitios web a medida con CMS
Drupal
Drupal se crea como un proyecto de distribución
libre (open source) en 2001
La versión actual es la 6.14
Se utiliza en numeroso sitios web con altos
requerimientos, como por ejemplo la página web
de la casablanca: http://www.whitehouse.gov/

171. Construcción de sitios web a medida con CMS
Drupal
MOTOR QUE GENERA

172. Construcción de sitios web a medida con CMS
Drupal
MOTOR QUE GENERA

173. Construcción de sitios web a medida con CMS
Drupal
MOTOR QUE GENERA

174. Construcción de sitios web a medida con CMS
Drupal
MOTOR QUE GENERA

175. Construcción de sitios web a medida con CMS
Drupal
MOTOR QUE GENERA
SITIOS WEB

176. Construcción de sitios web a medida con CMS
Drupal
MOTOR QUE GENERA
SISTEMAS DE
SITIOS WEB DESCARGA

177. Construcción de sitios web a medida con CMS
Drupal
MOTOR QUE GENERA
SISTEMAS DE
SITIOS WEB FOROS
DESCARGA

178. Construcción de sitios web a medida con CMS
Drupal
MOTOR QUE GENERA
SISTEMAS DE
SITIOS WEB FOROS INTRANETS
DESCARGA

179. Construcción de sitios web a medida con CMS
Drupal
MOTOR QUE GENERA
SISTEMAS DE
SITIOS WEB FOROS INTRANETS
DESCARGA
MÓDULOS

180. Construcción de sitios web a medida con CMS
Ideas finales
Los CMS nos ayudan a generar contenidos y a
administrar los cambios de una manera intuitiva
El software de las plataformas es libre y se va
actualizando periódicamente
Para poder utilizarlo necesitamos un servidor web
y un servidor de bases de datos
Los datos que nos darán será un acceso FTP y
una cuenta MySQL

181. Construcción de sitios web a medida con CMS
Fin
Fernando Cruz Bello