Página Web Profesional con HTML5 y CSS3. Creación de HTML

Aprende a Crear una Página Web completamente desde cero, utilizando HTML5 y CSS3. empezaremos creando la estructura HTML, luego agregaremos los estilos CSS3. y finalmente lo subiremos a un hosting privado más un dominio .com
HOSTING Y DOMINIO
affiliate.name...
INSTALAR ATOM
• La Mejor Herramienta P...
CÓDIGO DEL CURSO
github.com/Faz...
MI SITIO WEB
faztweb.com
BLOG
blog.faztweb.com
Twitter:
/ fazttech

[@multimediaprogramacionwill2819]

Fazt te saludo desde las Estribaciones del Parque Nacional Natural Farallones de Cali, en Colombia. Estoy estudiando Tecnología en Producción Multimedia en el Centro de Gestión Ecoturística del Magdalena, en Santa Marta. Iniciaré la etapa de Proyecto para graduarme. Te cuento que durante toda la carrera te he seguido, entendido y aprendido todos tus cursos HTML, CSS, Java Script... muchos pero muchos de mis conocimientos los he adquirido con tus vídeos, la clave es tu forma de explicar: Clara, Paciente, Elocuente, precisa, con él alma y sin egoísmos. GRACIAS AMIGO.

[@geormanascanio947]

Venezolano tenía qué ser !!! 👏👏👏

[@Lost_In_The_Cyberspace004]

@@geormanascanio947 dice que es de colombia, el nombre lo dice eso creo

[@amhedrieldavikin]

XD, tranquilos señores no debe haber rivalidad por los países, por ejemplo yo soy de Argentina, pero como todos somos latinos pues... Latino tenías que ser 👏👏👏

[@SportsFacst4U]

Eres el mejor, gracias por compartir. He apredido en 60 minutos mas que en un cuatrimestre de la uni!

[@lacoalicion8638]

Estoy aprendiendo mucho con tus vídeos yo ya sabía programar pero lo dejé y se me olvidó pero contigo aprendo y recuerdo lo que ya sabía muchas gracias por estos vídeos ahora que pueda seré tu sponsor

[@puritocodigo784]

Hola

[@Ocioreal]

@@puritocodigo784 OLA K ASE?

[@EmmanuelAmaya-ot8tv]

@@Ocioreal esta tratando de conquistar el mundo

[@yuftbf]

Genial fatz! Ya anteriormente había hecho un curso de html, css y javascript presencial y realmente me hiciste acordar muchas cosas y aprender nuevas, explicas bien y que te bases directamente en la practica esta buenísimo, muchas gracias

[@amiirak.7301]

Gracias a ti juanbotin no me va a reprobar la materia.Besos desde México Los amamos

[@titopianito]

No manches yo también conozco a Juan botín. Esta padre, de qué parte de México vienes?

[@amiirak.7301]

@@titopianito De madrid y tu

[@titopianito]

@@amiirak.7301 Nooo jodas ostias tronca yo también ejque los de capital lo petamos

[@amiirak.7301]

@@titopianito Viva el agua del canal isabel II y vivan las HTML

[@titopianito]

@@amiirak.7301 Yo la dije a mi madre que me comprase un ordenador para suscribirme a mi canal favorito Fatz, y ahora ya puedo hacerlo

[@dayanaromerosoto1426]

Hola amigo , quiero felicitarte porque tiene muy buenos videos y explicas super bien , no dejes de hacer videos, te descubrir hace poco jaja. Feliz año

[@FaztTech]

Hola Dayana, es un gusto leerte. Claro, pronto se vienen más vídeos, cualquier sugerencia siéntete libre de hacerla. también te deseo un !Feliz Año¡

[@osmeig6025]

Hola Day!

[@victorino.98]

Coincido totalmente, hay gente que dice que KZbin está decayendo pero canales como el tuyo dicen lo contrario.

[@jaironaranjo3654]

you are amazing. The fact that you explain it in such details shows that you are not just a great instructor but someone that cares about your audience.

[@mathiashochkofler2746]

INCREIBLE VIDEO, hacen falta más canales como estos en KZbin.

[@WilsonXtrem007]

La verdad me asombra la manera en la que enseñas muy completa me suscribi a tu canal hace poco y es mi canal favorito, otra cuestion que compartes sin pedir nada a cambio pero deberias poner opcion de PayPal para que los que esten dispuestos puedan hacerte donaciones, solo es mi opinion, saludos!

[@FaztTech]

Gracias Wilson. es un verdadero gusto que te sea de ayuda. Claro, es una buena idea. !Gracias¡ y ¡Saludos!

[@dariomassala]

Falo português e entendo muito bem os teus videos. És um máximo. Adoro os teus videos.

[@geraldmc1939]

Es de los mejores KZbinr que le meten a la programación Full Stack. 👌🏼

[@eliotzuckerberg9507]

Muchas gracias hermano, Que bueno que hay personas como tú qué nos comparte de sus conocimientos

[@puritocodigo784]

Suscríbe..te a mi canal....

[@iarahsmiler16]

Muchas gracias por tu tiempo y dedicación, es un placer como explicas todo tan claro y concreto

[@marianomartin6274]

Seguro que tiene una razón, pero es la primera vez que veo el header en un div. La etiqueta ALT provee de un texto alternativo en caso de que no se visualice la imagen, también ayuda a la accesibilidad de la web y a los buscadores, por lo que poner la url de la página en alt no tiene sentido, ALT debe siempre ser una descripción de la imagen. Un punto a favor la UL para el menú, así como los enlaces del footer, mucha gente que hace "tutoriales" mete directamente enlaces porque no sabe luego en CSS dar formato a la lista para que se vea horizontal. La lista también ayuda a la accesibilidad y especialmente a personas con deficiencias visuales, por lo que es recomendable hacer un menú de ésta forma.

[@Wich183]

Muchas gracias, no sabía ni por donde empezar.

[@thearcanno_0078]

muchas gracias me han pagado 1.890$ gracias a ti. He hecho una pagina web de traspasso de bitcoins

[@emilianooliveto5028]

Cual es la diferencia de crear un y un ?

[@danielvicens9931]

Impresionante video..! Muchisimas gracias por tu tiempo y ganas de transmitir tus conocimientos...Muy bien explicado y ameno.

[@puritocodigo784]

Hola suscríbete a mi cana

[@eliassponton3997]

Otra felicitaciones de parte mia amigo... yo de no saber nada aprendi con este video, muy buen video y un gracias totales... :)

[@nakurey9288]

Muchisimas gracias! Estoy creando mi sitio y todo va genial. He aprendido mucho contigo

[@francodavidspyridacos1057]

Muy bien explicado Gracias por compartir tus conocimientos muchos te lo agradecemos.

[@nyromano]

Hola buen amigo, muchas gracias por compartir tu abundancia, tu tiempo y tu conocimiento.

[@rsancheza54]

Excelentes videos tutoriales para desarrollo de páginas web, gracias por enseñar y compartir conocimenientos

[@LosNuevosRicos]

Ese esta en Ingles lo que haces ;) Ahi tambien lo aprendi

[@WilmarCuesta]

Te recomiendo para el editor de código utilizar un tema que tenga mas brillo o color, se dificulta la visualización en pantalla, hay que colocar dos o varias ventas, cuando se reduce la venta de tu vídeo no se logra ver bien. sin importar la calidad que se le de.

[@JuanRamirez-zb6oi]

bueno video cuando sacas la siguiente parte de como subir al internet mi pagina web y si ya tienes video pasame el link

[@galafardu]

Buen video y muy bien explicado, esperamos que sigas subiendo mas tutoriales.

[@pupimarti9470]

Hola en el wrap iría , no section. En el section va el contenido de la página

[@leninhc653]

Amigo buenas, no jala los iconos?

[@rodrigocristaldo3599]

Hola amigo muchísimas gracias. Que la vida te devuelva el doble de lo que das. Saludos. Like y suscrito.

[@luismanuelnoguerol8247]

Un apunte, el dominio .com viene de comercial no de company, Un saludo y buen video

[@FaztTech]

gracias, muchas veces me lio. un Saludo :)

[@OctavioGarciaMartinez]

gracias Gracias ¡¡¡¡ me ayudo mucho

[@felixnguema5498]

Hola fazt, soy principiante en esto de la programacion y de la web de desarrollo, uso, sublim tex abriendo mi codigo por el navegador chrome, pero sólo me aparece el (index.html) y por ejemplo en Mi primera pagina web no aparece en el navegador chrome, lo unico que aparece es sólo el index.html y no se porque lo demas no, gracias.

[@shojo799]

me pasa igual

[@williamlebron2078]

Excelente curso, lo recomiendo 100%

[@gamesytz1858]

Me gusta tu página es genial

[@nandomendoza8780]

Buenos días Caballero, He seguido los pasos pero no puedo visualizar los iconos. Cuál sería el problema, yo necesito tu ayuda.

[@depoolad6178]

Sigue así bro, son excelentes tus vídeos!

[@puritocodigo784]

Suscribwtw

[@chimboterex]

gracias, por sus conocimientos , bendiciones aprendiendo

[@maximilianoweihmuller298]

El tutorial estuvo genial es muy completo. Muchas Gracias por tu deducacion.

[@josephcossio6830]

Seria genial que hicieran un curso wsplicando que signigic h1, body, h2, etc, con ek fin que las persona que no conocen aprendan poco a poco

[@alexissantillan8913]

el del banner deslizante me fascino lastima que recien soy un principiante

[@leiles4002]

una explicacion clara y precisa

[@marlonrodriguez8493]

fazt tengo una duda porque mi atom no me reconoce el codigo java para hacer el slider

[@carloscuevas6488]

Excelente video

[@doiracasanova1955]

Hola, no sé de programación, pero quiero agregar a mi blog un botón para que las personas al presionarlo se les agregué la página a la pantalla de inicio de su cel . Entonces quiero saber cuál es la línea de texto para pegarla en el editor HTML de mi blog.

[@mitubo1970]

hola, gracias por enseñar... ¿Lo harías responvive/adaptativo ? gracias

[@puritocodigo784]

Ola suscribe te a mi. Canal

[@nandomendoza8780]

Te parece si tenemos una reunión virtual?

[@gbmelgar1]

Gracias amigo muy buenos videos, me fascinan

[@puritocodigo784]

Sus cri vete a mi cannaal

[@alebcn2001]

Hola Fazt, me ha encantado tu video. Eres un fenómeno. Te querría hacer una consulta, para ir aprendiendo he ido siguiendo todos tus pasos... pero el tema del SCROLL no me acaba de funcionar y no se cual debe de ser el motivo. Tengo el documento igual que el tuyo....argggg

[@MarcoCortex]

si hacen el link con Font Awesome, recuerden que la version >5 necesitara usar: en vez del que esta en el video. Si todavia quieren hacer todo igual que el video busquen una version antigua de Font Awesome aqui: www.bootstrapcdn.com/fontawesome/

[@alexislarios6537]

@Boom Onex yo tampoco puedo, lol. no se que sucede. ayudame tambien

[@lisbethgonzalez9221]

yo tampoco he podido, alguien sabe como?

[@DiegoLanda91]

Disculpa dónde está la parte donde subes al dominio y lo compras?

[@Trayamen]

Cuando creas el bxslider, haces 2 copias de la misma scrypt llamándoles .slider 2 y .slider 3... si colocas todas las imágenes en la lista desordenada dentro del mismo bloque.. con la script que haces utilizando la class .slider 1 ya vale no? Muy buen video estoy aprendiendo mucho!

[@instaladordetelecentro3676]

algo mas me vas a explicar GENIOOO

[@Alfonso6143]

Ineresante todos tu vídeos saludos

[@lautarommb1814]

"Identifier expected.javascript" min 30:30

[@musicword1525]

hola que tal. me gusta mucho tu canal de youtube y pues estaba siguiendo el vídeo tutorial: Página Web Profesional con HTML5 y CSS3. Creación de HTML y en la parte donde se llama el icono de navegación siempre me sale un rectángulo vertical me podrías ayudar gracias

[@matiloki]

Cosa Genial esto.

[@davidtome2159]

¿Está bien usar así los DIV dentro de sus respectivas secciones?

[@oscarfiblas2096]

Terminé el proyecto y hay algunos detalles: no funciona el menú desplegable responsivo superior (el del proyecto descargado tampoco funciona), no encuentro el video en donde se supone que veríamos la parte de contratar un alojamiento, dominio, etc...en fin... se agradece el video pero resignación... es lo que hay no más...

[@romanstark7077]

Muy buen video

[@andrademartinez9110]

buendia, me quedo en esta parte: S(documet).ready(function(){ s() }) de los sliders, parece que el editos no reconoce eesa parte!

[@martin04.09]

me pasa igual, ya lo solucionaste?

[@jose_contreras]

En S(document) no es S es: $

[@danielalaino6422]

@@jose_contreras hola, yo lo estoy haciendotal cual dice el tutorial y tampoco me configura el slider. Pudieron solucionarlo?gracias

[@havook839]

me pasa lo mismo esa parte no me funciona será por el ccs del slider ?

[@isaacthekiller5558]

buen video, gracias

[@TuVizzioFavorito]

Holaaa, muy buen videooo! pero los Iconos parece que ya no funcionan :c que puedo hacer al respecto?

[@estefaniabarca5416]

Excelente aporte

[@Angel-sv8ft]

Me u1 gracias bien esplicado sigue adelante,

[@lunajack9770]

disculpa escribiste todo el codigo cres poder pasarmelo es que no se en que me equivoque

[@puritocodigo784]

Suscri. Bbwte a mi canaal

[@omaraglaz9322]

Hola Fazt, yo recién veo el video, se puede usar para programar en vez de atom , visual studio code. Saludos de Argentina. Buen vídeo

[@facusalguero]

hola muy bueno el video...una pregunta. Como se puede hacer para que cuando pones un texto largo en un , x ejemplo los Lorem, que se vea como el tuyo, que lo escribe en varios renglones...xq a mi se me pone en el mismo renglon, y se hace largo y molesto.

[@jameskramer6590]

al momento de refrescar la pagina no me sale el icono, cual seria el problema ? porque tengo los mismos datos tuyos

[@havook839]

me pasa lo mismo alguien sabe por que es ?

[@johnmitchell4974]

quiero mas de este proyecto

[@jhonyg.7011]

eres el mejor amigo...solo quiero saber cuando agregastes la biblioteca Jquery..creo q me dormi

[@puritocodigo784]

Suscríbete a mi canal es de desarrollo web

[@martperu1109]

Como consigues que los brackets se autocompleten, mi atom no tiene el autocompletado de eso.

[@marianobarrios45]

Podés hacer un vídeo de una página de ecommerce con angular? Estoy medio perdido en eso. Me pasa que no se en que parte tengo que desarrollar el colegio HTML y CSS.

[@SooZ8888]

Genial, muy bien explicado!! Saludos!

[@elalemanthebad]

Hola, saludos desde República Dominicana. Tus videos son lo máximo. Pudieras hacer un tutorial de un blog con base de datos donde se guarden las publicaciones que el administrador vaya haciendo?

[@darkd6659]

Justo lo que necesitaba :)

[@LibertCharrua]

30:51 creo no es necesario copiar esa parte del còdigo. Al menos a mi me funcionò solo con el primero me ponia las tres fotos ya que llamamos a la clase y no a cada una de las fotos. Ojo no tengo experiencia en esto y a lo mejor en otras circunstancias hay que hacerlo. Pero entiendo que $(document).ready(function(){ $('.rollo1').bxSlider({ mode: 'fade' }) }) llama a la clase slide1 (yo le puse rollo1 pensando en lo que voy a hacer finalmente con mi sitio) y esa clase ya contiene todas las fotos definidas en el slide-wrap. Por favor corrìganme si me equivoco gracias

[@gonzalozarate6465]

Estaba con lo mismo, y dije si lo que se invoca es la etiqueta entera, no hace falta... lo probé y funcionó. Como decis ese código funciona.

[@havook839]

@@gonzalozarate6465 tienes razón bro no es necesario poner todo las Slider1 2 3 basta con llamar a la clase Slider

[@leoarias3]

Por mas codigo de scipt que he hecho no logro hacer el slider, aun revisando tu codigo!!

[@jost3974]

no se si te sirva pero en bxslider me fallaba por la s que estaba en minuscula era solo ponerla asi bxSlider espero te ayude

[@AlejandroHernandez-nl8vv]

@@jost3974 ami me sigue dando la imagen normal no me aparece el slider como tal, a que sera el problema

[@danielhidalgo2723]

@@AlejandroHernandez-nl8vv Me pasa igual, necesito ayudaaaaaaaaaaaaaaaaaa!

[@thesniperua3670]

a mi no me funciona, no me cambia la pagina al color negro, directamente está en blanco y no se por qué, está exactamente igual q el tuyo

[@lcfawkes447]

no se como pero cuando deberia salir el slider en el minuto31 no me sale,despues mire el codigo y cheque y vi q tenia comas y puntos y comas,lo hice a si y tampoco funcionaba.A si q opte por copiar el codigo de github.

[@felixnguema5498]

Ósea el código programado, está super bien explicado, pero en la programación no se ve de forma clara el código

[@juanbermeo520]

Fazt, excelente video. Queria preguntarte una cuestión, estoy diseñando una página web y requiero una base de datos con Información de usuarios, fotos, videos, etc. Estoy pensando en utilizar Firebase, tu que servidor me recomiendas para almacenar toda esa información?

[@alejandraluna2294]

Yo tengo la misma situación. ¿Qué servidor te sirvió?

[@maximilianodanielguardiola3773]

Cómo se hace para que en mailto al apretar en icono de correo te redireccione a el correo de Gmail y no al Outlook o el correo predeterminado de Windows.

[@lliuya]

esta bueno tu enseñanza amigo saludos

[@cesaresqueda3108]

Buenisimo....

[@manueldavidjoserangelevans1604]

usaras flexbox para diseñar el sitio web ?

[@adamsramos5144]

Hola,amigo me puedes ayudar,lo que pasa es que sigo tus pasos y no me funciona el slider manual

[@puritocodigo784]

Suscríbete. A. Mi .. canal..

[@ChristianJofre]

revisa el github

[@carlosmarin4036]

de hecho el ditor me dice que no lo permite por que es codigo binario cuales la razon por ello gracias

[@alejandrojara2024]

Disculpa. No se relaciona css con html. El fondo de pantalla no se hace negro. Es necesario que esta carpeta esté en el hosting que hay que comprar. O se lo puede hacer de la carpeta del computador. Porfa

[@martinezgomezjosesebastian400]

Que tal buenas tardes es un muy buen video pero quisiera saber el porqué no aparecen mis imágenes

[@juliocesarrivera5754]

hola fazt me gusta esta clase pero tengo una duda porque no programas el html semanticamente? porque usas mucho div?

[@puritocodigo784]

Suscríbete a mi canal es de desarrollo w eb

[@oscaredelarosa35]

gran aporte

[@lacoalicion8638]

Una pregunta que escritorio usas tu? Cuenta me que distro o so usas como el tipo de máquina que tienes. Yo tengo una macbook 2006 con ubuntu 16 y una de escritorio amd athlon 2 de 4 núcleos 16 de RAM con ubuntu y windows 10 la cual cuando acabe mi proyecto la usaré de servidor

[@ELNIKO16MARI]

Excelente gracias !!!

[@juanignaciocastillo3250]

Tengo una duda hago todo como en el vídeo pero no tiene efecto alguno en el navegador a la hora de abrir el archivo index.html, como si no tuvieran efecto los códigos ni nada de lo q programe, alguno me puede ayudar?

[@JonathanOrtiz-nc8yl]

gracias por el aporte pero esta imposible grabarse todo esos codigos

[@tdrarima4780]

Necesito ayuda cuando quiero abrirlo en google la pantalla aparece en blanco sin nada :c

[@alexisbustamante7950]

Eres el.mejor!! Jajaja gracias por el video

[@photoafpimagen]

Hola Amigo, te escribo desde Misiones/Argentina, todavía no vi el vídeo pero por la presentación me gusto, te pregunto, solo para información....¿Sigues con el canal?, si tengo preguntas (seguro que la voy a tener) ¿Puedes Responder?....desde ya gracias y saludos

[@maurtayu]

Muy buen video, un excelente inicio de año y éxitos, Gracias por compartir tu conocimiento.

[@bryanvilchez1282]

por que escribes la cabecera dentro de un "DIV" ? Explicame Faszt pls

[@javierk.jeriq.4361]

el tamaño de las imagenes para los sliders tienen que ser del mismo tamaño los 3 ..??