[HTML/CSS] Projeto Pousada-secreta - Duvida.
17/09/2021
0
Bom dia , gostaria que vocês analisassem a estrutura do html do projeto e me dessem dicas de como melhorar-lo e o que precisa ser melhorado.
================================== HTML===============================================
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Pousada Secreta </title>
</head>
<body>
<header>
<div class="container">
<div class="menu-navegacao">
<nav>
<a href="#">Pousada Secreta</a>
<a href="#sobre">Sobre</a>
<a href="#rotas">Rotas</a>
<a href="#quartos">Quartos</a>
</nav>
</div>
</div>
</header>
<section>
<div class="backgroud">
<div class="conteudo-titulo">
<h1>Pousada Secreta</h1>
<p>pousada reservada em Angra dos Reis</p>
</div>
</div>
</section>
<main>
<section>
<div class="conteudo-principal">
<div>
<h2>sejam bem vindos(A)!</h2>
<P>Relaxem em nossas acomodacoes e curta o melhor de Angra dos Reis.</P>
<p>Temos quartos para solteiros, casal ou familia.</p>
</div>
<div class="quartos-img">
<div>
<img src="assets/quarto-solteiro1.jpg" alt="">
<div>
<a href="#">Quarto solteiro</a>
</div>
<img src="assets/quarto-casal1.jpg" alt="">
<div>
<a href="#">Quarto casal </a>
</div>
<img src="assets/quarto-familia1.jpg" alt="">
<div>
<a href="#">Quarto familia</a>
</div>
</div>
</div>
</div>
</section>
<section>
<div class="conteudo-meio">
<div>
<h3>rota</h3>
<p>Veja como chegar aqui</p>
</div>
<div class="iframe">
<div>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3673.1152700350485!2d-43.36501068559016!3d-22.982788346364128!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x9bda2a689aeccd%3A0xa51f3be0d88fc0f!2sAv.%20Ayrton%20Senna%2C%203000%20-%20Barra%20da%20Tijuca%2C%20Rio%20de%20Janeiro%20-%20RJ%2C%2022775-003!5e0!3m2!1spt-BR!2sbr!4v1631884055434!5m2!1spt-BR!2sbr" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
</div>
</div>
</div>
</section>
<section>
<div class="conteudo-final">
<div>
<h3>Sobre a pousada</h3>
<p>conheca um pouco sobre a pousada</p>
</div>
</div>
</section>
<section>
<div class="container-final">
<div class="box-img">
<div>
<h3>A pousada</h3>
<p>A pousada dispoe de estacionamento privativo gratuito,piscina ao ar livre e garagem</p>
<img src="assets/img1.jpg" alt="Foto da pousada" title="A Pousada">
</div>
</div>
<div>
<h3>Nossos quartos</h3>
<p>Os quartos possuem TV de tela plana a cabo, cozinha compacta e area de refeicoes.Alem disso,as unidades da Poudada Dev contam com ar-condicionado e guarda-roupa.</p>
<img src="assets/img2.jpg" alt="Foto dos quartos" title="Nossos quartos">
</div>
<div>
<h3>Alimentacao</h3>
<p>A pousada oferece cafe da manha em estilo continental ou buffet. Nossos restaurantes funcionam 24hrs.</p>
<img src="assets/img3.jpg" alt="Foto restaurante" title="ALimentacao">
</div>
<div>
<h3>Recepcao</h3>
<p>Nossa recepcao fica aberta 24hrs por dia.</p>
<img src="assets/img4.jpg" alt="Foto da recepcao" title="A Recepcao">
</div>
</div>
</section>
</main>
<footer>
<div class="rodape">
<div>
<h3>Entre em contato</h3>
</div>
<div>
<img src="assets/icones/endereco.png" alt=""><a href="https://www.google.com/maps/place/Via+Parque+Shopping/@-22.9826906,-43.3663798,17z/data=!3m1!4b1!4m5!3m4!1s0x9bda2c2293fa63:0x539cb07246f0e38d!8m2!3d-22.9826906!4d-43.3641911">Endereco Av 133,222-Rio de Janeiro,RJ </a>
</div>
<div>
<img src="assets/icones/telefone.png" alt=""><a href="">Cel:552100000000</a>
</div>
<div>
<img src="assets/icones/calendario.png" alt=""><a href="https://www.booking.com/index.pt-br.html?label=gen173nr-1BCAEoggI46AdIM1gEaCCIAQGYAS24ARnIAQzYAQHoAQGIAgGoAgO4Ap-zkooGwAIB0gIkNDVhNzdlY2MtOTg5MC00MGY1LWE5ZTktYTQyMzgxYTAxZjg02AIF4AIB;sid=74b0d64a13fb7e8b4eec7d5d4a1335b3;keep_landing=1&sb_price_type=total&">Faca sua reserva pelo Booking.com</a>
</div>
<div class="copyright">
<p>Copyright-PousadaDev</p>
</div>
</div>
</footer>
</body>
</html>
================================== HTML===============================================
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Pousada Secreta </title>
</head>
<body>
<header>
<div class="container">
<div class="menu-navegacao">
<nav>
<a href="#">Pousada Secreta</a>
<a href="#sobre">Sobre</a>
<a href="#rotas">Rotas</a>
<a href="#quartos">Quartos</a>
</nav>
</div>
</div>
</header>
<section>
<div class="backgroud">
<div class="conteudo-titulo">
<h1>Pousada Secreta</h1>
<p>pousada reservada em Angra dos Reis</p>
</div>
</div>
</section>
<main>
<section>
<div class="conteudo-principal">
<div>
<h2>sejam bem vindos(A)!</h2>
<P>Relaxem em nossas acomodacoes e curta o melhor de Angra dos Reis.</P>
<p>Temos quartos para solteiros, casal ou familia.</p>
</div>
<div class="quartos-img">
<div>
<img src="assets/quarto-solteiro1.jpg" alt="">
<div>
<a href="#">Quarto solteiro</a>
</div>
<img src="assets/quarto-casal1.jpg" alt="">
<div>
<a href="#">Quarto casal </a>
</div>
<img src="assets/quarto-familia1.jpg" alt="">
<div>
<a href="#">Quarto familia</a>
</div>
</div>
</div>
</div>
</section>
<section>
<div class="conteudo-meio">
<div>
<h3>rota</h3>
<p>Veja como chegar aqui</p>
</div>
<div class="iframe">
<div>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3673.1152700350485!2d-43.36501068559016!3d-22.982788346364128!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x9bda2a689aeccd%3A0xa51f3be0d88fc0f!2sAv.%20Ayrton%20Senna%2C%203000%20-%20Barra%20da%20Tijuca%2C%20Rio%20de%20Janeiro%20-%20RJ%2C%2022775-003!5e0!3m2!1spt-BR!2sbr!4v1631884055434!5m2!1spt-BR!2sbr" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
</div>
</div>
</div>
</section>
<section>
<div class="conteudo-final">
<div>
<h3>Sobre a pousada</h3>
<p>conheca um pouco sobre a pousada</p>
</div>
</div>
</section>
<section>
<div class="container-final">
<div class="box-img">
<div>
<h3>A pousada</h3>
<p>A pousada dispoe de estacionamento privativo gratuito,piscina ao ar livre e garagem</p>
<img src="assets/img1.jpg" alt="Foto da pousada" title="A Pousada">
</div>
</div>
<div>
<h3>Nossos quartos</h3>
<p>Os quartos possuem TV de tela plana a cabo, cozinha compacta e area de refeicoes.Alem disso,as unidades da Poudada Dev contam com ar-condicionado e guarda-roupa.</p>
<img src="assets/img2.jpg" alt="Foto dos quartos" title="Nossos quartos">
</div>
<div>
<h3>Alimentacao</h3>
<p>A pousada oferece cafe da manha em estilo continental ou buffet. Nossos restaurantes funcionam 24hrs.</p>
<img src="assets/img3.jpg" alt="Foto restaurante" title="ALimentacao">
</div>
<div>
<h3>Recepcao</h3>
<p>Nossa recepcao fica aberta 24hrs por dia.</p>
<img src="assets/img4.jpg" alt="Foto da recepcao" title="A Recepcao">
</div>
</div>
</section>
</main>
<footer>
<div class="rodape">
<div>
<h3>Entre em contato</h3>
</div>
<div>
<img src="assets/icones/endereco.png" alt=""><a href="https://www.google.com/maps/place/Via+Parque+Shopping/@-22.9826906,-43.3663798,17z/data=!3m1!4b1!4m5!3m4!1s0x9bda2c2293fa63:0x539cb07246f0e38d!8m2!3d-22.9826906!4d-43.3641911">Endereco Av 133,222-Rio de Janeiro,RJ </a>
</div>
<div>
<img src="assets/icones/telefone.png" alt=""><a href="">Cel:552100000000</a>
</div>
<div>
<img src="assets/icones/calendario.png" alt=""><a href="https://www.booking.com/index.pt-br.html?label=gen173nr-1BCAEoggI46AdIM1gEaCCIAQGYAS24ARnIAQzYAQHoAQGIAgGoAgO4Ap-zkooGwAIB0gIkNDVhNzdlY2MtOTg5MC00MGY1LWE5ZTktYTQyMzgxYTAxZjg02AIF4AIB;sid=74b0d64a13fb7e8b4eec7d5d4a1335b3;keep_landing=1&sb_price_type=total&">Faca sua reserva pelo Booking.com</a>
</div>
<div class="copyright">
<p>Copyright-PousadaDev</p>
</div>
</div>
</footer>
</body>
</html>
Tiago Santana
Curtir tópico
+ 0
Responder
Post mais votado
17/09/2021
Bom dia , gostaria que vocês analisassem a estrutura do html do projeto e me dessem dicas de como melhorar-lo e o que precisa ser melhorado.
================================== HTML===============================================
<header>
<div class="container">
<div class="menu-navegacao">
<nav>
<ol>
<li><a href="#">Pousada Secreta</a></li>
<li><a href="#sobre">Sobre</a></li>
<li><a href="#rotas">Rotas</a></li>
<li><a href="#quartos">Quartos</a></li>
</ol>
</nav>
</div>
</div>
</header>
================================== HTML===============================================
<header>
<div class="container">
<div class="menu-navegacao">
<nav>
<ol>
<li><a href="#">Pousada Secreta</a></li>
<li><a href="#sobre">Sobre</a></li>
<li><a href="#rotas">Rotas</a></li>
<li><a href="#quartos">Quartos</a></li>
</ol>
</nav>
</div>
</div>
</header>
Tiago Santana
Responder
Clique aqui para fazer login e interagir na Comunidade :)
Inserção de url
Descrição
Url
