Cómo Crear una Página Web COMPLETA con HTML y CSS desde cero | No Frameworks Full Responsive

Armamos una página web completa desde cero usando solo HTML y CSS. Es una página moderna y completa que puede ser adaptada a la temática que más les guste. El diseño y el maquetado es completamente adaptable a dispositivos móviles (mobile-friendly). Condición obligatoria para desarrollar páginas web estos dias.
Repositorio de GitHub con todo el código:
github.com/choidavid4/pagina-...
Si estas muy perdido/a, te recomiendo ver estos videos:
Aprende HTML y CSS en 36 minutos:
• Curso Básico de HTML5 ...
Tutorial de display flex:
• Cómo Centrar tus Eleme...
-----------------------------------------------------------------------------------------------------------
Unite al server de DISCORD:
/ discord
-----------------------------------------------------------------------------------------------------------
Seguime en las redes!
GitHub: github.com/choidavid4
TikTok: www.tiktok.com/@deivchoi?lang=es
Instagram: / deivchoi
-----------------------------------------------------------------------------------------------------------
Otros videos que te pueden interesar:
Programación básica desde cero:
• Tutorial de Programaci...
6 Meses de Programación. Lo que aprendí:
• 6 MESES de Programació...
Tutorial completo de HTML y CSS:
• Curso Básico de HTML5 ...
Cómo es Estudiar Ingeniería Informática en Argentina:
• Como es Estudiar Ingen...
-----------------------------------------------------------------------------------------------------------
Secciones del video:
00:00 Qué vamos a estar armando?
01:58 Preparando el entorno
03:15 La importancia del diseño
04:33 Maquetado HTML
19:13 Estilos Generales de los Elementos
27:33 Estilizado CSS Mobile
57:20 Estilizado CSS Escritorio

[@Reonaru]

Acabo de terminar en curso y de probar mi página tanto en la pc como en mi móvil y no me queda más que agradecer por tan increíble trabajo. Gente como usted incentiva a no temerle a la tecnología. Una vez más gracias por compartir sus conocimientos. P.D.: Si por algún motivo el MediaQuery no les funciona podría ser por que no tiene el ViewPort en el Head del html . . . lo comento porque me pasó y quizá a alguien le sirva esta info.

[@hectorrobuzenoit]

Cómo hiciste para que en el celular te aparezca las imágenes

[@IanIlyaPratt]

Excelente video, en la práctica conforme vas explicando o desarrollando las diferentes partes de la pagina dejas en claro conceptos que pueden ser enredados y los explicas muy bien, con mucha sencillez, sin duda más videos como estos..... desde hace mucho he querido hacer paginas web y este video me ha devuelto el ánimo y se disfruta mucho y lo transmites.... he visto otros videos sobre como hacer un sitio web y dan tedio pero esta se me paso el tiempo muy rápido y ameno.... Esta página se ve muy pro...

[@deivchoi]

Gracias por tus palabras Juan Carlos! Me alegro mucho que te haya gustado!!!

[@gabrielsotto9529]

@@deivchoi bro, y si en vez de una imagen estática como hero quiero poner un carrusel de imágenes como hago?

[@gamuro6977]

@@gabrielsotto9529 eso me imagino que se hace con animaciones

[@hortmanjoj]

@@gabrielsotto9529 con framework

[@lorielramirez4046]

Jajaja x2, he visto gente que mete Div a lo pendejo y yo quedó 🤡🤡

[@marlonjpp]

Apenas estoy comenzando a ver vídeo cursos de HTML y CCS. Tus vídeos tocando ciertos temas son excelentes, muy claros, bastante resueltos para cubrir cualquier duda q pueda tener quien apenas se inicia. Viendo este vídeo me resulta abrumador tener el dominio q muestras sobre la sintaxis, conocer todas etiquetas atributos y valores casi de memoria, imagino que tanta práctica hace q uno se maneje con tal fluidez. Por ahora miro el vídeo y me parece 🤯🤯

[@Taurussoftware]

He visto muchos tutoriales de html y css, pero la mayoría no explican con claridad o dejan cosas sin mencionar o son aburridos o poco prácticos. Felicidades por que me ha resultado en verdad útil seguir este tutorial.

[@mattoivan3819]

Tantos videos de practica para HTML Y CSS básico en youtbube que no te explican conforme van armando una pagina y aparece este chabon tirando magia, explicando paso a paso etiquetas, dando consejos y atajos de Visual. hoy son las 2:10 Am me la pase toda la tarde perdido en una nube pensando que carajos hacer, como practicar para entregar un proyecto a la facultad la cual no enseñan muy bien y ahora con esto ya voy mas encaminado. Gracias genio por compartir tus conocimientos y por esa paciencia.

[@kitorusso8756]

Tremendo video amigoo! Mas que agradecidooo. A medida que iba viendo tu video, pausaba e iba aplicando en mi propia pagina. Estoy super contento con el resultado y también con el conocimiento adquirido. GRACIAS, super motivador ver resultados tan instantáneos, en un mundo totalmente nuevo para muchos. Segui asi papaaa!

[@ezequiel2803]

Terminé mi primera página! Grande Deivchoi, aprendo más con estos videos que en los cursos y facultad, me saca todas las dudas.

[@jorgelinamattos794]

Te agradezco de corazón el increíble video que aportaste,EXCELENTE!!!. Estaria bueno que enseñes diferentes modelos de pagina, porque como lo explicas se comprende muchisimo mejor.

[@abrahambenjumea913]

Hermano, que buen video! Hoy acabo de terminarlo. Es la primera pagina que hago y los conceptos no me pudieron quedar mas claros. Sigue asi bro. Congrats!

[@deivchoi]

Bien ahiiii!! A verla

[@user-rl7yl8iw4n]

اغبولب

[@katherinecadincartacho1908]

@@deivchoi año😄😄😄😃🤞🏽🤜🏽🤜🏽🤜🏽🫦🧣⛑⛑👖👛👛👡👜👜👜🧢

[@bautistaberutti6907]

no puedo creer lo linda que quedo mi primera pagina web gracias a tu video, sos muy crack explicando, segui asi!!

[@Daniel-ok6rj]

Hola bro, ya hace unas semanas ando aprendiendo sobre html y css, enserio muchisimas gracias, gracias a ti pude aprender css y flexbox de una manera muy facil y con una explicación muy entendible, hoy hare esta practica, espero sigas enseñando todo lo que sabes. Saludos Te Mereces Más Subs bro.

[@matdiez8738]

Acabo de terminar mi primer página web y quedó hermosa gracias a vos, muchísimas gracias

[@gonzalorolon5286]

Recién descubrí tu página amigo explicas todo muy bien y fácil de entender! Gracias y seguí así...saludos

[@xderen_xd]

Gracias! Se me presentó la posibilidad de desarrollar el boceto de una startup y no tenía nada de portafolio para mostrar y tu video me salvó la vida jajaja. Te debo una

[@GiselaGutierrez-mn5dz]

Hace una semana veo tus videos realmente gracias, son muy efectivos tu explicación es clara y versátil.

[@titets_]

me salvaste la vida con una practica que tenia que entregas y no sabia como empezarla, lo explicaste todo muy bien y puede hacer una pagina completa enlazada a otras paginas siguiendo tu modelo y la verdad que me ha queado mucho mejor de lo que me esperaba.

[@santitapia1870]

Pibe, eres mi idolo, gracias a tus videos he comprendido mucho de programacion y con este tutorial pase mi materia de programacion en la uni. Eres grande Deiv, abrazo desde México (Y)

[@Ricardo-vr6by]

Excelente video, use tu video para hacer mi trabajo y gracias a ti conseguí mi titulación, muchísimas gracias de verdad hermano, gracias por explicar a cada detalle👍

[@matiasquinoneros2569]

Es un video excelente para quienes iniciamos en este mundillo de la programación Web, nos permite con una simple plantilla, ver los conceptos mas básicos y poder comenzar a editarlos a piaccere. Sigue asi! Nos das una gran ayuda.

[@nachogramendola2781]

allora figa, quindi parliamo l´italiano? mi piaccerebbe

[@alexvides2299]

Los vídeos de este chico me motivan mucho a aprender. Muchas gracias de verdad!

[@MrGusguna]

Tus videos motivan aquellos que queremos iniciarnos en el mundo de la programación web. Lo haces tan fácil y claro que me motiva a seguir estudiando y aprendiendo. Muchas gracias.

[@ivanser1233]

Cómo vas?

[@danieljacinto9489]

No había encontrado un KZbinrs como tu hermano mucha gracias tus videos son lo mejores!!

[@bangerz.werker5748]

Super bueno el contenido, lo haces parecer muy simple y a la vez está bien concentrado, muchas ideas y consejos se pueden rescatar. Muchísimas gracias!!

[@juansoft4851]

Muchas gracias genio por el tiempo, la paciencia, todo! Te quedó excelente el "tutorial" muy agradecido, está muy bien explicado, muy bien redactado, por partes, se aprendió un montón, me encantó!

[@ircac8787]

Che me gusta tu forma de explicar, y esto de empezar en Mobile antes que desktop me está agradando y lo voy a aplicar en próximos proyectos. Gracias!

[@marketingteamdeveloper9151]

Aprendí mucho . Gracias... OJALA HAGAS UNO DE PYTHON!!!!!!!!!!!!!!!!!!!!!!!!!!!!! QUIEN DICE QUE SI

[@miguelchino9954]

Siuuu

[@axelnovich]

mas bien loquita

[@Chucho_369]

SIII!!!...

[@salahamar2466]

Suiuuuuiuiu

[@scaredtolive6631]

Salute

[@julietadiazstafuza6781]

Hermoso video! Muy bien explicado, tu voz se escucha perfectamente! MUCHAS GRACIAS, 😘

[@juanin9224]

No alcanzas las palabras para decir lo bueno que esta tu video asique solo voy a decir Muchas Gracias. Eres grande.

[@erickstravels5121]

Estuve deambulando por internet ,hasta que te encontre , y admiro tu contenico deivchoi , solo agradecer que con esto ayudas a muchos :D

[@carinasittner6669]

Ya cuando llegue de trabajar me voy a poner hacerlo..ya empecé con tu primer video y le tenía un poco de miedo pero me salió así que a seguir a no temerle a la tecnología si te gusta hazlo yo estoy prueba y error me equivoco aún pero no me rindo gra ias David por compartir con nosotros tus conocimientos

[@xlestad2737]

Un capo Deiv la verdad súper claro y eso que va a 200 km/h.. un lujo el contenido

[@jancarlos1017]

Explicas tan bien que es el mejor video que he visto!! ya tienes un suscriptor más.. Muuuuuuuchas Graaaaacias!!!!!

[@uncalvopelabola]

Muy buen trabajo , de verdad , muchos tutoriales pero tu los haces de una forma muy limpia y entretenida . Literal aprendo mas contigo que con la incompetente de mi profesora que parece que le han regalado el titulo en la tómbola. Muchas gracias!

[@dayananicolleamadorcastro9669]

me encanta como explica y me quedo hermosa la pagina gracias, explica mejor que mi profesor lo felicito, gracias a usted podre hacer mejor mis paginas web

[@oigresrol]

foa me re sirvio para entender varias cosas, mientras ibas codeando ibas explicando es genial. mas de esto por favor!

[@yohjanmonroy2713]

Muy buenos aportes y más para quienes estamos comenzando. Gracias Deivchoi saludos desde Colombia

[@elnegrovirginio3611]

Te amo David. sos el numero uno. Lo mejor que le paso al internet en toda su magnifica historia.

[@user-aafaf]

Muchas Gracias por el video , me sirvió de mucho ya que soy estudiante de programación y me hace un poco complicado aprender , pero estaré mejorando con tus videos .

[@maicoljhoan1899]

ESTE MEN ES INCREÍBLE! COMO ES QUE ALGUIEN COMO VOS NO TIENE MAS 10M DE SUPCRITORES!

[@xass9689]

Muchas gracias hermano, este video me ha servido para aprender mas sobre html y css, estoy muy contento con los resultados, ahora toca llevarlo a la practica propia, un saludo

[@gaston2587]

Excelente trabajo. Sin dudas la mejor forma de aprender es haciendo paginas, asi de una, mientras vas aprendiendo vas interactuando con cada paso. Con el metodo de leer concepto por concepto y haciendo ejemplos sueltos te re dormis, sentis que no aprendes nada y te desmotivas por no ver plasmado algo interesante. Tu canal es muy bueno bro, en serio digo. Si me estoy durmiendo viendo otro tutos de programacion me pongo aver uno de los tuyos para desperarme.

[@bersuarez2741]

la cosa es no perder las ganas de seguir 😁😁😜😜

[@nenu6535]

No tengo dudas de este comentario

[@al-ulk9694]

y q onda hermano después de un año como te va con este tema de la programación ?

[@prodigiteg]

Por favor más vídeos así necesito aprender @media que me a dado duro entender y responsive más vídeos así con proyectos para ir aprendiendo. 👍 Gracias

[@vulp3sa]

excelente manera de explicar, entendí todo lo que necesitaba a la primera pero igual vi el video muchas veces porque tu voz es hermosa jsajs gracias por tanto

[@fabrizioaq-gy3bm]

Primer video que veo completo de como crar una web desde cero y tu metodo de enseñansa obliga al espectador a quedarse todo el video ;D

[@QueenPanda-28]

Increíble, preste atención desde inicio a fin. Muy buen video, vas directo al punto y lo explicas excelente. Ahora sé, que pase por alto algunas propiedades de CSS. Además, me ayudará para un tp que debo entregar. Gracias!!! 🤝❤👋👩🏻‍💻

[@mimikiuz]

señor chino que habla argentino muchas gracias. He aprendido muchisimo. Intentaré adaptar lo que has hecho en mi proyecto

[@lucianavargas1561]

Excelente explciación! No entendía este tema y ahora lo tengo mucho más claro! Gracias!!!

[@LauraMiranda81]

Sos increible! Encontré todo en un solo lugar!! muchas gracias por compartirlo!!! Tu vídeo es excelente!

[@santiagoruiz3805]

No sabes como estoy de agradecido contigo, gracias que buen video!!

[@RodrigoMarinCHILE]

Gracias por compartir tus conocimientos. Se agradece una manera tan clara y didáctica de enseñar. Con personas que enseñan como tu uno e motiva a seguir aprendiendo.

[@DosMax]

siempre le tuve miedo a programar viendo tanto codigo pero aca lo explicas muy bien y de apoco espero ir naturalizando los conceptos que nombras y lograr tener mis propios proyectos muy buen video dejo mi like y espero sigas creciendo

[@lex8699]

gracias deivchoi por contribuir de esta forma, mejor que lo que dan en la uni, increible mano, Dios te bendiga brother

[@DanyDei]

Gracias, por fin terminé mi primera página, tengo bastante que aprender todavía pero esto me sirvió mucho. Gracias totales.-

[@carolinaosan2459]

me encanta la manera sencilla en q lo explicas, me ayudó muchisimo a mejorar las herramientas de otro curso q estoy haciendo, mil gracias!💪💪

[@elizabethguevara9534]

Excelente explicación, gracias por brindar tus conocimientos. Y se agradece de corazón.

[@cartiermoto]

Muchas gracias, excelente tutorial, me ha gustado mucho el proyecto, sus estilos y colores, además de que es responsive.

[@luciarodriguezroldan6135]

Gracias por enseñarme como abrir el visual desde una carpeta. Tome su like buen hombre ❤

[@rodrigogilles]

Más videos como este please, y ver más funcionalidades si es posible.. es entretenido como explicas y se entiende perfect... se me paso volando la hora y + y entendí todo.. saludos

[@deivchoi]

Gracias por el comment Rodriii. Sii estoy considerando hacer mas tutoriales pq todos me estan diciendo que les gustan jajajja

[@allanmonge5314]

Excelente, me ayudo mucho en un proyecto ya qué tenia dificultad manejando el zoom

[@AlejandroLaLoggia]

Buenisimo el video!! Me gusto que vayas corrigiendo en el momento las cosas!! Muchas gracias!

[@danielespirituvalera7825]

gracias amigo, aprendi mucho con tus conocimientos, enserio muchísimas gracias, esperamos mas de tus videos porfavor.

[@maurocesar6892]

Con este video descubrí que mi mayor problema es no saber las funcionalidades de algunos elementos, con la práctica y repaso podré entender la utilización de estos

[@ivanser1233]

Cómo vas Bro?

[@alky.3333]

gracias, logre medio entender unos conceptos que me tenian partiendo la cabeza y que como autodidacta, no me la iba a encontrar dentro de un buen tiempo

[@Nico_rojas08]

Sos un makina gracias por tu semejante aporte crack❤!!! Vamos por mas videos asi makina. Pta: te veo hace mucho y pareces a glen de the walking dead 😂❤

[@streetgraphicwear]

Lo que mas aprendi en este video fueron los atajos de teclado jajaja, una maravilla lo que te ahorra en tiempo!!

[@soomnii]

Gracias amigo, yo sin saber nada de HTML y CSS logré crear mi primera página y entendí todo muy bien. (solo tenía conocimientos sobre python)

[@jorgevazquez4845]

exelente video la verdad una orientacion a como empezar increible lo diste ahora se como empezar a hacer como moverme muchas gracias capo te agradezco tus 1hora explicando gracias

[@pabitlus]

Increíble Profesor! Muy bueno! Gracias. Seguí explicando así de claro. :)

[@williamsmamanimamani846]

tu video está posicionado, ya le di like para posicionarlo aún más, muy buen bieo aprendí muchísimo, yo también quisiera ser desarrollador web responsivo. Saludos desde Bolivia.

[@pedroalexisbenitez2342]

Amigo excelente, muy bien explicado. Tengo una pregunta: Me gustaría saber porque no usaste en el no usaste un con sus ? Solo eso quiero saber gracias de antemano y ya te estoy siguiendo.

[@kalerw4644]

muchísimas gracias hermano, con esta información de ORO puedo sentir que es posible convertirme en desarrolladora web sin el título de Universidad

[@federicoecequielcantoni4472]

El Messi de la programación! Genial el contenido!

[@cdunoguier]

te felicito, es un placer ver tus videos, super claro !

[@JeronimoMora-ql1ih]

gracias brp eres el mejor de todos tus videos me motivan aseguir estudiando programacion transmites mucha esperanza gracias de verdad bro

[@lycansk850]

explicas rapido xd pero se entiende y esos tips de tipeo te re ayudan, que genio papa! un abrazo!

[@hortmanjoj]

Excelente video, mucho talento para crear y para enseñar. Gracias !

[@santielieben]

Muchas gracias!! No me quedo igual pero aprendí un montón. Gracias 😌

[@ache_music]

La cabeza me exploto con este video, fue como abrir una caja de Pandora en mi cerebro ❤ gracias master excelente video me aclaraste muchas cosas

[@OscarHernandez-jr4xc]

Gracias pibee! Excelente video! Abrazo

[@lavozpopularca]

Gracias .. Gracias , no sabes como me ha servido este video....Excelente video hermano..

[@jerrymilesmiles9313]

Excelente aporte al conocimiento! Saludos desde Limón, Costa Rica!

[@edsondejesusmayamendez7598]

Gracias a ti hice mi primer sitio bro, muchas gracias, ya tengo grabada tu voz diciendo SomosProsha

[@duck1t0]

Sos el 1 explicando bro.. no se te pianta nada...

[@alexsreynapodcast]

Eres un verdadero amo de la programación, tus vídeos son muy claros y comprensivos, gracias bro . Me esta sirviendo de mucho ahorita que ando sin jale, gracias

[@Franklin_GonzalezD]

Gracias por los tutoriales, son de gran ayuda, espero vuelvas a crear contenido... PD: es gracioso que cierres los parpados para ver mejor si prácticamente no se te ven los ojos jajaja... Saludos

[@SmartP]

Te ganaste un nuevo subscriptor brother sigue así ❤️

[@ezequielbustosnavarro5084]

Explicas mejor que los prpfes que tengo.... GRACIAS!

[@diegodalera3921]

Muy muy bueno , de lo mejor que vi . Muchas Gracias

[@juventinatovias6862]

estoy a mitad de video en la parte del gradiente del fondo y estoy aprendiendo bastante y viendo que las ideas que tengo en mi mente no son tan complejas de plasmarlas como creía. Gracias por este tutorial, bendiciones.

[@estebanwebdesign]

Excelente tu explicacion clara y sencilla. Te felicito!!! Quisiera preguntarte si no puedes hacer un videoexplicando estos conceptos que has utilizado. Yo ya realize el curso de HTML y algo del de CSS

[@omarsosa1052]

Sos un crack chavon! sabelo!!! mil gracias.

[@joselomartinez2220]

Exelente exelente exelnte...dicen que un ejemolo no sirve para explicar..pero si sirve para entender..eh aqui el caso...muchas gracias...ahora si puedo decir aaahhhhhhh...asi que de esto se trata...gracias compañero...muy agradecido de verdad cuan util tus aportes..abrazos...y bueno simplemente gracias

[@emanuelmaggio2297]

Alto video amigo, te quedo excelente la pagina

[@lucasdilascio6490]

Tremendo video!!!! Muy bueno!!! Muchas gracias por enseñar... Saludos.-

[@julianab705]

Gracias!! me gusta que no supones que ya se saben cosas.

[@enzoa7204]

Excelente video man , aportas mucho... felicidades!.

[@fede2764]

Che qué bien, mil gracias!!

[@y7365mVVHsK9J]

Gracias por compartir. Queda super moderna :)

[@Dane-mendoza]

GRACIAS! muy útil, y buenas aclaraciones. :) saludos desde Colombia.

[@shara_hyarr]

Voy por el minuto 41 y esta resultando genial!!