¿Cuál es el mejor recurso para aprender HTML y CSS y cómo lo aprendiste?

No recuerdo cómo aprendí, pero recuerdo lo que no funcionó para mí.

El primer lenguaje de programación que aprendí fue PHP. ¡Lo encontré extremadamente difícil!

Lo aprendí en la universidad, así que comenzamos desde hello world y al final del semestre terminamos una aplicación semi-completa.

¡Me sentí como una abeja encima de un elefante tratando de adivinar en qué estaba parado! Fue horrible.

Entonces, todos los problemas habituales, “Tengo que usar referencias constantemente”, “Me resulta difícil recordar los nombres de las propiedades” … todos son naturales, no te preocupes por eso. Es la naturaleza humana que cuanto más hacemos algo, mejor recordamos. La parte difícil, al menos para mí, era comprender si la idea en la que estaba parado era un elefante, un toro o un árbol.

Frecuentemente veo este problema aquí en quora de las preguntas hechas por las nuevas abejas (¡entiéndelo!).

Aunque no fue parte de la pregunta, primero debe aprender a ver la imagen completa. Con HTML y CSS puede ser fácil pero no completamente obvio. En general, ¿qué es lo que puedes hacer con esos dos? ¿Puedes explicar aproximadamente cómo esta página usa HTML y CSS?

El problema (si no recuerdo mal) con cursos como CodeSchool o muchos otros es que podrían comenzar con “ahora le daremos al cuerpo el color rojo”. Sí, necesita saber eso, pero si no comprende, si no puede imaginar cómo esa cosa básica y aislada encaja en la imagen completa, ¿cuál es el punto? Si lleva las piezas a un rompecabezas pero no una imagen del producto final … (Será divertido saber si alguien alguna vez ha abordado un rompecabezas de esa manera)

En el pasado (cuando me di cuenta de cómo aprendo mejor) recuerdo haber encontrado cursos en Lynda: cursos en línea, clases, capacitación, tutoriales que cubrían la teoría. No estoy seguro de si son lo suficientemente buenos, pero de eso estoy hablando. Tal vez google para publicaciones de blog o videos de youtube donde puede sentarse y ver cómo encajan estos dos. De hecho, hay tutoriales en los que las personas crean un sitio de principio a fin en YouTube.

Mira algunos de ellos. Tome algunas notas, pero el punto no es copiarlas. Solo para ver cómo ambos trabajan juntos.

Entonces, sinceramente, Google es tu amigo. Porque depende de tu ritmo personal. Si después de ver esos videos tiene la idea y solo necesita orientación, o simplemente practica simulacros, cualquier cosa, desde videos de YouTube hasta incluso w3schools, no es el mejor sitio, pero le brinda lo que necesita sin perder el tiempo.

MÁS IMPORTANTE: después de ver los videos de youtube, obtenga papel y bosqueje su primer sitio web. Luego, en lugar de buscar recursos para aprender lo que quieran enseñarte. Busca recursos para aprender cómo convertir tus garabatos en papel a un sitio web

Lo he hecho de una manera bastante extraña. Vi algunos videos en YouTube que explican qué es qué y fui a W3Schools. Hice mi primer documento HTML, luego agregué bloques y estilos y luego agregué un archivo CSS para agregar esos estilos.

Y ahí está, mi comprensión básica estaba hecha y sabía qué era qué.

Luego jugueteé un poco más y miré un tema HTML5. ¿Por qué un tema HTML5? Bien simple … lo replicaría, y cuando me quedaba atascado miraba el código fuente del tema y aprendía a partir de ahí. Seguí preguntando por qué, y qué pasa si … Me encantó y aprendí de esa manera.

Esto realmente me hizo considerar las clases de CSS reutilizables antes de leerlo, no me gustaron sus cuadrículas, así que hice la mía. Más tarde descubrió los temas de Magento Ultimo, amó sus cuadrículas y las usó, al igual que su marcado adicional. También replicado eso.

Como puede ver allí, ya está al nivel de hacer algunas cosas reales. A veces estás aprendiendo y haciéndolo de la peor manera, pero ¿cómo podrías saber por qué algo está mal y es una mala práctica si no lo has experimentado? Al experimentar las malas prácticas, puede evitar tener más, incluso cuando nunca haya leído sobre ello.

Sin embargo..

Lo único que desearía haber sabido en ese momento sería CSS-Tricks y la red de desarrolladores de Mozilla. Ambos son mucho mejores que W3 ya que tienen ejemplos mucho más relevantes y elaborados.

CodeAcademy también hubiera sido bueno al principio, pero no tanto como CSS-Tricks y MDN.

Te sugiero que primero leas los documentos oficiales de HTML y CSS, y por oficial me refiero a las referencias de HTML y CSS en Mozilla.org. Simplemente revise todas las etiquetas y propiedades y lo que hacen para obtener una buena amplitud del alcance de HTML y CSS.

Sin embargo, si no eres realmente alguien que quiere leer tanto y prefieres ser dirigido por un instructor, hay muchos cursos baratos sobre Udemy y Udacity que puedes comprar. También hay mucho contenido gratuito en YouTube.

También querrá familiarizarse con una herramienta de código de juegos como JSFiddle, donde puede probar sus habilidades de codificación en tiempo real.

Con todo, hoy es mucho más fácil aprender HTML y CSS que nunca. Para mí, compré una tonelada de libros [en el día] y escribía el código a través de un editor de texto, y luego lo probaba en un navegador. Las cosas definitivamente han evolucionado desde entonces, así que estoy seguro de que puedes hacerlo mucho mejor.

Buena suerte.

Tratar:

Aprenda a codificar y ayudar a organizaciones sin fines de lucro

Tutorial HTML

Tutorial CSS

HTML CSS

HTML y CSS

Tutorial CSS

Creo que CodeSchool y A Book Apart son los mejores. Pero hay muchos por ahí, y no los he probado todos.

Originalmente aprendí HTML con la “Guía para principiantes de HTML” de NCSA. Pero he leído muchos libros e innumerables artículos web sobre el tema. Incluso lo enseñé por un tiempo.

No recuerdo dónde aprendí CSS originalmente.

En cierto modo, todavía estoy aprendiendo ambos. Siempre hay etiquetas que has olvidado o que nunca conociste y trucos CSS que aún no has probado. Ambos son idiomas vivos. No hay fin para ellos.

Escribí una publicación de blog sobre el aprendizaje del desarrollo web (que definitivamente incluye HTML y CSS) hace solo un par de semanas. Tiene todo tipo de enlaces a diferentes recursos que lo llevarán tan lejos en el desarrollo web como desee.

Puedes ver esa publicación AQUÍ.

Puedes aprender HTML y CSS fácilmente con tutorialspoint.com.

En tutorialspoint puedes aprender fácilmente con demo. Pruébalo editor te ayuda a aprender por ti mismo.

Me gusta Head First HTML y CSS: una guía del alumno para crear páginas web basadas en estándares: 9780596159900: Computer Science Books @ Amazon.com. Tiene buenos ejercicios y es entretenido.

Si no le gustan los libros, recomendaría los Tutoriales web en línea de W3Schools o codecademy.com

El mejor recurso es youtube. Es muy buena manera.