OpenFab Website

Overview

This is the official website for OpenFab, a Brussels-based FabLab that explores the relationship between humans and technology.

Project Structure

• index.html: Main website page
• css/styles.css: Custom styling
• images/: Contains logos and visual assets

Setup and Local Development

1. Clone the repository
2. Open index.html directly in a web browser
3. No additional dependencies required

Customization

• Modify content in index.html
• Adjust styles in css/styles.css
• Replace images in images/ directory

Responsive Design

• Mobile-friendly layout
• Adaptive typography
• Flexible grid system using Bootstrap

Features

• FAQ Accordion
• Embedded Google Calendar
• Contact Form
• Location Information
• Responsive Design

Contributing

1. Fork the repository
2. Create a feature branch
3. Commit your changes
4. Push to the branch
5. Create a Pull Request

Suggested Improvements and Contribution Tasks

Technical Enhancements

1. Contact Form Webhook Integration
   • Implement an automated notification system for new contact form submissions
   • Potential technologies: Zapier, IFTTT, or custom serverless functions
   • Goals:
     • Instant notification to community managers
     • Automated tracking of incoming inquiries
     • Potential integration with communication platforms (Slack, Discord)

Form integrated with Tally.so and automatic forward to contact email openfab

2. Dynamic FAQ Management System

   • Create a mechanism to easily update and add FAQs
   • Potential approaches:
     • JSON-based FAQ configuration
     • GitHub-based workflow for community contributions

3. Accessibility Improvements

   • Implement WCAG 2.1 compliance
   • Add proper ARIA labels
   • Ensure keyboard navigation
   • Improve color contrast
   • Add screen reader support

4. Performance Optimization

   • Implement lazy loading for images
   • Minify CSS and JavaScript
   • Optimize Google Fonts loading
   • Consider static site generation

5. Internationalization

   • Add multi-language support
   • Implement language switcher
   • Prepare translation infrastructure

Design Philosophy

• Minimalist and clean design
• Focus on user experience
• Emphasizing community and maker spirit

Technologies

• HTML5
• CSS3
• Bootstrap 4
• Responsive Web Design

Credits

• Design: @ZuperNinja, @Satblip, @Doegox, @nicolasdb and @maeligg
• Inspiration: Maker community spirit
• Special thanks to Vulca initiative

License

Creative Commons Attribution ShareAlike 4.0 International License

Contact

• Website: OpenFab
• Email: contact@openfab.be
• Location: 158 Rue Gray, 1050 Ixelles, Belgium

Future Roadmap

• Implement suggested technical enhancements
• Community-driven development
• Continuous improvement of maker resources