Fakir Site 👩🏻‍💻

This is a personal website showcasing the services, projects, and blog of the site owner. The website provides smooth navigation between sections through a top navigation bar (Navbar). Users can easily access any section by clicking on the relevant link in the menu. A standout feature of this site is that each section appears smoothly when selected from the menu, enhancing user experience.

---

Live Demo 🌐

• Check out the live demo of the project at Fakir Site.

---

🛠 Website Contents

1. Home Section Welcome message: Hello, I'm Alex Smith with animated text describing the role (e.g., Professional Web Developer). Logo displayed next to the navigation links (Navbar) for easy access.
2. About Section Profile information, including: Name Age Location Email Personal photo reflecting the owner’s identity. Buttons for Download CV and Hire Me for easy interaction.
3. Services Section Displaying offered services using cards, such as: UI/UX design App development Product design
4. Portfolio Section Displaying previous projects using a grid of images with a filter option to sort by category (e.g., Graphic Design, Web Design).
5. Statistics Section Presenting interactive statistics such as: Number of members Completed projects Files downloaded Lines of code written
6. Feedback Section Displaying client feedback with images and star ratings.
7. Blog Section Featuring articles and videos related to the site’s niche, along with publication dates and post titles.

---

🚀 Navigation between Sections

• Navbar allows quick access to all sections.
• Clicking on a menu item automatically scrolls to the corresponding section smoothly.

---

🧑‍💻 Languages and Technologies Used

• HTML5: For structuring the webpage.
• CSS3: For styling and design.
• Font Awesome: To add appealing icons for cards and statistics.
• Google Fonts: To incorporate fonts like Roboto and Source Sans 3.

---

How to Use 🚀

We welcome contributions to Fakir! Here’s how you can help:

1. Fork the repository - Click the "Fork" button at the top right of the repository page.

2. Clone your fork - Use the command:

    https://github.com/OmarrSakr/Fakir-Site.git
   

---

⚠ Notes

• The site currently lacks full interactivity on small screens.
• It is recommended to add a side menu or burger menu to improve navigation on mobile devices.

---

📂 Project Structure

# Fِِakir-Site
│
├── index.html                  # 🏠 ملف الصفحة الرئيسية
│
├── webfonts/                   # 🔤 مجلد لتخزين ملفات الخطوط
│   ├── fontawesome-webfont.woff2
│   ├── fontawesome-webfont.woff
│   └── custom-font.ttf
│
├── CSS/                        # 🎨 مجلد لتخزين ملفات CSS
│   ├── all.min.css             # 📦 ملف Font Awesome
│   ├── pagestyle.css           # 📄 ملف CSS الرئيسي لتصميم الصفحات
│
├── Images/                     # 🖼️ مجلد لتخزين الصور
│   ├── about.jpg               # 👤 صورة في قسم "حول"
│   ├── feedback.jpg            # 💬 صورة تعليقات العملاء
│   ├── portfolio/              # 📂 مجلد لتخزين صور المحفظة
│   │   ├── 1.jpg
│   │   ├── 2.jpg
│   │   ├── 3.jpg
│   │   ├── 4.jpg
│   │   ├── 5.jpg
│   │   └── 6.jpg
│   ├── blog/                   # 📝 مجلد لتخزين صور المدونة
│   │   ├── 12.jpg
│   │   └── 32.jpg               
│
└── JS/                         # ❌ لا يوجد مجلد لتخزين ملفات JavaScript

---

Future Updates 📈

• Add responsiveness:
  • Optimize the layout for various screen sizes (e.g., smartphones and tablets).
• Enable smooth animations:
  • Use libraries like ScrollReveal.js or AOS to animate elements gradually on scroll.

---

Important Notes 📢

• This project is a static website and does not include a backend or dynamic content.
• Non-Responsive Design: The current version is not optimized for mobile or tablet screens.

---