Cómo diseñar sitios web que no sean feos

Answer 1

Te contaré un pequeño secreto sucio: casi todos los sitios web ‘hermosos’ son esencialmente copias unos de otros. No tiene que ser un diseñador talentoso para diseñar un sitio web hermoso, solo necesita seguir algunas reglas básicas y principios de diseño universal. Es decir. Sé un buen imitador.

No se embarque desde cero e intente crear algo completamente nuevo y original: el 99% de las veces se verá feo, garantizado.

1. Comience con espacios en blanco y tipografía.

   Lo creas o no, el 90% del atractivo estético de un sitio web proviene solo del TEXTO escrito en la página. El estilo de fuente, el tamaño, las proporciones y el buen uso del espacio en blanco lo son todo.

   Si puede diseñar un sitio hermoso usando solo texto y espacios en blanco, el resto es salsa.
2. Utilice imágenes de alta calidad o ninguna imagen

   Si va a agregar gráficos a su sitio web, es mejor que sean de alta calidad. Las fotos de archivo baratas, gratuitas o usadas en exceso no son suficientes. Y las fotografías de aficionados son aún peores. Hay muchas imágenes, gráficos e íconos de alta calidad disponibles con una búsqueda rápida en Google.

Las plantillas son un gran comienzo. Para mantenerse en línea con el diseño de la plantilla, asegurando que el sitio se vea genial, pero aún así altamente personalizado y original, inspírese. Nadie quiere un sitio web para cortar galletas.

Comience por ‘tomar prestados’ elementos de hermosos sitios web existentes para determinar qué proporciones debe tener y dónde colocar los elementos:

Las mejores tendencias de diseño web

Flat Design Gallery & Showcase • Un recurso inspirador para diseñadores • Flat Inspire

¡Buena suerte!

Anna

Answer 2

Estos elementos son los 7 principios clave que hacen que un diseño web se vea bien :

• Equilibrar,
• Cuadrícula,
• Color,
• Gráficos,
• Tipografía,
• Espacio en blanco,

1. Balance

El equilibrio se trata de garantizar que su diseño no se incline hacia un lado u otro. Es como el equilibrio de peso para lograr simetría o asimetría.

2. rejilla

El concepto de cuadrículas está estrechamente relacionado con el de equilibrio. Las cuadrículas son una serie de reglas horizontales y verticales que lo ayudan a “compartimentar” un diseño. Piensa en columnas. Las columnas mejoran la legibilidad, haciendo que el contenido de una página sea más fácil de absorber. El espaciado y el uso de la Regla de los tercios (o Golden Ratio similar) hacen que todo sea más fácil a la vista.

3. Color

¿Qué pasa si cambiaste la base roja en el sitio web de The First Twenty (arriba) a verde lima? ¿Se vería bien? Probablemente no. Porque no pertenece a la misma paleta de colores (y, por supuesto, el verde lima no es el color más fácil para trabajar). Los sitios web como ColourLovers existen por alguna razón. No puedes elegir tus colores al estilo Rambo, con las armas encendidas. Algunos colores van bien juntos, otros no. Existen muchas teorías sobre los colores y sus combinaciones, incluidas las convenciones sobre esquemas monocromáticos y contrastantes, pero muchas se reducen al sentido común y a tener una idea de ello.

4. Gráficos

De acuerdo, un gran diseño no necesita gráficos elegantes. Pero los gráficos pobres definitivamente dañarán un diseño. Los gráficos se agregan al mensaje visual. Los sitios web como WebDesigner Wall tienen ilustraciones impresionantes, mientras que otros son discretos.

5. tipografía

El arte de escribir es un tema difícil de tratar porque abarca muchos elementos. Si bien puede considerarse como una rama del diseño, uno puede pasar toda una vida dominando todos sus aspectos. Este no es el lugar para proporcionar una referencia tipográfica completa, por lo que limitaremos nuestra discusión a lo que le beneficiará a corto plazo.

6. Espacio en blanco

El espacio en blanco, o espacio negativo, tiene que ver con lo que no está allí . Al igual que la medida y la guía, el espacio en blanco le da al texto algo de espacio para respirar y paz espacial . Puede hacer que los elementos se destaquen agregando espacios en blanco a su alrededor. Copiar, por ejemplo, no debería verse apretado. Para garantizar la legibilidad, asegúrese de que los párrafos tengan suficiente relleno.

7. Conexión

“Conexión” es un término inventado aquí, pero parece ser el mejor para lo que queremos decir. La conexión aquí se refiere a un diseño web que tiene tanto unidad como consistencia . Estos dos atributos demuestran la profesionalidad de un diseño (y, por lo tanto, de su diseñador). Son atributos muy amplios. Un diseño debe ser consistente en su uso de colores, en su gama de fuentes, con sus iconos, etc. Todos estos aspectos cuentan; un diseño puede verse bien y aún sufrir inconsistencias.

Answer 3

Bueno, la clave al diseñar un sitio web en estos días sería hacerlo funcional sobre los aspectos del formulario. Consulte este blog de searchenginejournal: deje de diseñar sitios web que se vean bien | SEJ

En mi sincera opinión, esto es algo que todo diseñador debe tener en cuenta antes de diseñar un sitio web.

Por excelencia, esto es lo que se resume en:

• Casi siempre, la forma sigue a la función. Esta es la regla fundamental de un diseño web fácil de usar.
• No persiga el aspecto del diseño de tal manera que pueda pasar por alto la funcionalidad básica de su sitio web; esto podría perjudicar su clasificación, a lo grande.
• Manténgalo rápido y ágil: un sitio web estéticamente atractivo a menudo puede atascar los tiempos de carga en su sitio web, y esto puede ser un gran desvío para su audiencia.
• Se trata de claridad en un mundo complejo: manténgalo conciso y sin confusión.

Para resumir, el rastro de diseño dorado sería el que pueda lograr el óptimo entre forma y funcionalidad, con tal vez un pellizco más hacia el lado de la funcionalidad, dada esa encrucijada de elección.

Answer 4

Saber codificar no es lo mismo que saber diseñar. Eso es lo que estás reconociendo, lo cual es realmente bueno: tienes el ojo y la humildad de ver que falta algo.

Lo que necesitas son los fundamentos del diseño. Los conceptos básicos del diseño se aplican independientemente de dónde esté diseñando. Comprenda y aplique los conceptos básicos de tipografía, color, contraste, espacio y tamaño, y estará a la vanguardia.

• 50 lecciones totalmente gratis en teoría del diseño gráfico
• O simplemente ve a Google por completo. Aquí hay un montón de cosas: aprende los fundamentos del diseño – Búsqueda de Google

Es un malentendido común que el “diseño web” es algo completamente nuevo sin conexión con la historia del diseño, la teoría y la práctica de otros medios. Sin embargo, HTML, CSS y JavaScript son solo la implementación. El diseño sigue siendo diseño.

Answer 5

El diseño está sobrevalorado cuando se habla de sitios web, eliminamos todos los elementos tanto como sea posible. Intentamos y solo tenemos dos fuentes, una para los titulares y otra para el texto del cuerpo y se adhieren a negro, blanco y gris. Donde realmente nos enfocamos es el contenido, su sitio solo será tan hermoso como su contenido, les decimos a los clientes que específicamente solicitan sitios impresionantes … nos dan contenido hermoso y le daremos un sitio hermoso. La mayoría de nuestros sitios tienden a provenir de diseñadores de moda y accesorios. Estos clientes a menudo nos muestran una copia del sitio web de otra persona. Y señalamos el contenido … bellas imágenes, videos e ilustraciones.

Contenido, Contenido, Contenido.

Answer 6

Jaja pesadilla de cada aspirante a desarrollador web y diseñador. Me pasó a mí y a todos los demás.

No te preocupes, si eres un principiante, compárate con los otros principiantes, no con los profesionales. Aprenderás haciendo y resolviendo problemas. Le puedo asegurar que si toma un libro de Desarrollo Web y lo estudia continuamente durante 180 días, aún tendrá dificultades una vez que comience a desarrollar. La mejor estrategia será desarrollar 1 sitio web al azar todos los días o asumir algún proyecto y desarrollarlo. Vuelva a diseñar un sitio web que no le guste. Así es como mejora, si lucha con la creatividad como yo, entonces no se preocupe, encuentre inspiración en el trabajo de otras personas o póngase en contacto con algún diseñador de UI para que lo ayude. Usa Dribble, codepen para inspirarte y seguir practicando. Un día serás más que capaz de crear tus propios sitios robustos.

Mantén la calma y sigue codificando.

Answer 7

Realmente depende del sitio web que tenga ahora. Si se creó hace un par de años, la solución perfecta sería rediseñarlo de acuerdo con las últimas tendencias. Además, si desea verificar si su sitio web necesita rediseño, puede usar estos 3 consejos.

1. Debe prestar atención a las tendencias de diseño web en su área comercial particular. Revise los sitios web de sus competidores, encuentre algunas características que le gusten y considere si desea implementar algo similar a su propio sitio web.
2. Puede consultar a una agencia de diseño web: le darán un valioso asesoramiento.

Answer 8

Hay muchas plantillas por ahí que pueden ayudarlo al comienzo del diseño.

Además, asegúrese de tener una visión de cómo desea que se vea y funcione el sitio web. Uno de mis recursos favoritos para inspiraciones de diseño es Behance

Otra cosa buena es crear siempre un tablero / collage visual con imágenes / estilos / diseños que te hayan inspirado. Esto te ayuda a mantenerte claro sobre cómo quieres que sea la web.

Answer 9

Abre un Evernote y cada vez que veas un sitio web que te guste, toma nota de él y por qué te gusta. Incluso si es solo el menú o las esquinas redondeadas de un cuadro o la fuente, tome nota.

Esto solo te ayuda a desarrollar un gusto por lo que prefieres en un diseño. Con el tiempo, encontrará cosas que le gustan, y cuando vaya a crear su sitio, tendrá una biblioteca de cosas que le gustaría elegir.

El diseño web es un arte, como cualquier otro. Como dice Picasso: “Los buenos artistas copian; los grandes artistas roban “.

Answer 10

Si desea obtener un diseño de sitio web profesional, le recomendaré que visite Creación de sitios web profesionales

En la era en línea en la que vivimos, tener un sitio web profesional es una necesidad absoluta para casi todas las opciones de carrera y negocios. Un gran sitio web puede funcionar simultáneamente como una herramienta de marketing, una plataforma de tienda, una exhibición de trabajos y habilidades, un canal de comunicación y como un motor para la marca. Si quieres un sitio web que pueda realizar todas estas tareas con fuerza, Wix es justo lo que necesitas.

Conozca más visita, … Creación profesional de sitios web

Answer 11

Use bootstrap, es extremadamente fácil de conectar y hace un CSS increíble para usted. Mi característica favorita es la barra de navegación. Todo es gratis y te enseñan cómo conectarlo en su sitio web: Bootstrap · El marco front-end más popular del mundo para dispositivos móviles y receptivos. También mira videos de youtube si te confundes.

Answer 12

Práctica práctica práctica.

Jefferey hace un gran punto. Encuentre un sitio que le guste y cópielo. O usa una plantilla. Feo es una opinión subjetiva. Estoy dispuesto a apostar que mucha gente no comparte su opinión sobre su trabajo, ya que todos tendemos a ser nuestro peor crítico.

Answer 13

Mi opinión personal se trata de ser básico pero elegante. Intenta hacer un diseño minimalista con un máximo de 2 o 3 colores. Entonces se verá más conveniente. Mientras más color obtengas, será más difícil crear una armonía entre los colores. Y reduzca los elementos tanto como pueda.

Answer 14

Con Adobe Dreamweaver obtienes algunas plantillas que te ayudarán con algunas ideas. Y puede personalizar estas plantillas editando su código o creando uno por su cuenta.

También hay muchos sitios web de plantillas por ahí, con material gratuito para inspirarte. Creo que esto podría ayudarte.