Code Monkey home page Code Monkey logo

olgatenison / discoverjapan Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 12.23 MB

Study project is a landing page for a travel company Torii Gates. This one is about most wonderful places to visit and discover in Japan! The page is fully adaptive. It was used such technologies as flex, grid, BEM and simple JS.

Home Page: https://olgatenison.github.io/DiscoverJapan/

CSS 51.36% HTML 44.10% JavaScript 4.54%
bem-methodology css3 html5 javascript js landing-page

discoverjapan's Introduction

DiscoverJapan

Превью изображение

study project


Description

Project is a landing page for a travel company Torii Gates. This one is about most wonderful places to visit and discover in Japan! The page is fully adaptive.

It was used such technologies as flex, grid, BEM and simple JS.


The project consists of the following blocks:

  • Header
  • Intro
  • Benefits
  • Places
  • Tours
  • Top
  • Videos
  • Footer

Technologies Used

Discover Japan is built using a variety of modern web technologies to create a fully responsive and visually appealing landing page. Here are the key technologies employed in this project:

  • HTML5: The structure of the web page is created using the latest HTML standard, ensuring a semantically correct and well-organized layout.

  • CSS3: Cascading Style Sheets (CSS3) are used to style the page, providing a visually appealing and consistent design across different devices and screen sizes. Techniques like Flexbox and Grid are utilized for responsive layouts.

  • BEM (Block-Element-Modifier): The BEM methodology is employed to maintain a clean and maintainable CSS codebase. It promotes modular and reusable styles, making it easier to manage and scale the project.

  • Responsive Design: The page is designed with a responsive approach, ensuring that it looks and functions well on a variety of devices, including web browsers, tablets, and mobile phones. Media queries and flexible layouts are used to achieve responsiveness.

  • JavaScript: JavaScript is used to enhance the user experience and add interactivity to the website. For smaller screens, a burger menu is implemented to improve navigation on mobile devices.

This combination of HTML5, CSS3, BEM, responsive design, and JavaScript ensures that Discover Japan provides an engaging and accessible user experience across different platforms and screen sizes.


The project is available for viewing in any browser, it has a web, tablet and mobile version (screen width ≥ 320px). Also I made burger menu for a smaller scrins.

discoverjapan's People

Contributors

olgatenison avatar

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.