Cómo crear un sitio web de portafolios: Una guía detallada

Imagen

Cómo crear un sitio web de la cartera

Una guía detallada


En esta sencilla guía paso a paso te llevaré a través de todo el proceso de creación de un sitio web de portafolio personal convincente para mostrar tu mejor trabajo, y eventualmente conseguir que te contraten.

El proceso incluye cuatro pasos esenciales y no le llevará más de 20 minutos. Cubrirá todas las lagunas de conocimiento en materia de diseño web y hará posible tener un impresionante sitio web de cartera sin tener que tocar ninguna línea de código.

Haga clic aquí para ir al primer paso.

Descargo de responsabilidad: Este post contiene enlaces de afiliados, lo que significa que recibo una pequeña comisión por una compra sin costo adicional para usted. Creo en los productos mencionados en el artículo y tengo una amplia experiencia con ellos. Si compras a través de mi enlace de afiliado, ¡muchas gracias por tu apoyo!

Paso 1: Elegir un nombre de dominio

Antes de empezar a construir el sitio web, repasemos rápidamente los nombres de dominio.

Casi todas las empresas de alojamiento venden nombres de dominio. Al comprar un plan de alojamiento(lo discutiremos en el paso 2), la mayoría de las empresas de alojamiento le proporcionan un nombre de dominio gratuito por un año.

A la hora de elegir un dominio, es posible que sientas la necesidad de ser creativo, o incluso divertido. El mejor consejo que puedo darle es que sea sencillo.

¿Debería usar su nombre como nombre de dominio?

Le recomiendo encarecidamente que utilice su nombre exacto para el dominio. La razón es que es la mejor manera de asegurarse de que su sitio web es lo primero que aparece cuando la gente lo busca en línea. De lo contrario, podrían encontrarse con tu página personal de Facebook u otras páginas al azar que no tienen nada que ver contigo.

Lo mejor es tener el mayor control posible sobre los resultados de búsqueda de su propio nombre, y un dominio para su nombre es la mejor manera de hacerlo.

Si el dominio de tu nombre no está disponible, intenta añadir una palabra al final, como "johndoeportfolio.com" o "johndoeart.com". Lo importante es que tu nombre completo esté ahí.

Paso 2: Poner en línea el sitio web de tu cartera

El siguiente paso es establecer dónde se alojará su sitio web. Para esta guía cubriré 3 opciones, una para cada tipo de usuario.

  • Usando Wix.com (para los que quieren una solución prefabricada fácil de usar)
  • Usando Bluehost (para los que quieren más control, pero no quieren gastar mucho dinero)
  • Utilizando Kinsta (para los que quieren la solución premium más avanzada, y no les importa pagar por ella)

Cómo poner en línea tu sitio web del portafolio usando Wix

Wix es un constructor de sitios web que cualquier persona, con cero experiencia en diseño web, puede utilizar para construir un sitio web de aspecto profesional en minutos. Wix es muy popular debido a su flexibilidad y facilidad de uso. En esta sección, vamos a repasar la creación de un sitio web de portafolio personal utilizando Wix.com.

Crear una cuenta

Crear una cuenta en el constructor del sitio web de Wix es muy sencillo. Incluso puedes registrarte con tus cuentas de Google o Facebook.

Visite la página de inicio www.wix.comy haga clic en Empezar.

Será redirigido a la página de registro. Introduzca su dirección de correo electrónico y una nueva contraseña, y luego haga clic en el botónRegistrarse.

El siguiente paso es una pequeña encuesta para ayudar a Wix a conocer tus necesidades para que te proporcione la mejor experiencia posible. Puedes elegir entre responder la encuesta o no.

La encuesta se compone de sólo tres preguntas y se tarda menos de 30 segundos en completarla. Elige no haber hecho nunca esto, ya que esta guía está pensada tanto para los principiantes como para los usuarios avanzados.

Una vez que selecciones la última opción, serás redirigido a la siguiente página donde se te dará la opción de elegir entre usar el Diseñador de Inteligencia Artificial de Wix o el Editor de sitios web de Wix para crear tu sitio web.

Usando el Diseñador de Inteligencia Artificial de Wix (ADI) para crear un sitio web de la cartera

Haz clic en "Empezar ahora " para usar el ADI de Wix o en "Elegir una plantilla " para crear tu propio sitio web impresionante usando elEditor de Sitios Web de Wix. En esta guía, vamos a explorar ambos, comenzando con la opción Wix ADI, que es la mejor opción para los no desarrolladores web.

Elija el tipo de sitio web que desea crear; en este caso, un sitio web de portafolio. Haga clic en siguiente para elegir las características que desea en el sitio web.

Aquí elegimos la "tienda online ", porque vamos a mostrar nuestro trabajo y los visitantes deben poder contactar y contratar. Tenga en cuenta que puede optar por omitir este paso y añadir características más tarde. Después de eso, haga clic en Siguiente.

Elija un nombre de marca/empresa o utilice su propio nombre. Lo que elijas aquí se utilizará como nombre de dominio. Hemos utilizado nuestro nombre de marca, "bloopanimation" como ejemplo. Haga clic en Siguiente.

Dado que estamos trabajando en un nuevo proyecto, se supone que no tenemos un sitio web existente o Google places, así que haremos clic en "Omitir" para revisar y editar nuestra información.

Rellene los campos proporcionados; su correo electrónico ya está ahí. Añada su logotipo, dirección, número de teléfono, fax (si lo tiene), y los enlaces de las cuentas sociales.

En la siguiente página, elija un tema para su sitio web (puede cambiar fácilmente de tema más adelante). Seleccione uno y haga clic en continuar.

Si has subido un logotipo, tendrás una opción para crear una paleta de colores a partir de ese logotipo. Puedes omitirla si no tienes una, o hacer clic en "Crear paleta" para continuar.

El siguiente paso es elegir el diseño de la página de inicio.

Seleccione cualquiera de los diseños mostrados o sáltese. Todavía puedes cambiarlos más tarde. Una vez que hayas seleccionado un diseño, serás llevado al editor de Wix ADI.

El Editor de Wix tiene tres áreas principales, que se identifican en la imagen de abajo como; (1) Área del Menú Superior (2) el Área de la Barra Lateral, y (3) el Área de la Página Principal.

Es importante que analicemos en profundidad cada una de estas áreas y su funcionamiento.

Área del menú principal: El área del menú principal se compone de las siguientes pestañas:

  • A) Selector de página activa: Aquí es donde seleccionarás la página que quieres que aparezca en el área de la página principal para editarla.
  • B) Añadir: Se utiliza para añadir una nueva página o una nueva sección de página.
  • C) Diseño: Esta área le permite cambiar temas, colores, fuentes, animaciones o diseños de página.
  • D) Gestionar tienda: Se utiliza para crear una tienda online. Como nuestro interés es crear un portafolio, omitiremos esto.
  • E) Botones de deshacer/rehacer: Deshacer o rehacer una acción.
  • F) Ayuda: Accede a la base de datos de ayuda de Wix.
  • G) Sitio: Esta pestaña contiene una lista de submenús como "crear un nuevo sitio", "mi sitio", "conectardominio", etc. Nuestro único interés aquí es el de "conectardominio"; los demás son bastante sencillos.
  • H) Campana de notificaciones: Aquí aparecerán todas tus notificaciones.
  • I) Actualización: Para conectar su dominio, tendrá que actualizar a una cuenta premium. Puede encontrar todos los planes de actualización aquí.
  • J) Vista previa: La pestaña de vista previa le permitirá previsualizar su diseño antes de publicarlo.
  • K) Publicar: Una vez que hayas terminado de diseñar el sitio web y estés satisfecho con lo que has visto en la vista previa, puedes seguir adelante y pulsar el botón de publicar para publicar tu sitio web de cartera.

Área de la barra lateral: El área de la barra lateral se utiliza normalmente para mostrar información que no forma parte de la página principal. Para empezar, haga clic en una sección, y se abrirá para su edición en el área de la barra lateral. Desde ahí, puedes cambiar archivos multimedia como imágenes, editar texto y otras cosas.

A continuación se muestra una captura de la sección de cabecera tal y como aparece en el área de la barra lateral.

Puedes cambiar el diseño de la sección, añadir/editar el menú, añadir una membresía a tu sitio web, y mucho más desde esta área. Para añadir cualquiera de estas características a su sitio web, sólo tiene que hacer clic en la casilla de verificación junto a ella.

Echemos un vistazo a algunos de ellos:

  • Menú del sitio: Cada página que añada a su sitio web aparece aquí. Puede editar las páginas, reorganizar el orden de las mismas o eliminarlas.
  • Barra de inicio de sesión de los miembros: Esta característica es para los sitios web de miembros.
  • Nombre de la empresa: El nombre de la empresa que eligió anteriormente se guarda aquí. Sin embargo, puedes cambiar el nombre desde aquí en cualquier momento.
  • Tagline: Establezca un eslogan para el sitio web.
  • Logotipo: Añade un logotipo o cambia uno existente.
  • Correo electrónico del sitio: Editar o añadir una nueva cuenta de correo electrónico.
  • Número de teléfono: Edita o añade un nuevo número de teléfono.
  • Botón: Permite añadir botones como el de "Contacto" o el de "Ponte en contacto".
  • Cuentas sociales: Edita o añade tus cuentas sociales.

Las opciones anteriores se incluyen en la sección de encabezado. Otras secciones tienen sus respectivas características. Haga clic en cualquier otra sección, y las características de edición aparecerán en la barra lateral.

Área de la página principal: Esta es el área de visualización principal donde puedes ver tu diseño. El visor es increíblemente intuitivo de usar. Simplemente haga clic en una sección para editar, reordenar/mover, diseñar o eliminar de su sitio web.

Puede tener tantas secciones como desee, pero le recomendamos que sea sencillo, con 5 o 6 secciones. Las secciones del encabezado y el pie de página no pueden ser movidas/ordenadas pero pueden ser editadas.

Secciones del cuerpo: A diferencia de la sección de la cabecera, puedes duplicar, mover, eliminar la sección del cuerpo. También puede editarla y diseñarla. Las dos flechas de la parte superior derecha se utilizan para mover una sección hacia arriba/abajo. Mientras que la opción "mover a..." en el desplegable de la parte superior izquierda se utiliza para mover una sección a un área determinada.

Las secciones de pie de página/encabezado: Como mencioné antes, sólo puede editar y diseñar la sección de pie de página.

Echemos un vistazo a nuestro resultado final. Para este ejemplo hemos eliminado todas las páginas, dejando sólo la página de inicio. Nuestra página de inicio tiene seis secciones.

  • La sección de cabecera
  • Sección de bienvenida
  • Sección de la galería profesional (sirvió como sección del portafolio)
  • La sección de citas
  • La sección de contacto
  • El pie de página

Usar el editor del sitio web de Wix para crear un sitio web de la cartera

Ahora que hemos visto cómo funciona el ADI de Wix, vamos a ver cómo personalizar nuestro sitio web de cartera utilizando el Editor de Wix. Para utilizar el Editor de sitios web de Wix, ve a Wix y sigue todos los pasos indicados anteriormente. Esta vez, selecciona la opción "elegir una plantilla".

En la siguiente página, verás un montón de hermosas plantillas repartidas en varias páginas. Navega y elige.

Pase el ratón por encima de la plantilla que desee utilizar y haga clic en "ver" para obtener una vista previa de la plantilla, o en "editar" para empezar a trabajar con ella inmediatamente.

Una vez que hagas clic en el botón "editar", te llevará al editor del sitio web de Wix. El editor es bastante simple y fácil de usar; veamos algunas de las características.

En la imagen de abajo hemos hecho doble clic en el título para hacerlo editable, así que puedes escribir fácilmente el título de tu sitio web. Puedes cambiar el tipo de título, el tipo de letra, el tamaño de la letra, el color de la letra y otras opciones de formato de texto utilizando el cuadro de "ajustesdetexto". El cuadro de "configuracióndel texto" sólo aparece cuando se quiere editar un texto.

Puedes editar el menú y las páginas, añadir un fondo y añadir medios a tu sitio web. Puedes hacer clic en los elementos del lienzo para editarlos.

Puedes guardar o previsualizar tu página web antes de publicarla. Cuando estés listo para publicar, haz clic en el botón "publicar" de la parte superior derecha. Te recomendamos que guardes tu trabajo de vez en cuando para no perder tu diseño.

Si es la primera vez que te metes en el diseño de una página web, puede que te resulte confuso. Pero el editor de Wix es tan fácil de usar que, después de jugar un poco con él, le cogerás el truco y te sentirás cómodo navegando por él.

Este es nuestro resultado final:

Conectar un dominio personalizado a tu Sitio Wix

Puedes conectar un dominio personalizado a tu sitio Wix desde diferentes lugares en el tablero de tu sitio. Para conectar tu dominio, ve a tu cuenta en la parte superior derecha de la página. Aparecerá una ventana emergente con una llamada a la acción "Obtener un dominio ".

También puedes hacerlo visitando el menú desplegable de tu perfil o simplemente haciendo clic en "Obtener un dominio" allí mismo, en tu panel de control.

Después de eso, se le presentará una opción para comprar un nuevo dominio o conectar un dominio que ya posee.

Para conectar un dominio que ya tienes, debes actualizarte a un plan premium de Wix. Adelante, actualiza tu plan si deseas conectar tu dominio ya comprado.

Si no tiene un dominio y desea comprar uno nuevo, haga clic en "comprar un nuevo dominio"."

Escriba el nuevo dominio que desea comprar y haga clic en el botón "buscar" para comprobar si el dominio está disponible.

Haz clic en "Obtener". Podrás pasar a un plan anual que incluye un dominio gratuito de 1 año, o bien comprar el dominio y actualizarlo más tarde.

Nota: el dominio no se asignará a su sitio web hasta que lo actualice.

Seleccione un plan para pasar al pago.

Recomendamos el plan anual para que puedas obtener un bono de dominio gratuito y otras excelentes características.

Introduzca los datos de su tarjeta y envíe su compra.

Enhorabuena! tu plan premium está en marcha y ya tienes todo listo para crear tu sitio web de cartera.


 

Cómo poner en línea su sitio web de la cartera utilizando el alojamiento web de Bluehost

Si piensa utilizar WordPress (el sistema de gestión de contenidos más popular) para diseñar su sitio web de cartera, entonces el uso de Bluehost para el alojamiento de su sitio es la mejor opción para los principiantes.

En esta sección te llevaremos a través de todo el proceso de configuración de una cuenta de alojamiento en Bluehost, registrar un dominio, instalar y activar WordPress en él.

¿Por qué Bluehost?

Bluehost es una de las empresas de alojamiento más populares, fiables y de confianza del mundo. Hemos utilizado Bluehost para alojar Bloop Animation en sus primeros años (antes de cambiar a Kinsta, que es un servicio de alojamiento más pesado dirigido a sitios web con mucho tráfico y necesidades de comercio electrónico) y ha sido la opción más rápida y asequible para muchos otros como nosotros.

Cómo crear una cuenta en Bluehost e instalar WordPress

1. El inicio de la actividad

Para crear una cuenta en Bluehost, visite www.bluehost.com y haga clic en el botón "Get Started Now".

2. Seleccione un plan de alojamiento

El propósito de su proyecto determina el mejor plan de alojamiento para usted. Si estás creando un sitio web de portafolio, probablemente deberías optar por el plan básico.

Lo bueno de Bluehost es que cuando tu sitio web empieza a tener mucho tráfico, siempre puedes pasar a un plan superior sin que ello afecte a tu sitio web. Teniendo esto en cuenta, vamos a contratar el plan básico para nuestro sitio web de cartera.

Con el alojamiento compartido, que es ampliamente utilizado y asequible, podemos instalar y activar fácilmente nuestro sitio web de WordPress. Al contrario que en el alojamiento de Servidores Privados Virtuales ( VPS ), la gestión del servidor y los parches de la plataforma son gestionados por los proveedores de alojamiento compartido. Por lo tanto, no tenemos que preocuparnos de todo eso.

Veamos los planes de alojamiento compartido de Bluehost y sus características.

3. Registrar un nombre de dominio

Al principio de esta guía, hemos hablado de la elección de un nombre de dominio. Ahora que hemos elegido un plan de alojamiento, podemos finalmente registrar ese nombre de dominio.

Afortunadamente, Bluehost le ofrece un dominio gratuito durante el primer año al adquirir un plan de alojamiento.

Tenemos tres opciones para elegir.

  1. Crear un nuevo dominio
  2. Utilice un dominio que ya posea. Si elige esta opción, tendrá que apuntar los servidores de nombre del dominio al alojamiento de Bluehost. Haga clic aquí para saber más sobre la configuración de los servidores de nombre.
  3. Saltar y crear un nombre de dominio más tarde.

Para el propósito de esta guía, iremos con la primera opción.

4. Cree su cuenta

Una vez que haga clic en "Siguiente" después de proporcionar su nombre de dominio, se le llevará a la siguiente página donde podrá crear una nueva cuenta o iniciar sesión si ya tiene una cuenta con Bluehost.

Rellene los datos de la cuenta y pase al siguiente paso.

5. Elija la información del paquete y los extras.

Elige tu plan de cuentas dependiendo de tu presupuesto; puedes ir por 12 meses o más. Notarás que cuanto más largo sea el plan, más barato será el precio mensual.

Precio básico de 12 meses - $5.95/mes - $71.40/año

Precio básico de 24 meses - $4.95/mes - $118.80/año

Precio básico de 36 meses - $3.95/mes - $142.20/año

Puede elegir cualquiera de los siguientes paquetes adicionales:

  • Protección de la privacidad del dominio: Cuesta 0,99 dólares más al mes (se factura anualmente a 11,88 dólares/año). La privacidad del dominio protegerá su información personal (por ejemplo, su nombre, correo electrónico, país y dirección) de la vista del público. Esto se recomienda sólo si quieres que la información de tu dominio sea anónima.
  • Seguridad SiteLock: Cuesta 1,99 dólares al mes (se factura anualmente a 23,88 dólares/año). Este complemento verifica su dirección de correo electrónico, dirección física y número de teléfono. Esta función es necesaria si pretende demostrar su credibilidad a sus clientes.
  • CodeGuard Basic: Cuesta 2,99 dólares al mes (se factura al final del plazo de alojamiento). Proporciona seguridad adicional al permitirle hacer una copia de seguridad de su sitio web con regularidad.
  • Bluehost SEO Tools Start: Cuesta 1,99 dólares adicionales al mes (se factura anualmente a 23,88 dólares/año). Herramienta SEO de Bluehost que puede ayudar a la clasificación de su sitio web en los motores de búsqueda.
  • 1 buzón de Office 365: Viene gratis durante los primeros 30 días. Es una plataforma de correo electrónico impulsada por Microsoft.

Recomiendo añadir el paquete de Privacidad de Dominio. El resto son un poco exagerados para los sitios web de cartera en mi opinión.

A continuación, añadiremos nuestra información de pago y enviaremos. Si no quieres pagar con tarjeta de crédito, puedes hacer clic en "más opciones de pago" para pagar con PayPal.

Una vez que haya introducido toda la información correctamente y haya hecho clic en "enviar", recibirá un correo electrónico de confirmación y un mensaje de felicitación. ¡Se ha registrado en Bluehost con éxito! Haga clic en el botón "Crear cuenta" para continuar.

Bluehost suele crear un sitio para usted automáticamente después del registro. Sin embargo, puede eliminar este sitio yendo a"Manage Site", haga clic en"Settings", luego desplácese hasta el final de la página y elimínelo.

  1. Instalación de WordPress mediante el botón "Instalación con un clic" de Bluehost

Después de registrarse en Bluehost, lo siguiente que hay que hacer es instalar y activar WordPress. Con la "Instalación con un solo clic" de Bluehost para WordPress, puedes instalar WordPress sin problemas con un solo clic y en poco tiempo.

a) Acceda a su cuenta de Bluehost. Desde su panel de control, haga clic en "Mis sitios", y luego en "Crear sitio".

b) Introduzca un nombre y un lema para su nuevo sitio de WordPress y haga clic en "Siguiente".

c) Si has registrado un dominio, en la flecha desplegable, elige un dominio que quieras utilizar para tu sitio web de cartera. Asegúrate de desmarcar las casillas de los plugins que no necesites.

Escriba su nombre de usuario y contraseña de WordPress, y haga clic en el enlace "iniciar sesión en WordPress" para continuar.

Ahora que hemos terminado con la instalación de WordPress, tenemos que conseguir una plantilla para diseñar el aspecto real del sitio web. Cubriremos esto ampliamente en Paso 3.


Cómo poner en línea el sitio web de tu portafolio usando Kinsta

Kinsta es un servicio premium de alojamiento de Wordpress. Es el más rápido y seguro que hemos encontrado, y tiene un servicio de atención al cliente excelente. Simplemente no puedo recomendarlos lo suficiente.

No son baratos, con el plan más barato a partir de 30 dólares al mes, pero merecen la pena con creces.

Todos los planes incluyen una migración gratuita de Wordpress, lo que significa que Kinsta transferirá todo su sitio web desde su anterior servicio de alojamiento, y lo configurará todo por usted.

Sus planes también vienen con un CDN gratuito, copias de seguridad automáticas diarias, un excelente soporte 24/7 y un certificado SSL gratuito. La mayoría de los servicios de alojamiento cobran por este tipo de complementos.

Después de elegir un plan, simplemente pasa por el proceso de compra, y la amable gente de Kinsta te guiará a través del resto del proceso.

Una vez que su sitio web de Wordpress está configurado, el resto del proceso de diseño de su sitio web es el mismo que cualquier otro servicio de alojamiento, y vamos a cubrir eso en el paso 3.

Paso 3: Diseñar el sitio web de su cartera en Wordpress utilizando un tema (gratuito / de pago)

En esta parte trabajaremos en WordPress para mostrar cómo obtener y configurar un nuevo tema. Comenzaremos con la instalación de un tema en blanco (que en realidad cubrimos en el paso 2), hasta la instalación de algunos temas gratuitos y premium.

Si estás alojando tu sitio web de WordPress en Bluehost o en otros proveedores de alojamiento, tienes la libertad de usar cualquier tema (tanto gratuito como de pago) para tu sitio web. Recomendamos que te mantengas alejado de los temas anulados o agrietados para evitar instalar archivos maliciosos en tu sitio web, haciéndolo así vulnerable a la piratería.

Tema X - nuestro tema premium más recomendado

Antes de cubrir algunos temas gratuitos y de pago recomendados, queremos mostrarte cómo configurar el que consideramos uno de los mejores temas que existen: X. Es el tema que utilizamos en Bloop Animation, y mi tema X de cabecera siempre que configuro un sitio web.

X es hecho por themco. ellos hacen 2 versiones del tema: X, y Pro. Pro es sólo una versión más personalizable de X. Para la mayoría de la gente recomendaría quedarse con X.

Para conseguir X, pensó, tendremos que ir a Themeforest.

Conseguir temas premium de WordPress en Themeforest

Hay muchos sitios web de confianza con temas premium, pero recomendamos Themeforest. Themeforest es el proveedor de temas premium número 1, y tienen un tema para casi cualquier propósito, incluyendo sitios web de portafolio.

Así que vamos a themeforest.net. En el cuadro de búsqueda, escriba "x theme" y haga clic en Buscar.

El primer resultado debería ser el tema que estamos buscando. Haz clic en el icono del carrito de la compra para añadirlo al mismo.

Aparecerá una ventana emergente con opciones para elegir entre la Licencia Regular y la Licencia Extendida, y entre 6 y 12 meses de soporte. Para este proyecto, vamos con las licencias regulares con un plan de soporte de 12 meses, que cuesta 35.38 dólares en total.

Para continuar, haga clic en Añadir a la cesta, y luego en Ir a la caja.

Después de hacer clic en Pago seguro, deberá crear una cuenta o iniciar sesión en una cuenta existente, si la tiene.

Elija un nombre de usuario y una contraseña para crear una cuenta y continuar.

A continuación, rellene sus datos de facturación y haga clic en guardar y continuar.

Elija una opción de pago y complete la transacción. Hay una opción de tarjeta de crédito, Paypal o Skrill.

Una vez que su pago sea confirmado, recibirá un correo electrónico de confirmación de ThemeForest. El tema será añadido a tu cuenta de ThemeForest.

Acceso y descarga de sus temas después de la compra

Después de comprar el tema X, tendrás que descargar el archivo del tema antes de instalarlo en tu alojamiento Bluehost, donde ya has activado WordPress.

Para ello, entra en tu cuenta de ThemeForest, pasa el ratón por encima de tu nombre de usuario en la parte superior derecha y haz clic en descargas.

En la página de descargas, verás todos los temas y artículos que has comprado en ThemeForest. Haga clic en el botón de descarga junto al tema x y luego seleccione Installable WordPress file only para descargar el tema. Se descargará el archivo en formato zip.

Instalando el tema

Después de descargar los archivos del tema desde su cuenta de ThemeForest, inicie sesión en su cuenta de WordPress que instaló en Bluehost. Una vez iniciada la sesión, pasa el ratón por la sección "Apariencia" y selecciona el submenú "Temas".

En la siguiente página, haga clic en Añadir nuevo.

A continuación, haga clic en Cargar tema.

Instale el archivo del tema seleccionando la opción Elegir archivo. Busque y seleccione el archivo zip que acaba de descargar.

Haga clic en el botón Instalar ahora para instalar el tema.

Tardará unos segundos o minutos en instalarse, dependiendo de su conexión a Internet. Una vez que la instalación se haya realizado con éxito, verás un mensaje como este:

Haga clic en activar para activar el tema. Se le redirigirá al panel de control del tema.

Validar su tema

Para validar el "tema x", presentar el código de licencia que viene con su compra para la verificación.

Para obtener la llave de compra del Bosque Temático, sigue estos pasos:

  1. Ingrese a su cuenta y haga clic en su nombre de cuenta en la sección superior derecha de la pantalla.
  2.  En el menú desplegable, haga clic en "Descargas".
  3. Haga clic en el botón "Descargar" junto al "tema x".
  4. A continuación, haga clic en "Certificado de licencia y código de compra" en el menú desplegable para descargar el archivo de texto con la información del producto.

Busque el código de compra del artículo en el archivo de texto, y encontrará la clave de compra que se utilizará en la validación del producto.

Ahora que tienes la licencia del producto, ve a la instalación de WordPress y accede a la página de validación del producto de la siguiente manera:

Vaya a X > Validación.

Verás un campo de entrada donde añades el número de licencia y pulsas enter:

Si todo va bien, recibirás un mensaje de éxito. Ahora, instala el plugin requerido de Cornerstone.

Haga clic en la X para ir al tema X, tablero de instrumentos. Haga clic en la nube de diseño de lanzamiento.

En la nube de diseño, verás muchos temas creativos y bonitos. Elige el que te guste y haz clic en Instalar.

Visite su sitio web para ver cómo se ve con la plantilla que eligió:

Ahora puedes ir al personalizador para añadir tus propias imágenes y personalizar el sitio web a tu gusto. También puedes cambiar el tema si no te gusta.

Temas recomendados para el sitio web de su cartera (premium)

El tema X es, con mucho, uno de los mejores que hay, pero no es el único. Hay muchos otros temas flexibles y de gran apariencia que puedes usar, así que volvamos a Themeforest y revisemos algunos de ellos.

Con más de 48,600 temas en sus listas, encontrar el tema perfecto para un proyecto sobre Themeforest puede ser difícil de intimidar para los desinformados.

Afortunadamente para usted, hemos hecho la investigación por usted y hemos encontrado 10 grandes opciones para un sitio web de portafolio.

Avada por ThemeFusion ($60)

Avada es el tema número 1 en ventas de todos los tiempos en todos los mercados populares de temas de WordPress, con más de 600.000 ventas y contando.

También es el tema de WordPress multipropósito más utilizado en este momento. Construido por la compañía ThemeFusion, Avada utiliza un Fusion Builder de arrastrar y soltar para que la personalización del sitio web sea sencilla incluso para aquellos que no tienen experiencia en la codificación única.

Después de instalar el tema Avada (la instalación del tema se hace de la misma manera que instalamos el tema X), ve a la pestaña Demo si quieres instalar una de sus plantillas de demostración como punto de partida.

Pasa el ratón por encima de cualquier plantilla de demostración, haz clic en Vista previa para ver la vista previa en vivo; si te gusta, haz clic en Importar para importar la plantilla. Puedes importar todas las demos que quieras; sólo tienes que activar la que quieras utilizar en cada momento.

Una vez que haga clic en Instalar, una ventana emergente le mostrará los plugins necesarios para importar los contenidos. Instale y active todos los plugins necesarios. Después de eso, marque la casilla Todo para importar el contenido de demostración de la plantilla seleccionada. A continuación, haga clic enImportar.

¡Felicidades! Has importado con éxito la plantilla de demostración, ahora abre una nueva pestaña en tu navegador y escribe tu dominio para ver cómo es tu nuevo sitio web.

The7 de Dream-Theme ($39)

The7 es otro de los temas más vendidos en Themeforest en este momento. Cuenta con una integración completa y perfecta con WPBakery Page Builder (antes Visual Composer) y Ultimate Addons.

Con más de 1000 opciones de temas, casi cualquier diseño imaginable puede ser creado con el tema The7. La función de Asistente de Diseño te permite crear un sitio web profesional en cuestión de minutos.

Los siguientes plugins premium están incluidos en el tema The7.

  • WPBakery Page Builder (antes Visual Composer)
  • Últimas adiciones
  • La revolución del deslizador
  • Deslizador de capas
  • Ir a las tablas de precios
  • ConvertPlus

También es totalmente compatible con los plugins más comunes como WooCommerce, Yoast SEO, etc.

Betheme de Muffingroup ($59)

Con más de 500 sitios web preconstruidos listos para usar y una instalación de 1 clic, Betheme le ofrece posibilidades ilimitadas. Betheme es muy adecuado para sitios web de cartera. Con su función de arrastrar y soltar, cualquier persona (incluso aquellos sin experiencia en codificación) puede construir fácilmente sitios web de aspecto profesional con él.

Impreza de UpSolution ($39)

Con Impreza, no hay límite a lo que puede personalizar para alinearse con sus necesidades específicas. Es una opción perfecta para un sitio web de cartera. Con más de 220 demos de páginas web ya hechas, Impreza también viene con un constructor visual de arrastrar y soltar y un instalador de demos de 1 clic.

Puente de QODE ($59)

Bridge es un tema de WordPress retina multipropósito con más de 500 demos y constructores de 2 páginas construido en el marco convincente y flexible por QODE.

Cualquiera de los sitios de demostración de ejemplo puede ser importado sin problemas al elegir su diseño o estilo favorito, y luego importar páginas y configuraciones con la función de importación con un solo clic. Con el tema de Bridge, puedes tener un sitio web completamente equipado instalado y funcionando en pocos minutos.

Enfold de Kriesi ($59)

Enfold es un tema de WordPress limpio, súper flexible y totalmente receptivo de Kriesi. Enfold puede ser utilizado para diseñar cualquier tipo de sitio web que van desde sitios web de la cartera ordenada, sitios web de negocios, sitios web de la Agencia, tiendas en línea, y mucho más. Construido sobre el Avia Framework, Enfold ofrece un plugin multi-idioma que incluye más de 20 idiomas.

Jupiter X de artbees ($59)

Jupiter X es tu tema todo en uno para crear sitios web fáciles de pixelar con rapidez. Con el constructor de páginas Elementor (el principal constructor de páginas de WordPress del mundo), puedes personalizar Jupiter X directamente con el personalizador de WordPress. Aparte de eso, ahora puede construir sus propios encabezados y pies de página sin esfuerzo utilizando los editores visuales.

Con más de 300 plantillas de sitios web prefabricados, Júpiter X también viene con cientos de plantillas de bloques de páginas para ahorrar tiempo e inspirarse. Cada mes se lanzan nuevos sitios web y plantillas de bloques para Júpiter X.

Uncode de undsgn ($59)

Uncode es un tema de WordPress creativo y perfecto para los píxeles. Se basa en una versión personalizada y mejorada del popular WPBakery Page Builder. Uncode es un tema multipropósito, limpio, flexible y adecuado para el diseño de cualquier sitio web. Puede ser utilizado para un sitio web de la cartera, la agencia, freelance, negocios, servicios, puesta en marcha, la fotografía, el evento, el artista, la música, etc.

Con más de 70 diseños de demostración diseñados profesionalmente, puedes importar y personalizar a tu gusto. Además, con el plugin Uncode Wireframes, también puedes importar más de 400 plantillas de secciones que pueden combinarse para crear un sitio web completo o una página de destino independiente. Puedes construir virtualmente cualquier cosa que quieras sin tocar o incluso sin ver una sola línea de código.

TheGem por CodexThemes ($59)

TheGem es un tema de WordPress multipropósito, responsivo y de alto rendimiento con un diseño artístico moderno que se adapta a todos los usos creativos del diseño web.

Diseñado y desarrollado por CodexThemes, TheGem es una caja de herramientas para la construcción de páginas web con elementos de diseño, estilos y características. Puedes construir un sitio web impresionante, profesional y de alto rendimiento en unos pocos minutos sin siquiera saber cómo codificar.

Está empaquetado con más de 40 conceptos de diseño multiusos distintivos, 150 magníficas páginas de demostración, 8 configuraciones de navegación en más de 20 estilos y diseños de página flexibles. Es perfecto para construir un sitio web de portafolio y cualquier otro tipo de sitio en pocos minutos.

La Gema se construye con pasión creativa en el corazón con deslumbrantes diseños ingeniosos, y a toda persona artística le encantará.

Temas recomendados para el sitio web de su cartera (gratis)

Aparte de todos los temas premium/pagos listados arriba, hay temas gratuitos que puedes usar para crear un hermoso sitio web de portafolio.

Una vez que instales WordPress en tu cuenta de alojamiento, tendrás acceso a los numerosos temas gratuitos de WordPress.

Cómo encontrar un tema gratis desde tu cuenta de WordPress

Para utilizar un tema gratuito, tendrás que encontrar el tema entrando en tu cuenta de WordPress. Pasa por encima de Apariencia y haz clic en Temas.

En la página de Temas, haga clic en "Añadir nuevo"."

En la página"Añadir nuevo", puedes ver los temas destacados, y todavía hay mucho más. De hecho, puedes filtrar los temas para conseguir lo que quieres.

Utilizando el menú de filtros, podemos filtrar los temas por: Populares, Últimos y Favoritos. Al hacer clic en el filtro "Últimos" se obtienen 7.656 resultados de temas:

Si tienes un nicho preferido en mente, puedes utilizar el cuadro de búsqueda. Así, para encontrar un tema de cartera, puedes hacer clic en la pestaña "Destacado" o escribir "cartera" en el cuadro de búsqueda para ver todos los temas de cartera. La búsqueda arrojó 863 resultados de temas.

Puede optar por restringir aún más su búsqueda utilizando la pestaña Filtro de características.

Normalmente, usar esa pestaña la mayoría de las veces es innecesario, especialmente si eres un principiante. Sin embargo, no hay nada malo en probarlo. Seleccionemos Portafolio en el encabezado Asunto, y Tres columnas en el encabezado Diseño, y luego hagamos clic en Aplicar filtros.

Después de esto, nos quedan 346 temas.

Por último, con el cuadro de búsqueda de temas , puede buscar un tema si ya conoce el nombre. Busquemos Gridster-Lite; ese es el tema gratuito que usaremos en este ejemplo.

Nuestra búsqueda arrojó tres resultados; usaremos el primero.

Ahora que has visto cómo filtrar los temas gratuitos para conseguir el tema deseado en WordPress. Vamos a ver cómo diseñar un sitio web de la cartera utilizando uno de los temas libres, Gridster-Lite.

Usando el tema libre de Gridster-Lite

En esta parte, aprenderemos a diseñar un sitio web de portafolio utilizando el tema gratuito de WordPress Gridster-Lite.

Una vez que hayas buscado y encontrado el tema, pasa el ratón por encima y haz clic en Instalar. Se puede obtener una vista previa para ver el aspecto que tendrá nuestro sitio web.

Una vez instalado, haga clic en Activar.

Veamos cómo se ve nuestro sitio web con el nuevo tema:

Paso 4: Añadir su demo-reel

Muchos de los temas que cubrimos tienen constructores de páginas o plantillas únicas que puedes importar para crear sitios web de portafolio de gran apariencia.

Sin embargo, quería asegurarme de que supieras cómo crear una página, añadirle tu demo y establecerla como tu página de inicio por defecto, en caso de que quisieras hacer las cosas por ti mismo.

Así que primero, vamos a añadir una nueva página:

Entonces serás dirigido al editor de la página, probablemente usando el editor de bloques. El editor de bloques es una forma muy agradable de construir páginas en Wordpress sin usar ningún tema o plugin. Llamemos a nuestra página "Home".

El editor de bloques te permite construir páginas con "bloques", que son básicamente piezas diferentes de una página, creadas con ajustes predeterminados. Pueden ser trozos de texto, o en nuestro caso, un vídeo incrustado.

Haga clic en el signo más para añadir un nuevo bloque:

Entonces aparecerá el bloque usado más recientemente, pero podemos navegar por todos los diferentes bloques o buscar el que queramos.

Sabemos que queremos añadir un vídeo a esta página, así que escribamos "vídeo" en la barra de búsqueda:

Se nos presentan algunas opciones diferentes para incrustar nuestro video. En este caso elegiremos Vimeo, pero también puedes usar YouTube y otros.

Después de elegir Vimeo, entraremos en la URL de nuestro demo reel de Vimeo y haremos clic en "Embed".

Nuestro demo reel fue añadido a la página.

Ahora vamos a establecer esta página como nuestra página de inicio por defecto.

Vaya a Configuración -> Lectura:

Selecciona una página estática para que se muestre como tu página de inicio, y elige la página que acabamos de crear (llamada "home").

Ahora, cuando vayamos a nuestra página web, esto es lo que veremos en nuestro demo, al frente y al centro.

Sí, el diseño no es nada para escribir en casa, pero ahora ya sabes cómo crear y editar tu página de inicio. Intenta explorar otros bloques, plantillas y creadores de páginas para encontrar el que funciona para ti!

Paso 5: Directrices de diseño del sitio web

Ahora que sabemos cómo construir un sitio web de portafolio, quiero hablar un poco sobre algunos conceptos básicos de diseño para mantenerte en el camino correcto para crear un sitio web de gran apariencia, pero también efectivo.

Lo primero que debes tener en cuenta es mantenerlo simple. Repite este mantra durante todo el tiempo que trabajes en tu sitio.

Si no tienes experiencia en diseño, tu tendencia será probablemente la de sobrecomplicar las cosas, añadir más información de la necesaria, y añadir tantos elementos como puedas. Especialmente porque estas plataformas de plantillas ofrecen tantas opciones geniales. Puede que pienses que es una gran idea incluir un widget de mapas con tu ubicación en la página de inicio, pero no es una gran idea. Limítate a lo básico.

Lo más importante es que recuerdes para quién estás haciendo este sitio. No lo estás haciendo para ti, ya lo sabes todo sobre ti. Lo estás haciendo para gente de la industria que quiere saber más sobre ti. Quieren una breve información sobre ti, ver algunos de tus trabajos y una forma de ponerse en contacto contigo. Eso es todo. Todo lo que no sea eso es probablemente innecesario.

Una sola página vs. varias páginas

Hay dos enfoques comunes para un sitio web de portafolio personal. El diseño de una sola página y el de varias páginas.

Un sitio web de una sola página es una sola página web con un montón de elementos de menú en la parte superior que conducen a diferentes partes de la página, por lo que el espectador permanece en la misma página todo el tiempo.

Un sitio web multipágina es cuando se divide el sitio web en páginas individuales, una para cada propósito. Por ejemplo, una página de contacto o una biografía. Entonces el menú de navegación te lleva a la página apropiada.

Elegir un diseño es tu elección, es una cuestión de gusto, pero si no tienes demasiadas cosas que poner en el sitio, o si no puedes decidir, la opción más segura es ir con es un diseño de una sola página.

Es la opción más considerada para sus lectores, ya que les facilita la obtención de toda la información que necesitan en un solo lugar. Personalmente creo que es la mejor opción.

En realidad usado un diseño multipágina para mi propio sitio web de portafolio, porque tenía mucho que escribir en cada sección, tenía una página para mis cortometrajes, una página con mi biografía personal, y quería una opción de menú dedicada para enlazar con mi blog en bloopanimation.com.

Pero a pesar de que usé una página múltiple, traté mi página principal como una mini página de diseño, incluyendo una imagen, un breve titular que resume quién soy, un párrafo más largo con una biografía más detallada, un enlace a mi blog y una lista de mis cortometrajes.

De esa manera, si alguien salta al sitio y no quiere empezar a navegar, todavía puede obtener toda la información de esa página.

Respeto mucho el tiempo de mis lectores y quiero asegurarme de que hago todo lo posible para facilitarles la tarea cuando se toman el tiempo de investigar lo que hago.

Metas

Asegúrate de saber cuál es el objetivo de tu sitio web. Mis objetivos con el sitio web pueden ser diferentes a los tuyos.

Estoy tratando de dar información básica sobre mí y posicionarme como director de animación. Ya no estoy tratando de ser contratado como animador, así que ni siquiera tengo mi demo reel en el sitio.

Solía hacerlo, cuando todavía trabajaba en los estudios, y por aquel entonces lo primero que se veía en mi página web era un gran vídeo de mi demo reel, esperando a que hicieras clic para verlo. Lo hice porque sabía que las personas que visitan el sitio son probablemente de un estudio que está considerando contratarme, así que quise facilitarles lo más posible la posibilidad de ver mi trabajo.

Trabaja en tu página web para que ofrezca lo que más le interesa a tus lectores. Pon esa cosa al frente y al centro.

Conclusión + Recursos

Gracias por seguir esta enorme guía, espero que haya sido de ayuda.

Para su conveniencia, he reunido todos los diferentes recursos mencionados en esta guía a continuación, para que pueda consultarlos en cualquier momento.

¡Buena suerte con tu trabajo!

Recursos:

Alojamiento del sitio web

  • Wix.com: Para los principiantes que quieren una solución prefabricada fácil de usar.
  • Bluehost: Para los que quieren más control, pero no quieren gastar mucho dinero.
  • Kinsta: Para los que quieren la solución premium más avanzada, y no les importa pagar por ella.

Temas

Artículos