- Created CONTRIBUTING.md to outline contribution process and code of conduct. - Added LICENSE file with MIT License and third-party licenses. - Introduced SECURITY.md detailing vulnerability reporting and security measures. - Established README.md in assets directory for asset management and guidelines. - Implemented index.html as the main entry point for the website. - Configured package.json for project dependencies and scripts. - Developed styles.css for custom styles and responsive design. - Set up vite.config.ts for Vite configuration and build settings.
4.7 KiB
4.7 KiB
Required Assets for Miracles In Motion Website
This directory contains all the assets needed for the website to function properly.
Images Directory Structure
assets/images/
├── logo.png # Main organization logo (200x200px recommended)
├── logo-white.png # White version for dark backgrounds
├── favicon.ico # Website favicon (32x32px)
├── hero-bg.jpg # Hero section background image (1920x1080px)
├── og-image.jpg # Open Graph image for social sharing (1200x630px)
├── team/ # Team member photos
│ ├── director-1.jpg
│ ├── director-2.jpg
│ └── volunteer-1.jpg
├── impact/ # Photos showing impact
│ ├── students-1.jpg
│ ├── supplies-1.jpg
│ └── distribution-1.jpg
└── sponsors/ # Sponsor/partner logos
├── school-district.png
├── local-business.png
└── community-org.png
Documents Directory
assets/documents/
├── 501c3-certificate.pdf # IRS determination letter
├── financial-report.pdf # Latest annual financial report
├── form-990.pdf # Latest Form 990
├── privacy-policy.pdf # Privacy policy document
├── terms-of-service.pdf # Terms of service
├── donor-privacy-policy.pdf # Donor privacy policy
├── volunteer-handbook.pdf # Volunteer handbook
├── gift-acceptance-policy.pdf # Gift acceptance policy
├── annual-report-2024.pdf # Latest annual report
└── impact-report-2024.pdf # Impact measurement report
Image Specifications
Logo Requirements
- Format: PNG with transparency
- Size: 200x200px (minimum), SVG preferred
- Variants: Color, white, and dark versions
- Usage: Navigation, footer, social sharing
Hero Images
- Format: WebP preferred, JPG fallback
- Size: 1920x1080px minimum
- Quality: High quality, compressed for web
- Content: Students, supplies, or community impact
Team Photos
- Format: WebP preferred, JPG fallback
- Size: 400x400px minimum
- Style: Professional, consistent lighting
- Requirements: Signed photo releases on file
Impact Photos
- Format: WebP preferred, JPG fallback
- Size: Various sizes for responsive design
- Privacy: No identifiable students without permission
- Alt Text: Descriptive text for accessibility
Content Guidelines
Photography
- Focus on positive, uplifting imagery
- Show diverse representation
- Maintain dignity and respect for all subjects
- Obtain proper releases for all identifiable people
- Follow child protection policies
Document Standards
- Format: PDF preferred for official documents
- Accessibility: Ensure PDFs are accessible
- Size: Optimize for web delivery
- Updates: Keep current versions, archive old ones
File Naming Convention
- Use lowercase letters
- Use hyphens for spaces
- Include version dates for documents
- Be descriptive but concise
Examples:
annual-report-2024.pdfhero-students-supplies.jpgteam-sarah-director.jpglogo-miracles-in-motion.png
Optimization
Images
- Compress images without quality loss
- Use appropriate formats (WebP > JPG > PNG)
- Generate multiple sizes for responsive design
- Include alt text for accessibility
Documents
- Keep file sizes reasonable for download
- Ensure accessibility compliance
- Version control for updates
- Consider bandwidth limitations
Legal Considerations
Photo Releases
- Required for all identifiable people
- Special requirements for minors
- Store releases securely
- Respect usage limitations
Copyright
- Only use images we own or have licensed
- Credit photographers when required
- Respect usage restrictions
- Maintain license documentation
Privacy
- Protect student privacy
- Follow FERPA guidelines
- Blur faces when necessary
- Remove metadata that could identify locations
Missing Asset Placeholders
Until actual assets are available, the website will use:
- CSS-generated logos and icons
- Placeholder images
- Generic backgrounds
- Font-based icons
Getting Assets
To obtain proper assets for this website:
- Logo: Contact the organization's brand manager
- Photos: Coordinate with program staff for approved images
- Documents: Request from legal/administrative team
- Approval: All assets must be approved before use
Updates
This asset list should be updated when:
- New programs launch
- Staff changes occur
- Legal documents are updated
- Annual reports are published
- New partnerships are formed
For questions about assets, contact: web@miraclesinmotion.org