[Markdown]

Collaboration: Website

Hubzilla Websites In Progress

Right now we operate Hubzilla.org, but in the future we may operate other websites, or co-manage other websites.

Website Content

Documentation on the websites are supplemental to the Built-in Help System and contain information about our software, the association, resources, and other information our community would find useful.

It may contain materials not suitable for the Help system, such as promotional materials, association member resources, information for various Hubzilla teams, and obscure troubleshooting situations most people won't encounter. It also may contain "How-to" articles and videos that present similar information as the Help system, but in a different format.

Additional Goals

In addition to providing documentation, one of our goals is to showcase what the Hubzilla software is capable of. This includes using various tools Hubzilla offers, such as forums, webpages, menus, blocks, wikis, calendars, OpenWebAuth federated single sign on, access control, etc. to build a website that is easy to navigate and use.

Specifically we want to showcase that Hubzilla can be used as a collaboration tool, not just a social media presence.

Current Initiate - Website Redesign

We are currently in the process of redesigning the Hubzilla webite.

Some of the proposed pages that we will be creating, that are seperate from the built-in Help system include:

Redesigned Home Page
Hubzilla Features
Hubzilla Use Cases
Documentation Home Page (directs people to the help system, videos, articles, etc.)
Association Business (articles of association, mission statement, how to join, etc.)
Code of Conduct, Community Rules, etc.
List of Compatible Themes
Addons, what they do, and how to configure them.
How Contribute to the Project (developers, writers, membership, patrons, etc.)
Bootstrap 5 Compatibility (let people know they can use Bootstrap 5 in Hubzilla)
How We Built This (pointing to pages on Hubzilla.org and explaining how we did it)

Currently Being Worked On

We are in the process of working on several pages.

Published by Incomplete

Repos - Should we put third-party repos for themes?
Themes - We need to add third-party themes.
Events - Needs events.

Not Published Yet

Addons
Use Cases
Developer's Guide
Forums
Technology

Possible Strutures of the Website

A possible structure is:

Landing page
|
├–– News (this links to /channel/info)
|
├–– Community
|      |
|      ├–– Documentation (=collaborative wiki, easily  updateable by the community)
|      |     |
|      |     ├–– Hubzilla Features
|      |     |
|      |     ├–– Hubzilla Use Cases
|      |     |
|      |     ├–– How to start as a User
|      |     |
|      |     ├–– How to start as an Admin
|      |     |
|      |     ├–– How to contribute as a Developer
|      |     |
|      |     ├–– Bootstrap 5 Compatibility
|      |     |
|      |     └–– How We Built Hubzilla.org
|      |
|      └–– Forums (-> they are moderated by a moderation team)
|            |
|            ├–– Users Forum
|            |
|            ├–– Admins Forum
|            |
|            ├–– Developers Forum
|            |
|            └–– Documentation Forum
|      
└–– Association (->this content is maintained by the board of directors)
       |
       ├–– Articles
       |
       ├–– Membership
       |
       ├–– Become a patron or associate
       |
       └–– Contact

Using that for inspiration, here is another possible structure of the web pages:

Home (Landing Page)
- Getting Started (landing page)
- How to Get Involved
- How to find a Server to Join
- Mentions
- Association / Non-profit
- MIT License / Open Source
- Overview of Software (privacy-focused, fediverse server, cms, etc.)
- Extendable
News (info channel)
Software (Software landing page)
- Hubzilla Features
- Hubzilla Use Cases
- Extending Hubzilla
  - Addons
  - Themes
  - Widgets
Documentation (Documentation landing page)
- What is the Fediverse? (text plus embed Framagit's video)
- Help System (/help)
- How to Start as a User
- How to start as an Admin
- How to contribute as a Developer
- Bootstrap 5 Example Code
- Integrations & Compatibility (ActivityPub, BBCode, Bootstrap 5, Markdown, Diaspora, etc.)
- How We Built Hubzilla.org
- (also links to pages under Home above)
Community (Community landing page)
- Users Forum
- Admins Forum
- Developers Forum
- Documentation Forum
- (crosslinked with association)
Members (Association Forum)
- (links to various subpages and wikis)
- Association (Association landing page)
  - Purpose & Mission
  - Membership
  - Become a Patron of Sponsor
  - Articles of Association
  - Contact
  - (crosslinked with community)
Support (Support Forum)
- (crosslinks added to relevant docs and pages)

Note: This structure purposefully uses the "multiple ways to get there" methodology. That means that although the software information has its own section, it is interlinked with the documentation, and vice versa.

Reasoning:

We have limited space in the top level menu.
Community and Association seem redundant from an outsiders perspective.
People will be interested in joining the community, and we can tell them about the association once they are there.
Community and Association still have their own sections, but use the Community menu link to get to both.
The Members link will also have links to the Association pages, even if they are not a member.
People who use the website frequently will want a quick way to get to the Association Members Area.
People are interested in what the software can do before they need documentation on how to use it.
Where possible, we should interlink with the Help Docs.

This is just a proposed list. We are currently discussing the exact structure of the redesigned websites.

Colors

Sections

Different background colors are used to tell people that they are on a difference section of the website.

Info Channel = light gray steel blue = rgba(221,231,234,1)
Association Channel (Members Only) = light gray green = rgba(221,234,231,1)
Documentation Channel = light medium gray = rgba(210,209,216,1)
Support Channel = light gray purple = rgba(225,221,234,1)
Development Channel- defaults to dark mode.
Board Channel = light gray

Background Colors

E2DDEA
rgba(174,155,208,1)
rgba(134,99,198,1)
rgba(67,71,138,1)
rgba(223,218,241,1)
rgba(222,218,241,1)
rgba(220,218,241,1)
rgba(211,224,255,1) blue
rgba(221,231,234,1) - cold ligh blue

Conversations

Relevant conversations include:

There may be more relevant conversations in the Documentation Forum.