the new oVirt website: live preview!

Hi everyone! Check out the new site here: http://mediawiki-garrett.rhcloud.com/ I've turned the Inkscape mockups into a real, working website, powered by MediaWiki. ## Background ## During last week's IRC meeting, we talked about the possibility of using MediaWiki as community CMS. I spent this week making a custom skin that both works with some simple layout as well as standard MediaWiki pages. It's also worth noting that it works on all screen resolutions and browser widths — the whole design is “responsive” which means it's optimized for mobile phones too, which is perfect for looking up documentation or telling people about oVirt at conferences and while traveling. ## Discussion ## I would like to propose that we discuss the new website design & implementation during this week's IRC meeting, especially since there's now even more to see. ## Next steps ## The website theme (including the signed-in state) is nearly done and looks amazingly similar to the mockups[1]. We have some content for the first few pages. There's still a bit more to do before making it live, however. [1] mockups: http://people.redhat.com/glesage/oVirt/website/mockup-1/ The next steps are: 1. Fix any bugs found with the MediaWiki skin / theme 2. Work on content for the remaining pages 3. Map links on the main pages to existing content 4. Write additional content where necessary (if there's no page yet) 5. Upgrade MediaWiki on oVirt 6. Make sure the new pages are on the current wiki 7. Install the skin and a few configuration settings 8. Flip the switch (immediately after step 7), and we have a new site! ## One more thing... ## It wouldn't be a great demo without letting you all testdrive the wiki-ness of the site, right? I've created a test user for everyone to quickly sign in and kick the tires on the wiki instance. User: test Pass: demodemo You can also create your own account, if you'd like to. Please note that this is a temporary site for development purposes, and is not intended as a production website for oVirt. That said, it's a good place to play around. You'll only see the wiki-ish stuff when you're signed in, and I worked hard to put them at the top of the page in an orderly fashion. Click on the items at the top to see menus with all the standard MediaWiki features, except grouped. Even the header is a dropdown (to see the different modes on the page). Since editing is key to any wiki, I made the edit action a stand-alone button at the top. Also, when you're logged in, you'll notice that "Home", "Download", and "Community" are locked down so that only those in the administrator group can edit. Feel free to edit other pages or make new ones. In addition, you might see some weirdness when using the site, as I'm not 100% done developing it. It's fairly stable, but it still is an alpha preview. I may alter things further or turn on some debugging output from time to time. Generally, though, I'll try to keep it in a working state. Just ping me on IRC if you have any concerns. ## In closing ## I'd like to thank the team for challenging me during last week's meeting about using MediaWiki in this wiki-as-a-website concept. It's been a fun and interesting week jumping back into PHP after so long. I like the results, and I hope you do too! = = = I'm looking forward to your feedback, both here on the list, and also in the IRC meeting! Garrett

Looks great! The eye does look for a bit of separation between columns though, but it might just be me :) ----- Original Message -----
From: "Garrett LeSage" <garrett@redhat.com> To: "oVirt Arch" <arch@ovirt.org>, board@ovirt.org, infra@ovirt.org Sent: Wednesday, 19 September, 2012 10:56:46 AM Subject: the new oVirt website: live preview!
Hi everyone!
Check out the new site here: http://mediawiki-garrett.rhcloud.com/
I've turned the Inkscape mockups into a real, working website, powered by MediaWiki.
## Background ##
During last week's IRC meeting, we talked about the possibility of using MediaWiki as community CMS. I spent this week making a custom skin that both works with some simple layout as well as standard MediaWiki pages.
It's also worth noting that it works on all screen resolutions and browser widths — the whole design is “responsive” which means it's optimized for mobile phones too, which is perfect for looking up documentation or telling people about oVirt at conferences and while traveling.
## Discussion ##
I would like to propose that we discuss the new website design & implementation during this week's IRC meeting, especially since there's now even more to see.
## Next steps ##
The website theme (including the signed-in state) is nearly done and looks amazingly similar to the mockups[1]. We have some content for the first few pages. There's still a bit more to do before making it live, however.
[1] mockups: http://people.redhat.com/glesage/oVirt/website/mockup-1/
The next steps are:
1. Fix any bugs found with the MediaWiki skin / theme 2. Work on content for the remaining pages 3. Map links on the main pages to existing content 4. Write additional content where necessary (if there's no page yet) 5. Upgrade MediaWiki on oVirt 6. Make sure the new pages are on the current wiki 7. Install the skin and a few configuration settings 8. Flip the switch (immediately after step 7), and we have a new site!
## One more thing... ##
It wouldn't be a great demo without letting you all testdrive the wiki-ness of the site, right? I've created a test user for everyone to quickly sign in and kick the tires on the wiki instance.
User: test Pass: demodemo
You can also create your own account, if you'd like to. Please note that this is a temporary site for development purposes, and is not intended as a production website for oVirt. That said, it's a good place to play around.
You'll only see the wiki-ish stuff when you're signed in, and I worked hard to put them at the top of the page in an orderly fashion. Click on the items at the top to see menus with all the standard MediaWiki features, except grouped. Even the header is a dropdown (to see the different modes on the page). Since editing is key to any wiki, I made the edit action a stand-alone button at the top.
Also, when you're logged in, you'll notice that "Home", "Download", and "Community" are locked down so that only those in the administrator group can edit. Feel free to edit other pages or make new ones.
In addition, you might see some weirdness when using the site, as I'm not 100% done developing it. It's fairly stable, but it still is an alpha preview. I may alter things further or turn on some debugging output from time to time. Generally, though, I'll try to keep it in a working state. Just ping me on IRC if you have any concerns.
## In closing ##
I'd like to thank the team for challenging me during last week's meeting about using MediaWiki in this wiki-as-a-website concept. It's been a fun and interesting week jumping back into PHP after so long. I like the results, and I hope you do too!
= = =
I'm looking forward to your feedback, both here on the list, and also in the IRC meeting!
Garrett _______________________________________________ Infra mailing list Infra@ovirt.org http://lists.ovirt.org/mailman/listinfo/infra
-- Regards, Dan Yasny Red Hat Israel +972 9769 2280

On Wed, Sep 19, 2012 at 09:56:46AM +0200, Garrett LeSage wrote:
Check out the new site here: http://mediawiki-garrett.rhcloud.com/
I've turned the Inkscape mockups into a real, working website, powered by MediaWiki.
Awesome job to base it on mediawiki. I love having a single place to edit the site, guarded by permissions for stuff like the frontpage. How easy to maintain is it when we want to upgrade mediawiki? Haven't checked it in-depth yet but I'm wondering if the search should be promoted to the top navigation. Also would like to a see a difference in existing and non-existing links.

On Wed, Sep 19, 2012 at 03:38:26PM +0200, Ewoud Kohl van Wijngaarden wrote:
On Wed, Sep 19, 2012 at 09:56:46AM +0200, Garrett LeSage wrote:
Check out the new site here: http://mediawiki-garrett.rhcloud.com/
I've turned the Inkscape mockups into a real, working website, powered by MediaWiki.
Awesome job to base it on mediawiki. I love having a single place to edit the site, guarded by permissions for stuff like the frontpage. How easy to maintain is it when we want to upgrade mediawiki?
Looks nice indeed ! A bit of feedback too:
Haven't checked it in-depth yet but I'm wondering if the search should be promoted to the top navigation.
Seconded, even if the new site makes a better use of today's large screens, the search is currently always hidden until one scrolls down The vertical spacing between 2 paragraphs or bulleted items looks a tad bit too large to my eye compared to the spacing between lines. The top page and the Download page don't even tell what licence is applicable, IMHO that crucial information should be presented to the user between the time it hits the home page and the time he's told how to install it on Fedora 17. thanks ! Daniel -- Daniel Veillard | libxml Gnome XML XSLT toolkit http://xmlsoft.org/ daniel@veillard.com | Rpmfind RPM search engine http://rpmfind.net/ http://veillard.com/ | virtualization library http://libvirt.org/

On 09/20/2012 08:17 AM, Daniel Veillard wrote:
Looks nice indeed !
Thanks!
Seconded, even if the new site makes a better use of today's large screens, the search is currently always hidden until one scrolls down
This sentence gives me an idea about how to possibly incorporate search. I'll have to play around with it a bit, but I might have something to show pretty soon.
The vertical spacing between 2 paragraphs or bulleted items looks a tad bit too large to my eye compared to the spacing between lines.
I adjusted the spacing so that the line rhythm was maintained on the page. It's especially needed on pages like: http://mediawiki-garrett.rhcloud.com/OVirt_3.1_release_notes (Which is a copy/paste of the wiki text from the official oVirt wiki.) I will probably tweak the fonts and text a bit further, especially when we have another reskinned instance of MediaWiki (containing all of the content from wiki.ovirt.org) up and running.
The top page and the Download page don't even tell what licence is applicable, IMHO that crucial information should be presented to the user between the time it hits the home page and the time he's told how to install it on Fedora 17.
That's a great point. Is it enough to mention "ASL2.0" in the footer and link to a licensing page, like the current oVirt.org website does? Or should we say more? Thanks for the feedback! Garrett

Hi, On 09/20/2012 02:27 PM, Garrett LeSage wrote:
On 09/20/2012 08:17 AM, Daniel Veillard wrote:
The top page and the Download page don't even tell what licence is applicable, IMHO that crucial information should be presented to the user between the time it hits the home page and the time he's told how to install it on Fedora 17.
That's a great point.
Is it enough to mention "ASL2.0" in the footer and link to a licensing page, like the current oVirt.org website does? Or should we say more?
IMHO, the license matters at earliest when you're downloading (so not on the front page), and probably only when you're making changes (the "Developer" or "Contributor" pages). The important thing is to let people know that the product is open source - that they are free to modify and redistribute it. The actual license only matters at the point where you want to do that. Cheers, Dave. -- Dave Neary Community Action and Impact Open Source and Standards, Red Hat Ph: +33 9 50 71 55 62 / Cell: +33 6 77 01 92 13

On Thu, Sep 20, 2012 at 02:57:07PM +0200, Dave Neary wrote:
Hi,
On 09/20/2012 02:27 PM, Garrett LeSage wrote:
On 09/20/2012 08:17 AM, Daniel Veillard wrote:
The top page and the Download page don't even tell what licence is applicable, IMHO that crucial information should be presented to the user between the time it hits the home page and the time he's told how to install it on Fedora 17.
That's a great point.
Is it enough to mention "ASL2.0" in the footer and link to a licensing page, like the current oVirt.org website does? Or should we say more?
IMHO, the license matters at earliest when you're downloading (so not on the front page), and probably only when you're making changes (the "Developer" or "Contributor" pages). The important thing is to
I think you're optimistic there. Lot of people won't download stuff if they can't tell the Licence upfront, not just me :-) Daniel -- Daniel Veillard | libxml Gnome XML XSLT toolkit http://xmlsoft.org/ daniel@veillard.com | Rpmfind RPM search engine http://rpmfind.net/ http://veillard.com/ | virtualization library http://libvirt.org/

Hi, On 09/20/2012 04:06 PM, Daniel Veillard wrote:
On Thu, Sep 20, 2012 at 02:57:07PM +0200, Dave Neary wrote:
IMHO, the license matters at earliest when you're downloading (so not on the front page), and probably only when you're making changes (the "Developer" or "Contributor" pages). The important thing is to
I think you're optimistic there. Lot of people won't download stuff if they can't tell the Licence upfront, not just me :-)
Like I said, I think that what is important is to say that this is open source, that you can use, modify and resistribute it - and then put the license information/legalese in the download page or elsewhere. Cheers, Dave. -- Dave Neary Community Action and Impact Open Source and Standards, Red Hat Ph: +33 9 50 71 55 62 / Cell: +33 6 77 01 92 13

On Thu, Sep 20, 2012 at 02:27:28PM +0200, Garrett LeSage wrote:
On 09/20/2012 08:17 AM, Daniel Veillard wrote:
The vertical spacing between 2 paragraphs or bulleted items looks a tad bit too large to my eye compared to the spacing between lines.
I adjusted the spacing so that the line rhythm was maintained on the page. It's especially needed on pages like:
http://mediawiki-garrett.rhcloud.com/OVirt_3.1_release_notes (Which is a copy/paste of the wiki text from the official oVirt wiki.)
I will probably tweak the fonts and text a bit further, especially when we have another reskinned instance of MediaWiki (containing all of the content from wiki.ovirt.org) up and running.
okay, well it's use one person feedback and i don't claim any UI sense :-) but again the space left between the last bullet of Installer section and the title of the Tools session looks quite large to my eye (I can put a finger between the bottom of the '(' and the top of the T here), vertical space is scarce especially on new screens :-\
The top page and the Download page don't even tell what licence is applicable, IMHO that crucial information should be presented to the user between the time it hits the home page and the time he's told how to install it on Fedora 17.
That's a great point.
Is it enough to mention "ASL2.0" in the footer and link to a licensing page, like the current oVirt.org website does? Or should we say more?
Saying it's OpenSource under "ASL2.0" with a link is sufficient sure ! thanks Garrett :-) Daniel -- Daniel Veillard | libxml Gnome XML XSLT toolkit http://xmlsoft.org/ daniel@veillard.com | Rpmfind RPM search engine http://rpmfind.net/ http://veillard.com/ | virtualization library http://libvirt.org/

On Thu, 2012-09-20 at 21:30 +0800, Daniel Veillard wrote:
On Thu, Sep 20, 2012 at 02:27:28PM +0200, Garrett LeSage wrote:
On 09/20/2012 08:17 AM, Daniel Veillard wrote:
The vertical spacing between 2 paragraphs or bulleted items looks a tad bit too large to my eye compared to the spacing between lines.
I adjusted the spacing so that the line rhythm was maintained on the page. It's especially needed on pages like:
http://mediawiki-garrett.rhcloud.com/OVirt_3.1_release_notes (Which is a copy/paste of the wiki text from the official oVirt wiki.)
I will probably tweak the fonts and text a bit further, especially when we have another reskinned instance of MediaWiki (containing all of the content from wiki.ovirt.org) up and running.
okay, well it's use one person feedback and i don't claim any UI sense :-) but again the space left between the last bullet of Installer section and the title of the Tools session looks quite large to my eye (I can put a finger between the bottom of the '(' and the top of the T here), vertical space is scarce especially on new screens :-\
The top page and the Download page don't even tell what licence is applicable, IMHO that crucial information should be presented to the user between the time it hits the home page and the time he's told how to install it on Fedora 17.
That's a great point.
Is it enough to mention "ASL2.0" in the footer and link to a licensing page, like the current oVirt.org website does? Or should we say more?
Saying it's OpenSource under "ASL2.0" with a link is sufficient sure !
thanks Garrett :-)
Daniel
See other part of this thread -- we have projects in oVirt that are *not* ASL 2.0. ovirt-node is GPL2 and content on the site and wiki are something else as well, iirc. Mike

On Thu, Sep 20, 2012 at 10:50:42AM -0400, Mike Burns wrote:
On Thu, 2012-09-20 at 21:30 +0800, Daniel Veillard wrote:
Is it enough to mention "ASL2.0" in the footer and link to a licensing page, like the current oVirt.org website does? Or should we say more?
Saying it's OpenSource under "ASL2.0" with a link is sufficient sure !
thanks Garrett :-)
Daniel
See other part of this thread -- we have projects in oVirt that are *not* ASL 2.0. ovirt-node is GPL2 and content on the site and wiki are something else as well, iirc.
I wasn't arguing for a licence, just arguing for it to be clarified before suggesting downloading the code. Daniel -- Daniel Veillard | libxml Gnome XML XSLT toolkit http://xmlsoft.org/ daniel@veillard.com | Rpmfind RPM search engine http://rpmfind.net/ http://veillard.com/ | virtualization library http://libvirt.org/

On 09/19/2012 03:38 PM, Ewoud Kohl van Wijngaarden wrote:
Awesome job to base it on mediawiki.
Thanks!
I love having a single place to edit the site, guarded by permissions for stuff like the frontpage.
Yeah, I think it'll make a much more cohesive site, and would make it easier for everyone to edit everything (provided they have permissions to do so — but I'm only suggesting the main pages be locked down to a select group).
How easy to maintain is it when we want to upgrade mediawiki?
Two of my main goals when making this were to make the site: 1) editable by all 2) easily maintainable for the oVirt infrastructure team A complimentary goal was to make the skin: 3) reusable by others I met all three above goals by basing it on MediaWiki's default theme "Vector" (although it has a lot of changes) and also on Twitter's Bootstrap, so that we would benefit from updates from both projects, and we can use formatting from each. (Basically: Near-instant documentation and support for updates!) Since I intentionally made the base skin reusable, it *could* easily be picked up by other sites. (The oVirt theme is just a little layer on top of the MediaWiki skin that simply changes the fonts and colors and adds a little bit of oVirt style elsewhere in the site too.) The more popular it is elsewhere, the more bugfixes, improvements, and quick updates to new MediaWiki versions we'll get.
Haven't checked it in-depth yet but I'm wondering if the search should be promoted to the top navigation.
I've gotten a lot of feedback about that. I'm going to consider ways to fit it in. It's probably useful to point out that oVirt.org, right now, doesn't have a working search (try searching for "download", "git", etc.) — yet it's one of the most prominent elements. The theme, as-is, is a huge step in the right direction, as search actually *works*. (The results still need to be a bit beautified, but that's on the todo.) Also, I strongly believe search shouldn't be *needed* on a site... but it's good to have, however. People should be able to find the content they're looking for without having to resort to a search. On a website, search should secondary to navigation and hyperlinked content, used when all else fails.
Also would like to a see a difference in existing and non-existing links.
It's actually there in the CSS, but I commented it out for now, as most all of the links are non-existing. Here's how it works: * When you're signed in, right now the links turn orange. I could make them red (like the default) or underlined or strikethrough — or even blink (if we really wanted to). I could also display icons or text before or afterward too. * When you're *not* signed in, I will have it so that the link doesn't change color or change the mouse when it is hovered. (Basically: it looks like the text on the rest of the page.) Naturally, since we don't have much content on this website preview right now, and I wanted to display what it _would_ look like on the actual site, I decided to disable this feature for the time being. -=-=- Thanks for the feedback! Garrett

On 09/19/2012 10:56 AM, Garrett LeSage wrote:
Hi everyone!
Check out the new site here: http://mediawiki-garrett.rhcloud.com/
I've turned the Inkscape mockups into a real, working website, powered by MediaWiki.
## Background ##
During last week's IRC meeting, we talked about the possibility of using MediaWiki as community CMS. I spent this week making a custom skin that both works with some simple layout as well as standard MediaWiki pages.
It's also worth noting that it works on all screen resolutions and browser widths — the whole design is “responsive” which means it's optimized for mobile phones too, which is perfect for looking up documentation or telling people about oVirt at conferences and while traveling.
## Discussion ##
I would like to propose that we discuss the new website design & implementation during this week's IRC meeting, especially since there's now even more to see.
## Next steps ##
The website theme (including the signed-in state) is nearly done and looks amazingly similar to the mockups[1]. We have some content for the first few pages. There's still a bit more to do before making it live, however.
[1] mockups: http://people.redhat.com/glesage/oVirt/website/mockup-1/
The next steps are:
1. Fix any bugs found with the MediaWiki skin / theme 2. Work on content for the remaining pages 3. Map links on the main pages to existing content 4. Write additional content where necessary (if there's no page yet) 5. Upgrade MediaWiki on oVirt 6. Make sure the new pages are on the current wiki 7. Install the skin and a few configuration settings 8. Flip the switch (immediately after step 7), and we have a new site!
## One more thing... ##
It wouldn't be a great demo without letting you all testdrive the wiki-ness of the site, right? I've created a test user for everyone to quickly sign in and kick the tires on the wiki instance.
User: test Pass: demodemo
You can also create your own account, if you'd like to. Please note that this is a temporary site for development purposes, and is not intended as a production website for oVirt. That said, it's a good place to play around.
You'll only see the wiki-ish stuff when you're signed in, and I worked hard to put them at the top of the page in an orderly fashion. Click on the items at the top to see menus with all the standard MediaWiki features, except grouped. Even the header is a dropdown (to see the different modes on the page). Since editing is key to any wiki, I made the edit action a stand-alone button at the top.
Also, when you're logged in, you'll notice that "Home", "Download", and "Community" are locked down so that only those in the administrator group can edit. Feel free to edit other pages or make new ones.
In addition, you might see some weirdness when using the site, as I'm not 100% done developing it. It's fairly stable, but it still is an alpha preview. I may alter things further or turn on some debugging output from time to time. Generally, though, I'll try to keep it in a working state. Just ping me on IRC if you have any concerns.
## In closing ##
I'd like to thank the team for challenging me during last week's meeting about using MediaWiki in this wiki-as-a-website concept. It's been a fun and interesting week jumping back into PHP after so long. I like the results, and I hope you do too!
= = =
I'm looking forward to your feedback, both here on the list, and also in the IRC meeting!
very nice! small question - would the twitter feed work with mediawiki? Thanks, Itamar

On 09/20/2012 03:40 PM, Itamar Heim wrote:
very nice!
Thanks!
small question - would the twitter feed work with mediawiki?
Sure. We'll definitely make it work. We will most likely use a Twitter extension for MediaWiki: http://www.mediawiki.org/wiki/Category:Twitter_extensions And since we're on the topic of extensions, I know a few have been asked about before, notably YouTube and an events calendar. YouTube: http://www.mediawiki.org/wiki/Category:YouTube_extensions Calendaring/events: http://www.mediawiki.org/wiki/Extension:Calendar http://www.mediawiki.org/wiki/Category:Calendar_extensions (We could simply use the wiki itself to have text about the events too. We don't have to make it any more complex than it has to be.) Garrett
participants (7)
-
Dan Yasny
-
Daniel Veillard
-
Dave Neary
-
Ewoud Kohl van Wijngaarden
-
Garrett LeSage
-
Itamar Heim
-
Mike Burns