Landing page turística sobre Busan, segunda maior cidade da Coreia do Sul. O site apresenta gastronomia local, informações rápidas e três destinos históricos imperdíveis, com visual inspirado na cultura coreana e suporte bilíngue (português e inglês).
Autor: Glawber Santos
- Layout responsivo (mobile, tablet e desktop)
- Menu fixo com navegação por seções
- Alternância de idioma PT / EN (preferência salva no navegador)
- Seções: hero, dados rápidos, gastronomia, destinos e chamada para ação
- Animações suaves ao rolar a página
- Acessibilidade: link “pular para o conteúdo”, foco visível e textos alternativos nas imagens
- HTML5 semântico
- CSS3 (variáveis, Grid, Flexbox, media queries)
- JavaScript vanilla (i18n, menu mobile, scroll)
Sem frameworks ou build — basta abrir no navegador.
Pagina_Turistica/
├── index.html # Página principal
├── style.css # Estilos
├── script.js # Idioma, menu e interações
├── README.md
└── assets/
├── Busan.png
├── Templo Haedong Yonggungsa.png
├── Templo Beomeo-sa.png
├── Parque Yongdusan.png
├── Vector.svg # Ícone de coração (rodapé)
└── favicon.svg
- Clone ou baixe o repositório.
- Coloque as imagens
.pngna pastaassets/(veja lista acima). - Abra o arquivo
index.htmlno navegador.
Opcional — servidor local (evita problemas com alguns recursos em file://):
# Python 3
python -m http.server 8080
# Node (npx)
npx serve .Acesse http://localhost:8080.
As imagens não estão versionadas no repositório por padrão. Adicione manualmente em assets/:
| Arquivo | Uso |
|---|---|
Busan.png |
Hero — vista da cidade |
Templo Haedong Yonggungsa.png |
Destino 1 |
Templo Beomeo-sa.png |
Destino 2 |
Parque Yongdusan.png |
Destino 3 |
Sem elas, a página funciona, mas os blocos de imagem exibem apenas o fundo de placeholder definido no CSS.
Use o botão PT / EN no menu. A escolha é gravada em localStorage com a chave busan-lang.
Para editar textos, altere o objeto translations em script.js e os atributos data-i18n correspondentes no index.html.
Projeto educacional e pessoal. Conteúdo sobre Busan baseado em material de estudo; imagens são de uso local conforme os arquivos que você adicionar em assets/.
Feito por Glawber Santos.