Diseño de paginas web para principiantes

Inicio » Diseño de paginas web para principiantes

Cómo diseñar un sitio web

El diseño de páginas web es bastante complejo y desalentador, pero con el desarrollo de Internet y la tecnología, el diseño de páginas web desborda más que nunca hoy en día. Por lo tanto, convertirse en un diseñador web se ha convertido en la principal tendencia entre los jóvenes diseñadores. Hoy, te guiaré sobre cómo aprender diseño web en casa brevemente.

Muchos jóvenes diseñadores a menudo malinterpretan el concepto de diseño web, el diseño web es sobre el diseño, no sobre la codificación y el desarrollo front-end. Por supuesto, sería estupendo que conocieras algún lenguaje de codificación (HTML, CSS, Java), pero no puedes adentrarte en el desarrollo front-end, ese no es el núcleo del diseño web. El diseño web consiste en resolver los problemas de comunicación entre los usuarios y la información de la página web.

Conceptos básicos de diseño web

Puedes iniciar una nueva carrera en el desarrollo web hoy mismo aprendiendo HTML y CSS. No necesitas un título de informática ni un software caro. Todo lo que necesitas es un ordenador, un poco de tiempo, mucha determinación y un profesor en el que confíes. He enseñado HTML y CSS a innumerables compañeros de trabajo y he impartido sesiones de formación para empresas de la fortuna 100. Soy ese profesor en el que puedes confiar.

No te limites a crear sitios web con alguna herramienta cursi de “construcción de sitios”. Este curso te enseña a tomar el control del 100% de tus páginas web utilizando los mismos conceptos con los que se crean todos los sitios web profesionales.

Este curso no asume ninguna experiencia previa. Empezamos desde el principio y aprendemos juntos poco a poco. Al final del curso habrás creado (a mano) una página web que se ve muy bien en teléfonos, tabletas, portátiles y ordenadores de sobremesa por igual.

En el verano de 2020 el curso ha recibido una nueva sección en la que subimos nuestro sitio web en directo a la web utilizando el servicio gratuito GitHub Pages; esto significa que podrás compartir un enlace a lo que has creado con tus amigos, familia, colegas y el mundo.

Diseño de páginas web sencillas

Hola y bienvenidos a otro post mío. Esta vez quiero centrar mi atención en los principiantes del diseño web que acaban de dar los primeros pasitos en el misterioso mundo de la codificación HTML-CSS-PHP y que les encantaría crear una página web sencilla y atractiva pero les preocupa que esto pueda requerir mucho tiempo además de un profundo conocimiento del lenguaje Html.

Este sitio web de Vlog es muy bonito, coloreado y llamativo, pero lento de navegar y algo confuso porque si te equivocas al hacer clic, se abrirá otro sitio web en lugar del que querías. 10 puntos por el concepto, pero lo visitarás una o dos veces para enseñárselo a un amigo y ya está.

Personalmente, tiendo a preferir el diseño minimalista. Pocos colores, pocas campanas y silbatos pero donde todo funcione y donde, aunque mantengas tu diseño simple, puedas captar la atención de tus visitantes. Y créeme…., el blanco y el negro, si se utilizan de forma correcta, pueden acabar con cualquier diseño con color. Incluso como principiante en el diseño web, no se trata de la cantidad de cosas con las que llenas tu sitio, sino de la calidad y la pasión que pones en un diseño, aunque sea básico.

Ideas de páginas web para principiantes

Para empezar, la mayoría de las páginas web de Internet están escritas, al menos en parte, en HTML. Para ver el HTML que crea esta página necesitas “Ver la fuente” en el navegador que estés utilizando. Intenta ir a Cmd/Ctrl-U (para Firefox), ve a Cmd/Ctrl-Alt/Opt-U (para Chrome), y si estás usando Internet Explorer, realmente necesitas preguntarte si el diseño web es la carrera correcta para ti.

Otra cosa que puedes notar de la fuente HTML es que todas las páginas HTML tienen una estructura similar. Todas empiezan con una declaración <!DOCTYPE> que dice en qué versión de HTML se encuentra, seguida de una declaración <HTML>, seguida del <head> del documento que es un contenedor de varios elementos incluyendo enlaces a scripts, hojas de estilo, la meta información, etc. Después del <head> viene el <body> donde se marcan los elementos de la página web.

Ejercicio: Selecciona todo el código fuente de esta página en un documento de NotePad (PC) o TextEdit (Mac) y guárdalo en tu ordenador como “test.html” o algo así. Abre este archivo en un navegador y debería tener el mismo aspecto que la versión online. Ahora apague su conexión a Internet y vea el aspecto de la página de prueba. Es bastante diferente, ¿no? Intenta averiguar por qué.

Ir arriba