Community Page WIP & Navbar fix #79
Conversation
For the time being, I think we should take down the community page from the website until I can take a pass at the page's design (if we need an entire page for it) and figure out where it should be nested in the navigation. Currently, I think that the card design it is using is kind of confusing for this particular situation. Ana and I were thinking that the page should give the user all of the different means of communications (like it currently is) but displayed different and give the user some context on what mean of communication is used for what. If you visited it right now blindly as someone who has never gotten in contact with the Jupyter community, it is very confusing on where to post questions, suggestions and what each website does for us specifically. Also, fixed the navbar items from overflowing to the next line in the navbar. Once I have the redesign of the community page done, we are going to restructure the nabber to have less items displayed. We are either going to nest items within each other (dropdown style of nav item) or just remove some items that don’t need to be in the navbar
|
@fperez wanted to have at least something on the website displaying different avenues of communication, and I agree it is good to have this... the way it is currently doesn't differ very much from how it used to be on the old IPython website. I think it is better to have the links at least be there so people can pick one of those avenues for communication rather than having nothing at all. I don't object to redesigning it to be clearer, but I would suggest leaving it up for the time being until the redesign is done rather than removing it. |
|
The problem with keeping this is mainly a problem with the navigation bar on the website, we were having the nav items overflow into the next row because there were too many tabs. This redesign will only take me one week and no matter what happens, but nevertheless we still need one less tab in the navbar to fix the hamburger icon from being displayed to the user at larger viewport sizes in the web browser. Currently, at around 1200px in width, we have to condense the navbar into a hamburger menu so it doesnt overflow to the next line in the navbar:
This is at the same size with the fix:
So if we don't take the community tab out, we will either have to nest it as a dropdown to the "Project" tab or take another one of the links in the nav out |
|
The problems is that there are more nav tabs so they can't all be shown On Fri, Feb 26, 2016 at 11:45 AM, Jessica B. Hamrick <
Brian E. Granger |
|
I should emphasize that I am strongly +1 on the community page - but as it On Fri, Feb 26, 2016 at 11:41 AM, Cameron Oelsen notifications@github.com
Brian E. Granger |
|
I was thinking for the redesign something like this:
|
|
That's pretty cool! |
|
Something like this, colors are still off and some adjustments are going to be made, but this is a lot more approachable from a user standpoint:
|
|
I think that design looks great! 👍 I guess if it's only going to be a week or so then it isn't too bad to remove it temporarily. Or maybe we could add a link under the Project page temporarily so the page still exists (just isn't quite as prominent for the time being?) |
|
I love the design, that's great! Many thanks @cameronoelsen! But I don't think we should drop the site as it currently stands, rather we should iterate and improve it. While the hamburger menu is certainly a design & UX regression that we should fix, and the design above is a major improvement, we really need this information on the site. I'd asked for it several times, and one day in discussion, @jhamrick was kind enough to do the work to include it. In general, I think it's much better practice to iterate and improve on existing contributions rather than reverting them because they leave issues behind. It encourages collaboration and participation from the team. Reverting people's work should only be done when it creates a major problem that requires urgent solution. In this case I don't see that as the case, especially as the reversion would itself create another problem (removing necessary information), which I think is actually worse than a minor inconvenience on the UX for a few days. |
Created the section with all of the different community links that are needed. Still needs some small formatting changes within but the main content is now on the page and responsive
Polished design up, changed community block to community section, as well as added a break to the GitHub section so that all of the outward links would have the same height
Small changes that I noticed could be added while I was making the community page. Just added some CSS to fix current bugs (from not having the states declared) as well as adding a transition between the hover state and the normal state
-Changed logos for each resource with grayscale versions. Not as in your face with the gray. -Changed logos for both the mailing lists -Centered elements within each community-section -Changed font size of the navbar down by 1px at 992px width so that it would fit when scaled down -Added transitions to some elements (orange buttons across site, navbar transitions for gray to white as well as white to white)
-Went back and forth with Carol and Jon on each community section’s description. -Changed the ordering of the elements on the page to put the most general community outlets first and as you go down it gets more specific
|
Here is the updated look of the community section! I think we should be pretty close to push this to the site. Just need to figure out how to nest the community tab under the project nav item. Were you able to find out how @Carreau? Also, how does the ordering of the community outlets look to everyone along with the descriptions of each source? Carol, Jon and I thought the most general community outlets should be on the top (email lists/google groups) and then as you go down the page, the outlets get more specific to developers. Community page at 1200px
Community page at 992px
Community page on mobile devices
|
|
+1, that looks great @cameronoelsen, thanks! |
|
Some footer issues when the page browser window is really big:
|
Avoid Ids and use advance css selector. This allow to redactor the order sections without to modify the CSS>
|
I've issued a PR to fix a few things on the PR: |
A few more idiomatic way of writing css.
|
I've made a few (minor) fixes. This is strictly improving the current state of the website, so if there is no objection, I'll merge soon-ish. |
|
@Carreau Code looks fine. |
Community Page WIP & Navbar fix
|
👍 |
|
@Carreau Were you able to figure out how to nest the community page in the project section statically while the others are generated, I was waiting on that before we wanted to merge and looks like the letter-spacing was changed for the desktop nav bar and is now inconsistent with the mobile site version. We are also now having the problem of the navbar overflowing onto the header section that we had before we did the push for the hamburger icon. |
For the time being, I think we should take down the community page from
the website until I can take a pass at the page's design (if we need an
entire page for it) and figure out where it should be nested in the
navigation. Currently, I think that the card design it is using is kind
of confusing for this particular situation.
Ana and I were thinking that the page should give the user all of the
different means of communications (like it currently is) but displayed
different and give the user some context on what mean of communication
is used for what. If you visited it right now blindly as someone who
has never gotten in contact with the Jupyter community, it is very
confusing on where to post questions, suggestions and what each website
does for us specifically.
Also, fixed the navbar items from overflowing to the next line in the
navbar. Once I have the redesign of the community page done, we are
going to restructure the nabber to have less items displayed. We are
either going to nest items within each other (dropdown style of nav
item) or just remove some items that don’t need to be in the navbar