HTML + CSS NA PRÁTICA 🔥 Faça seu primeiro site
Вставка
- Опубліковано 30 лип 2024
- [Hey] Nesse vídeo eu ensino a fazer um site simples, mas dando várias dicas práticas! Usando apenas HTML e CSS!
Espero que vocês gostem! :)
Bora codar? 🔥
Repositório com o código desse vídeo: github.com/AdrianaSaty/easy-p...
O que mais você quer ver aqui no canal?
Comenta aqui embaixo pra eu saber! ;)
------------------------------------------------------------------------------------------------------------------
[Links]
- Instagram: / adriana.saty
- Twitch: / adrianasaty
- Github: github.com/AdrianaSaty/easy-p...
- Website: www.adrianasaty.com/
------------------------------------------------------------------------------------------------------------------
[índice]
00:00 Intro
00:38 Instalando o VS Code
01:01 Explicação Inicial
01:57 Criando a Navbar
07:14 Criando o Header
10:12 Criando o Main
11:08 Criando o Footer
14:33 Ajustes Finais
15:37 Fim - Наука та технологія
Gente, os SVGs vocês podem pegar no repositório, na pasta img:
github.com/AdrianaSaty/easy-portfolio
Eu justamente estava nessa duvida, pois sou iniciante e estou aprendendo aqui.. rs cheguei ate comentar mas ai acabei de ver sua postagem das img .svg (kkkkk)
fui buscar na internet e vi mta coisa estranha hahaha VLWWWWWWW
Div está obsoleto?
já ia perguntar, ainda bem que você já colocou aqui kkk
Como faz pra compartilhar o site? o link não é clicavél e se copiar e colar da erro.
Até já me inscrevi
Estou estudando html e css é muito boa essa sensação de entender o que está acontecendo na construção do site, além de uma explicação clara, concisa sem enrolação ótimo conteúdo!!!
Obrigada 🤩
@@AdrianaSaty to fazendo pelo celular spck editor
ela tem talento pra encinar, ja eu sou ao contrario kkk
CONCORDO. muito bom, obrigada
@kelly caroline KKKKKKKK valeu kelly ai sim hein!!!!
Uma dica para vc que está começando a programar ou vc que precisa de mais agilidade fica minha dica para ficar mais rápido coloca o VSCODE no Save automático e instala a extensão Live Server que atualiza o documento automático eu uso e não preciso estar me preocupando em ter que atualizar ou salvar toda vez.
Boa DICA VLW...
Valeu, mano você sabe me dizer qual programa ela usou para criar a pasta?
valeu cara, eu só sabia do sabe automático, ajudou muito
n é so dar CRTL + S?
@@Alberto-fj7ed Sim, mas a gente pode esquecer
Não deixe de gravar mais conteúdos como este nos ajuda muitooo
Meu muito obrigado, Adriana! Estou mega feliz e vou me aprofundando mais ainda nesse novo ramo da tecnologia. Tmj!
E continue postando mais e mais conteúdos!
De todos os que eu estou estudando você é a que explica melhor, tem paciência e ainda é linda, parabéns
ser linda é o ponto chave para prestar "atenção" na aula
Parabéns, que vídeo didático e explicativo. Estou no início dos estudos de desenvolvimento Web, ainda no módulo 1 de HTML, mesmo sem ter visto CSS, a impressão que fiquei é de entendimento de como estava funcionando cada etapa da construção desse seu site. Sei que há inúmeros projetos, mas parto do princípio que o simples bem feito, funciona demais! Parabens pelo conteúdo !!!
Simples e direto ao ponto, muitos que fazem esse conteúdo simplesmente colocam algo lá e faz como se todos soubessem, você não, vc coloca e explica numa linguagem simples, parabéns, puro stilo de ensinar!
Você está ensinando conteúdo muito bom e de grande ajuda Adriana.
Tens o dom de ensinar.
Parabéns 👏 , muito obrigado.
Comecei a estudar recentemente JS, HTML e CSS! Achei o vídeo incrível, continue com os vídeos! Muito sucesso Adriana :)
Nunca vi nada de programação e vc fez parecer tudo muito simples, parabéns de verdade
Obrigada ^^
isso não é programação, levando em conta que html é linguagem de marcação e css e estilização. linguagem de programação seria Javascript
@@inv5879 Deixa o menino sonhar pô kkk
Esse projeto vai agregar nos meus estudos em html e css . Vlw , Adriana! Faça mais projetos!
Muito bom! Acabei de concluir um cursinho básico de html e estava com dificuldade pra entender essa conexão com o CSS, depois desse vídeo estou bem mais preparado para começar o curso de CSS! Essa proposta de vídeo rápido e sem muitas explicações casou muito bem com minha situação
Mais um vídeo de altíssima qualidade, nao sou iniciante, mas sou uma negação em html, e aquela dica sobre o rel nos links para SEO e segurança foi top demais. 👏
Valeu!! ^^
Saty vc é perfeita garota, se eu tivesse visto um conteúdo assim no início da minha faculdade tudo teria sido mais fácil pra mim.
Sua explicação e didática está a altura de professores universitários fodas. Parabéns pelo conteúdo disponibilizado totalmente de graça!
Deixo aqui meu reconhecimento e valorização do seu trabalho nas redes!! 💚
Muito obrigadaaaa!! 🤩🤩🤩
@@AdrianaSaty adriana, eu queria mandar meu site pra amigos familiares. Como faço isso?
@@christopherjacobs2763 copia o link e manda
estou cursando ciências da computação e tenho aprendido mais com o youtube do quê com o conteúdo fornecido pela faculdade hsuahsuahu
@@christopherjacobs2763 se vc não hospedou ele, compacta a pasta toda e manda para eles, ai quando eles extrais peça para eles abrir a pasta index.
Esse primeiro projeto iniciante foi ótimo para mim. Faz mais videos assim Adriana!
Parabens pela didática!!
Que show, estou começando a dar uma olhada em HTML também, toda a ajuda é bem vinda.
Você ensinou muito bem sobre HTML e CSS parabéns
Trás um código que retorna data, hora e clima
Clima é so usar uma api
Anotado!
Tô começando agora os estudos, tem muitos elementos usados aí que ainda não vi, mas já compreendi de tão clara que foi sua explicação. Sensacional! Parabéns e traga sempre esses conteúdos enriquecedores! Sucesso!
Ajudou muito , não entendia nada de html e css e vc foi a unica que foi fazendo passo a passo explicando cada detalhe muito obrigado princesa
Muito boa a explicação, estou aplicando já e vou fazer a segunda parte do exercício conforme proposto! Excelente! Faz mais vídeos!
Nossa, conteúdo perfeito pra quem ta começando!
Parabéns pelo canal, continue postando que com certeza logo logo vai chover de inscritos.
Obrigada!! Fico feliz que tenha gostado! :)
Muito bom o conteudo, parabéns! Estou fazendo um curso e você me ensinou em 16 min mais de css do que o cara do curso em 17 videos pequenos. Ansioso para os proximos videos.
Que da horaa!! Que bom que você curtiu :D
Sempre tem um comentário desse em todos os vídeos do UA-cam sobre programação, engraçado.
@@felipechagas8003 Mas é por que é fato Felipe, muitos fazem o curso muito "cheio" justamente pra dizer que tem mais conteúdo, que aborda tudo, mas no fim, não é necessário.
@@felipechagas8003 Isso acontece bastante porque a maioria dos cursos completos abordam todos os conceitos e muitos raramente são usados. Vídeos assim que vão direto ao ponto são melhores pra aprender, porque a pessoa vê o projeto pronto e tem a sensação que ta aprendendo.
@@alucian isso mesmo, colocaram vários vídeos curtos pra fingir que tem conteúdo, quando poderiam ter feito um vídeo só explicando justamente o que foi abordado no vídeo. Arrependido de ter comprado
Muito .. muito obrigada Adriana. Era tudo que estava precisando. Vc é muito didática, rápida, sem enrolações. Em alguns minutos fiz várias páginas para o meu tcc. Gratidão.
Muito legal o seu vídeo, querida Adriana! São pessoas como você que melhoram o mundo, através da partilha dos conhecimentos! Você é uma Professora nata! Parabéns, sucesso e felicidades!
MDS, ela é simplesmente incrível, o jeito q ela ensina é tão gostoso, da vontade de aprender mais, ele prende a atenção de um jeito natural e cativante, por favor faça mais aulas dessa
vou soltar um vídeo com tutorial de react, typescript e material ui em breveee! :D
Me tire uma duvida, estou querendo entra nesse ramo. Porém não sei nada de inglês, da pra desenrola mesmo assim.. @@AdrianaSaty
Meu Deus, que didática incrível. Parabéns!
Obrigada! :)
Parabéns querida. Amei seu jeito de ensinar. Estou fazendo um curso de Programador Web no Senac e sua aula me ajudou muito. Pra complementar. Top demais. Sucesso. ❤
Poderia fazer mais vídeos assim. Amei, e já me deu um norte pra fazer um site inicial que foi pedido no curso
*O que uma explicação rápida, prática e eficiente não faz na vida do jovem* vlw pelo conteúdo centrado
é noix!!
Eu to entrando nesse universo de programação agora e nossa seus vídeos só tá me fazendo ter a certeza de que estou no lugar certo, valeu!
Uhuul! Que bom!!! 🥳🥳🥳
html e css não é programação. pra programação tem que usar linguagem de programação. algumas linguagens de programação são Javascript, Java,PHP, Python e tem muito mais. cada um pra determinada situação, com seus pros e contras . htm e css são linguagem de marcação e estilização respectivamente
Sem palavras, estava a uma semana tentando entender meus erros. Você me ajudou com todos, obrigado.
Ótimo conteúdo! Consegui ver o que aprendi em um curso sendo aplicado. Agora bora praticar!
Parabéns pela iniciativa de começar do Básico. Quando se tem um nível de compreensão maior da linguagem o trivial parece ser pouco ,mas pra quem está aprendendo é uma ajuda e tanto.
☺️☺️☺️
Muito bom! Também comecei um canal de programação espero um dia poder chegar no seu nível.
Parabéns pelo conteúdo ajudou muito
Que da hora!!
Ensinar é a melhor forma de aprender :)
Obrigada ^^
Muito obrigada, eu tive pela primeira vez uma base solida sobre o que é HTML e CSS....Parabéns....Deus te abençoe
Parabéns Adriana você é muito didática e inteligente!! Eu que não sei nada em programação HTML e CSS já aprendi muito!! Você tem um Dom único para ensinar!! Parabéns!!
Excelente didática e explicação, porém pra mim que estou dando os primeiros passos nesse universo e tenho 5.3 anos foi difícil acompanhar o seu ritmo, mas foi ótimo gostei e te parabenizo pela iniciativa como li em outro comentário você vai ajudar muita gente que esta começando assim como eu. Valeu
Esse vídeo eu falei bastante conceito mais intermediário/avançado, então não se preocupe em entender tudo!
Se eu tiver falando muito rápido também da para colocar numa velocidade mais devagar aqui pelo yotuube :)
Parabéns pelo conteúdo! Em 16min de vídeo ensinou muito mais do que muito curso!
Que bom que vc curtiu! Obrigada ☺️
@@AdrianaSaty imagina! Eu quem agradeço por você disponibilizar este conteúdo. Parabéns pelo excelente trabalho!
Gente, que didática maravilhosa. Seguindo o canal.
Parabéns, muitos ditos "professores" deveriam ter essa forma simples e direta de ensinar.
moça por favor, traz mais vídeos nesse estilo💞
Pode deixar ˆˆ
Mal comecei a assistir o vídeo e já amei , explicação ótima! Era exatamente esse vídeo que eu estava procurando! Sério mesmo, muito Obrigada! ❤
Estou começando ainda e vou precisar assistir mais algumas vezes, mas você foi bastante didática. Muito bom o vídeo. Parabéns.
Desnecessário porém ser tão bonita, isto foi apenas um capricho da natureza.
Olá boa noite!
Adorei esse vídeo e fiz quase tudo , mas na parte 11:32 , não sei como importar as imagens. Por favor , poderia me explicar. Obrigado
Eu consegui baixando ela em "salvar como"
Vai falir as escolas kkk, vídeo ficou muito dahora, simplificado e dinâmico, vlwww, tô no aguardo dos próximos!!
huiaehheaiu valeuu!! Agora to sem criatividade de tema XDD Se tiver sugestões :)
@@AdrianaSaty Ensina a fazer joguinho de vestir para meninas. É uma boa introdução a JavaScript. Não vi nem um vídeo desse no UA-cam.
Que felicidade, eu estava tão focado estudando, que n tinha parado para ver se estava aprendendo, e olhando vc fazer esse site, percebi que já aprendi muita coisa, poucas coisas do que vc falou aí que eu ainda não usei, más sei o pq vc usou.
Muito obrigada pelo vídeo, ele é simples, porém eficiente! Nos cursos os temas são complicados, grandes, parece que vc nunca vai entender, porém contigo ficou tão simples!
Hello, atualmente sou professor de Inglês e fazendo transição de carreira... iniciei meus estudos em HTML, CSS e Javascript. junto a isso também comecei minha graduação de Engenharia do Software, suas dicas são ótimas. muito obrigado.
Este vídeo é muito bom para aprender, vc é otima e direta, pfvr volte a postar
Show de bola, tava me batendo pra entender as classes e agora compreendo como funciona.
Parabéns pelo conteúdo...
Sua aula me ajudou e muito a aprender e compreender sobre criação de site usando HTML e CSS 👏👏👏
Cara, sendo sincero.... Assistir esse vídeo me deu vontade de programar..kkkkkk
Parabéns pelo canal, curtindo seus vídeos!
Bora codar!! 🤘
Boa tarde! Muito bom seus vídeos. Como você fez pra importar as imagens já em svg? Estou iniciando os estudos.
Quero saber tbm scrr
sua didática é a mais simples e perfeita que já vi
PARABÉNS
Peguei esse vídeo pra relembrar CSS e HTML depois de um ano parada.
Incrivelmente simples, muito obrigada por esse conhecimento ❤
A maneira que você ensina parece ser muito fácil, mas quando eu começo a fazer eu sempre travo kkkkk, Muito bom, estou animado para os próximos vídeos! 😁
Poxa, comenta aqui onde você travou que eu te ajudo. E me ajuda a fazer melhor nas próximas! :)
Fiz alguns módulos hoje de um curso de Html que estou fazendo e ja tive um pouco de prática
Esta em portugues ainda mas creio q ja vou deixar em ingles original, pq vou ter que me acostumar.
Sua didática é muito boa, facilitou muita coisa ja em explicação
Pow, muito bom, prático e objetivo! Obrigada por dividir seu conhecimento. ❤
Muito bom o video, estou fazendo facul de (ADS) e seu conteúdo está fazendo com que eu entenda um pouco mais na área de desenvolvimento.
Estou fazendo Análise e Desenvolvimento de Sistemas, mas estou querendo começar a realizar meus projetos e seu conteúdo me ajudou na estruturação para meu primeiro projeto...😃😃😃
Ganhou um inscrito!!!
Consegui fazer, adorei!, agora criar as outras páginas, parabéns e obrigado, a forma como é ensinado influência muito,.
Simplesmente perfeita, a muitos anos sem contato com programação, acendeu minha vontade 😊😊 gratidão
Grava com mais frequência vídeos. A forma que você explica me identifiquei. E sem enrolação direta ao ponto. E top demais.
Ola Adriana Saty, conteudo top! Estou iniciando agora e a sua aula me abriu a mente de uma forma inexplicável... Parabéns!!!
poh, eu comecei a assistir uns videos me esforçando para aprender programação começando do básico e pretender ir até o avançado e esse seu video foi de fato o melhor de todos! Obrigado! Você acaba de ganhar mais um inscrito, pois a senhorita ensina e explica o que cada comando faz e isso facilita demais. Continue assim pois sempre que você postar mais videos, eu irei assistir a todos eles. (eu demorei dias somente para descobrir como e onde criar e editar os codigos) kkkk agr esta sendo muito mais simples!
incrível parabens, peguei um trabalho de html e css, criar um site de viagens, o seu video meu ajudou demais.
Estou estudando a um tempo e vim aqui fazer na prática e entendi 90% do que foi passado e aprendi coisas novas.
Sou seu fã e no insta fico ansioso pela sexta-feira da maldade no Ti haha.
Ótimo vídeo pra quem está aprendendo Adriana. Obrigado por compartilhar colega
Vídeo muito bom. Aprendi muito. A quantidade de visualizações comprovam ainda mais sobre um assunto tão nichado e considerando a quantidade de inscritos do canal.
Mto da hora seu vídeo! Me ajudou de mais! Estou começando do zero aos 42 anos e venho praticando, tem muita coisa para aprender. Mas se meter as caras e estudar da certo, no meu github tenho uns projetos que estou praticando como base para estudos através de eventos que participo e um curso que estou fazendo. Valeu Adriana pelo vídeo! Abraço.🤘😎🎸
Muito bom ver oque está acontecendo na pratica, fiz direitinho. Vfinalizar o desafio do contact e project! abraço arrasou
Esses videos rapidos são muito bons! keep doing it help us a lot!
olha! com essa voz, esse jeitinho, esse olhar lindo, Aprendo até Física Quântica. Parabéns seus vídeos são sensacionais, não pare por nadaaaaaa. Mesmo já em um nível um pouco mais avançado, fiz questão de assistir tudo. SINHINHO ATIVADO, INSCRITO, LIKE e ainda vou monstar um Fãn Clube rsrsrs
Muito bom mesmo, não sou chegado em Código mas assistindo didaticamente assim fica bem agradável.
Q da hora primeiro pessoa ajudando iniciante eu estou em faculdade ha 1 mes esses estilos de vídeo ajudara eu fica mais ansioso e concentrado a querer aprender mais e pode ajuda nas provas continua fazendo vídeo e se for cobrar algo que seja simbólico de trazer muito dinheiro e ajudara uma imensidão de pessoas ❤❤❤
Gostei da explicação, fui seguindo o passo a passo do vídeo e consegui. top
explicação muito boa, fui seguindo o passo a passo do vídeo e bateu certinho. top
Muito bom, estou a 2 meses procurando um conteúdo assim e não achava. Muito obrigado de verdade
obrigado por compartilhar adriana, pra quem e leigo como eu, sua explicação foi de uma grande valia.
parabéns pela facilidade que voçe tem em trasmitir o seu coneúdo.
OBRIGADO!! Aprendi muita coisa com o seu vídeo!! ; ), Tem aulas de 30 minutos que aprende quase nada kkkk muito obrigado mesmo!!
Muito bacana a criação e estilização, e a forma bem didática! Muito bom!
Excelente aula! Ensina na prática , fica bem mais fácil de entender! Parabéns !
Que aula maravilhosa! Estou começando a aprender programação agora! Obrigada!
você é perfeita ensinando, muito obrigado !
É tão lindo ver, quando a pessoa realmente sabe o que está fazendo ❤
Muito obrigada Adriana! ❤ Sucesso para ti!
Nossa! amei esse tutorial! so sabia alguns conceitos de HTML, mas, na hora ja consegui seguir o tutorial! Parabens, Adraina! Obrigada por compartilhar esse video! :D
Ficou muito showw Adriana!! Vou estudar Eng. de Software ano que vem, mas estudo pelo UA-cam e tenho curso para front-End!!
Caraca que aula!! Parabéns e muito obrigado Saty!! Iniciei os estudos em html e css em janeiro, e é muito gratificiante ver que o que já estudei de lá pra cá eu tenho repertório pra entender/colocar em prática e fazer um site desse bem bacana!! 😄😊
Boaa cara!! Continua nesse ritmo que você vai longe! 🤘
Gostei muito do seu vídeo, você explica muito bem, está me ajudando muito a criar meu primeiro site. Parabéns!
Olha , estou querendo entrar nesse mundo de TI , adorei o seu conteúdo e sua explicação.
ainda não vi muitas coisas , mas precisava ver algo sendo feito para saber se sou capaz ou não e você me ajudou muito com isso.
Muito Obrigado
você é top , valeu demais essa aula foi o começo de muitas coisas que estão pra vir pra mim !!
Ótimo vídeo, muito bem explicado, aprender na prática e bem melhor, parabéns pelo seu trabalho!!!
ola Adriana.. muito top seus videos, estou entrando para esse mundo agora consegui fazer tudo certinho so personalizar a aba contatos que ainda estou quebrando a cabeça rsrsr mais vc explica tudo bem simples e funcional parabens.
Boa tarde, explicação perfeita. Parabéns! Vou fazer e te marcar com toda certeza!
Cê tem futuro moça, Deus abençoe sempre sua vida 🙏😊❤
Ja te acompanhava no insta e achava mt top seu conteúdo, agora aqui no UA-cam ta sensacional esses vídeos
Obrigada 🙌🙌🙌
Passe o tempo que for, que vídeo excelente!