«Lo que no está a la vista no se vende». Esta máxima aplica para todo, especialmente para los creativos y los cientos de miles de negocios que luchan por mayor visibilidad en el mundo. 

La forma de lograrlo es con un sitio web que conecte con los usuarios y los invite a explorar los servicios o productos que ofreces. El que las personas se queden depende de muchos factores, incluyendo el tiempo de carga de una página y el diseño de la misma. 

Piénsalo así: si no te gusta cómo se ve una página, difícilmente te quedarás a seguir leyendo. Por eso te traemos un listado de sitios web de empresa y personales que te inspirarán a crear el tuyo.

Guía Gratis

Inspiración para el diseño de sitios web

Cuéntanos un poco de ti para acceder a la guía

Ejemplos de sitios web empresariales originales

¿Para qué querrías un sitio web de negocio? Se estima que para 2023 las ventas online alcancen los 6.542 mil millones de dólares. Hoy en día es indispensable comenzar un sitio web que sea tu centro de operaciones, sin importar si tu negocio está dirigido a otras empresas o al público en general. Así podrás darte a conocer de forma internacional, concentrar las actividades de tus redes sociales, amplificar el efecto de tu publicidad offline y, en general, encontrar más y mejores oportunidades de venta.

Cada empresa es un mundo, por lo que debe tener un sitio que la distinga de la competencia. Estos sitios no solo son ideales para pasar tiempo en internet, sino que te ayudarán a tomar inspiración para crear el mejor sitio de tu negocio. 

1. Malvestida

Ejemplo de página web: Malvestida

Imagen de Malvestida

Lo que hacen estas autoras es combinar varios puntos de vista y distintas estéticas en un tema extremadamente colorido y estridente. Compaginan también diferentes técnicas digitales para realzar el contenido que publican. Un punto que tienes que notar y que es un plus a la hora de hacer contenido: el contraste del fondo blanco con tipografías oscuras y sans serif. 

2. Giphy

Ejemplo de página web: Giphy

Imagen de Giphy

Amo el modo en que este sitio organiza el contenido, de forma tal que puedes pasar horas buscando el gif ideal para ilustrar una situación en específico. Además, es entretenido ver cómo la gente puede crear sus propios gifs en función de lo que necesitan. 

3. Medium

Ejemplo de sitio web: Medium

Imagen de Medium

En términos de usabilidad, esta es una de las opciones más increíbles. Tiene un diseño súper intuitivo que te lleva de la mano por diferentes lecturas que se interrelacionan. 

4. Genial.Gurú

Ejemplo de sitio web original: Genial

Imagen de Genial.Gurú

De diseño minimalista, va también de la mano con una tendencia en la web: el diseño por bloques verticales de colores sobre fondo claro. Es una web donde puedes pasar horas leyendo sobre datos curiosos, porque el diseño carga muy rápido. 

5. Minerva

Ejemplo de sitio web original: Minerva

Imagen de Minerva

Quizá una de las webs más bonitas que hay en el listado. La cervecera de Guadalajara, México tiene una presencia web increíble. El sitio está organizado en bloques de fotos con una tipografía extremadamente legible que permite un examen rápido por las diferentes secciones. 

Lo que más nos gusta de esta web es que está complementada con diferentes iconos relacionados con el giro, junto a un gran manejo del color de la marca.

6. Cervecería de Colima

Ejemplo de sitio web original: Cervecería de Colima

Imagen de Cervecería de Colima

A pesar de que tiene el mismo giro que el sitio anterior, Cervecería de Colima organiza la información de manera vertical y le da la misma prioridad a la imagen fija y al video para presentar su producto estrella. (Mira qué bonitos son los videos que tienen en la página de inicio).

Usa un diseño relativamente clásico: imágenes sobre fondo oscuro y tipografía clara y legible, lo cual siempre es atractivo y te hace querer ver más. 

7. Atlantic Records

Ejemplo de sitio web original: Atlantic Records

Imagen de Atlantic Records

Creo que este es uno de mis sitios clásicos favoritos y la prueba de que la industria musical puede ir adaptándose a los nuevos tiempos. Tiene un diseño intermedio entre lo más actual y un diseño web clásico. Los colores marcan acentos bien interesantes sobre el fondo blanco y la funcionalidad de los colores. 

8. Nos reiremos de esto

Ejemplo de página web original: Nos reiremos de esto

Imagen de Nos reiremos de esto

La página de este proyecto + tienda virtual ha sido uno de nuestros descubrimientos favoritos de los últimos meses, ya que se aparta del diseño tradicional: usa un fondo oscuro y una tipografía increíble de color claro. 

Se siente urbana la combinación de negro y amarillo junto a los diferentes iconos que le dan continuidad a la vista. 

9. Waaark

Ejemplo de página web original: Waaark

Imagen de Waaark

«No puedes llamarte un estudio creativo si tu web no lo demuestra», parece ser el tema que te aborda cuando entras a waaark.com. Y te prometemos que te enamorarás del uso de los colores y los iconos para ejemplificar las diferentes secciones del sitio. 

10. Airbnb

Ejemplo de sitio web de empresa original: Airbnb

Imagen de Airbnb

Airbnb tiene uno de los diseños más geniales de todo el internet: es elegante, sencillo y con múltiples opciones una vez que entras a su home.

11. Hunter Boots

Ejemplo de página web de empresa original: Hunter Boots

Imagen de Hunter Boots

El diseño del sitio web de esta tienda tiene dos características particulares que me llaman la atención: el hecho de que una cookie te envíe a un sitio específico y la combinación de colores que realmente llama mucho la atención. 

Algunas buenas prácticas a la hora de diseñar un sitio web empresarial

Cada empresa debe tener un diseño único que el usuario pueda reconocer el giro (a lo que se dedica) y lo que puede encontrar en tu sitio en menos de 5 segundos. Por eso ten en cuenta los siguientes tips para realizar tu diseño:

  • Ten en cuenta la usabilidad, es la facilidad con que las personas pueden utilizar una herramienta particular o cualquier otro objeto fabricado por humanos con el fin de alcanzar un objetivo concreto.​ Mira algunos ejemplos de SEOptimer.

  • Usa tipografías adecuadas, pues recuerda que son indispensables para hacer llegar tu mensaje al consumidor adecuado. 
  • Crea una interfaz amigable para hacer que el usuario se quede en tu página por un buen rato, navegue y encuentre lo que está buscando de forma intuitiva.
  • Deja tus datos de contacto, ya que al listar todas las formas que hay de contactar a tu empresa, el usuario se sentirá seguro de que lo vas a atender de forma expedita.
  • Ten en mente que la presentación de tu oferta tiene que ser clara y de acuerdo con lo que quieres vender.

Ejemplos de sitios web personales creativos con currículum

Cuando solicitas un trabajo, generalmente debes presentar un currículum y una carta de presentación, o quizá tu perfil de LinkedIn. No obstante, hay maneras más eficaces de destacarte de la competencia, y crear un sitio web personal es una de ellas.

El problema con el currículum y la carta de presentación es que generalmente son aburridos, sin importar cuánto te esfuerces en darles un estilo propio. Hay una buena razón para ello: se supone que debe ser una sola página, con información básica que documente tu experiencia laboral. Si bien es bueno ser conciso, hay muy pocas posibilidades de transmitir tu originalidad o de que se destaque tu personalidad.

Un currículum es un documento único que prácticamente no cambia, mientras que un sitio web personal puede personalizarse y actualizarse según el trabajo que estés desempeñando o lo que desees resaltar. Es fluido y se mantiene actualizado. 

Si estás considerando la posibilidad de crear tu propio sitio web personal, echa un vistazo a los siguientes ejemplos y obtén la inspiración que necesitas.

12. Gary Sheng

Ejemplo de página web personal original: Gary Sheng

Imagen de Gary Sheng

A diferencia de un currículum tradicional, el sitio web de Sheng incluye logotipos y enlaces en los que se puede hacer clic. En ellos destaca sus habilidades de ingeniería de software y desarrollo de sitios web.

Es genial que los visitantes puedan elegir entre desplazarse por la página para ver todas las categorías del sitio web («Acerca de mí», «Mi pasión», etc.) o ir directamente a una página específica mediante la barra de navegación superior.

La sección «Mi sistema» se asemeja a la declaración de misión de una empresa, y este toque personal ayuda a humanizar su trabajo y a que sea difícil de olvidar.

13. Rafael Derolez

Ejemplo de sitio web personal original: Rafael Derolez

Imagen de Rafael Derolez

El currículum web de Derolez es moderno, interesante e informativo. Muestra su personalidad, su branding y sus habilidades de desarrollo de una manera muy simple y clara. Además, el uso de fuentes únicas y superposiciones geométricas le da personalidad a su nombre de forma visualmente atractiva.

¿Quieres ponerte en contacto con Derolez? Solo haz clic en la llamada a la acción en la parte inferior de la página para abrir un correo electrónico que será dirigido directamente a él. O bien, selecciona uno de los enlaces de redes sociales para ponerte en contacto con él en plataformas como Twitter.

14. Brandon Johnson

Ejemplo de sitio web creativo: Brandon Johnson

Imagen de Brandon Johnson

El increíble currículum de Johnson es digno de visitar. Hermosas imágenes de planetas complementan su trayectoria en la astronomía, y las animaciones hacen que su currículum sea una experiencia muy entretenida, más que un simple documento.

En cuanto al diseño, el fondo con texturas y múltiples capas añade profundidad a la página bidimensional y evoca el espacio exterior y los sistemas planetarios, que constituyen el centro del trabajo de Johnson.

15. Quinnton Harris

Ejemplo de sitio web original: Quinnton Harris

Imagen de Quinnton Harris

El curriculum de Harris, con numerosas fotografías que cuentan su historia personal, parece una especie de álbum de recortes digital. Abarca todas las áreas de una hoja de vida (e incluso más) y describe su formación académica, su experiencia laboral y sus habilidades de una manera sumamente visual.

Además, el texto es magnífico. Es claro que Harris se tomó el tiempo necesario para elegir cuidadosamente las palabras con el fin de describir cada paso de su recorrido personal y profesional. Por ejemplo, la sección de narración dice lo siguiente:

La ciudad de Nueva York, mi nuevo hogar,
tiene todos los secretos necesarios para impulsar
no solo mi profesión, sino mi identidad como artista.
Con cada objetivo que encuadro y cada píxel que configuro, descubro mi propia personalidad.

Finalmente, en el último punto de navegación (con los círculos ubicados a la izquierda de la página que permiten desplazarse), los usuarios son redirigidos al inicio, donde Harris sigue contando su historia a profundidad.

16. Sean Halpin

Ejemplo de página web original para currículum: Sean Halpin

Imagen de Sean Halpin

El currículum de Halpin es breve, agradable y directo, lo que representa fielmente su estilo y su branding personal descritos en el sitio. El espacio en blanco permite que sus diseños y el texto se destaquen y llamen la atención del lector. Esto ayuda a mejorar la legibilidad, especialmente en los dispositivos móviles.

Algunas buenas prácticas para crear sitios web con currículum
  1. Codifica tu currículum para que pueda ser rastreado por los motores de búsqueda.
  2. Ofrece un botón para descargar tu currículum en PDF para que el manager de contratación pueda agregarlo a tu archivo.
  3. Mantén la coherencia del branding entre la versión del sitio web y la del documento: utiliza fotografías, colores e imágenes similares para que sea fácil reconocerte.
  4. Sé creativo y auténtico. Piensa en los colores, las imágenes y los medios que quieres que formen parte de tu historia y que no podrías incluir en un currículum tradicional.

Ejemplos de sitios web personales creativos con portafolios

Diseñar un portafolio online es una herramienta de marketing y branding personal muy útil, en particular si tu experiencia laboral y tus habilidades se relacionan con la creación de contenido. De hecho, los fotógrafos, diseñadores gráficos, ilustradores, redactores y profesionales del marketing de contenidos pueden utilizar portafolios web para demostrar sus habilidades de manera más amena que un currículum o un portafolio impreso.

17. Tony D’Orio

Ejemplo de sitio web original: Tony D'Orio

Imagen de Tony D’Orio

Es importante que el diseño de tu porfolio visual sea simple para permitir que las imágenes capten la atención de los visitantes, y D’Orio lo logra incluyendo llamativas fotografías en primer plano en su sitio web. Su logotipo y el menú de navegación son claros y no distraen la atención de su trabajo. Además, los posibles clientes pueden descargar fácilmente su trabajo de manera gratuita.

¿Quieres intentarlo? Haz clic en el menú de la esquina superior izquierda, y luego selecciona «Crear un PDF» para elegir todas las imágenes que desees descargar. Cuando abras el PDF, verás que incluye la tarjeta de presentación de D’Orio a modo de portada, en caso de que la necesites.

18. Gari Cruze

Ejemplo de página web original con portafolio: Gari Cruze

Imagen de Gari Cruze

Cruze es redactor; sin embargo, al convertir su sitio web en un porfolio con imágenes de las diferentes campañas en las que ha trabajado, logra que los visitantes sigan haciendo clic para obtener más información sobre él. Además, hay una excelente llamada a la acción en la parte superior de la página que dirige a los visitantes a la publicación del blog más reciente de Cruze.

El divertido texto de su sitio, específicamente en las secciones «17 Random Things» (17 datos al azar) y «Oh Yes, They’re Talking» (Oh, sí, hablan), sirve para demostrar sus habilidades y, a la vez, hacerlo aún más memorable. A la derecha de estas páginas también se incluye la información de contacto de Cruze, lo que permite mantener comunicación con él en cualquier momento de manera fácil.

19. Melanie Daveid

Ejemplo de sitio web original personal con portafolio: Melanie Daveid

Imagen de Melanie Daveid

El sitio web de Daveid es un ejemplo perfecto de «menos es más».

El portafolio de esta desarrolladora incluye imágenes claras y emblemáticas de campañas y aplicaciones en las que ha trabajado. Puedes apreciar sus habilidades de codificación cuando hagas clic para ver los detalles de su trabajo.

Si bien puede parecer un exceso de minimalismo presentar pocos ejemplos de su trabajo, Daveid benefició su porfolio al incluir sus campañas más notables.

20. The Beast is Back

Ejemplo de página web de portafolio creativo: The Beast is Back

Imagen de The Beast is Back

El portafolio de Christopher Lee es colorido y abigarrado de una manera que resulta muy atractiva. Cuando aprendes sobre Lee en su sitio (muy fácil de navegar), comprendes que esta divertida y dinámica página principal es perfecta para un ilustrador y diseñador de juguetes.

En su porfolio web se destacan diseños llamativos con marcas reconocidas, como Adobe y Hasbro, junto con enlaces para comprar su trabajo. Este es otro porfolio estilo galería con toques de color que le aportan personalidad y hacen que sea divertido y, por ende, más memorable. 

Buenas prácticas para crear sitios web con portafolios
  1. Utiliza principalmente imágenes. Aunque muestres tu trabajo escrito, el uso de logotipos u otro tipo de branding es más llamativo para tus visitantes.
  2. No tengas miedo de ser tú mismo. Tu personalidad, estilo y sentido del humor son lo que pueden distinguirte de los demás sitios.
  3. La organización es fundamental. Si tu porfolio está repleto de fotografías, logotipos y otras imágenes, asegúrate de que los visitantes puedan navegar fácilmente hasta el lugar donde puedan contactar contigo.
  4. Crea tu propia marca. Elige un logotipo o símbolo para que tu información sea fácil de identificar.

Ejemplos de páginas web originales personales tipo blog

Publicar con frecuencia en un blog es una excelente manera de llamar la atención en las redes sociales y los motores de búsqueda, y así aumentar el tráfico a tu sitio web. Publicar en blogs es una manera inteligente de dar personalidad a tu trabajo, contar tus experiencias y mejorar tu redacción. Puedes escribir un blog personal si eres escritor de profesión, pero prácticamente cualquier persona puede beneficiarse de sumar un blog a su sitio y ofrecer contenido útil a su público.

21. The Everywhereist

Ejemplo de sitio web original con blog: The Everywhereist

Imagen de The Everywhereist

Su coherente branding ayuda a los visitantes a navegar fácilmente por el sitio. El blog de viajes usa una iconografía mundial para trasladar a los visitantes por el sitio y facilita la exploración de secciones fuera del blog.

También incluye la sección «Best Of» (Lo mejor), que ofrece un panorama general a los nuevos visitantes sobre lo que pueden esperar del blog. El esquema de colores es cálido y neutro, sin demasiados recursos que pudieran distraer la atención del contenido.

22. fifty coffees

Ejemplo de sitio web con blog: fifty coffees

Imagen de fifty coffees

fifty coffees narra acerca de las reuniones en las que la autora compartió una taza de café mientras buscaba su próxima oportunidad laboral, y hace un excelente trabajo al utilizar fotografías e ilustraciones para ayudar a contar sus largas historias.

¿La mejor parte? Cada publicación termina con una lista de las conclusiones de sus reuniones para facilitar la comprensión de texto. Las fotografías de alta calidad que complementan las historias son la cereza del pastel.

23. Minimalist Baker

Ejemplo de página web original: Minimalist Baker

Imagen de Minimalist Baker

No destacamos el blog de comidas de Dana solo porque las comidas se vean deliciosas y tengo hambre. Su blog tiene un fondo de color blanco que permite que sobresalgan las fotografías de sus comidas, un branding único que la hace memorable y una breve biografía para personalizar su sitio web.

24. Kendra Schaefer

Ejemplo de sitio web original: Kendra Schaefer

Imagen de Kendra Schaefer

El blog de Kendra está repleto de información sobre su vida, su historia y su experiencia profesional, pero evita abrumar a los visitantes al usar un fondo claro y organizar los módulos de su blog para minimizar el desorden. También comparte enlaces a ensayos adicionales, lo que reafirma su autoridad y credibilidad como escritora.

Buenas prácticas para crear blogs

  1. Mantén tu sitio simple y ordenado para evitar distracciones más allá de las publicaciones del blog.
  2. Publica con frecuencia, cerca de 3 a 5 veces a la semana.
  3. Experimenta con diferentes estilos de blogs, como listas, entrevistas, gráficos y viñetas.
  4. Emplea imágenes para dividir el texto y añadir contexto a tu análisis.

Ejemplos de páginas web personales con demostraciones

Otra excelente manera de darte a conocer y promocionar tus habilidades es crear un sitio web personal que también sea una demostración de tus habilidades como codificador, diseñador, ilustrador o desarrollador. Estos sitios pueden ser interactivos y animados, de manera que brinden información sobre ti y también les demuestren a los managers de contratación por qué deberían trabajar contigo. Esta es una excelente opción de sitio web para los creadores de contenido técnico y artístico, como desarrolladores, animadores, diseñadores de experiencias del usuario, managers de contenido de sitios web e ilustradores.

<< Descarga gratis 77 ejemplos de páginas principales, blogs y páginas de  destino excepcionales >> 

25. Albino Tonnina

Ejemplo de página web original: Albino Tonnina

Imagen de Albino Tonnina

Tonnina demuestra habilidades avanzadas y complejas de desarrollo de sitios web; sin embargo, las imágenes y los símbolos que utiliza son claros y fáciles de entender. También ofrece una opción simple para ver su currículum al principio de su sitio para aquellos que no deseen explorar la animación.

26. Robby Leonardi

Ejemplo de página web: Robby Leonardi

Imagen de Robby Leonardi

El increíble sitio web de demostración de Leonardi aprovecha las habilidades de animación y desarrollo de sitios web para convertir su porfolio y currículum en un videojuego para los visitantes del sitio. El fantástico branding y la manera única de compartir información garantizan que su sitio sea inolvidable para los visitantes.

27. Samuel Reed

Ejemplo de sitio web original: STRML de Samuel Reed

Imagen de Samuel Reed

Reed usa su página como una demostración completa sobre cómo codificar un sitio web. Su sitio web comienza como una página en blanco y termina como un sitio totalmente interactivo donde los visitantes pueden apreciar la manera en que Reed realiza su trabajo. Lo genial de este sitio web hace que sea memorable y que sus habilidades sean sumamente fáciles de promocionar.

28. Devon Stank

Ejemplo de página web original: Devon Stank

Imagen de Devon Stank

El sitio de demostración de Stank hace un excelente trabajo: expone sus conocimientos especializados de diseño web, a la vez que cuenta todo sobre él, su agencia y sus pasiones. Es el equilibrio perfecto entre una demostración y un currículum breve.

Además, nos encanta el resumen en video. Es fácil de ver y entender, lo que revela tanto la personalidad como las certificaciones de Stank.

Buenas prácticas para crear sitios web con demostraciones

  1. Crea tu propia marca y utiliza logotipos y colores uniformes para identificar tu nombre y tus habilidades entre el conjunto de imágenes.
  2. No abrumes a tus visitantes con demasiadas imágenes a la vez, especialmente si tu demostración es animada. Asegúrate de que las imágenes sean fáciles de entender para que los visitantes no se sientan agobiados cuando exploren tu sitio.

 

¿Cuál de estos ejemplos fue tu favorito? Ahora tienes toda la inspiración que necesitas para hacer tu propio sitio web original.

 

Inspiración Web

 diseño web

Publicado originalmente en septiembre 15 2020, actualizado septiembre 16 2020

Topics:

Diseño Web