Python.org Redesign Preview(preview.python.org)
preview.python.org
Python.org Redesign Preview
http://preview.python.org/
164 comments
The `>>>` added to links with the `:before` selector adds a right margin that becomes an unclickable area between the decoration and the actual link. Using padding instead of margin will fix that.
I really like the design, personally.
Well done!
Curious about the heading font used, FluxRegular.woff: does anybody know the source of the font, and the licensing? :)
Curious about the heading font used, FluxRegular.woff: does anybody know the source of the font, and the licensing? :)
I may have missed it, but I didn't find a link to the wiki. I expected to find it in either the community or doc tab.
I prefer the previous version tbh.
Okay who else hates flyout menus like these?
When they don't implement the magical amazon triangle, yes
http://bjk5.com/post/44698559168/breaking-down-amazons-mega-... (discussed on HN several times previously)
http://bjk5.com/post/44698559168/breaking-down-amazons-mega-... (discussed on HN several times previously)
Looks and feels like ruby-lang.org
Just saying.
Just saying.
Looks great! Go for it. Then go talk to the PHP.net team about their disastrously ugly site, too.
http://prototype.php.net/ feel free to contribute.
Huge improvement, that really looks great. One cool feature you could look into is an interactive terminal like http://www.codecademy.com/ has on their homepage.
Check here for an overview of the site redesign by the person who made it happen: http://jessenoller.com/blog/2012/11/28/the-great-python-org-...
Great stuff.
Great stuff.
Great work!
Some thoughts from a purely personal perspective, take them as you will:
- I often refer non-programmers to python.org when they ask what that "Python" thing I do all day is. If this is a significant portion of your traffic, I might move the "Python is a programming language..." bit higher up the page.
- "Integrate systems more effectively" doesn't mean much to me, but if the landing page is a tool for devs to convince their managers to let them use the language, could make sense.
- I don't love calling the list 'l' given that many beginners wind up here. It can look like a "1" to those not used to monospace, and is confusing. Come to think of it, the whole beginning example would be very obtuse to anyone not familiar with programming at all: one of the things I love about Python is that it's easy to introduce to a total beginner, with something like "it's like learning French or Italian, not a bunch of random symbols".
- I personally love the way you do the main dropdowns.
- The topbar is nice too, but a bit less noticeable to me than maybe it should be. I think some tooltip-provided explanation (or similar) of PyPi, saying "Package Index", might help those new to Python but aware of what a package index is. This might be unnecessary though.
- The location (and naming) of the "Socialize" link doesn't make much sense to me. What does it have to do with Search? Also unsure why there's the font +/- link there; do you often hear that browser settings are insufficient?
I'm exited to see what I think is a terrific update to the beloved Python homepage. Best of luck!
- I often refer non-programmers to python.org when they ask what that "Python" thing I do all day is. If this is a significant portion of your traffic, I might move the "Python is a programming language..." bit higher up the page.
- "Integrate systems more effectively" doesn't mean much to me, but if the landing page is a tool for devs to convince their managers to let them use the language, could make sense.
- I don't love calling the list 'l' given that many beginners wind up here. It can look like a "1" to those not used to monospace, and is confusing. Come to think of it, the whole beginning example would be very obtuse to anyone not familiar with programming at all: one of the things I love about Python is that it's easy to introduce to a total beginner, with something like "it's like learning French or Italian, not a bunch of random symbols".
- I personally love the way you do the main dropdowns.
- The topbar is nice too, but a bit less noticeable to me than maybe it should be. I think some tooltip-provided explanation (or similar) of PyPi, saying "Package Index", might help those new to Python but aware of what a package index is. This might be unnecessary though.
- The location (and naming) of the "Socialize" link doesn't make much sense to me. What does it have to do with Search? Also unsure why there's the font +/- link there; do you often hear that browser settings are insufficient?
I'm exited to see what I think is a terrific update to the beloved Python homepage. Best of luck!
"I might move the "Python is a programming language..." bit higher up the page."
If you look at the site with a text browser like lynx then this is even more important. Lots of menus and other things that assume you know what's going on, then finally on the next page break or two an explanation. Make that all but topmost.
(And y'all ought to view your sites with a text browser once in awhile, it will give you a rough idea of the experience of people using browsers for visual and other impairments.)
If you look at the site with a text browser like lynx then this is even more important. Lots of menus and other things that assume you know what's going on, then finally on the next page break or two an explanation. Make that all but topmost.
(And y'all ought to view your sites with a text browser once in awhile, it will give you a rough idea of the experience of people using browsers for visual and other impairments.)
If you're using lynx for browsing, you already know what Python is.
As I said, it gives you an idea of what an impaired user might see.
I certainly like the frontpage look, a lot more up to date than the current site. I tend to prefer less weight in the header on inner pages. While it is nice and prominent, it does push the stuff that returning users will be interested in further down the page. I really liked the popups on the main nav.
The style reminds me of the jQuery site redesign, but python.org looks better.
Fucking sexy, only immediate criticism is the PSF link looks disabled because it's the only unsaturated label color. It feels very "coming-soon" and not very "click on me!"
Awesome. How about having a different landing page for non-devs and devs like drupal.com vs drupal.org?
Serif font makes the l look like a 1 in the code.
@jacobian - hope you see this - it appears that you were hellbanned 41 minutes ago. I have no idea why - don't shoot the messenger!
I loaded the page in other browsers and saw my comment, but now there are like 20 others saying the same thing but my comment id is the predecessor to the one that's at the top (so i was first ;] ). what symptom tells you I was hellbanned?
@bobx11 - you weren't hellbanned, @jacobian was. But no one can reply to a comment from a hellbanned user, so the custom is to reply to a parent comment in the hope that the hellbanned user may see it.
If you had been hellbanned yourself, then you would see your own comments, but other users wouldn't see them unless they enabled "showdead" in their HN settings. And non-logged-in visitors would never see them. So viewing an HN page you've commented on from an incognito window is a good way to check that.
If you had been hellbanned yourself, then you would see your own comments, but other users wouldn't see them unless they enabled "showdead" in their HN settings. And non-logged-in visitors would never see them. So viewing an HN page you've commented on from an incognito window is a good way to check that.
Looks great, now make the Python example actually interactive using a Javascript backend.
[deleted]
Great idea.
using 'l' as a variable name seems like bad practice… it looks like a 1!
One of my biggest bugbears of learning from the official docs was trudging through python.org. Hopefully this addresses that.
Loving the redesign - clean, functional and pretty as well.
Loving the redesign - clean, functional and pretty as well.
You had problems learning because you didn't like how Python's web site was styled?
That wouldn't surprise me at all. The visual design of a website can engage a user or drive a user away. The current python.org just presents the user with an unfriendly wall of text which make it difficult to get one's bearings.
This is especially important for accommodating users with conditions like ADHD.
This is especially important for accommodating users with conditions like ADHD.
I like what i see ! Looks a tad bit inspired from earlier version of tryruby.org, i hope they add the functionality .
I like everything except for the search bar: The search icon is off, and the button is too high.
Also the «socialize» dropdown on that bar doesn't look that good.
Also the «socialize» dropdown on that bar doesn't look that good.
Guillemets are not used in English. Use “” instead.
It looks OK but if one is going to hire top notch agencies and spend a decent bit of money, I don't see why the design should look this dated and cluttered. Too many navbars and buttons everywhere and tons of gradients and rounded corners are emphasizing almost everything on the page. Isn't this kind of gradient-heavy stuff dated to 5-10 years ago?
I suggest to add a slice example in the first page since it quickly makes obvious how Python can help you in writing less code.
It would be interesting to do A/B testing with different code snippets.
It would be interesting to do A/B testing with different code snippets.
Looks nice, but my first thought when I looked at the code example:
1 >>> l = ['spam', 'ham', 314, 23]
It's worse than that because the PEP 8 sytle guide specifically mentions to avoid using l as a name!
http://www.python.org/dev/peps/pep-0008/#names-to-avoid
http://www.python.org/dev/peps/pep-0008/#names-to-avoid
Yeah, that example is a placeholder; we plan on replacing it with something awesome. Thanks!
Replace it with a try-python style interactive shell!
+1 for an interactive shell.
Something like http://repl.it/languages/Python :)
Something like http://repl.it/languages/Python :)
Cool!
I got as far as:
What are the dangers of dropping a python interpreter on a site, what are good guidelines to secure it?
I got as far as:
import os
for filename in os.walk('/'):
print(filename)
What are the dangers of dropping a python interpreter on a site, what are good guidelines to secure it?
+1 to this. I was drawn to Code Academy because I could immediately start playing around with code on the home page. (At least it used to be like that. Not sure anymore.)
This.
The problem is using Courier, not the example. Try 'Monaco, Consolas, mono'
Ah, that explains it, I was about to post "wow, this code snippet does a pretty poor job at convincing me to learn Python" :-)
I'd suggest improving the colour scheme of the code window, dark green on dark grey background is not very legible. Maybe steal some colors from the Sphinx doc colour scheme?
Yup, we'll change that. All of this content is dummy preview content at this point.
I made the very same observation when Jesse Noller first blogged about it (apparently as my very first HN comment[1]!).
[1] https://news.ycombinator.com/item?id=4842906
[1] https://news.ycombinator.com/item?id=4842906
Yep, that was my first reaction as well. However, the idea of preview can be extended, codeacademy style. Make a small python interpreter in js, that people can try in, that gives them an interactive tutorial for python.
yup, that's a terrible example, not only because of the stupid variable name but poor example code choice. It's work in progress I assume.
Yeah, please use a slightly longer variable name.
I use customized font, so the number "1" looks exactly like the letter "l" here to see http://grab.by/kMFW
Why would you do that?
Love the design and architecture, and really love the success stories. I remember struggling to sell a dated financial enterprise company on the benefits of Python, and those case studies would have really helped.
[deleted]
It looks a lot better than the current site! A few criticisms:
1) The line numbers and spacings on the list example are confusing: The examples come from an interactive session, but the presence of line numbers suggest that it's a script. Also the spacing is inconsistent with what you'd get if you typed that into the standard python shell.
2) I think the drop down menus from the top of the page are much bigger and obtrusive than they need to be. When I opened the page, my mouse went over the "Success Stories" tab, and I saw a big white "Google" logo in the middle of the page. The eye is naturally drawn to it, and I spent a second or two like, "What is that doing there?" until I figured it out.
3) Maybe I would have a slideshow or "arrow-buttons" with more python examples than just the list. Basic usage of a list doesn't sell python as hard as, say, list comprehensions, arbitrarily large integers, and/or manipulating sets.
1) The line numbers and spacings on the list example are confusing: The examples come from an interactive session, but the presence of line numbers suggest that it's a script. Also the spacing is inconsistent with what you'd get if you typed that into the standard python shell.
2) I think the drop down menus from the top of the page are much bigger and obtrusive than they need to be. When I opened the page, my mouse went over the "Success Stories" tab, and I saw a big white "Google" logo in the middle of the page. The eye is naturally drawn to it, and I spent a second or two like, "What is that doing there?" until I figured it out.
3) Maybe I would have a slideshow or "arrow-buttons" with more python examples than just the list. Basic usage of a list doesn't sell python as hard as, say, list comprehensions, arbitrarily large integers, and/or manipulating sets.
Looks great; a great improvement over the current one.
Under the font menu (next to 'Go' button) there is a small separator between 'Larger' and 'Reset' options. It does not have any label but acts like 'Larger' option and increases the font when clicked.
If it is just a separator it should not increase the font. Else it should have proper label.
If it is just a separator it should not increase the font. Else it should have proper label.
Maybe I've grown too used to the current design, but my first reaction is - yuck, too much like a http://everyfuckingwebsite.com/ clone. I'll try to articulate my dislike as something constructive, and submit feedback directly.
Sometimes the obvious problems are really hard to put a finger on. The new design for example tries too hard to look good, almost de-emphasizing the message.
The fact that they are even previewing the website with dummy content tells me that they are focusing on the wrong things.
The fact that they are even previewing the website with dummy content tells me that they are focusing on the wrong things.
I think you did put your finger on it! You describe it perfectly. It's got that trying too hard feel. There's just so much of it. It kind of reminds of those fully flash websites. Too much "look pretty."
There's also a bit of information overload going on in the menus. I don't know. I'm not entirely a fan of the bold colors. I personally would have just liked an iteration of the current site, rather than a full revamp.
Something along the lines of Github's clean white background and minimalistic layout would, I think, suit a Python site very well.
I could just be me fearing change, though..
There's also a bit of information overload going on in the menus. I don't know. I'm not entirely a fan of the bold colors. I personally would have just liked an iteration of the current site, rather than a full revamp.
Something along the lines of Github's clean white background and minimalistic layout would, I think, suit a Python site very well.
I could just be me fearing change, though..
This is an example of a how to do a great OSS website:
http://git-scm.com/
Granted, it is a bit easier to make a succinct website for something like Git rather than the entire Python project.
Granted, it is a bit easier to make a succinct website for something like Git rather than the entire Python project.
I found it a bit disappointing that the divio slides look nicer than the final result. I loved the clean look of the original design.
Constructive criticism:
The shadow on the logo is too dark and looks wierd. Also, I'd put a call to action, like "Download" or "Learn" in a more visible format (maybe on a button) in a larger font, above all the "blocks", along with the content of the Statistics block.
The PSF block at the bottom looks out of place. (I really love the way you show additional information when I hover on the links in the second navbar. I'm not sure how that extends to touch based devices, but you could probably present the PSF block in a similar way.)
The "Socialize" link looks out of place too and should probably be on the upper navbar. (The other "actions" in that block are related to the site itself - search and text size)
I agree with the others that that code sample should actually be an editor with the ability to actually execute code.
The shadow on the logo is too dark and looks wierd. Also, I'd put a call to action, like "Download" or "Learn" in a more visible format (maybe on a button) in a larger font, above all the "blocks", along with the content of the Statistics block.
The PSF block at the bottom looks out of place. (I really love the way you show additional information when I hover on the links in the second navbar. I'm not sure how that extends to touch based devices, but you could probably present the PSF block in a similar way.)
The "Socialize" link looks out of place too and should probably be on the upper navbar. (The other "actions" in that block are related to the site itself - search and text size)
I agree with the others that that code sample should actually be an editor with the ability to actually execute code.
Thanks for the feedback, good stuff.
BTW, please do try the nav on mobile devices, especially tablets. They work there, too, and I think our designers did something especially slick :)
BTW, please do try the nav on mobile devices, especially tablets. They work there, too, and I think our designers did something especially slick :)
Here are some annotated screenshots of the design on my mobile devices: https://docs.google.com/folder/d/0B2Fy-Q78JeVpV3UyOGpnSVZ0UV...
(The higher-rez ones are from Chrome running on my Galaxy Note; the lower-rez ones are from the stock browser on a Galaxy Ace)
(The higher-rez ones are from Chrome running on my Galaxy Note; the lower-rez ones are from the stock browser on a Galaxy Ace)
These are awesome, thank you!
Just checked it out on my tablet (iPad) - I don't see much of a difference (of course, it's responsive!) except for the menu, which works pretty well :)
Minor points:
- When in "mobile mode", the search box changes colour so it doesn't look like a text input any more. I'm not sure if that's a good idea.
- I agree with the others on this one again: the gradients and the shadows are a bit excessive. Maybe you could try a "flat" shadow instead? (ie. a shadow with a 0 blur radius)
- I really loved the old docs search mechanism where the site had a local index of keywords and could search without hitting the server. I hope you don't lose that.
- I'm not sure what the concept of the two navigation bars is. What is the top bar for, and what's the second bar for? I see "Documentation" in two places. Logically speaking, I'd expect the upper bar to be the primary navigation, and the lower bar to be the secondary navigation, but clearly, that isn't the case.
Anyway, is this open source as of now? Where can I contribute?
Minor points:
- When in "mobile mode", the search box changes colour so it doesn't look like a text input any more. I'm not sure if that's a good idea.
- I agree with the others on this one again: the gradients and the shadows are a bit excessive. Maybe you could try a "flat" shadow instead? (ie. a shadow with a 0 blur radius)
- I really loved the old docs search mechanism where the site had a local index of keywords and could search without hitting the server. I hope you don't lose that.
- I'm not sure what the concept of the two navigation bars is. What is the top bar for, and what's the second bar for? I see "Documentation" in two places. Logically speaking, I'd expect the upper bar to be the primary navigation, and the lower bar to be the secondary navigation, but clearly, that isn't the case.
Anyway, is this open source as of now? Where can I contribute?
The code's not open source yet, but it will be. The idea is we'll deliver what we've promised to the PSF, then launch the site for real (i.e. replace python.org) and open source the code at the same time. We want to make this into a community-maintained thing, but first we got some real work to do :)
Is it implemented in Django?
Yes the website is running Django 1.5 on Python 3.3 :)
I suppose the trick with the navigation only works on certain touch devices? Does not work on my phone.
It is great on an iPad. Works very well.
responsive.
The problem with python's website was never that it wasnt "Sexy" enough to attract newcomers. Its that the documentation was never as well written or well organized as other languages/libraries like ruby and jQuery.
Really? I've always found Python's documentation (especially the official tutorial) to be excellent. What do you think could be improved about it?
A navigable list of objects, functions, and methods would be really nice, something like this (preferably complete): http://api.rubyonrails.org
Another suggestion would be to split tutorials/examples apart from object references. For example, take a peek at the Python Decimal module docs: http://docs.python.org/2/library/decimal.html#module-decimal
All the information is there, but it isn't organized very well. There's a tutorial, overview of Decimal and its methods (with tutorials mixed within), and various "notes" sections. It's all mixed together, and confusing for a new user.
Personally, I'm more of a fan of this type of structure:
Guides/How-To's including examples, introductions to use an object, spell out caveats, etc... This should get wordy when needed.
Both could have links to one another. For experienced coders, you'll mostly just use #1 (which fits great in a navigable list). For newbies, #2 will teach you how to do things.
$0.02
Another suggestion would be to split tutorials/examples apart from object references. For example, take a peek at the Python Decimal module docs: http://docs.python.org/2/library/decimal.html#module-decimal
All the information is there, but it isn't organized very well. There's a tutorial, overview of Decimal and its methods (with tutorials mixed within), and various "notes" sections. It's all mixed together, and confusing for a new user.
Personally, I'm more of a fan of this type of structure:
1. API documentation. No how-to's.
2. "Guides" and How-To's
Guides/How-To's including examples, introductions to use an object, spell out caveats, etc... This should get wordy when needed.
Both could have links to one another. For experienced coders, you'll mostly just use #1 (which fits great in a navigable list). For newbies, #2 will teach you how to do things.
$0.02
Agrees on this. Sometimes you don't want the tutorial or book, you just want the reference guide of one liners saying what the thing is, at least for the proficient programmer. If I come back to Python from a few months on some C++ project and have to spend 15 minutes looking up how to use their JSON api because I have to dig 90% of the time to find callables the docs fail.
The lack of a Javadoc / Qt ref / cppreference (I love that wiki) module / function list makes just searching for something you know exists and just need the method name a pain in the butt.
The lack of a Javadoc / Qt ref / cppreference (I love that wiki) module / function list makes just searching for something you know exists and just need the method name a pain in the butt.
The documentation is beautifully written and perfect for learning, but it doesn't support the quick-fire referencing I, and I presume the other detractors, have grown to expect.
Contrast the first Google result for "python dictionary" [1] and "java hashmap" [2]. The Python result tells you about every data structure and does so in a story, the Java one gives you what you want and little more.
[1] : http://docs.python.org/2/tutorial/datastructures.html
[2] : http://docs.oracle.com/javase/6/docs/api/java/util/HashMap.h...
Contrast the first Google result for "python dictionary" [1] and "java hashmap" [2]. The Python result tells you about every data structure and does so in a story, the Java one gives you what you want and little more.
[1] : http://docs.python.org/2/tutorial/datastructures.html
[2] : http://docs.oracle.com/javase/6/docs/api/java/util/HashMap.h...
The first result is the tutorial - the second result is the comparable API documentation, although unfortunately you need to find the right section of the page after clicking through. Like the Java doc, it has a prose introduction followed by a list of methods.
Overall, I think you're right that the Python docs aren't optimal for quick fire referencing. I think we tend to use some form of introspection to examine methods, function signatures and docstrings. For instance, I keep IPython open and use tab completion and the 'foo?' syntax to find the details I need.
Overall, I think you're right that the Python docs aren't optimal for quick fire referencing. I think we tend to use some form of introspection to examine methods, function signatures and docstrings. For instance, I keep IPython open and use tab completion and the 'foo?' syntax to find the details I need.
I also think the docs are pretty good. However, the one thing I would absolutely LOVE is if they added a table at the top of every page that has functionName and return Type (like so many other languages do).
The thing that irks me about the docs now it that they're almost too in depth. Sometimes, when I just need to get a quick refresher of what function X does, it takes me nearly 45 seconds to just find the thing. Ctrl + F doesn't help because the docs are so verbose that searching for one thing usually results in 20+ hits or references on the page.
Just a little table like the Java docs, and I'd be pleased as punch!
The thing that irks me about the docs now it that they're almost too in depth. Sometimes, when I just need to get a quick refresher of what function X does, it takes me nearly 45 seconds to just find the thing. Ctrl + F doesn't help because the docs are so verbose that searching for one thing usually results in 20+ hits or references on the page.
Just a little table like the Java docs, and I'd be pleased as punch!
I'm a Rubyist but I find that curious because the more common public complaint seems to be that Ruby's documentation isn't as good as Python's. (And its official site is rather tired, to say the least.)
I really liked Python's documentation. I read the tutorial and it got me up and running really quickly, and whenever I had a problem or needed details of the arguments it was an invaluable reference.
Clearly, not everyone thought so. What did you not like about the docs?
Clearly, not everyone thought so. What did you not like about the docs?
It's nice to learn from, but if you already know what you're doing and you just forgot the arguments to that one god damn method, it's pretty irritating to actually find the arguments to that one god damn method.
>>> help(method)
usually tells you.
usually tells you.
I find Python's online documentation to be fantastic. It's probably the best online documentation I use. I'm really curious what about it you find lacking.
If Python's documentation is a "problem", then IMO the devs should continue doing problematic things. What in particular do you find lacking about the documentation? I've never heard this complaint before.
The site looks good, but on the "Docs" sub-site, the fly-out menu colors are horrible (no contrast at all).
For example, this is a fly-out on the main page: http://cl.ly/image/0w2t0N0S3714
And this one is one the docs sub-site: http://cl.ly/image/1Z2S0p3O1e15
For example, this is a fly-out on the main page: http://cl.ly/image/0w2t0N0S3714
And this one is one the docs sub-site: http://cl.ly/image/1Z2S0p3O1e15
I really hate saying this because I know it must have taken a lot of work to get to this stage... but it looks very 2005. Fewer gradients and shadows and try to slim down the menus and columns. I know the current site isn't exactly a beauty, but I liked how it had a Wikipedia-like gravitas. This design looks too young for the audience.
The previous one looked very 1998 so it's still a progress
I don't think it's that 2005. For example, it has RWD, which is wonderful.
I was more in 2009, still, it has probably taken a lot of work and a lot of time so the design became dated in the process ...
I felt the same. The design looks pretty older to me, as well those sans types makes my eyes bleed.
[deleted]
Why every second website now uses this -webkit-font-smoothing: antialized? Fonts look unreadable for me on mac os. Why to make a decision for user on how to render fonts?
EDIT: Made a screenshot to illustrate the problem: https://www.dropbox.com/s/orzn4f2utoxh4st/Screen-Shot-2013-0...
EDIT: Made a screenshot to illustrate the problem: https://www.dropbox.com/s/orzn4f2utoxh4st/Screen-Shot-2013-0...
So cool!
When I hover over one of the buttons (About being the first one I hovered on), when I move my mouse cursor down and to the right at the same time to go click "Learn more about the PSF", i accidentally hit the "Downloads" drop down, which then appears.
At that point I need to move my cursor back to "About", drag down, and then right.
Putting a time delay on there, or that Javascript that Amazon uses for theirs that detects mouse movement would be fantastic.
At that point I need to move my cursor back to "About", drag down, and then right.
Putting a time delay on there, or that Javascript that Amazon uses for theirs that detects mouse movement would be fantastic.
Thanks, yeah we've heard that from several people and it's on the TODO list to add some hover intent detection for sure.
Looks great overall. I like the color scheme and the details.
Some constructive critisism and ideas:
(1) I'm pretty sure that the text in the secondary navbar is not correctly centered vertically. It's off by a couple of pixels.
(2) It would be nice if the code area in the frontpage had a chunky "Try Python now" button pointing to an online python editor, with a step-by-step teaser tutorial.
(3) The frontpage lacks a button to quickly download the latest version on my platform. I had to look twice to find the 'Download' column.
(4) The search box is a weak point. The magnifying glass is not aligned properly. The grey dropdowns feel a bit disconnected from the rest of the design. You're going for shadows and emboss, but that's completely flat.
(5) The position of the 'Socialize' dropdown is a bit random. It could be placed as another tab in the secondary navbar or in the footer.
Some constructive critisism and ideas:
(1) I'm pretty sure that the text in the secondary navbar is not correctly centered vertically. It's off by a couple of pixels.
(2) It would be nice if the code area in the frontpage had a chunky "Try Python now" button pointing to an online python editor, with a step-by-step teaser tutorial.
(3) The frontpage lacks a button to quickly download the latest version on my platform. I had to look twice to find the 'Download' column.
(4) The search box is a weak point. The magnifying glass is not aligned properly. The grey dropdowns feel a bit disconnected from the rest of the design. You're going for shadows and emboss, but that's completely flat.
(5) The position of the 'Socialize' dropdown is a bit random. It could be placed as another tab in the secondary navbar or in the footer.
I love it. The aesthetics are nothing special, at best you could say they are inoffensive but with a big community organization like python and so many opinions to cater to, inoffensive is probably as good as it gets.
More importantly, it is properly responsive, well laid out, touchscreen friendly, and a flexible enough design that it should be easy to add sections later. Everything a modern site should be.
More importantly, it is properly responsive, well laid out, touchscreen friendly, and a flexible enough design that it should be easy to add sections later. Everything a modern site should be.
I like the design but I've some feedback.
- Search bar has to be well integrated with the primary navigation.
- Alignment of the search text field & the search button.
- Search text field has sharp edges while the button is slightly bigger and has rounded edges.
- I think increase/decrease your text size is redundant. Your target audience is programmers or people who want to learn programming. They already know how to zoom in/zoom out.
- Instead of showing an image of how to create an array. Wouldn't it be awesome, if we create a simple interactive shell where-in you show how to manipulate strings (reverse, capitalize etc. It will get user's who are new to Python excited about the language and its simplicity.
How can I contribute to the project?
- Search bar has to be well integrated with the primary navigation.
- Alignment of the search text field & the search button.
- Search text field has sharp edges while the button is slightly bigger and has rounded edges.
- I think increase/decrease your text size is redundant. Your target audience is programmers or people who want to learn programming. They already know how to zoom in/zoom out.
- Instead of showing an image of how to create an array. Wouldn't it be awesome, if we create a simple interactive shell where-in you show how to manipulate strings (reverse, capitalize etc. It will get user's who are new to Python excited about the language and its simplicity.
How can I contribute to the project?
Thanks for the feedback, good stuff.
As for contributing: we'll be releasing the code when we launch the site for real (i.e. actually replace python.org), and we'll certainly be taking pull requests. I'll also have some contributor guidlines written up by that point.
We've got some serious work to do first, though :)
As for contributing: we'll be releasing the code when we launch the site for real (i.e. actually replace python.org), and we'll certainly be taking pull requests. I'll also have some contributor guidlines written up by that point.
We've got some serious work to do first, though :)
This website looks way too good for a programming language! Stunning!
It would look better if it only had one top menu bar with search box integrated in it instead of two menu bars with a search box between them.
Finally! I really hope their docs improve because right now, they are horrendous.
Do you think you can clarify? Most people seem to think that Python's docs are quite good — it's one of the things that originally brought me to Python, along with many others. If you can explain how they let you down perhaps we can do something to fix it?
Sure. My main problem I find is actually finding what I need. Assume I want to read about the string split method. There are two places that I'd go to:
http://docs.python.org/2/library/string.html http://docs.python.org/2/library/stdtypes.html
I know the difference, but that's very confusing and annoying. It might be easier to have all string methods in one page, but separate them in terms of built-in standard library vs. the module ones.
Then I came across: http://docs.python.org/release/2.5.2/lib/string-methods.html which is a cleaner version.
Another thing I found in string a few days ago: the difference between capitalize() and title() on std string is not clarified at all in the docs.
http://docs.python.org/2/library/string.html http://docs.python.org/2/library/stdtypes.html
I know the difference, but that's very confusing and annoying. It might be easier to have all string methods in one page, but separate them in terms of built-in standard library vs. the module ones.
Then I came across: http://docs.python.org/release/2.5.2/lib/string-methods.html which is a cleaner version.
Another thing I found in string a few days ago: the difference between capitalize() and title() on std string is not clarified at all in the docs.
The example should be runnable!
mainnav element is unnecessarily wide. Also too much of spacing between the elements in top-bar.
The margin to "About" in the mainnav looks a bit odd. Is it required?
The contents of the mainnav is oddly placed. I feel it can be organized from left to right in terms of usability to users. Like Downloads and Documentation first rest should follow in the respective orders.
The latest news can be placed somewhere in the first page itself for better visibility. Users has to scroll down now to see it.
The margin to "About" in the mainnav looks a bit odd. Is it required?
The contents of the mainnav is oddly placed. I feel it can be organized from left to right in terms of usability to users. Like Downloads and Documentation first rest should follow in the respective orders.
The latest news can be placed somewhere in the first page itself for better visibility. Users has to scroll down now to see it.
Little thought: Wouldn't it be great to lazy load a JS live input console to actually try out the demo scripts on the frontpage? I'm missing those out for several language sites (eg Ruby).
This redesign is amazing.
Having a snippet of code presented to you is nice.
However, I wonder whether it'd be possible to provide a more hands-on feel, possibly through something like <http://repl.it/languages/Python>. That way, one can interact with the snippet of code.
Having a snippet of code presented to you is nice.
However, I wonder whether it'd be possible to provide a more hands-on feel, possibly through something like <http://repl.it/languages/Python>. That way, one can interact with the snippet of code.
Nice, but i think it is too dense with information and more confusing then the current one.
There are those two big horizontal menus that confuse me and just moving the mouse over the first page pops up new menus everywhere.
I'd suggest: Put the main navigation bar (about, downloads, docs, etc) to the top and move the current top bar with links to the side, somewhere else.
Also Downloads and Docs is mentioned many times on that page, i'd suggest to leave the link to the Docs in the main bar and get rid of the other ones.
And at the bottom this whole page (takes up my whole screen) contains all this links again.
It's probably that way to decide which design way to go.. The blue navigation bar also is right in the middle of the screen, that's disturbing. The common way to display navigation is at the top or at the left side not right in the middle, where the content belongs (imo).
Anyway, keep going, you're doing a great job! :)
I'd suggest: Put the main navigation bar (about, downloads, docs, etc) to the top and move the current top bar with links to the side, somewhere else.
Also Downloads and Docs is mentioned many times on that page, i'd suggest to leave the link to the Docs in the main bar and get rid of the other ones.
And at the bottom this whole page (takes up my whole screen) contains all this links again.
It's probably that way to decide which design way to go.. The blue navigation bar also is right in the middle of the screen, that's disturbing. The common way to display navigation is at the top or at the left side not right in the middle, where the content belongs (imo).
Anyway, keep going, you're doing a great job! :)
Really nice!
Looks nice.
My feedback for what it's worth:
- The home page is very "blue". Personally I think this page will look better if the blue gradient in the background was a light gray gradient instead.
- Search icon needs to be lowered.
- Hovering the secondary menu is not a pleasant experience. I think this is mainly because of the white info panel in the drop down switch from right to left. It makes it look cluttered and disorienting. Another problem here is that there is a menu with drop downs in between the primary nav and the content. Moving your mouse between primary nav and content will bring up a secondary nav drop down which in my opinion is very irritating.
- I think how the menu is aligned under Education (overlaps the content) is the best way.
My feedback for what it's worth:
- The home page is very "blue". Personally I think this page will look better if the blue gradient in the background was a light gray gradient instead.
- Search icon needs to be lowered.
- Hovering the secondary menu is not a pleasant experience. I think this is mainly because of the white info panel in the drop down switch from right to left. It makes it look cluttered and disorienting. Another problem here is that there is a menu with drop downs in between the primary nav and the content. Moving your mouse between primary nav and content will bring up a secondary nav drop down which in my opinion is very irritating.
- I think how the menu is aligned under Education (overlaps the content) is the best way.
It is blue, but at least it's a colour, and not a bad one. The problem with gray is that it looks very, well, gray.
I had similar thoughts about the white part of the drop-down menu changing sides.
FWIW, I think it's a really significant improvement over the current homepage, which always feels like a list of mostly-irrelevant news links to me. This one has a code snippet which is a great idea (though I hope the content of the snippet improves!), and big links to downloads and docs.
I had similar thoughts about the white part of the drop-down menu changing sides.
FWIW, I think it's a really significant improvement over the current homepage, which always feels like a list of mostly-irrelevant news links to me. This one has a code snippet which is a great idea (though I hope the content of the snippet improves!), and big links to downloads and docs.
A few misc. observations:
* Too much of this page is spent on navigation and link lists. It's the landing page, but we don't need to link to every single sub-section of the site.
* I don't think having a whole sub-menu on the bottom of the page with various download architectures is a good idea. A single "Downloads" link would be much better, breaking out by distro on the downloads page.
* Ditto for a lot of the other stuff in the bottom menus. I understand we're trying to make things discoverable, but feel that you went too far in the other direction (information overload).
* The mobile style is pretty disappointing. There is a ton of wasted vertical space, and the vast majority of my scrolling is spent getting through all of the various menu levels. This could be trimmed down a ton, there's just too much. Strip out all of the ancillary links, stick to the core content, and make it easy to digest.
I make these comments because I genuinely care. I want to see the new python.org blow our socks off.
* Too much of this page is spent on navigation and link lists. It's the landing page, but we don't need to link to every single sub-section of the site.
* I don't think having a whole sub-menu on the bottom of the page with various download architectures is a good idea. A single "Downloads" link would be much better, breaking out by distro on the downloads page.
* Ditto for a lot of the other stuff in the bottom menus. I understand we're trying to make things discoverable, but feel that you went too far in the other direction (information overload).
* The mobile style is pretty disappointing. There is a ton of wasted vertical space, and the vast majority of my scrolling is spent getting through all of the various menu levels. This could be trimmed down a ton, there's just too much. Strip out all of the ancillary links, stick to the core content, and make it easy to digest.
I make these comments because I genuinely care. I want to see the new python.org blow our socks off.
You are killing it. Python.org should be really dry. The language is too juicy. I really love the way it looks right now. Moreover, whoever designed the new one, did a half-hearted job. It looks obnoxious. May be there is a design which looks better, but this definitely is not it. It looks like some corporate-y site, and worse, a really bad corporate.
too much variation in style between sections. Some areas are very flat and 'Metro-ish' and then you have heavy gradients, extreme rounded corners. It just doesn't feel consistent. Looks like multiple designers were working on this and no one was talking to one another.
Looks awesome
Could the prompt on the home page be made to be interactive? (CodeAcademy style?) Seems a great way to get people to jump in straight away… and no better way to learn than by doing.
Yeah, that'd be a superb idea. Start with a really good code example (or a few really good examples that cycle between page loads), and have an interactive thingy. Like the Go homepage: http://golang.org/
Has some nice aspects, but that secondary nav is horrible in almost every way.
I'm not in any way related to this effort, but if you're going to give criticism, please at least make it constructive or give examples of what you mean. I certainly didn't find it horrible "in almost every way".
I think that was an example of very concise and constructive criticism.
Sometimes just about everything is wrong with a given design, and saying so is the best way to express this.
In this case, it's pretty obvious that the nav buttons are uselessly large, the empty padding on either end is wasteful and annoying, the location mid-way down the page isn't practical, the color makes it blend in with the page's background, the drop down submenus make it awkward to find and get to the information being sought, the submenus are cluttered, and so forth.
The location is poor. The appearance is poor. The usability is poor. Using "horrible in almost every way" to describe it is very accurate and precise. It's just not the kind of thing that works after some minor tweaks; it all needs to be thrown away and redone using a different approach.
Sometimes just about everything is wrong with a given design, and saying so is the best way to express this.
In this case, it's pretty obvious that the nav buttons are uselessly large, the empty padding on either end is wasteful and annoying, the location mid-way down the page isn't practical, the color makes it blend in with the page's background, the drop down submenus make it awkward to find and get to the information being sought, the submenus are cluttered, and so forth.
The location is poor. The appearance is poor. The usability is poor. Using "horrible in almost every way" to describe it is very accurate and precise. It's just not the kind of thing that works after some minor tweaks; it all needs to be thrown away and redone using a different approach.
It might be "constructive" if everyone is in basic agreement and people know what's being referred to. That's certainly not the case with the OP's comment, and there's obviously people who disagree. The specifics in your comment (especially your "In this case..." paragraph) are much more helpful and specific.
Sorry, I wanted to add that I agree with several others that the secondary nav is flawed, but couldn't really decide which comment to reply to. Most of the reasons to why it isn't very good have already been stated, but I agree my specific comment was bad because it didn't add anything new or helpful, other than "someone else doesn't like it."
Three "m" words: mystery meat menus.
[deleted]
Please use a serif font for non-Titles. Every time I read something online that is a couple of paragraphs long (eg: documentation), I always wished that they have a Times/serif font version of this document.
It would probably not be as "beautiful" compared to Non-serif fonts but it would certainl help my eyes (and I'm sure for others as well - especially if we spend hours in front of a computer screen).
It would probably not be as "beautiful" compared to Non-serif fonts but it would certainl help my eyes (and I'm sure for others as well - especially if we spend hours in front of a computer screen).
it looks quite nice. Great work, guys !
I'm thinking about Vim's redesign. It must be done, what do you think :D
In the downloads tab "Download for Mac OSX" is the worse choice for a default. Either choose the one with the most users (Windows) or the open one (Linux)...
These will by dynamic, as with most download links out there. OS X is just shown because that's what we've been developing with, mostly.
lookin goooooood
What is the motivation to redesign the site, other than to make it look more web 2.0?
Looks pretty 'standard', but I love it.
It doesn't go full-fullscreen on widescreen, which ususally isn't bad, but I know on the old python (and at least the docs site) having the vertical fixed sidebar list was handy, and much more useful than one horizontal navbar (or 3, in this case... maybe cut down on the nav bars).
Personal taste, I prefer my sites with a fixed vertical navigation pane to the side when you get ultra-widescreen.
Personal taste, I prefer my sites with a fixed vertical navigation pane to the side when you get ultra-widescreen.
I like!
Love that it's responsive! I like it!
This design is shinier, though it feels uninspired and shows a disappointing lack of attention to fundamental design principles.
Stop calling all high-dpi displays Retina. I'm on Nexus4 and message at the bottom of your page says "Retina Display @1.5".
Very nice work.
I am a bit torn on this though: http://i.imgur.com/QBEWQQc.png
It does not look simple enough with all the >>> characters.
If you are not familiar with the python shell, I am not sure that you will be able to understand which lines are commands and which lines are results. There must be a better way to do this.
More code examples would also be a welcome change IMHO.
I am a bit torn on this though: http://i.imgur.com/QBEWQQc.png
It does not look simple enough with all the >>> characters.
If you are not familiar with the python shell, I am not sure that you will be able to understand which lines are commands and which lines are results. There must be a better way to do this.
More code examples would also be a welcome change IMHO.
A usability annoyance: when I hover over "Blog", and then move my mouse to click the first blog article's headline, the menu changes to "success stories".
At [1] they discuss how Amazon fixed that (HN discussion at [2]).
[1] http://bjk5.com/post/44698559168/breaking-down-amazons-mega-... [2] https://news.ycombinator.com/item?id=5330998