SlideShare una empresa de Scribd logo
1 de 11
W O L F w w w . w e b s i t e . c o m 1
W o r d C a m p M a d r i d 2 0 1 8 B E A T R I Z L A V E L A P É R E Z
Compositores
Visuales
Guarden los cuchillos
W O L F w w w . w e b s i t e . c o m 2
Compositores Visuales
Page Builders
Maquetadores
Sí, los uso
W O L F w w w . w e b s i t e . c o m 3
Sí, los uso
ALGUNOS CONOCIDOS
WPBakery
Divi Elementor
Page Builder by SiteOrigin
W O L F w w w . w e b s i t e . c o m 4
VENTAJAS
PUEDO EDITAR MI WEB
W O L F w w w . w e b s i t e . c o m 5
INCONVENIENTES
VISTA/CONTROLADOR
ESTILO UNIFICADO
Nº DE OPCIONES/COMPLEJIDAD
PARA APRENDER, MEJOR
APRENDER ESTÁNDARES
SUELEN SER DE PAGO/FREEMIUM
$
LOCK-IN
EVOLUCIÓN
DATOS GOOGLE TRENDS
W O L F w w w . w e b s i t e . c o m 8
WordPress se pone las pilas
Gutenberg
W O L F w w w . w e b s i t e . c o m 9
Gutenberg en acción
W O L F w w w . w e b s i t e . c o m 10
Conclusiones
• Los humanos quieren tocar su web
• Solución mixta
• Gutenberg promete, pero tiene muchas críticas.
• No-facilidad de uso.
• Mucha gente no querrá aprendrer
• Compatibilidad con desarrollos antiguos
• Gutenberg crecerá, pero le queda
• No sabemos por dónde saldrá esta gran revolución
W O L F w w w . w e b s i t e . c o m 11
G R A C I A S
B E AT R I Z L AV E L A P É R E Z
@BeatrizLavela
hola@bealavela.es

Más contenido relacionado

La actualidad más candente

Segundo powerpoint
Segundo powerpointSegundo powerpoint
Segundo powerpointavispilla
 
Andres granda v
Andres granda vAndres granda v
Andres granda vaagranda00
 
Mini Maker Faire Bcn 2016 - Taller All VR Education
Mini Maker Faire Bcn 2016 - Taller All VR EducationMini Maker Faire Bcn 2016 - Taller All VR Education
Mini Maker Faire Bcn 2016 - Taller All VR EducationAll VR Education
 
Universidad técnica de manabí
Universidad técnica de manabíUniversidad técnica de manabí
Universidad técnica de manabíhenryloor
 
Taller Intro @all_VR_edu en #FricsTech
Taller Intro @all_VR_edu en #FricsTechTaller Intro @all_VR_edu en #FricsTech
Taller Intro @all_VR_edu en #FricsTechAll VR Education
 
Qué son y para qué sirven los Hangouts de Google+
Qué son y para qué sirven los Hangouts de Google+Qué son y para qué sirven los Hangouts de Google+
Qué son y para qué sirven los Hangouts de Google+econred
 
20 cosas que hay que ponerle a tu blog y 20 que hay que quitarle
20 cosas que hay que ponerle a tu blog y 20 que hay que quitarle20 cosas que hay que ponerle a tu blog y 20 que hay que quitarle
20 cosas que hay que ponerle a tu blog y 20 que hay que quitarleMariano Pérez
 
Curso redes sociales clasejueves
Curso redes sociales clasejuevesCurso redes sociales clasejueves
Curso redes sociales clasejuevesBetty Rugeles
 
Producir un videoblog
Producir un videoblogProducir un videoblog
Producir un videoblogedgarcajun
 

La actualidad más candente (17)

Blog
BlogBlog
Blog
 
Segundo powerpoint
Segundo powerpointSegundo powerpoint
Segundo powerpoint
 
Curador
CuradorCurador
Curador
 
Andres granda v
Andres granda vAndres granda v
Andres granda v
 
Live 1 2021
Live 1 2021Live 1 2021
Live 1 2021
 
Tp 15
Tp 15Tp 15
Tp 15
 
Mini Maker Faire Bcn 2016 - Taller All VR Education
Mini Maker Faire Bcn 2016 - Taller All VR EducationMini Maker Faire Bcn 2016 - Taller All VR Education
Mini Maker Faire Bcn 2016 - Taller All VR Education
 
Universidad técnica de manabí
Universidad técnica de manabíUniversidad técnica de manabí
Universidad técnica de manabí
 
Taller Intro @all_VR_edu en #FricsTech
Taller Intro @all_VR_edu en #FricsTechTaller Intro @all_VR_edu en #FricsTech
Taller Intro @all_VR_edu en #FricsTech
 
Sistema de videconferencia
Sistema de videconferenciaSistema de videconferencia
Sistema de videconferencia
 
Montage
MontageMontage
Montage
 
Como instalar hangouts pdf
Como instalar hangouts pdfComo instalar hangouts pdf
Como instalar hangouts pdf
 
Qué son y para qué sirven los Hangouts de Google+
Qué son y para qué sirven los Hangouts de Google+Qué son y para qué sirven los Hangouts de Google+
Qué son y para qué sirven los Hangouts de Google+
 
Oct
OctOct
Oct
 
20 cosas que hay que ponerle a tu blog y 20 que hay que quitarle
20 cosas que hay que ponerle a tu blog y 20 que hay que quitarle20 cosas que hay que ponerle a tu blog y 20 que hay que quitarle
20 cosas que hay que ponerle a tu blog y 20 que hay que quitarle
 
Curso redes sociales clasejueves
Curso redes sociales clasejuevesCurso redes sociales clasejueves
Curso redes sociales clasejueves
 
Producir un videoblog
Producir un videoblogProducir un videoblog
Producir un videoblog
 

Similar a Beatriz lavela compositores visuales

leccion primer parcial segundo quimestre
leccion primer parcial segundo quimestre leccion primer parcial segundo quimestre
leccion primer parcial segundo quimestre violeta9915
 
Device Days 2012 - HTML5 y CSS3 para móvil
Device Days 2012 - HTML5 y CSS3 para móvilDevice Days 2012 - HTML5 y CSS3 para móvil
Device Days 2012 - HTML5 y CSS3 para móvilJavier Usobiaga
 
Los page builders en WordPress: qué son, y como usarlos para diseñar contenidos
Los page builders en WordPress: qué son, y como usarlos para diseñar contenidosLos page builders en WordPress: qué son, y como usarlos para diseñar contenidos
Los page builders en WordPress: qué son, y como usarlos para diseñar contenidosManuel Vicedo
 
Actividad evaluable 5-Amadeo Abal Chaves
Actividad evaluable 5-Amadeo Abal ChavesActividad evaluable 5-Amadeo Abal Chaves
Actividad evaluable 5-Amadeo Abal ChavesAmadeo Abal Chaves
 
Vlog - La evolución en la era de la Web 3.0
Vlog - La evolución en la era de la Web 3.0Vlog - La evolución en la era de la Web 3.0
Vlog - La evolución en la era de la Web 3.0Armando Alvarado
 
Mi_caja_de_herramientas_TIC-2.pdf
Mi_caja_de_herramientas_TIC-2.pdfMi_caja_de_herramientas_TIC-2.pdf
Mi_caja_de_herramientas_TIC-2.pdfrosalba212
 
tendencias en el desarrollo de software
tendencias en el desarrollo de softwaretendencias en el desarrollo de software
tendencias en el desarrollo de softwareRobal96
 
El aula en la web 2.0
El aula en la web 2.0El aula en la web 2.0
El aula en la web 2.0sabwilliams
 
Claudio Adrian Natoli - Tendencias en el diseño web 2015
Claudio Adrian Natoli - Tendencias en el diseño web 2015Claudio Adrian Natoli - Tendencias en el diseño web 2015
Claudio Adrian Natoli - Tendencias en el diseño web 2015Claudio Adrian Natoli Michieli
 
Introduccion a html5
Introduccion  a  html5Introduccion  a  html5
Introduccion a html5REYMIS820
 
Introduccion a html5
Introduccion  a  html5Introduccion  a  html5
Introduccion a html5REYMIS820
 
Diseñando la web móvil con HTML5 y CSS3
Diseñando la web móvil con HTML5 y CSS3Diseñando la web móvil con HTML5 y CSS3
Diseñando la web móvil con HTML5 y CSS3Marta Armada
 

Similar a Beatriz lavela compositores visuales (20)

Weebly
WeeblyWeebly
Weebly
 
leccion primer parcial segundo quimestre
leccion primer parcial segundo quimestre leccion primer parcial segundo quimestre
leccion primer parcial segundo quimestre
 
Device Days 2012 - HTML5 y CSS3 para móvil
Device Days 2012 - HTML5 y CSS3 para móvilDevice Days 2012 - HTML5 y CSS3 para móvil
Device Days 2012 - HTML5 y CSS3 para móvil
 
Los page builders en WordPress: qué son, y como usarlos para diseñar contenidos
Los page builders en WordPress: qué son, y como usarlos para diseñar contenidosLos page builders en WordPress: qué son, y como usarlos para diseñar contenidos
Los page builders en WordPress: qué son, y como usarlos para diseñar contenidos
 
Adoble dreanweare1
Adoble dreanweare1Adoble dreanweare1
Adoble dreanweare1
 
Qué es un blog
Qué es un blogQué es un blog
Qué es un blog
 
Qué es un blog
Qué es un blogQué es un blog
Qué es un blog
 
Actividad evaluable 5-Amadeo Abal Chaves
Actividad evaluable 5-Amadeo Abal ChavesActividad evaluable 5-Amadeo Abal Chaves
Actividad evaluable 5-Amadeo Abal Chaves
 
Wordpress
WordpressWordpress
Wordpress
 
Vlog - La evolución en la era de la Web 3.0
Vlog - La evolución en la era de la Web 3.0Vlog - La evolución en la era de la Web 3.0
Vlog - La evolución en la era de la Web 3.0
 
Mi_caja_de_herramientas_TIC-2.pdf
Mi_caja_de_herramientas_TIC-2.pdfMi_caja_de_herramientas_TIC-2.pdf
Mi_caja_de_herramientas_TIC-2.pdf
 
Diseño de web
Diseño de webDiseño de web
Diseño de web
 
tendencias en el desarrollo de software
tendencias en el desarrollo de softwaretendencias en el desarrollo de software
tendencias en el desarrollo de software
 
3 dslideshare
3 dslideshare3 dslideshare
3 dslideshare
 
El aula en la web 2.0
El aula en la web 2.0El aula en la web 2.0
El aula en la web 2.0
 
Tendencias en el diseño web 2015
Tendencias en el diseño web 2015Tendencias en el diseño web 2015
Tendencias en el diseño web 2015
 
Claudio Adrian Natoli - Tendencias en el diseño web 2015
Claudio Adrian Natoli - Tendencias en el diseño web 2015Claudio Adrian Natoli - Tendencias en el diseño web 2015
Claudio Adrian Natoli - Tendencias en el diseño web 2015
 
Introduccion a html5
Introduccion  a  html5Introduccion  a  html5
Introduccion a html5
 
Introduccion a html5
Introduccion  a  html5Introduccion  a  html5
Introduccion a html5
 
Diseñando la web móvil con HTML5 y CSS3
Diseñando la web móvil con HTML5 y CSS3Diseñando la web móvil con HTML5 y CSS3
Diseñando la web móvil con HTML5 y CSS3
 

Último

12 Clasificacion de las Computadoras.pdf
12 Clasificacion de las Computadoras.pdf12 Clasificacion de las Computadoras.pdf
12 Clasificacion de las Computadoras.pdfedwinmelgarschlink2
 
Buscadores, SEM SEO: el desafío de ser visto en la web
Buscadores, SEM SEO: el desafío de ser visto en la webBuscadores, SEM SEO: el desafío de ser visto en la web
Buscadores, SEM SEO: el desafío de ser visto en la webDecaunlz
 
libro de Ciencias Sociales_6to grado.pdf
libro de Ciencias Sociales_6to grado.pdflibro de Ciencias Sociales_6to grado.pdf
libro de Ciencias Sociales_6to grado.pdfFAUSTODANILOCRUZCAST
 
Institucion educativa la esperanza sede la magdalena
Institucion educativa la esperanza sede la magdalenaInstitucion educativa la esperanza sede la magdalena
Institucion educativa la esperanza sede la magdalenadanielaerazok
 
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENAINSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENAdanielaerazok
 
COMPETENCIAS CIUDADANASadadadadadadada .pdf
COMPETENCIAS CIUDADANASadadadadadadada .pdfCOMPETENCIAS CIUDADANASadadadadadadada .pdf
COMPETENCIAS CIUDADANASadadadadadadada .pdfOscarBlas6
 
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdfNUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdfisrael garcia
 
institucion educativa la esperanza sede magdalena
institucion educativa la esperanza sede magdalenainstitucion educativa la esperanza sede magdalena
institucion educativa la esperanza sede magdalenajuniorcuellargomez
 
Guia para el registro en el sitio slideshare.pdf
Guia para el registro en el sitio slideshare.pdfGuia para el registro en el sitio slideshare.pdf
Guia para el registro en el sitio slideshare.pdflauradbernals
 
COMOGANARAMIGODPARACRISTOIGLESIAADVENTISTANECOCLI,COM
COMOGANARAMIGODPARACRISTOIGLESIAADVENTISTANECOCLI,COMCOMOGANARAMIGODPARACRISTOIGLESIAADVENTISTANECOCLI,COM
COMOGANARAMIGODPARACRISTOIGLESIAADVENTISTANECOCLI,COMcespitiacardales
 

Último (10)

12 Clasificacion de las Computadoras.pdf
12 Clasificacion de las Computadoras.pdf12 Clasificacion de las Computadoras.pdf
12 Clasificacion de las Computadoras.pdf
 
Buscadores, SEM SEO: el desafío de ser visto en la web
Buscadores, SEM SEO: el desafío de ser visto en la webBuscadores, SEM SEO: el desafío de ser visto en la web
Buscadores, SEM SEO: el desafío de ser visto en la web
 
libro de Ciencias Sociales_6to grado.pdf
libro de Ciencias Sociales_6to grado.pdflibro de Ciencias Sociales_6to grado.pdf
libro de Ciencias Sociales_6to grado.pdf
 
Institucion educativa la esperanza sede la magdalena
Institucion educativa la esperanza sede la magdalenaInstitucion educativa la esperanza sede la magdalena
Institucion educativa la esperanza sede la magdalena
 
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENAINSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
 
COMPETENCIAS CIUDADANASadadadadadadada .pdf
COMPETENCIAS CIUDADANASadadadadadadada .pdfCOMPETENCIAS CIUDADANASadadadadadadada .pdf
COMPETENCIAS CIUDADANASadadadadadadada .pdf
 
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdfNUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
 
institucion educativa la esperanza sede magdalena
institucion educativa la esperanza sede magdalenainstitucion educativa la esperanza sede magdalena
institucion educativa la esperanza sede magdalena
 
Guia para el registro en el sitio slideshare.pdf
Guia para el registro en el sitio slideshare.pdfGuia para el registro en el sitio slideshare.pdf
Guia para el registro en el sitio slideshare.pdf
 
COMOGANARAMIGODPARACRISTOIGLESIAADVENTISTANECOCLI,COM
COMOGANARAMIGODPARACRISTOIGLESIAADVENTISTANECOCLI,COMCOMOGANARAMIGODPARACRISTOIGLESIAADVENTISTANECOCLI,COM
COMOGANARAMIGODPARACRISTOIGLESIAADVENTISTANECOCLI,COM
 

Beatriz lavela compositores visuales

  • 1. W O L F w w w . w e b s i t e . c o m 1 W o r d C a m p M a d r i d 2 0 1 8 B E A T R I Z L A V E L A P É R E Z Compositores Visuales Guarden los cuchillos
  • 2. W O L F w w w . w e b s i t e . c o m 2 Compositores Visuales Page Builders Maquetadores Sí, los uso
  • 3. W O L F w w w . w e b s i t e . c o m 3 Sí, los uso ALGUNOS CONOCIDOS WPBakery Divi Elementor Page Builder by SiteOrigin
  • 4. W O L F w w w . w e b s i t e . c o m 4 VENTAJAS PUEDO EDITAR MI WEB
  • 5. W O L F w w w . w e b s i t e . c o m 5 INCONVENIENTES VISTA/CONTROLADOR
  • 6. ESTILO UNIFICADO Nº DE OPCIONES/COMPLEJIDAD PARA APRENDER, MEJOR APRENDER ESTÁNDARES SUELEN SER DE PAGO/FREEMIUM $ LOCK-IN
  • 8. W O L F w w w . w e b s i t e . c o m 8 WordPress se pone las pilas Gutenberg
  • 9. W O L F w w w . w e b s i t e . c o m 9 Gutenberg en acción
  • 10. W O L F w w w . w e b s i t e . c o m 10 Conclusiones • Los humanos quieren tocar su web • Solución mixta • Gutenberg promete, pero tiene muchas críticas. • No-facilidad de uso. • Mucha gente no querrá aprendrer • Compatibilidad con desarrollos antiguos • Gutenberg crecerá, pero le queda • No sabemos por dónde saldrá esta gran revolución
  • 11. W O L F w w w . w e b s i t e . c o m 11 G R A C I A S B E AT R I Z L AV E L A P É R E Z @BeatrizLavela hola@bealavela.es

Notas del editor

  1. WordPress no es para blogs, sin embargo, resulta difícil personalizar nuestras páginas sin conocimientos de html/css o un tema que se ajuste. Si quiero añadir bloques, debo: Escribir html/css puro Que un programador me cree la página y si la quiero editar, tengo que contactar con él para cualquier cambio A veces el programador me puede crear un shortcode, que permite cierta personalización de variables. Compro un tema en themeforest que ya tiene el diseño implementado. El éxito de temas comerciales en Theme Forest y luego en su propio market ha sido incorporar un compositor visual, de manera que el cliente tiene unas propiedades básicas definidas y puede personalizar partes de contenido. La gente te mira mal cuando dices que lo usas… pero según mi opinión dependerá de cómo los usemos
  2. No hay que meter todos en el mismo saco…
  3. No dependo de shortcodes o la ayuda de un programador, yo mismo puedo editar mis páginas. Hay muchas otras, como que la mayoría te dejan crear bloques reutilizables, plantillas, cuenta con un banco de plantillas desde la cual partir… En general, el trabajo de maquetar es más rápido… y siempre puedo tocar css para ajustar cositas generales.
  4. Estos inconvenientes puede ser de uno o varios de los plugins, no tienen por qué ser de todos…
  5. A mayor número de opciones, más complejo es manejar el constructor. Si tenemos pocas opciones, puede quedársenos corto el constructor Dedicamos mucho tiempo a aprender este tipo de constructores, pensando que aprender html o css puede ser complejo. Ya que invertimos nuestro tiempo en aprender, lo suyo es aprender algo que nos pueda servir para todos los temas, y no para el que estemos usando en ese momento Si bien
  6. En este gráfico podemos ver el auge que han tenido los compositores visuales en los 5 últimos años. Sin entrar a hablar de otras plataformas como Wix o Squarespace, que por mucho que no sean nada óptimas a la hora de construir una web, ofrecen al usuario lo que demanda: poder crear su página web de manera autónoma.
  7. Gutenberg es un nuevo editor de WordPress. Espero que sepáis que recibe el nombre de Johannes Gutenberg, quien inventó la imprenta con teclas móviles hace más de 500 años. Se basa en la misma idea: tener bloques que podamos reutilizar en nuestra web. Saldrá en la versión 5.0 de WordPress, prevista para antes del tercer trimestre de este año. Matt tiene la Gutenbeard… y parece que le queda un rato para poder cortársela. Gutenberg está ahora mismo disponible como plugin, pero en la versión 5.0 se integrará en el core.
  8. Os voy a poner este vídeo de fondo… para que veáis un poco cómo funciona Gutenberg. Notad que en la mayoría del vídeo, sólo uso el teclado, cuando use el ratón aparecerá resaltado.
  9. Los humanos quieren meter nuestras patitas en su web. No es un privilegio de desarrolladores, diseñadores, etc. Con los compositores visuales, aprenden rápidamente dónde tocar (a veces también dónde no deben, sin querer). Soy partidaria de una solución mixta entre Page Builder y Custom Post Types. Si hay taxonomías de información, lo mejor es crear el Custom Posy Type para gestionarla, aunque otras partes de la web se usen mediante page builder. Gutenberg promete, pero creo que le falta un poco para que sea adoptado por la comunidad de usuarios. Ahora mismo, cunden las críticas, aunque personalmente la última versión la veo bastante chula. Personalmente, creo que algunos de los usuarios encontrarán un salto en la edición grande. El tener que mover el ratón para ver las opciones puede que no sea tan fácil de entender para todos. Algunos directamente querrán mantener su TinyMCE Da un poco de sustete qué pasará con nuestras webs cuando se integre Gutenberg. Mi impresión es que habrá algún plugin que nos traiga de nuevo el TinyMCE de toda la vida. También se habla de hacer un fork de WordPress, para los que no quieran ni oír hablar de esto de Gutenberg. Veo Gutenberg como un WordPress sin plugins… cuando tengamos temás y plugins para WordPress, es cuando se empezará a ver todo su potencial. Y esta parte la realiza la comunidad, no el core de WordPress.