Live Demo: https://otaviogrocha.github.io/google/
Desenvolvido a partir do curso CS50’s Web Programming with Python and JavaScript de Harvard edX.
Simples Clone do Google com as funcionalidades:
- Seu site deve ter pelo menos três páginas: uma para a Pesquisa normal do Google (que deve ser chamada de index.html), uma para a Pesquisa de imagens do Google e uma para a Pesquisa avançada do Google.
- Na página da Pesquisa do Google, deve haver links no canto superior direito da página para acessar a Pesquisa de imagens ou a Pesquisa avançada. Em cada uma das outras duas páginas, deve haver um link no canto superior direito para voltar à Pesquisa Google. Na página de pesquisa do Google, o usuário deve poder digitar uma consulta, clicar em "Pesquisa do Google" e ser direcionado para os resultados de pesquisa do Google para essa página.
- Assim como a do Google, sua barra de pesquisa deve ser centralizada com cantos arredondados. O botão de pesquisa também deve estar centralizado e deve estar abaixo da barra de pesquisa.
- Na página de pesquisa de imagens do Google, o usuário deve poder digitar uma consulta, clicar em um botão de pesquisa e ser direcionado para os resultados de pesquisa de imagens do Google para essa página.
- Na página de pesquisa avançada do Google, o usuário deve ser capaz de fornecer entrada para os quatro campos a seguir (retirados das próprias opções de pesquisa avançada do Google)
- Encontre páginas com… “todas estas palavras:”
- Encontre páginas com… “esta palavra ou frase exata:”
- Encontre páginas com… “qualquer uma destas palavras:”
- Encontre páginas com… “nenhuma destas palavras:”
- Como a própria página de pesquisa avançada do Google, as quatro opções devem ser empilhadas verticalmente e todos os campos de texto devem ser alinhados à esquerda.
- Consistente com o próprio CSS do Google, o botão “Pesquisa avançada” deve ser azul com texto branco.
- Quando o botão “Pesquisa Avançada” é clicado, o usuário deve ser direcionado para a página de resultados da pesquisa para sua consulta.
- Adicione um botão "Estou com sorte" na página principal da Pesquisa do Google. Consistente com o próprio comportamento do Google, clicar neste link deve levar os usuários diretamente ao primeiro resultado de pesquisa do Google para a consulta, ignorando a página de resultados normal.
- Você pode encontrar um aviso de redirecionamento ao usar o botão "Estou com sorte". Não se preocupe! Esta é uma consequência esperada de um recurso de segurança implementado pelo Google.
- O CSS que você escreve deve se parecer com a própria estética do Google.
Mais especificações através do link: https://cs50.harvard.edu/web/2020/projects/0/search/