Web Projects

WordPress layout practice & UI learning

These projects represent my hands-on practice with WordPress and Divi Builder, focusing on layout structure, spacing, responsiveness, and user experience fundamentals.

PROJECT 1: Personal Portfolio Website

Project Overview

This project represents my primary hands-on learning experience in website design using WordPress. The goal was to create a clean, professional portfolio website that clearly presents my skills, learning journey, and practical work while maintaining usability and responsiveness across devices.

Tools & Platforms Used

  • WordPress (CMS)

  • Divi Builder

  • Canva (for visual assets)

  • ChatGPT (for content structuring & ideation)

Project Objective

  • To design a professional resume-style website for job opportunities

  • To understand website layout hierarchy and content flow

  • To practice responsive design principles

  • To build confidence in real-world website creation

Design & Layout Approach

  • Created a clear hero section with name, role, and call-to-action

  • Structured pages into logical sections: Home, About, Portfolio, Resume, Contact

  • Focused on spacing, alignment, and readability rather than heavy design

  • Used consistent typography and color hierarchy for a professional appearance

Key Pages Designed

  • Home page with introduction and skill highlights

  • About Me page with skills, experience, certifications, and resume sections

  • Portfolio page with categorized practice work

  • Resume page with downloadable PDF

  • Contact page with clear call-to-action

What I Practiced & Learned

  • Building layouts using Divi sections, rows, and modules

  • Creating reusable design patterns

  • Understanding how content hierarchy affects user experience

  • Implementing buttons, navigation, and internal linking

  • Optimizing layout for desktop and mobile views

Challenges Faced

  • Balancing content length with clean design

  • Choosing professional color combinations

  • Structuring information clearly for recruiters

How I Solved Them

  • Researched portfolio website structures

  • Simplified layouts and reduced clutter

  • Tested different spacing and alignment options

  • Iterated based on usability and readability

Outcome

The final website acts as a digital resume and portfolio, helping recruiters quickly understand my skills, learning approach, and practical exposure. It also serves as a foundation for future projects and improvements.

Skills Demonstrated

  • WordPress website design

  • Layout planning & content structuring

  • Beginner UI/UX understanding

  • Attention to detail

  • Learning-by-doing mindset

View Live Website
Download Resume