No haga que su diseño se ajuste a ciertas dimensiones, haga que su diseño se ajuste al contenido.
Hoy en día, existen cientos de dispositivos diferentes con pantallas diferentes. No puede diseñar para todas esas dimensiones, por lo que debe crear una jerarquía en la que, independientemente de las dimensiones del cliente, el contenido se presente de la mejor manera posible.
Pero, podría argumentar correctamente, eventualmente tendrá que crear un documento en una determinada dimensión para comenzar a diseñar digitalmente. Si tu puedes. Pero no vayamos allí todavía.
En primer lugar, me gustaría sugerir que no use Photoshop para diseñar páginas web. Lo sé, lo sé, la mayoría de las personas (incluso los profesionales) usan Photoshop para diseñar páginas web. Nunca he entendido por qué. Photoshop no tiene herramientas de alineación decentes. Photoshop usa píxeles, lo que significa que la mayoría de las cosas (objetos inteligentes omitidos) no se pueden ampliar correctamente si es necesario. Photoshop no tiene métodos rápidos para distribuir uniformemente cosas entre el espacio disponible y, lo peor de todo, la tipografía en Photoshop es absoluto, puro horror. Y si me preguntas, el 99% del tipo de tiempo es, con mucho, el aspecto más importante del diseño de tu página web. Es lo que hace o rompe tu diseño; tipografía.
Utiliza Adobe Illustrator. Especialmente si vas a diseñar una página web receptiva. Déjame decirte por qué. En Adobe Photoshop, tiene un documento con una resolución. Esto significa que nunca puede poner fácilmente dos diseños uno al lado del otro. No puede trabajar fácilmente con versiones de un diseño, donde en Illustrator simplemente copia las mesas de trabajo, las coloca una al lado de la otra y allí tiene sus versiones o variaciones.
En segundo lugar, en Illustrator puede tener diferentes mesas de trabajo para diferentes diseños en un documento, lo que le permite aplicar fácilmente cambios de color, cambios tipográficos, cualquier cambio en todos sus diferentes diseños, diferentes diseños para diferentes dispositivos. Con dos clics, puede cambiar los
en su diseño de escritorio de pantalla completa, el diseño de su tableta, el diseño de su teléfono inteligente y el diseño de Dios sabe qué para ver cómo funciona. En Adobe Photoshop, esto llevaría cinco minutos, cambiando constantemente las ventanas, abriendo archivos, entrando en la molesta herramienta de tipo Photoshop, agitándose y tirando cosas por la ventana de su oficina.
En tercer lugar, Adobe Illustrator ofrece herramientas de tipografía decentes, herramientas de alineación y distribución. Entonces, cuando tiene, digamos, 5 elementos de menú, y alguien decide que habrá seis, agregue uno y distribúyalos usando el mismo espacio. En Photoshop, tendría que eliminar sus guías anteriores, calcular el espacio disponible, crear nuevas guías, copiarlas y luego colocar los elementos del menú en su lugar. Esto tomaría entre dos y tres horas como mínimo, nuevamente porque estás ocupado gritando a tus colegas y arrojando aún más cosas por la ventana de la oficina.
Y aquí está lo más importante: en Illustrator son todos vectores. Ahora podría decir: ¿por qué necesitaría vectores? Este es el por qué. Está ocurriendo un cambio en el diseño web. Hace cinco años, cualquier dispositivo que visitaba una página web tenía una densidad de píxeles entre 70 y 80 ppp. La mayoría de ellos, por supuesto, son 72 ppp.
Hoy, además de la resolución de la pantalla, también la densidad de píxeles es muy variable. Lo que significa que, cuando solo diseña en píxeles, los diseños pueden verse realmente en diferentes resoluciones a escala (las cosas pueden volverse muy pequeñas, por ejemplo) o, lo que es peor, puede terminar obteniendo imágenes de muy baja calidad (como es el caso de Safari Móvil cuando se usan iconos de 72 ppi).
Aquí es donde Illustrator es útil: puede diseñar a cierta escala y luego exportar todo en cualquier ppi que desee, asegurándose de que su página web se vea nítida en cualquier dispositivo.
Podría seguir por un tiempo. Pero para responder a su pregunta, diseñar con una determinada resolución no es realmente el lugar para comenzar. Te sugiero que primero entiendas el diseño web receptivo. No es solo un conjunto de reglas, es una forma de pensar.
El mejor artículo para empezar es Diseño web receptivo. ¡Buena suerte!