Cómo diseñar tu web profesional con WordPress

NOTA: He creado un curso de diseño web en Traduversia en el que vas a poder aprender a crear dos tipos de páginas web diferentes, un microsite y una web de secciones, todo desarrollado en WordPress. Si te ha gustado la entrada, puedes ampliar información AQUÍ.

Después de una semana de trabajo bastante intensa, por fin he podido terminar el vídeotutorial en el que llevaba trabajando desde antes de Navidad.

Esta entrada pretende ser una continuación de una entrada anterior titulada “La web del traductor 2.0”, en la que os mencioné algunas herramientas online y programas con los que podíais elaborar vuestra propia página web sin mucha dificultad. WordPress es la que a mí me ha parecido la más interesante para este fin, aunque trabajar con él no siempre es sencillo para todos. Por eso, he elaborado esta entrada pensando sobre todo en aquellos a los que más les cuesta llevar a buen puerto este tipo de tareas.

  • Quiero aclarar que esta entrada con vídeotutorial es completamente amateur, y que en ningún momento pretende quitar mérito a aquellos diseñadores o proveedores de servicios de diseño web a nivel profesional. Esta es simplemente una forma sencilla de explicar en qué consiste todo el proceso para que todos aquellos que quieran tomar la iniciativa y deseen hacerlo por su propia cuenta puedan conseguirlo fácilmente. Para aquellos que tengáis una ambición mayor al respecto, os recomiendo directamente contactar con diseñadores profesionales.

TutorialWP

1. Introducción: ¿Qué es WordPress?

La definición formal nos dice que “WordPress es un sistema de gestión de contenido (en inglés Content Management System, o CMS) enfocado a la creación de blogs”. Pero, aunque WordPress se suele utilizar principalmente para la creación de blogs, la realidad nos dice que es una herramienta que no solamente se utiliza para ese fin.

Lo de CMS es un concepto que al principio cuesta entender. Dicho de una manera muy sencilla, los CMS son unas herramientas destinadas al desarrollo de sitios web, y que nos permiten desarrollarlos online gracias a la inclusión de un panel de administración. Dentro de este panel de administración podremos ir configurando de una forma interactiva nuestra página, de forma que podamos elegir nuestras plantillas, subir nuestros archivos, añadir nuevas funcionalidades, etc. Los CMS tienen la principal ventaja de que nos permiten separar la parte del diseño web de la gestión de los contenidos, de forma que, una vez que ya hemos elegido o trabajado nuestro diseño, solo tendremos que ir añadiendo los contenidos. De esta manera, podemos automatizar todo el proceso del desarrollo y facilitar todas las tareas relacionadas con la gestión del sitio sin tener que preocuparnos por el diseño de la web, que ya habrá quedado configurado y preestablecido.

Entre las principales ventajas de WordPress destaca que es una herramienta gratuita y fácil de utilizar (al principio cuesta un poco familiarizarse con ella, pero una vez conseguido, todo es muy intuitivo). Además, es una herramienta muy personalizable que podemos adaptar a nuestras necesidades si somos capaces de hacer un planteamiento adecuado y sabemos sacarle el máximo partido. Este se debe, principalmente, a la inclusión de una serie de herramientas complementarias, los widgets y los plugins, y a la gran variedad de plantillas (themes) que hay disponibles en internet.

A la hora de crear nuestro sitio con WordPress, podemos elegir entre dos opciones. La primera de ellas, y la más sencilla, es la de crearnos una cuenta directamente en WordPress, de forma que nuestro sitio ya aparezca instalado por defecto dentro del sitio web de WordPress. Este proceso es mucho más sencillo, pero trae consigo una gran cantidad de limitaciones que no nos permitirán personalizar nuestro sitio a nuestro gusto.

El segundo método consiste en descargar los archivos de instalación de WordPress para instalarlo en un servicio de alojamiento que nosotros contratemos en internet. Esta segunda opción es, en mi opinión, mejor que la anterior, pues es la que nos permitirá instalar todos los plugins, widgets y plantillas con los que queramos trabajar.

Es este último procedimiento el que vamos a seguir para desarrollar nuestro sitio web con WordPress.

2. ¿Qué necesitamos para crear nuestro sitio web con WordPress?

  1. Los archivos de instalación de WordPress: Lógicamente, es lo primero que tenemos que descargar. Podéis descargarlos en esta dirección: http://es.wordpress.org/
  2. Alojamiento: a continuación, tendremos que crearnos una cuenta con un proveedor de alojamiento (también conocido en la red como hosting). A ser posible, os recomiendo que busquéis uno gratuito. Yo os propongo utilizar 000webhost (www.000webhost.com).
  3. Acceso FTP: Necesitaremos tener acceso mediante FTP al servidor de nuestro proveedor de hosting, de forma que podamos subir los archivos de instalación de WordPress. Para tal fin, os recomiendo que utilicéis Filezilla, un cliente FTP que podéis descargar aquí.
  4. Editor de páginas web: A lo largo del proceso, necesitaremos editar uno de los archivos .php para poder instalar WordPress correctamente. No es necesario hacer la edición con un editor web (se puede hacer con el mismo bloc de notas), pero yo os recomiendo que lo utilicéis, pues os vendrán mejor indicadas las etiquetas y podréis distinguir mejor los elementos que hay que cambiar. Os propongo que utilicéis Adobe Dreamweaver o Kompozer.
  5. Los contenidos de nuestra página: Os recomiendo que antes de aventuraros a diseñar el sitio web, hagáis un esquema con la estructura que queráis que tenga vuestro sitio web y, a ser posible, que redactéis los contenidos de las diferente secciones y tengáis preparados las imágenes y el resto de elementos que queráis incluir en ella. Yo, por ejemplo, suelo redactarlo todo en un archivo de Word, en el que voy añadiendo las imágenes y demás elementos, de forma que a la hora de diseñar el sitio web solo tengo que copiarlos y pegarlos dentro de las diferentes página y entradas.
  6. Paciencia, mucha paciencia: No siempre nos saldrán las cosas a la primera, y lo normal es atascarse varias veces durante el proceso, así que os recomiendo que, desde ya, os arméis de paciencia. Os aseguro que, al final, cuando veáis el sitio web terminado, os habrá merecido la pena el esfuerzo.
  7. Ver el siguiente vídeotutorial: En el siguiente vídeotutorial, os explico paso a paso cómo podéis crear vuestro sitio web. No me he saltado ningún paso, de forma que la idea es que podáis ir haciendo todos los pasos a la vez que vais visualizando el vídeo.

3. Vídeotutorial: Cómo diseñar vuestra página web profesional con WordPress

A continuación, podréis visualizar el vídeotutorial que he confeccionado (os recomiendo encarecidamente que lo veáis en HD). El vídeo dura poco más de una hora. Aunque es un poco largo, creo que merece la pena verlo de principio a fin, pues podréis seguir todos los pasos directamente sin tener que consultar ninguna otra página o fuente. Os pido disculpas con antelación por los errores de expresión o por si voy demasiado rápido en algunos puntos (es complicado ir haciéndolo todo mientras lo explico). Si os atascáis, os surge algún problema o no entendéis alguno de los pasos, no dudéis en contactarme. ¡Buena suerte!

Cómo diseñar tu propia página web profesional con WordPress – Blog Jugando a Traducir de Rafael López en Vimeo.

NOTA: He creado un curso de diseño web en Traduversia en el que vas a poder aprender a crear dos tipos de páginas web diferentes, un microsite y una web de secciones, todo desarrollado en WordPress. Si te ha gustado la entrada, puedes ampliar información AQUÍ.

Rafael López Sánchez

Rafael López Sánchez

Traductor profesional (EN/IT>ES) especializado en traducción audiovisual, localización, diseño y maquetación. He traducido series, películas y documentales emitidos en cine, televisión y canales de Internet. Imparto cursos online sobre mis especialidades en Traduversia y participo como ponente en congresos y eventos de traducción.
Rafael López Sánchez
Opt In Image

¡APÚNTATE GRATIS AL CURSO «HERRAMIENTAS PARA LA LOCALIZACIÓN Y LA TRADUCCIÓN AUDIOVISUAL»!

Esto es lo que obtendrás si te apuntas:

  • Acceso gratuito e inmediato al curso
  • Cupones de descuento para matricularte en nuestros cursos a precio reducido
  • Información inmediata y exclusiva sobre nuestros nuevos cursos y ofertas
  • Un correo semanal con lo último del blog de Traduversia

 

Y además, aprovecha este cupón exclusivo para lectores de Jugando a traducir. 😉

Cupon-JaT-Blanco-01

¡Deja un comentario si te ha gustado la entrada!

52 comentarios
  1. katzintlamantli
    katzintlamantli Dice:

    Sr. muchas felicidades por este blog, no sabes el tiempo que he pasado tratando de crear una pagina web en wordpress y por mas videos ayudas y tutoriales nomas no podía dejar de poner mi cara de what, seguí paso a paso tu información y por fin entendí un buen de cosas. Únicamente me atore en una parte, en la de la instalación de wordpress (minuto 21:32) del video, al momento de poner la dirección me marco un error, que no encuentra la base de datos, ya revise todos los datos, las claves, los passwords, reinicie el proceso completo y el resultado es el mismo, ¿cual podría ser el problema por el cual no puede comunicarse el sitio con la base de datos?, ya le di varias vueltas y el resultado es el mismo, ya hasta reinicie la maquina pensando que pudieran quedar residuos de memoria en el proceso de instalación y no, ¿podrías darme una orientadita en este caso? te lo agradecería de todo corazón, nuevamente felicidades por tu blog y hasta pronto.

    Responder
  2. melisa
    melisa Dice:

    hola! Descubrir esta web ha sido increible, gracias! poco a poco con el tutorial me voy enterando de como montar la web.

    Lo unico es que me queda una duda, yo no quiero que mi web sea .net84.net, entonces queria saber si una vez creado asi, net84.net, eso se puede modificar por otro .com o .net aunque sea pagando.

    Desde ya gracias!

    Responder
  3. Noe
    Noe Dice:

    Antes de nada, muchas gracias por la entrada del blog! Es increíblemente útil 🙂
    Tengo una duda, he intentado subir un tema a wordpress y después de esperar un buen rato a que se instalara me ha dado un timeout, lo intenté una segunda vez y ahora no puedo acceder al hosting. ¿Alguna vez te ha pasado esto? ¿Alguna idea de cómo puedo solucionarlo?
    Mil gracias!

    Responder
  4. Sebas
    Sebas Dice:

    Muchísimas gracias por compartir estos conocimientos con la gente!!! Me ha resultado súper interesante y vamos a practicar a ver si consigo dominar la parte técnica. Un saludo.

    Responder
  5. purplerabbitinternetmarketing
    purplerabbitinternetmarketing Dice:

    ¡Hola Rafael! Antes que nada muchas gracias por esta información. Estoy tratando de subir los archivos de Filezilla a 000webhost tal y como viene en tu tutorial, pero no puedo, dice que no se puede conectar al servidor… Ya le puse lo necesario y mi password y nada. Alguna sugerencia? Mil gracias de antemano.

    Responder
  6. Sebas Dumrauf
    Sebas Dumrauf Dice:

    Hola! Es muy bueno el contenido del videotutorial que has hecho. Me aclaró todas las dudas y me está animando a basar mi proximo sitio web en WordPress!

    Un saludo! y gracias por compartir tus conocimientos.

    Responder
  7. María
    María Dice:

    Yo también te felicito. No sólo por esta entrada, que me parece un trabajo estupendo, si no por todo el blog en sí. Denota que eres un gran profesional y te auguro muchos éxitos.
    Gracias por este bien tan preciado.
    María

    Responder
  8. Irene
    Irene Dice:

    Hola Rafael:

    Intentando instalar WordPress me dice esto:
    Fatal error: Allowed memory size of 67108864 bytes exhausted (tried to allocate 122880 bytes) in /home/a1126418/public_html/wordpress/wp-admin/includes/schema.php on line 959

    ¿Qué tengo que hacer?

    Gracias y saludos,

    Irene.

    Responder
  9. Diego Otero
    Diego Otero Dice:

    Hola, te felicito por tan excelente entrada!! quisiera hacerte una consulta, estoy necesitando hacer una página tipo magazine de notas y artículos de interés que se va a ir alimentando poco a poco, me recomiendas WP para este fin? tendría problemas después o algún limite para las entradas que vaya haciendo? y necesito adicionar al diseño de la página algunos widgets que muestren precio de la moneda, algunos indicadores económicos por ejemplo y mapa de ubicación, es fácil de hacer esto desde alguna plantilla paga??, te agradezco de antemano cualquier ayuda o info que me puedas dar, que estoy muy interesado en este proyecto… un saludo y de nuevo gracias por compartir ese conocimiento tan valioso!!

    Responder
  10. Victor hugo
    Victor hugo Dice:

    Saludos Rafael, gracias por tan exelente video que están muy bien explicado.
    Quisiera preguntarte si para crear dos paginas web y enlasarlas es necesario darse de alta dos veces en wordpress o con una vez ya vale.

    Responder
  11. Guadalupe Martín Santana
    Guadalupe Martín Santana Dice:

    Hola Rafael, antes de nada quería darte las gracias por una explicación tan clara y trabajada. No he visto el vídeo tutorial todavía. He llegado a ti y creo que podré hacer la página web con la ayuda que proporcionas. Voy a dejar de buscar. Me has dado la confianza que necesitaba porque de verdad estaba aterrorizada. Debo crear una página web para una editorial de carácter digital que estoy creando. Va a ser muy sencilla y aunque en un principio iba a intentar hacerlo directamente en Dreamweaver, me vi totalmente atascada desde el principio. Voy a buscar la plantilla y a ir siguiendo los pasos que propones. Si por casualidad vieses mi mensaje me encantaría saber tu opinión sobre plantillas, o lo que te parezca, gracias!!!!!!!

    Responder
  12. Laura
    Laura Dice:

    Hola Rafael! Muchisimas gracias por tu video tutorial no sabes que bien nos viene a todos los que nos estamos adentrando en este mundillo!

    Eso si, me he encontrado con un problema al hacer click en la ruta de “midominio.com/wordpress/wp-admin/install.php” no me lleva al formulario de wordpress, me carga una web que me dice que “este dominio acaba de ser registrado” y publicidad. Podrías echarme una mano?

    Gracias!

    Responder
  13. Alicia
    Alicia Dice:

    ¡Enhorabuena! nunca suelo dejar nada escrito, pero este tutorial es buenísimo y me ha venido genial, de golpe he entendido muchas cosas que no había encontrado antes por la web. Mil gracias!!

    Responder
  14. tublogdelibros
    tublogdelibros Dice:

    ¡Muy buen trabajo! Sumamente claro cada paso.
    Quisiera preguntarte si la instalación de las plantillas que no son gratis se instalan exactamente igual que éstas gratuitas que nos has mostrado.
    Un saludo cordial, y mis felicitaciones por tu labor.
    Faku

    Responder
  15. Irena Domingo
    Irena Domingo Dice:

    La verdad es que diseñar una página web con WordPress es sorprendentemente sencillo. Yo aprendí buscando información por internet de manera autodidacta y a través de vídeotutoriales de las páginas web http://www.lynda.com y http://www.video2brain.com.
    Recientemente he escrito una entrada sobre los plugins existentes en WordPress para traducir tu sitio web a ruso (o cualquier otro idioma): http://rusalia.com/como-traducir-pagina-web-a-ruso/
    Muy interesante tu blog. Un saludo

    Responder
  16. Maria
    Maria Dice:

    Que pasada de entrada! Muchas gracias por compartir tus conocimientos y ayudarnos a los que amamos este mundo a ser mejores en diseño Web. Seguid en esta linea enhorabuena por vuestro blog un abrazo! 🙂

    Responder
  17. Juan
    Juan Dice:

    Buen video, pero no he visto la modificacion con dreamweaver que se decia en un principio, la verdad es que era lo que buscaba del video, de todas formas, te felicito por el.

    Responder
  18. jose antonio
    jose antonio Dice:

    Hola. tengo un problema, despues de hacer todo lo que se explica en el video al llegar a acceder a la instalacion de WordPress no puedo entrar en el Admin, necesitaria que si puede me ayuda a solucionar mi problema. Gracias

    Responder
  19. María Bravo
    María Bravo Dice:

    Hola de nuevo Rafa,
    tan sólo quería agradecerte que me hayas contestado.. y tan pronto!!! Indagaré un poco en las opciones que me comentas.

    Salu2

    Responder
  20. María Bravo
    María Bravo Dice:

    Hola Rafa!!
    Mil gracias por tu tutorial. Ha sido todo un descubrimiento y de gran ayuda para mi!! Tenía una pregunta, espero que no sea una tontería: quiero trastear en una web ya hecha, pero antes me gustaría hacer una copia de seguridad por si meto la pata. ¿Cómo puedo hacerla?

    Gracias

    María

    Responder
    • Rafael López Sánchez
      Rafael López Sánchez Dice:

      Hola, María:

      Hay varias formas de hacer copias de seguridad. La más común es a través de Herramientas/Exportar, que consiste en crear un archivo XML en el que se guardarán todas tus entradas y comentarios. El diseño y la configuración de la web no se preservarán, pero es normal porque normalmente lo que interesa preservar son los contenidos y no tanto el diseño.

      Por otro lado, si tienes WordPress instalado en un hosting de pago, puedes utilizar varios plugins que sirven para hacer copias de seguridad. Hay muchos y todos sirven casi para lo mismo y son muy fáciles de utilizar. Yo siempre utilicé la opción de Exportar, y solo una vez recurrí a instalar un plugin (BackWPup, si no recuerdo mal). De todas formas, te dejo por aquí un listado de plugins para que investigues:

      http://www.stateofsearch.com/top-6-wordpress-backup-plugin-recommendations-for-2013/

      No dudes en escribirme si necesitas más información.

      ¡Un saludo!

      Rafa

      Responder
  21. Paloma
    Paloma Dice:

    Hola Rafael,

    me ha gustado mucho tu entrada ya que estaba cotilleando como poder hacer una web basándome en wordpress.
    ¿Sabes que tipo de hosting es necesario para anidar una plataforma tipo Moodle a la web? Por el espacio necesario y demás.

    Muchas gracias.

    Un saludo

    Responder
    • Rafael López Sánchez
      Rafael López Sánchez Dice:

      Hola, Paloma:

      Gracias por tu comentario. Creo que cualquier hosting que sea válido para WordPress será igual de válido para Moodle. Hay que buscar uno que permita crear bases de datos MySQUL para vincularla al PHP, pero actualmente casi todos los proveedores de hosting ofrecen este servicio. De entre los gratuitos, te recomiendo http://www.000webhost.com, y de los de pago hay varias opciones. Yo tengo contratado mi hosting con 1and1 y la verdad es que estoy bastante satisfecho. Son baratos y me dan lo que necesito.

      Para más información sobre hostings para Moodle, te dejo por aquí una guía interesante que he encontrado navegando por la red. Espero que te sirva.

      http://www.interclase.com/guia-para-seleccionar-hosting-moodle/

      ¡Un saludo!

      Rafa

      Responder
      • Rafael López Sánchez
        Rafael López Sánchez Dice:

        Ah, y con respecto al espacio, pues depende de la cantidad de cursos y materiales que quieras añadir. Yo te recomiendo que busques alguno que ofrezca como mínimo 10 gigas, porque si quieres añadir vídeos y demás siempre es bueno tener margen de almacenamiento. El que te he pasado de Webhost solo ofrece 1,5 gigas gratis, que para empezar es más que suficiente, pero si tu proyecto es ambicioso es posible que se te quede corto en cuestión de unos meses o de un año. Así que ya digo, analiza un poco tu situación y la utilidad que le quieres dar al aula virtual y decide con relación a eso. En fin, ya me contarás qué decides finalmente.

        ¡Un saludo!

        Rafa

        Responder
      • Oscar
        Oscar Dice:

        Hola,

        Puestos a cuidar la ortografía te diría que es MySQL y no MySQUL, cualquiera que entienda un poco y lea este comentario no sería raro que le reventase un ojo… o los dos 😉

        ¡Saludos!

        Responder
  22. lucas
    lucas Dice:

    Potential WordPress problem (Brute Force attack against WordPress websites)
    We have monitored on-going brute-force attack against WordPress websites, in order to keep your WordPress website secure, we recommend you do the following:

    1. Please change your password for WordPress admin area.

    2. Go to your cPanel > File Manager and find your wp-login.php file.

    Temporary rename wp-login.php file (for example into wp-login1.php).

    You need to change a line in your wp-login.php to reflect the change to the file name. Its line 380 where the form action refers to wp-login.php

    ————————-Update—————————

    wp-login.php is temporary disabled because of huge brute force attack. Please rename wp-login.php to something else.
    You should then also edit the file “wp-includes/general-template.php”, on line 237 there’s a function called “wp_login_url” which You should update with your new file name instead of wp-login.php

    Esto es una advertencia que esta en host http://www.000webhost.com tal vez sea por esto por lo que no puedo entrar en mi admin de wordpress pero es que no lo entiendo haber si podrias mirarlo. gracias

    Saludos

    Responder
    • Rafael López Sánchez
      Rafael López Sánchez Dice:

      Hola, Lucas:

      De tu mensaje deduzco que no eres traductor por ese “haber” en vez de “a ver” que casi me ha hecho desangrarme por los ojos (xD).

      Para mí es muy importante que los participantes en este blog escriban adecuadamente, pues aunque el blog trata muchos temas sobre nuevas tecnologías, estos no dejan de estar dedicados especialmente a traductores e intérpretes. Por tanto, debo pedirte que la próxima vez cuides un poco más tu ortografía (tampoco cuesta tanto, hombre, es cuestión de aplicarse) ;-).

      Con respecto a tu comentario, me imagino que si haces lo que te solicita 000webhost.com no deberías tener ningún problema. Sigue los pasos y A VER si hay suerte ;-).

      Un saludo,

      Rafael López

      Responder
    • raflosa
      raflosa Dice:

      ¡Hola, Teresa!

      Muchas de nada. Si al final consigues hacerte la página me sentiré muy realizado, jejeje. No dudes en pasarme la dirección cuando la tengas terminada.

      Un saludo.

      Rafa

      Responder
  23. María
    María Dice:

    Hola! Muchas gracias por tu blog, quería preguntarte si es profesional que pagues a una empresa por hacer la web y te la hagan en una herramienta word press o crees que eso no es algo que se dé en el mercado.

    Muchas gracias

    Responder
    • Rafael López
      Rafael López Dice:

      Hola, María. Hasta donde yo sé, hay muchas empresas que ofertan el diseño de páginas web con WordPress, y la verdad es que no me parece mal para nada. WordPress es una herramienta personalizable y, aunque uno tenga conocimientos sobre cómo utilizarla, hay gente que se dedica profesionalmente al diseño web y entienden mucho más sobre el funcionamiento de este CMS y de cómo crear plantillas personalizadas con funciones mucho más específicas. Es cierto que uno mismo, si se lo curra, puede hacer cosas interesantes, pero un profesional siempre podrá hacer muchísimo más.

      Espero haber respondido a tu pregunta.

      Un saludo.

      Rafa

      Responder
  24. Adrián
    Adrián Dice:

    Gracias por tal currada de entrada y tutorial!! Me irá de lujo para una página que tengo en mente. Tan sólo querría preguntar una cosita, ¿es posible modificar la página una vez que esta ya está “publicada” en internet? ¿Es un proceso muy difícil? Muchas gracias por todo.

    Un saludo,

    Adrián

    Responder
    • raflosa
      raflosa Dice:

      ¡Hola, Adrián!

      Muchas gracias a ti por tu comentario.

      Por supuesto que es posible modificar la página una vez publicada. Eso es lo mejor de todo. El procedimiento es el mismo que para crear y editar los posts. Accederías mediante al panel de administración con tu usuario y contrasña y podrías insertar, editar y borrar todos los contenidos que tú quisieras a tu antojo. Eso es lo mejor de WordPress. ¡Es una pasada!

      Espero haber respondido a tu pregunta.

      ¡Un saludo!

      Responder
    • raflosa
      raflosa Dice:

      ¡Muchas gracias, Merche! Para eso es este blog, para compartir conocimientos y hacer cosas útiles para los demás. Espero, de verdad, que la entrada le sea útil a aquellos que estén interesados en este tema.

      ¡Un saludo!

      Responder

Trackbacks y pingbacks

Dejar un comentario

¿Quieres unirte a la conversación?
Siéntete libre de contribuir

¡Deja tu comentario y comparte tu opinión! Recuerda ser constructivo en la medida de lo posible. :P

Loading Facebook Comments ...