DEV Community

Cover image for Responsive Dream Intranet Homepage
Sanchit
Sanchit

Posted on

Responsive Dream Intranet Homepage

Frontend Challenge Holistic Webdev Submission

This is a submission for Frontend Challenge: Office Edition sponsored by Axero, Holistic Webdev: Office Space.

What I Built

I built a clean, responsive dream intranet homepage designed to help employees communicate, collaborate, and stay organized in a welcoming digital workspace.

The homepage features:
User profile section with a personalized welcome and motivational quote

Local weather display for daily readiness

Search bar for navigating internal resources easily

Upcoming events section with clear event cards

Quick links for HR, IT, chat, and company tools

Team spotlight showcasing team members and their focus

Announcements for important updates

Footer with contact and helpful links

My goal was to balance clarity, accessibility, and aesthetic appeal while ensuring the homepage remains lightweight and fast, aligning with Axero’s mission of effective workplace communication.


Demo

🖥️ Live Demo: View My Intranet Homepage

💻 Source Code: GitHub Repository


Journey

While building this intranet homepage, I:

✅ Practiced responsive design for multi-device compatibility

✅ Used vanilla HTML, CSS, and JavaScript to keep the project lightweight

✅ Focused on semantic HTML for accessibility and clarity

✅ Learned how structured, clean layouts improve daily workflows

I particularly enjoyed crafting the team spotlight section and event cards to make the homepage feel more connected and welcoming. This project reinforced the importance of small UI choices (like hover states, card spacing, and typography) in improving user experience on an intranet used daily.


Top comments (0)