Download Static HTML Website Designs - Download do código-fonte Static HTML Website Designs

Static HTML Website Designs

Outras categorias

Static HTML Website Designs

Baixar

Coleção de sites HTML estáticos ·

Introdução

Esta é uma coleção de landing pages e modelos de blog desenvolvidos por mim. Esses temas são baseados em HTML, CSS, javascript, jquery e Bootstrap. Estou criando este repositório como um portfólio para mostrar meu trabalho como desenvolvedor web frontend para conseguir uma oportunidade de emprego, seja freelance, meio período, período integral ou contratos, e esses designs são apenas uma parte simples do meu trabalho porque não posso colocar os trabalhos dos meus clientes aqui para público. Se você acha que meus serviços podem ser úteis para você e tem interesse em me contratar, fique à vontade para me enviar um e-mail.

Neste repositório você encontrará os seguintes designs

Clique no nome do tema para ver a visualização ao vivo, e esses designs NÃO são para uso pessoal ou comercial, são apenas para fins de exibição (para mostrar minhas habilidades de front-end).

Canox: Blog simples, limpo, pessoal, moderno e profissional, ideal para fazer um site de blog profissional.
Covid-19: Covid-19: Página inicial simples para visualizar as estatísticas do coronavírus e ver como se proteger dele com estatísticas em tempo real provenientes da API e um mapa interativo para visualizar as estatísticas mais recentes por país. Este design foi desenvolvido pelo designer Shahriar Hossain e eu apenas converti o design em códigos de front-end fazendo algumas alterações no design para torná-lo mais bonito.
Konish: Landing page bonita e simples para uma empresa técnica. E este trabalho é um dos meus primeiros trabalhos como desenvolvedor web frontend.
Projeção e Colisão: Demonstração de informações na Web para o projeto Projeção e Colisão do terceiro ano de meu estudo na faculdade de engenharia de tecnologia da informação da Universidade de Damasco.
Sass: Outra landing page para uma empresa técnica. e você pode ver a apresentação no behance aqui.
Sellvas: Tema de modelo de revista e blog em tema de revista e blog de design elegante e limpo. Repleto de tudo que você precisa para montar um lindo blog e galeria de fotos, tem um design moderno e minimalista, fácil de manter e acabamento impecável em todos os detalhes. E este tema contém mais de 10 variações de layout e muitos estilos de postagens e páginas de erro para combinar com cada estilo de design.
História: Página de destino simples e limpa para visualização de antiguidades e trabalhos manuais, e este site foi projetado por Majd Shamma, mas converti esse design em um site estático.
Tieqode: Uma equipe de profissionais com as habilidades técnicas e comerciais necessárias, sólida liderança, experiência e conhecimento para oferecer as melhores soluções e serviços aos clientes. E quando entrei na equipe do TIEQODE trabalhei no site deles, e você pode ver o site aqui.
Casamento: Landing page moderna e bonita para um evento de casamento.

Sobre esses temas

Principais características desses designs

HTML5, CSS3, Javascript, jQuery e Bootstrap.
Belos efeitos de paralaxe.
Scripts válidos e códigos bem organizados.
Designs minimalistas, modernos e limpos.
Usei fontes gratuitas do Google como Roboto e Raleway.
Todos os arquivos são bem comentados para facilitar a edição.
Controle deslizante de carrossel de suporte.
Inclui efeitos jquery e CSS3.
Os menus suspensos e os menus normais também são otimizados para dispositivos móveis.
Suporte breadcrumb para uma melhor navegação.
Compatível com vários navegadores.
Integração incrível de fontes e ícones Ion.
Suporte a formatos de postagem.
Postagens relacionadas em postagens.
Caixa do autor incluída.
Erro personalizado 404 páginas.

Bibliotecas javascript usadas

Nestes temas, há alguns arquivos Javascript importados, e todos os arquivos e plug-ins necessários estão incluídos nos arquivos do projeto e esses arquivos e plug-ins são:

jQuery: jQuery é uma biblioteca JavaScript rápida, pequena e rica em recursos. Ele torna coisas como travessia e manipulação de documentos HTML, manipulação de eventos, animação e Ajax muito mais simples com uma API fácil de usar que funciona em vários navegadores. Com uma combinação de versatilidade e extensibilidade, o jQuery mudou a forma como milhões de pessoas escrevem JavaScript.
Bootstrap: estrutura CSS gratuita e de código aberto direcionada ao desenvolvimento web front-end responsivo e mobile-first. Ele contém modelos de design baseados em CSS e JavaScript para tipografia, formulários, botões, navegação e outros componentes de interface.
Owl Carousel: é uma biblioteca que me ajudou a fazer sliders nos sites com lindos efeitos e estilos de transição.
Paralaxe: é um recurso moderno, eu uso esse recurso para adicionar efeitos de paralaxe ao layout na rolagem do mouse.
Font Awesome & Ion Icons: Ícones vetoriais e logotipos sociais para usar nos sites. Font Awesome é o conjunto de ícones e kit de ferramentas mais popular da web e é usado por 38% dos sites que usam scripts de fontes de terceiros, e o Ion Icons é um ícone de design premium para uso em aplicativos da web, iOS, Android e desktop. E é suporte para SVG e fontes da web.
Mixitup: biblioteca de alto desempenho e livre de dependências para manipulação de DOM animado, oferecendo o poder de filtrar, classificar, adicionar e remover elementos DOM com belas animações. MixItUp funciona bem com seu HTML e CSS existentes, tornando-o uma ótima opção para layouts responsivos e compatível com fluxo inline, porcentagens, consultas de mídia, flexbox e muito mais.
TypedJs: uma biblioteca que digita. Insira qualquer string e observe-a digitar na velocidade que você definiu, retroceda o que foi digitado e comece uma nova frase para quantas strings você definiu.
E finalmente no arquivo main.js eu coleciono tudo acima: implemento alguns plugins para criar os efeitos nos temas. Esses plug-ins estão compactados, então não precisarei editar nada manualmente no arquivo. A única coisa necessária a saber é como chamar o método.

Imagens e ilustrações usadas

Todas as imagens utilizadas nos designs são 100% gratuitas, mas são apenas para fins de demonstração, e utilizei imagens, ícones e ilustrações dos seguintes sites: