Texus Landing Pages Design

This is simple landing page design with html-5,only css-3 and Javascript.

Project setup instruction:

Step 1: Clone Code

First, you will need to clone code from this repository

# using git
git init
git clone https://github.com/nurislammridha/texus-landing-page.git

Step 2: Start your application

Open project directory folder and you will find index.html folder, click on it and you will see output on your selected browser. Another page is page1.html .

Home Page Link: LIVE LINK

Second Page Link: second page

Output Features:

01) Header Navigation:

Email, basic address and contact number are showing header top
In main header navigation company logo is in left side and right side menus are showing.
Search and language icons are in right side corner.

02) Hero Section:

I designed an animated hero with three images with auto slide (slide after 3sec are set).
Company time table and other info are also showing

03) News Section:

I design three cards highlighting three different news with date and proper title

04) Gallery Section:

Image are showing as gallery.

05) Map Section:

Map are showing with company address

06) Footer Section:

Privacy Policy Options
Copy Rights
Social Media are linked
Company address phone number (dummy data are showing)
Company Open Hours (Dummy data are showing)
Some Company icons are showing
Subscribe button as "Book Now" button available here

Second Page

07) Tabs section:

A tab designed for showing some information

08) Paragraph section:

A paragraph design for showing some information

08) Data toggle section:

Toggle are designed. Click and open a section with lorem ipsum text. Up and down arrow are indicate open and close

09) Service section:

This section showing service of the company

10) Profile section:

Employe profiles with their addresses

Some highlighted technologies I use:

01) HTML5 : I use Html5 five for structure

02) CSS3: I use modern css (flex box, grid and animations) for styling.

03) CSS3 Animation: I use modern css3 animation and hover effect.

03) Javascript: For smooth scrolling(when navigation) and auto slide for hero caurosel.

Some basic module I design for better user experience

01) Responsive Design: I ensure landing page works across devices (large-small, any devices)

02) Cross Browser: Design supports different browsers.

03) Pixel Perfect: Design is pixel perfect

04) Animations: I use hover effect and some fade animations in some sections

05) Accessibility: I follow basic accessibility guidelines (alt text for images and proper form labels)

05) Instructions: I follow instructions from https://panrbiblioteka.lt/