Meu Processo 🖋️
Design 🎨
Ferramentas 🧰
Links 🔍
Redes sociais 📷
Olá! seja bem vindo. 👋
Esse projeto é a prática do curso disponivel gratuitamente no youtube "Learn HTML & CSS in 2022" do canal DesignCourse.
Nele pretendo aprimorar minhas habilidades com as ferramentas de HTML e CSS.
Inicialmente, é apresentado a estrutura dos códigos html e css e o editor de código que será utilizado (nesse caso o Visual Studio Code).
Nesse momento, algo que me surpreendeu foi a utilização do SASS ao invés de CSS em um curso para iniciantes. Porém se tratando de um "Crash Course" entendo o uso de tecnologias mais avançadas para o aprendizado.
Substitui as imagens e copy do Figma para dar um toque pessoal ao projeto.
Após baixar algumas imagens gratuitas do site Unsplash criei uma empresa fictícia de Design de interiores chamada "EcoPlace", empresa com o objetivo de planejar espaços internos com valores ambientalistas.
Adicionei alguns filtros as imagens dentro do Figma e todas elas estarão presentes na pasta /assets/img/.
Escrevendo o html adicionei apenas o uso de um H1 para englobar a typed logo deixando mais semantica e seguindo dicas de SEO.
Ao iniciar a criação da estilização minha parte preferida foi da utilização das animações, que mesmo se tratando de um design simples deu versatilidade ao projeto.
Apos a criação da estilização e responsividade da pagina se iniciou uma explicação sobre JavaScript algo que achei que não seria abordado no curso mas felizmente entrou para dar funcionalidade a nav.
Durante o curso o script foi criado no mesmo documento Html mas eu preferi colocar em um arquivo dentro de /assets/js/ para organização.
Por fim, recomendo o curso para iniciantes pois aborda muitas funcionalidades e ferramentas que utilizamos em toda criação html e css, senti falta somente de uma convenção durante a nomeação de classes, entretando minha parte favorita foi do workflow demonstrado em curso e as possibilidades de otimização disponiveis com o uso do SASS.
- HTML Semantico
- Sass
- Css Flexbox
- CSS Grid
- Mobile-first workflow