Skip to content

This project, made in 2019, aimed to test the responsiveness of a portfolio website layout. I did this using techniques and sources from my CodeFirst Web Development course. The design included a responsive navigation bar, page images and text layout so that it adjusts for desktop, tablet and mobile screens.

Notifications You must be signed in to change notification settings

emcglackenr1/PortfolioAndroidTest

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

32 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Portfolio Mobile Test

This project, made in 2019, aimed to test the responsiveness of a portfolio website layout. I did this using techniques and sources from my CodeFirst Web Development course. The design included a responsive navigation bar, page images and text layout so that it adjusts for desktop, tablet and mobile screens.

Available to view at: https://emcglackenr1.github.io/PortfolioAndroidTest/

Full Screen Versions

Website Preview1

Website Preview2

Mobile Versions

Mobile Preview1 Mobile Preview2

Responsive Navigation Bar

Full Screen Version

Navbar image

Mobile Version

This design utilises the popular 'hamburger menu' method, where the navigation bar collapses into the symbol below. It is a familiar icon in modern web design, and therefore user friendly.

Navbar on mobile

When clicked the 'hamburger menu' expands to reveal the navigation links.

Navbar on mobile expanded

Content Responsiveness

The website was responsive to several screen sizes

Full Screen Version of Image Gallery

Images Desktop Screen

Smaller screen layout

Images Smaller Screen1

Images Smaller Screen2

Mobile layout

Images Mobile

Full Screen Version of Text Content

Text Desktop Screen

Smaller screen layout

Text Smaller Screen1

Text Smaller Screen2

Mobile layout

Text Mobile

About

This project, made in 2019, aimed to test the responsiveness of a portfolio website layout. I did this using techniques and sources from my CodeFirst Web Development course. The design included a responsive navigation bar, page images and text layout so that it adjusts for desktop, tablet and mobile screens.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published