Un enlace de portafolio muchas veces se abre en el peor contexto: entre reuniones, desde un celular, en un correo reenviado o cinco minutos antes de que un panel compare candidatos.
Ese enlace tiene una tarea concreta. Hacer que el trabajo sea fácil de revisar.
Para muchos diseñadores, desarrolladores, fotógrafos, redactores, motion designers, estudiantes, estudios y freelancers, un portafolio estático es suficiente. Puede mostrar casos de estudio, visuales de alta calidad, demos, notas de proyecto, enlaces al código, videos y formas de contacto sin ejecutar un servidor. El reto no suele ser el hosting. El reto es publicar los archivos correctos, mantener el sitio rápido y poner el trabajo en una URL que se sienta intencional.
Qué debería resolver el hosting de un portafolio
Un portafolio no es solo una galería. Es una superficie de prueba.
| Necesidad | Qué significa en la práctica |
|---|---|
| Identidad propia | Usar un dominio propio en vez de depender solo de un perfil en una plataforma. |
| Casos con contexto | Mostrar problema, rol, restricciones, proceso, resultado y pruebas. |
| Calidad visual | Servir imágenes y medios con intención, sin forzar todo al formato de un feed. |
| Revisión real | Enlazar prototipos, demos estáticas, pequeñas apps web, documentación o código. |
| Revisión privada | Compartir trabajo no final o sensible detrás de contraseña cuando haga falta. |
| Seguridad de lanzamiento | Reemplazar o hacer rollback si un export, path de imagen o página de proyecto se rompe. |
El mejor camino de hosting debería permitir empezar simple y crecer hacia una presencia profesional más seria.
Portafolio estático o website builder
Los builders son cómodos. Las redes de portafolios ayudan a ser descubierto. Pero un sitio estático independiente da más control cuando el portafolio también es parte del trabajo.
| Opción | Cuándo conviene | Límite |
|---|---|---|
| Red de perfiles | Descubrimiento, uploads visuales rápidos, señales de comunidad | Estructura, marca, rutas e interacción limitadas. |
| Website builder | Edición sin código, templates, páginas rápidas | Costo mensual, límites del template, exportación y lock-in varían. |
| Portafolio estático | Diseño propio, exports, portafolios de código, demos interactivas | Hay que cuidar archivos, assets y disciplina de publicación. |
Para un diseñador, el portafolio puede ser la interfaz. Para un frontend developer, puede ser una muestra de producto. Para un estudio, puede ser el primer punto serio de marca. En esos casos, el sitio no debería sentirse como un perfil más dentro de un sistema ajeno.
Qué publicar desde herramientas comunes
El error más común es subir la carpeta equivocada.
| Herramienta o stack | Normalmente publica esto | Revisa antes de subir |
|---|---|---|
| HTML/CSS/JS | Carpeta que contiene index.html | Incluye imágenes, fuentes, scripts y páginas de proyecto. |
| Export de Framer | Carpeta estática exportada | Prueba paths de assets y layouts responsive después del export. |
| Export de Webflow | Carpeta del sitio exportado | Confirma custom code y comportamiento de forms. |
| Vite | dist después de npm run build | Revisa base paths si el sitio usa rutas anidadas. |
| React estático | build o salida del framework | Prueba rutas client-side y paths de assets. |
| Next static export | out | Solo para rutas que se pueden exportar estáticamente. |
| Astro / Eleventy / Hugo / Jekyll | Carpeta generada | No subas source si el host no ejecuta el build. |
Cloudflare Pages documenta Direct Upload para assets precompilados y cargas desde una computadora local. Eso importa para portafolios porque muchos empiezan como carpetas exportadas, no como pipelines CI perfectamente armados.
El caso de estudio importa más que la homepage
La homepage llama la atención. Las páginas de proyecto generan confianza.
Un buen caso de estudio suele responder estas preguntas:
| Pregunta | Por qué importa |
|---|---|
| ¿Cuál era el problema? | Alguien externo necesita entender brief, audiencia y restricciones. |
| ¿Cuál fue tu rol? | Un equipo quiere saber qué parte fue realmente tuya. |
| ¿Qué decisiones tomaste? | El proceso pesa más cuando el resultado visual se ve muy pulido. |
| ¿Qué cambió después del lanzamiento? | Métricas, citas, antes/después o aprendizajes hacen el trabajo más creíble. |
| ¿Dónde se puede revisar? | Enlaza demos, prototipos, videos, código fuente o notas más profundas. |
No todas las páginas de proyecto deben medir lo mismo. Un experimento CSS puede necesitar tres párrafos y una demo. Un rediseño de producto puede necesitar un caso completo. Un proyecto confidencial puede requerir un resumen redactado y un enlace privado.
Muestra buen material sin volver lento el sitio
Muchos portafolios fallan porque el trabajo se ve bien, pero la página pesa demasiado.
Antes de lanzar:
- Exporta imágenes al tamaño que el layout realmente usa.
- Usa formatos modernos cuando tu flujo los soporte.
- Comprime videos y evita autoplay de fondos pesados por defecto.
- Aplica lazy load a galerías largas.
- Deja originales de alta resolución solo cuando aporten algo.
- Prueba en celular con una red normal, no solo en un monitor grande.
Los analytics ayudan después del lanzamiento. Si un caso importante recibe tráfico pero la gente se va rápido, el problema puede estar en la historia, el peso de medios o el layout móvil, no necesariamente en la calidad del trabajo.
Usa dominio propio cuando el portafolio se vuelve serio
Una URL de preview sirve para una primera revisión. Un portafolio profesional normalmente debería vivir en un dominio que controlas.
Patrones útiles:
| Patrón | Ejemplo |
|---|---|
| Nombre personal | alexchen.dev, maria.design |
| Nombre de estudio | northline.studio |
| Rol | productdesigner.name, frontend.dev |
| Subdominio | work.example.com, portfolio.example.com |
Un dominio propio no es solo estética. Hace que el enlace sea más fácil de recordar, reutilizar y mover si cambias de plataforma. Google también documenta datos estructurados ProfilePage para ayudar a proporcionar información sobre personas y organizaciones en un sitio. No es un truco de ranking, pero sí otra razón para tratar el portafolio como una propiedad web real.
Protege trabajo que todavía no debería ser público
Los portafolios pueden incluir material sensible: nombres de clientes, pantallas de productos no lanzados, métricas internas, pitch work, proyectos de equipo o capturas bajo NDA.
Una regla simple ayuda:
| Tipo de trabajo | Publicación más segura |
|---|---|
| Trabajo público ya lanzado | Caso público con enlaces e imágenes. |
| Aprobado pero limitado | Resumen público más detalles protegidos con contraseña. |
| NDA o no lanzado | Página redactada o solo enlace privado. |
| Proyecto de equipo | Aclarar tu rol y dar crédito a colaboradores. |
| Métricas | Usar rangos o resultados cualitativos si los números exactos son confidenciales. |
La protección con contraseña no reemplaza una revisión legal. Es una capa práctica para compartir. Si el trabajo es sensible por contrato, pide permiso antes de publicar detalles.
Qué deberían decirte los analytics
Los analytics de un portafolio no deberían convertirse en un hobby. Deben responder algunas preguntas útiles.
| Pregunta | Señal útil |
|---|---|
| ¿La gente abre el portafolio? | Visitas, visitantes, países, referrers. |
| ¿Qué trabajos llaman la atención? | Páginas principales y rutas de proyecto. |
| ¿Los reclutadores llegan desde los canales correctos? | Referrers desde LinkedIn, email, bolsas de trabajo o dominio personal. |
| ¿El sitio pesa demasiado? | Bandwidth, dispositivos, navegadores y tráfico móvil. |
| ¿Una nueva versión rompió algo? | Caída repentina en páginas clave o rutas 404 repetidas. |
Usa enlaces UTM cuando compartas el portafolio en un CV PDF, post de LinkedIn, correo de outreach o campaña. Así "alguien lo abrió" deja de ser pura suposición.
Dónde entra DeployPages
DeployPages encaja cuando tu portafolio es un sitio estático o un export estático y quieres un flujo de publicación controlado.
Puedes subir desde el navegador una carpeta HTML, ZIP, export de Framer, build estático, demo pequeña, PDF de caso de estudio o portafolio completo. Cuando crece, el mismo proyecto puede usar dominios personalizados, analytics, protección con contraseña, rollback y deploys por CLI.
Para empezar, usa portfolio hosting. Si el portafolio empieza como página de CV, revisa resume hosting. Para una carpeta HTML simple, la guía para desplegar HTML es más directa.
Checklist antes de publicar
Antes de compartir el enlace del portafolio públicamente:
- Abre cada página principal y cada caso de estudio.
- Revisa mobile para hero, galerías, captions y cards de proyecto.
- Comprime imágenes, videos, PDFs y assets de export innecesarios.
- Reemplaza
localhost, rutas privadas, textos placeholder y nombres de proyecto borrador. - Agrega una forma clara de contacto.
- Usa dominio propio si el portafolio tiene uso profesional.
- Redacta o protege con contraseña el trabajo sensible.
- Prueba enlaces a demos, código fuente, prototipos y medios externos.
- Mantén una ruta de rollback antes de un rediseño grande.
Un portafolio no necesita ser enorme. Debe ser revisable, suficientemente rápido, honesto sobre tu rol y fácil de recordar.