Feedback on Modern Drupal.org Design

Created on 20 September 2024, 5 months ago

Collecting Your Feedback

At DrupalCon Barcelona we are previewing Drupal.org's new theme, information architecture, and landing pages on:
https://new.drupal.org

This preview will be updated with more design components, additional pages and sections, and various changes and fixes based both on our internal review and QA, and your feedback.

Please provide your feedback in the following way:

  • A one-line summary of the issue in the issue summary, linking to the comment in this issue with your feedback, which should include:
    • A more detailed explanation of your feedback.
    • How to find/reproduce the issue.
    • (if possible) a screenshot
    • (if you would like) your suggested solution, with or without a proposed css change

List of feedback:

  • [Issues go here]
🐛 Bug report
Status

Active

Version

1.0

Component

User interface

Created by

🇺🇸United States hestenet Portland, OR 🇺🇸

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @hestenet
  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    Overall scale

    The current overall scale of heading sizes, text sizes, images, etc is perhaps a little bit too big. (However, in general it's really nice to be fully utilizing more screen space - and we should lean into that! With basic content types even moreso than landing pages).

    I'm benchmarking based on the standard 14inch Macbook Pro, which I think is a pretty good representative sample of the current standard laptop screen size.

    Here's what it looks like at 67% zoom, where the full first component is above the fold:

  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    Feedback from @pameeela

    Content: Use consistent sentence case

    We should be using consistent sentence case in the content:

  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇺🇸United States B_man California, USA
  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    From @b_man

    Image overlap: positioning should be adaptable to more image sizes

    Images in the standard dimensions expected for the hero component break properly at various desktop widths and mobile sizes, however, images that fall outside of those dimensions can end up with content overlap.

  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    CTA buttons should accommodate longer text

    In CTA buttons, any text longer than about 8-12 characters has weird line wrapping behavior.

  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇩🇪Germany rkoller Nürnberg, Germany

    Link in the gdpr consent box only relies on color

    The link in the GDPR consent box is only relying on color which is not meeting WCAG SC 1.4.1. It can be reproduced/highlighted with accessibility insights test as seen in the screenshot. as suggested by accessibility insights either use an underline for the link l same as for the link n the red bar underneath or the link color has to have a contrast of at least 3:1 between the white regular text and the blueish link text. preferable would be using an underline and use also white for the link text.

  • 🇩🇪Germany rkoller Nürnberg, Germany
  • 🇩🇪Germany rkoller Nürnberg, Germany

    Focus should be visible

    The focus should be visible for every focusable element in the DOM (SC 2.4.7). At the moment when you tab through the front page, the tab between the get started button and the why drupal button is invisible. Same between the why drupal and the learn more button.
    And the focus appearance should also have at least width of 2 pixel and a color contrast of at the very least of 3:1 against the background color (SC2.4.13 is an AAA criterion but basically that should be an AA criterion - the focus outline has the same importance for keyboard users like the mouse cursor for mouse users). At the moment the focus relies on the browsers focus variable. in safari for example that color contrast isnt meeting the minimum requirement of 3:1 against the background color of all the available tab targets on the landing page.

    In edge and firefox it is "sort of" better. both use two focus outlines in different colors out of the box. i havent checked every tab target but those i checked at least one of the two has always at least a color contrast of 3:1, but still visually the outline is not THAT directly discernable (either because the width is a single pixel or because of simultaneous contrast)

    in edge - the visible white outline has only a thin 1px outline, the darker outline is too close to the button outline.

    in firefox - the white outline and the light blue hover style of the text is way too close, while even though the color contrast of the blue outline against the dark blue background is large enough the blue is still close to invisible visually due to simultaneous contrast.

    It also looks like when the focus is applied the hover style is applied as well which is some sort of mixed messaging and a visual distraction since the mouse cursor isnt anywhere near the focus area.

  • 🇩🇪Germany rkoller Nürnberg, Germany
  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇧🇪Belgium BramDriesen Belgium 🇧🇪

    I find the main navigation very wonky to use. Probably what is described in #18 and I think the issue partially lays in how the DIV is scaled as shown in the screenshot of #19

    The menu seems to pop open and close quite a lot when you do specific, but not very special hovering manoeuvres.

  • 🇩🇪Germany rkoller Nürnberg, Germany

    Improve the menu

    I agree with @bramdriesen, I also think there is room to improve for the menu. I’ve already touched the topic in #19 and spent the time since then trying to narrow down more points in that context and to summarize everything in a comment and two illustrative videos.

    desktop.mp4:

    • sub menus collapse immediately after the mouse leaves the target area ( ref https://www.w3.org/WAI/tutorials/menus/ the "why is this important" section, third point)
    • if you hover across the different top level menu items the screen becomes busy with the different submenus expanding and collapsing in high frequency - same or even worse if you tab through the menu items.
    • if you press the esc key within a submenu the focus isn’t returning to the parent top level menu item but the focus is entirely lost instead and you start tabbing at the top of the page
    • submenus automatically expand when getting into focus, but that detail is not announced in the aural interface. there you only get informed that a clickable group is in focus. that the submenu is expanded is not clear. and it is not necessarily clear either that you can access the submenu by clicking the arrow down button instead of tabbing into the submenu.
    • the announcement of submenu items starting in a sort of redundant manner with level 1 link and then the name. a front loaded redundant announcement should be avoided. the detail of interest is the title of the menu item. and i wonder are there more hierarchy levels at a later point? at the moment you only have the top level menu items and a plain level 1 of submenu menu items.
    • if you open the rotor you also notice that the top level menu items are not available via the rotor cuz they are neither links nor buttons
    • some unavailable special characters are shown in the rotor with questionmarks

    mobile:

    • for mobile the focus is also entirely lost and you have to start tabbing at the top of the page when you press escape with the menu open. but here you are already able to loose the focus within the top level menu item - the focus should return here to the hamburger icon but it is lost entirely.
    • for keyboard users the mobile view is better since you have actual toggle buttons to expand and collapse a top level menu item. the only odd detail is if you press return on the top level menu item the submenu expands, but there is no announcement that the submenu got expanded. that only happens on the toggle button next to the top level menu item.
    • in the transition from platform overview to drupal starshot you have leaving content list and entering content list. it sounds like you are getting into another section but “technically you are still in the same submenu?
    • and the mobile submenu has the same problem with the redundant announcement of level 1 link
  • 🇩🇪Germany rkoller Nürnberg, Germany
  • 🇩🇪Germany rkoller Nürnberg, Germany

    Improve the alt text

    If you make the following test and try to imagine the images the following alt texts are describing, by not looking at the images before that, and then compare the images in your head with the actual image on the page, some might be sort of similar but for some you will have some completely different images in your head (in particular the planned parent hood alt text is not describing the image at all):

    • Happy Drupal user
    • John Cloys, Princeton
    • Kids enjoying Nestlé
    • Children of UNICEF
    • Princeton students using Drupal
    • Planned Parenthood DIRECT powered by Drupal

    two good ressources in that context are: https://jakearchibald.com/2021/great-alt-text/ and https://tink.uk/text-descriptions-emotion-rich-images/ (in particular leonie provides the perspective of a blind screenreader user which i consider valuable and important in this case)

  • 🇩🇪Germany rkoller Nürnberg, Germany
  • 🇧🇪Belgium BramDriesen Belgium 🇧🇪

    Re #24 the video somewhat shows the issue I was referring to. But I found the menu to close and open a lot with vertical mouse movements. Depending on where you were with your cursor (e.g. not on the text but on the div around it).

  • 🇩🇪Germany rkoller Nürnberg, Germany

    And finally some feedback about the structure and the labels of the menu items.

    “Overview” sub menu items - All top-level menu items have a sub menu item overview. For Why Drupal the overview comes first while for the rest of the submenus it is placed last. But wouldn’t it make more sense to link the top-level menu items to the overview pages? At the moment the top level menu items are not linked to any page at all.

    Why Drupal - The submenu items aside the general overview looks sort confusing and contradictory. I assume the expectation for someone who never touched Drupal would be to learn what Drupal is about, but seeing different versions like Drupal Starshot, Drupal Core, and Drupal 11 (where Core and 11 are sort of overlapping?). And the wording for platform in “platform overview” is also creating questions - is Drupal a platform and not a CMS? That submenu contains a lot of different concepts.

    Solutions - if i read solutions, i would expect reading something instructional i could get actionable insights from which i can use to solve my own problems. but instead it is more about case studies which are usually not directly actionable. with the label solution there is a gap between the expectation and what i actually find there.

    Develop - Somehow the local development guide and installing drupal is “sort of” overlapping content wise it feels like.

    Download - Issue Queue has not necessarily to do with Download, wouldn't be Develop the better fit?

    Get Support - at the moment Drupal Slack is under Get Support. But technically it is also the main way to connect with other folks, maybe Connect might be the better fit?

    Connect - Connect i associate with interacting with other people in the community. community events and drupalcon therefore feels like a good match, same as drupal slack currently listed under get support. but the rest of the menu items feel quite heterogenous. how to contribute, from a technical perspective might be a better fit under develop, but semantically the way better fit might be under support drupal? jobs / careers feels not like the right match for connect. and how Drupal in the news fits into connect? Just based on the title i would expect an RSS feed aggregating blog posts and articles in the context of drupal, but clicking on the link it is more about internal news mainly from the Drupal association. And just based on the menu item label Sign up for Drupal News is not clear if those are the same news, plus the two are separated by the Connect overview menu item.

    Overall the new menu item structure is an improvement over the current one, got slimmed and reordered nicely, but as outlined it still has a few rough edges from my perspective (making me think at least once or twice when i try orienting)

  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    @rkoller, thank you very much for investing so much time in giving feedback.

  • 🇳🇿New Zealand quietone

    Thanks for doing this improvement.

    Download - Issue Queue has not necessarily to do with Download

    I wondered about this as well.

    As a core contributor I'd like it to be easy for others to find out how to contribute to core. I would like it to be possible to find out about core development from the homepage.. There is 'Why Drupal -> Drupal Core' which takes you to a long page with three buttons at the bottom, 'Try', 'Read the docs' and 'Find an Agency'. But none of these get you to core development. There is also 'Connect -> overview' and 'Connect -> 'how to contribute' but again, neither of those get you to anything about core development.

    Can we have an menu item or easy way to to get to such as https://www.drupal.org/about/core/blog or https://www.drupal.org/about/core from the homepage? That page still lacks a link to the Drupal project page or the core issue queue but it would an improvement. At least I think so.

  • 🇧🇪Belgium wim leers Ghent 🇧🇪🇪🇺

    Looks much better! And having worked on Experience Builder … this looks familiar, thanks to https://www.drupal.org/project/demo_design_system :D

    Learn why 1 in 8 websites un on Drupal

    1. Inaccurate.
    2. I cannot select this text because clicking = “grabbing” to do horizontal scrolling 🙃😬
  • 🇺🇸United States artinruins

    Agree with the points above, especially the accessibility issues and overall size for desktop being too large. For mobile, the left and right margins are wildly inconsistent. Each section seems to have its own rules about how far away from the left and right viewport edges text content will be. The testimonial block is very narrow while others are wide and others are in between. More consistent spacing rules are needed.

    A similar application of consistent top and bottom section padding should also be instituted. For example, under the Hero for mobile, the background pattern is not allowed to peek out, which looks like a mistake.

  • 🇩🇪Germany rkoller Nürnberg, Germany

    +1 to #32.4 🐛 Feedback on Modern Drupal.org Design Active , I've raised the same concern in a thread over on the Drupal Slack

  • Feedback from a Drupal developer visiting this new home for the first time.

    First of all, I look great, I like the aesthetic and the browsing / scrollin navigation feels smooth.

    Second reaction, scrolling back to top and reading the actual content, I feels a bit confused about the cover section. I would had loved to see a "real community" member instead of a stock picture. And the catch phrase feels mismatch with the target of the picture. The picture says we want to promote Drupal to UX people, but the title is focused on the power of Drupal for developers. IMHO this hero is a bit confusing.

    1. My least fav suggestion : change the catch phrase.
    2. My fav suggestion : Use picture of real Drupal community members - randomly or sorted on our karma/contribution.

    Bravo to everyone involved in this redesign anyway! It's a big leap and it looks fantastic anyway.

  • 🇬🇧United Kingdom pdjohnson Manchester

    The call to action buttons blend too much into the design. The Drupal Brand has more colours in the palette, please consider drawing from this to make CTAs more visually clear.

    This is the case for the button in the header

    and the button linking to learn more.

  • 🇬🇧United Kingdom pdjohnson Manchester
  • e0ipso Can Picafort

    Content wise, there were three things that jumped out to me.

    The most severe one is that we are involving ourselves with Nestle in Drupal's biggest redesign and marketing push. I know this is no news, but Nestle is one of the most evil companies in the world. Concerns about Nestle include slavery, child labor, deforestation, preventing access to non-bottled water in impoverished countries, ... Please take a look at Wikipedia's page dedicated to this for sources backing all these proven claims. I feel ultra strongly about this. I am convinced this goes against Drupal values, the community values, and individual values. I don't want us to be the focus of controversies like ADF and Project 2025 (which are US centric), but on actual slavery, childe labor, etc.

    My second concern is "50% of Fortune 500 companies use Drupal". My reaction, as a developer and contributor, was oh... am I supposed to volunteer my time for the super-rich? I guess I should think about it. I am unsure if this is the expected reaction. Perhaps we should highlight how these contribute back to the common good.

    My third concern is that I was expecting Drupal recognized as a public good being front and center in the messaging, but is seems that is not there at all (unless I missed it). I think this is the kind of message that will attract companies we want to volunteer for (and that tend to actually contribute back).

  • e0ipso Can Picafort

    Pagination on the cases studies carousel breaks a bit in desktop on the second slide:

  • 🇺🇸United States mherchel Gainesville, FL, US

    Great work on this. Such an improvement.

    A couple points on images:

    1. All image styles should convert to the WebP format.

    This provides as great resolution and transparency as PNG, but for a tenth of the file size. The current site downloads almost 5MB of images! We should be able to get this down to 500kb, even with this image heavy visual appearance.

    2. Do not lazy load images "above the fold"

    The hero image is lazy-loaded. This will make the image appear to load a bit slower, and also increase the site's LCP (largest contentful paint) which is bad. Fortunately this is easily fixed in the field formatter.

    3. Utilize responsive images, and do not load images as background images in CSS.

    Loading background images via inline styles in CSS makes it difficult to use image styles, and also makes it difficult to use responsive images. You can work around this by loading a regular <img> tag in the HTML and then absolutely positioning it and use object-fit

  • 🇨🇦Canada deviantintegral

    The "Start your Drupal journey" section has a huge amount of top and bottom margin, at least on desktop class screens.

  • 🇨🇦Canada deviantintegral

    The issue summary doesn't say "give content feedback", but there's lots of it here so here's mine!

    The most accessible, secure open-source DXP available

    Earlier in the page it says "fully composable CMS" - so what is it? I think it's important to choose one term and focus on it (which I would guess is CMS).

  • 🇨🇦Canada deviantintegral

    Given this is a web site, there's a surprising lack of links! On a desktop-class monitor, there's ~3 viewports worth of page with only two links - Why Drupal and Learn More in the case study section. It would be great if the "Flexible by design" text should include links supporting each assertion.

  • 🇨🇦Canada deviantintegral

    500K websites using Drupal today - this needs a link or a reference. For example, https://trends.builtwith.com/cms/Drupal shows around 200k websites, so are 300k sites actually headless, intranets, and the like? That seems off to me.

  • 🇨🇦Canada deviantintegral

    > Overall page scale, especially on a 14-inch laptop screen

    I agree, this is comically huge on a 27" screen! Here's a comparison to wordpress.org. We don't even get a "Get Drupal" type of button, and WordPress manages to get 3 key sections (the headline / video, the "how to wordpress" block, and "what's new").

    With all this in mind, I do want to say how exciting it is to see this work! Certainly from a "look" perspective, this is vastly improved over the current drupal.org home page. I think the guts of the design system are solid, and it's just individual components that need work. High five!

  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    @e0ipso - Thanks for the feedback.

    I'll quickly address 2 points, but I think it'd be prudent for larger discussions of any feedback items to branch off until full child issues if needed.

    Re: the companies we choose to represent Drupal, esp Nestlé. On a personal level I have similar concerns, and I think it's important to question who we choose to associate the Drupal brand with. On a technical level it's a hugely impressive case study in scale, editorial process, and internationalization - so I can understand why it was chosen. I think this is worth escalating to folks working on content for additional thoughts. Appreciate it being mentioned.

    Re: "Fortune 500" and the implied emphasis on the enterprise. It's interesting b/c I've been fending off concerns recently that somehow the Starshot/DrupalCMS means Drupal is not for the enterprise anymore. From both ends folks seem to think it's mutually exclusive, which is missing the forest for the trees, IMO.

    But I do believe we can probably find a way to speak to both audiences, and importantly, give community contributors a reason to be proud to participate.

    Maybe something like... "putting the power demanded by the fortune 500 in the hands of non-profits, community organizers, higher education, government, and small business alike."

  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    @deviantintegral

    Thanks for the several points of feedback.

    Re: # of Drupal sites, we have more reliable data than any of the web crawler based tools like BuiltWith or Wappalyzer in the form of the usage stats we get when sites phone home for updates:

    https://www.drupal.org/project/usage/Drupal

    Lots of great feedback from many people in this thread. I won't respond to each one here, but will pass on to everyone involved and create child issues where needed.

    Thank you all!

    I'm very glad to see that most feedback is 'this is great, but we can make it better' instead of in fundamental disagreement with the direction.

  • 🇲🇽Mexico dalin 🇨🇦, 🇲🇽, 🌍

    Love this. Overall it's a huge improvement!

    Some first-impression thoughts:

    * The stock photography feels like a mismatch with the Drupal brand. Any thoughts about getting real Drupal people? But I know that's a challenge with showing something representative, and to get permission. And we don't want a single person (or even a small group) to be "the face of Drupal".
    * The lack of page margins feels like a mistake. Especially with the second component "Flexible by design". On my monitor the 4th option wraps to a second line. This results in only 16px of padding on the left, and about 300px on the right.
    * As others have mentioned, the first component seems too big. I don't even see all of the first sentence on my screen.

  • 🇺🇸United States yesct

    Exciting new update!

    In addition to the color contrast issue on menu already mentioned, Menu hover style has a too low color contrast 🐛 Feedback on Modern Drupal.org Design Active , when I looked on my phone, the text was difficult to read also.

    Though that didn't show on the Chrome lighthouse accessibility report. Hm.

    The lighthouse report does show some other issues:

    Wave also points out some items (some things folks already mentioned). https://wave.webaim.org/

  • 🇺🇸United States yesct

    Re Nestle, I'd also like to see it removed from being highlighted on the front page. Nestle is against many of our values.

  • 🇨🇴Colombia jidrone

    Hello everyone,

    I found this overlap issue in the case studies, it can be easily fixed with a max-width for that text.

  • 🇬🇧United Kingdom simg

    Why does the accept cookies message say "yes, please" rather than "yes" or "ok, sure"?

    The website wants to set cookies, I'm not invested either way.

    It's like if my neighbour asks to borrow my lawn mower, I might say "OK", but I'm not going to say "yes, please".

  • 🇬🇧United Kingdom simg

    In a similar vein, why do I have to click a "Save" button to submit a comment rather than "Submit" or "Send" or "Post".

    "Save" only makes sense from an internal Drupal perspective where you know that comments are just nodes that can be saved. Normal website users wouldn't and shouldn't know about "Save"

  • 🇺🇸United States loopduplicate Burning Token, California

    I felt dizzy when I first looked at it. I think it's the background.

  • 🇺🇸United States karlshea Minneapolis 🇺🇸

    Seconding needing more page margins. Having the header menu run into the side of the window when it has rounded corners looks weird, and the text on the left of most of the block types feels way too close to the edge of the screen. Similar issues with the images on the right side of the blocks with rounded corners hitting the scrollbar.

  • 🇺🇸United States codeknitter

    I think we should make it easier to one click to information about the latest Drupal release.
    Make a super obvious - and at the top - could be the top line of the Download menu that says:

    Drupal 11 - and takes you to release notes, or a landing page that has Drupal CMS and Drupal 11 and information from the release notes right in front about what's in that version of Drupal.

    It doesn't have to be the release notes, but something that's got new features in that version front and center, and makes it MUCH easier to find the install instructions and also the release notes. I think we've de-emphasized that valuable information to the point that when i'm talking to folks new to Drupal - they don't even know where to FIND it.

    Also it looks Great!!

  • Dots on pictures are confusing.

    I want to click them thinking they are navigation of a slideshow - which they are sometimes.

    Not a slideshow

    Not a slideshow

    A slideshow

  • 🇺🇸United States notmike

    The John Cloys testimonial is misleading. It makes it sound like he is speaking on behalf of Princeton University as a whole. John's title is Assistant Director of Web & Digital Initiatives at the Princeton School of Public and International Affairs.

  • 🇸🇪Sweden stefan hamilton

    The grid-list__text style gets way too small on phones and it's contrast against the background is too low in the quote blurb to pass accessibility guidelines.

    The quote blurb has the rounded corners in the actual image which doesn't scale well. Would be better to use a css gradient or image without rounded corners and then use border-radius to round the corners.

    I would also argue that the 45 degree angled stripes in the top hero background contrast too much to the lighter blue background color. They disturb the focus on the content rather than boost it.

  • 🇨🇦Canada mrogers

    Congrats to all involved, this is a major step in the right direction. A couple items I noticed that I didn't see above:

    1. The main menu dropdown on the desktop toggles via hover *and* click. If you try to click an item in the main menu (not knowing it's a dropdown as there's no indication) it starts opening from the hover, and then it immediately closes from the click. Disorientating, should use a single interaction type.

    2. Not sure if you're interested in feedback on content, but the headline "Create ambitious experiences that scale Drupal for Developers" is confusing. You want to say something more like "Drupal empowers developers to create ambitious experiences that scale" or similar.

  • 🇺🇸United States eatings San Francisco, USA

    First thought, a content one:

    It's been my experience with both commercial and non-profit endeavors that if a design + content strategy requires a 'Why $product' page, then the design isn't fully baked.

    More specifically, what would we put on a 'Why Drupal?' page that shouldn't be on the homepage itself? Why force users to dig even more?

    Secondly, the CTA strategy on the page is weak and unclear to me.

    The page seems targeted to extremely top-of-funnel CMS buyers. The only meaningful CTAs within the first 3+ viewports of scrolling are demand-gen content (case studies, etc), and it isn't until the fourth viewport of scrolling that a visitor can take an action that leads to actually interacting with Drupal.

    That's understandable if the intent of the redesign is to pivot d.o into some sort of an organic demand generation engine, but I contend that would be a major site strategy shift that warrants further explanation and socialization from the content and marketing teams.

  • 🇺🇸United States rachelh_design

    I agree with the point about the overall scale being too big. In addition to that, it would be great to add more flexible scaling for the largest type sizes.

    Here's what's on the site now at viewport width 1132px:

    Text size reduced to 60px here:

    If the text can resize fluidly with something like a clamp() function, that would be great. Otherwise, there should at least be some mid-width breakpoint.

    Could be helped even more if you also reduce vertical space between items. Here's 40px less space below the dots and 20px less below the big heading:

  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇰🇬Kyrgyzstan dan_metille

    Navigation spacing and animation issues

    Space between the Drupal logo (including TM) and the first navigation link item is much more narrow than between the other navigation link items. Not a big deal, but this hurt my eyes.

    Also, about the submenu dropdown blocks, the (vertical) padding is very big, even if they overlap the main navigation, that make a big distance to select a sub item. Coupled with the very slow closing animation, it feels like unnecessary loosing precious time.

  • 🇨🇭Switzerland dan2k3k4 Zurich

    Some feedback from colleagues I shared the new design with:

    • The margins are not adding up
    • The icons for the blurbs don't seem to follow a rule on the different pages
    • The font size for the h2 is ridiculously huge on my laptop
  • 🇨🇭Switzerland saschaeggi Zurich

    The letter spacing of the text in the hero on the home page (https://new.drupal.org/homepage) is a bit cramped and hard to read

  • 🇪🇸Spain fjgarlin

    Re #68 - I raised this internally today. It happened after a deployment and it does not on https://drupalorg.prod.cluster.drupalsystems.org/homepage (internal URL only). It is related to our caching most likely, not the design.

  • 🇭🇺Hungary thamas Hungary

    Some random impressions. I try not to repeat what was written already.

    I think the design of the new homepage is just "too much". It could be a bit more consistent – eg. use fewer background pattern variations (stripes, drops, different colors etc.) –, and it could be not so much "loud".

    On the top of the page, in the first section, we see a photo of a single white male, who looks like a bit as a "worker" with an additional tablet. It is also obvious that it is a stock photo. Are we sure that this photo is the best option to represent Drupal's target audience and community?

    In general, the content could be more about what Drupal is, how flexible it is. There could be info about the so many usage options, about that it is an open source software built by a huge community and developed in a very professional way. And there could be less meaningless, "marketing tasting" mentions of the big companies that use Drupal. (That is important too, I know…)

    On a 14inch /~1600px wide screen, the left-right paddings of the sections are just too small! They are not proportionate with the vertical spacings that are used on the page.

    Also, the boxes of the "Flexible by design" section look sloppy on this screen width. 3 boxes in one row the fourth in a separate row. A lot of useless white space on their right side.

    The dropdown boxes of the main menu on the top are not consistent either. "Why drupal" dropdown uses a horizontal alignment, which looks OKish to me. The others use a vertical order of the subitems – in this case, I do not understand why the dropdown is so wide, there is a big, useless white space next to the menu items.

  • 🇪🇸Spain fjgarlin

    Issue reported in #68 is now fixed. If you're interested in why it was because of this: https://drupal.stackexchange.com/questions/318456/how-to-force-the-brows...

  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇵🇰Pakistan imhamad

    Issue Details:

    Un-necessary extra gap on the Tablet screen at "Start your
 Drupal journey"

    Visuals:

    Here's the loom to help better understand the issue. https://www.loom.com/share/81f9facf1ef54bdfb38a40d665aca622

    Supporting Document:

    Screenshot is attached

  • 🇺🇸United States Kristen Pol Santa Cruz, CA, USA

    I put this in Slack, not realizing/remembering this issue existed:

    Maybe this has been discussed already but the new home page sections (not sure about other pages) feel really big which makes things feel "claustrophobic"... I've heard this from several people... are there any plans to user test the page against a number of target personas to understand their perceptions?

    but I see this is covered a few places above.

    Some other things...

    1. I generally like the more fun colors and vibe we are going for so kudos for that
    2. I LOVE that John Cloys is highlighted
    3. I'm not a big fan of the green for the stats/data card section in combination of all the other colors.
    4. The right side of the "Start your Drupal journey" isn't very compelling to me... feels like the text/CTAs get lost in the design
    5. I don't like the word "composable" as I don't think that our target personas will know what that means
    6. The hero has " for Developers" but we are targeting marketers/etc too so hmm
    7. The "around" in "around your vision" seems awkward IMO
    8. Don't love the hero person for some reason and it feels like there's a lot of blue going on in the hero
    9. Perhaps the different case studies highlighted could have a different background color but not sure if that's a good idea or not
    10. My OCD tendencies want text line heights to match up in general (e.g. in the green section, the first is 3 lines and rest are 2 lines... note the first has the 100+ which is redundant)
    11. Already mentioned in Slack and maybe above but it would be good to incorporate real Drupal community members so some "professional" photo shoots would be cool
  • 🇦🇺Australia dabbor

    I do not like the new designs and here's why:

    • The font is too big
    • The image with that guy looking like ostrich, sticking his head out of the screen is not even so funny how it
      looks ridiculously bad.
    • The strips on the background gives me a feeling of prison.
    • The misaligned borders around images and buttons looks more like a mistake then a good design choice.
    • I do not like long scrolling pages, it looks cheap (the designer and communication team couldn't figure out how to say what they want to say in short consistent coherent way.
    • It's good to allow designs to breath providing necessary space, but wasting space so that we can look at a few sentences in nothingness.
    • Is there any colour palette used or the colours were just put on random and so many without any good transition between them (co-relation on the page).
    • I could continue if I had more time, but basically is there any system / thoughts behind the design based on good practices used and existing so far?
  • 🇺🇸United States TolstoyDotCom L.A.

    Re the comments about Nestle above, now do Margaret Sanger.

  • 🇬🇧United Kingdom Jon Pollard

    The homepage design doesn't really hang together as a coherent identity.

    As people have said previously, a lot of elements are too big, but also there doesn't seem to have been enough care given to how the elements work together and how the whole page works for the brand.

    Type sizes, letter-spacing, line-spacing, white-space all seem clumsy. Having a section with four elements and splitting them into a row of three and a row of one is not great.

  • Seconding #56... The "blue cheese" background hurts my eyes

  • 🇮🇪Ireland stella

    Issue reported in #53 above is still an issue on https://new.drupal.org/node/10000007 on the 2nd slide

  • 🇮🇪Ireland stella

    the font is too big for my screensize

    Screen/browser details: https://www.whatsmybrowser.org/b/CSD9W

  • 🇬🇧United Kingdom pdjohnson Manchester

    First of all, wow! The new.drupal.org is amazing! What a quantum leap. I have been spending some time exploring and 2 things strike me.

    1. In the main menu I find this wording "Get Started" a misleading. I am sure it will have been discussed a lot but to me it does not stand our as offering me the opportunity to try Drupal out. This is a true USP for us. https://www.drupal.org/ uses "Demo". This says exactly what it is. Could go with "Try Drupal" or "Try Now". Getting net new visitors to this demo page is a key step towards conversion.
    2. If the intention is to redirect from https://new.drupal.org/drupal towards https://new.drupal.org/get-started this page does not emphasise the opportunity to try a demo strongly enough
    3. The animation on the dropdown on the menu is very tiring on the eye. As you hunt the navigation for what you desire there is a lot of up down up down. I wonder if it is too much.

  • 🇬🇧United Kingdom pdjohnson Manchester
  • 🇩🇪Germany yannickoo Berlin

    This is awesome news, really modern design!

    1. I would love if we can make sure that for the graphics SVG files are being used insteaf of pixelated PNG fileslike this.

    2. Images should be available in at least 2x their size so they look sharp on all devices. Right now this here is a file that is being used and should be provided by designer in a higher resolution

    3. Is an underline really needed inside the mega menu? When hovering items inside the mega menu both the title and the description get an underline. Isn't it better to have the underline just on the title? Otherwise it looks odd and I'm not sure if that is helping a11y more.

    4. The "Platform" menu item has regular underline when hovering + bottom border, I think that regular underline shouldn't be there.

    5. Buttons should have a :focus-visible instead of :focus so people using the cursor doesn't see that extra blue ring

  • 🇨🇭Switzerland saschaeggi Zurich

    5. Buttons should have a :focus-visible instead of :focus so people using the
    cursor doesn't see that extra blue ring

    Regarding yannickoo point 5: From an a11y perspective it still performs better if it's not being specifically being targeted to an input method (tl;dr: using :focus instead of :focus-visible). It's something we leverage in Claro, Gin and in GitLab as well, so I'd vote not to change this behavior.

  • 🇺🇸United States hestenet Portland, OR 🇺🇸
  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    Update

    The following pages are now live:

    We have made a *quite a few* updates based on the feedback in this issue and elsewhere, both large and small. There are also still some issues outstanding that we are working to improve.

    Our general philosophy is:

    Each page won't be perfect as it goes live, but as long as we feel it is an improvement on what it is replacing we'll proceed with the roll out and make iterative improvements.

    I have updated the issue summary with notes on what we've worked on so far.

    There has been additional feedback that I have yet to triage into the IS. I do intend to do that.

  • 🇨🇦Canada mrogers

    Hamburger menu disappears on mobile when you click it.

  • 🇦🇺Australia ryan_witcombe

    Menu item: Get Support > THE DRUPAL ASSOCIATION

    Change to:

    The Drupal Association
    Learn how we support Drupal's growth and innovation - and how you can help.

  • 🇮🇳India keshav patel

    In the menu, the " Local development guide " and " Installing Drupal => Install Drupal using DDEV " Both contain the steps to get started with drupal using ddev, but going through the " Install Drupal using DDEV " page, I found it better descriptive.

    Suggestion:
    We can merge both pages and bring Install Drupal using DDEV link at the primary level (replace at "Local development guide" menu item. )

  • 🇮🇳India djsagar

    For the page https://www.drupal.org/download

    I checked the Extend Drupal section of the page on mobile, the left and right side spaces should be equivalent.

    Get started with Drupal section suggestion on mobile

  • 🇩🇪Germany lmoeni

    When I click the user icon, the page just reloads, and I stay on the home page.

  • 🇸🇰Slovakia poker10

    Links on the https://new.drupal.org/download are not working for me after deploying these changes. There are JS errors in console. (posted also on Slack)

  • 🇮🇳India prem suthar Ahemdabad- Gujrat , Jodhpur - Rajsthan

    Issue: Hamburger Icons and Child Menu Arrow Icons Disappear on Hover for Mobile Responsive Devices

    On all mobile responsive devices, when hovering over the hamburger menu or the arrow icons within the menu, the icons temporarily disappear and reappear once the hover state is removed. This behavior has been consistently observed across devices. A recorded video demonstrating the issue on the iPhone 14 Pro screen size is attached for reference.

    Kindly investigate and address this issue.

  • 🇧🇷Brazil PabloNicolas

    The User Icon link to https://new.drupal.org/user is not working. It redirects back to the homepage.

  • 🇪🇸Spain fjgarlin

    #92 fixed.

  • 🇧🇷Brazil julio_retkwa Balneário Camboriú

    Some buttons on :focus are using --drupal-navy font color on dark background. Carousel items should keep the consistent size

  • 🇪🇸Spain fjgarlin

    #88 and #94 (I think) fixed.

  • 🇩🇪Germany Tomefa Dresden

    #94 is not fixed, I'm logged in and when opening the page https://new.drupal.org/user
    i get redirect after a few seconds to https://new.drupal.org/home

    On big screen, the website is too big, it is disproportionate.
    I need to zoom out to 60% to have something more pleasant.

    But thanks for the improvement of the Design, it is more modern and playful.

  • 🇺🇸United States hot_sauce

    Firefox (latest version, 133) and Safari (18.1.1) on Mac Sequoia 15.1.1 from 2560px to 1459px, no space between "your" and "Drupal" (basically until it breaks to a new line). Chrome (131) is fine.

  • 🇬🇧United Kingdom jacobupal Leeds

    Here's some css which I think improves the appearance of the "Flexible by design" section at narrower screen sizes:

    /* Keeps the gaps between the flexbox items, not at the end */
    .grid-list{
      justify-content: space-between;
    }
    
    /* Display each item as a grid (when narrower than 1400px)  */
    .grid-list__item  {
      display: grid;
      
      /*  Define the grid geometry  */
      grid-template-columns: auto 1fr;
      grid-template-rows: 1fr 1fr;
      gap: 0 1.5rem;
      
      /*  Get rid of the 33% width */
      min-width: calc(50% - 1.5rem);
      
      @media (min-width: 1400px){
          /*  Return to the default appearance above 1400px */
          display: initial;
          min-width: calc(25% - 1.5rem);
      }
    }
    
    /* Define the layout of items when displayed as a grid */
    
    .grid-list__text{
      grid-column: span 2;
    }
    
    .grid-list__heading{
      margin-top:unset;
      width: 100%;
      align-self: end;
        @media (min-width: 1200px){
          margin-top: 2rem;
      }
    }
    
    .grid-list__icon{
      align-self: end;
      img{
        max-width:min-content;
      }
    }
    
    

    (You can test this using a browser extension like Stylus)

    What it does:

    • Keeps gaps between the flex-box items, not at the end, so that the last item in a row always lines up with the right-hand margin.
    • Displays each item as a grid (when narrower than 1400px)
    • Define the grid geometry
    • Get rid of the 33% width
    • Return to the default appearance above 1400px
    • Define the layout of items when displayed as a grid

    Here's how it looks after the change at under 1024px and under 1400px:

  • 🇸🇮Slovenia KlemenDEV

    When I click the user icon, the page just reloads, and I stay on the home page.

    Additionally, there seems no way to access the dashboard in the new UI

  • 🇪🇸Spain fjgarlin

    The dashboard is still available only on the Drupal 7 site ( https://www.drupal.org/dashboard ) as before.

  • 🇨🇦Canada xmacinfo Canada

    I like very much the new home page.

    But, is there work to personalize to some extend the home page for a logged in user?

  • 🇧🇪Belgium BramDriesen Belgium 🇧🇪

    Or, why would a logged in user be redirected automatically to his dashboard instead of a personalized Drupal.org home page?

    That’s currently a preference a user can set :) I for example am always being redirected to my dashboard when going to drupal.org as I have no need to see the “marketing” homepage.

  • 🇨🇿Czech Republic Petr Illek

    Nice to see it is moving forward.

    Could we use SVG's for icons, and convert PNG's to WEBP?
    E.g. this image https://new.drupal.org/assets/styles/large/public/2024-09/unicef-case-he... is 1.2MB large.

    And for the showcase section it might be actually better to have the dashed frame as SVG and only change the image inside.

  • 🇺🇸United States mherchel Gainesville, FL, US

    @petr illek

    There's a MR to convert all of the image styles to WebP. There are some static images that won't be included in that, but as soon as it gets merged and deployed, it'll save around 2MB per pageload.

  • 🇺🇸United States mortona2k Seattle

    How do we access our user account? I don't see a link in the main navigation anymore.

  • 🇪🇸Spain fjgarlin

    User icon is not visible on mobile (known issue) but should be in desktop. You can go to “/user” to get to your account if you’re on a phone.

  • 🇺🇸United States fkelly

    It appears that you gave the middle finger to all your beginner users by removing the Drupal Forums without any notice or mention. They were a long neglected feature on the Drupal dot org site but still sometimes useful to beginner to intermediate users.

    I can understand getting rid of them, but perhaps tell people and maybe have an archive somewhere?

  • 🇩🇪Germany rkoller Nürnberg, Germany

    not sure if that detail was already raised (at least i havent found anything in this thread), but the drop containing images in the hero isn't resizing proportionally in safari 18.1.1 (on macOS 14.7.1) ... in the latest firefox and edge the drop is getting resized proportionally.

    and in the context of #106 🐛 Feedback on Modern Drupal.org Design Active would it make sense to set #3265866: Optimise images on drupal.org active again?

  • 🇨🇦Canada xmacinfo Canada

    @fkelly12054@gmail.com I agree. As soon as the forum was removed from Drupal home page a long time ago, I stopped going over there to answer questions.

    The home page needs to display that there is a live community and exposing a forum block would display that.

    But at minimum a link to the forum is needed.

    I love very much the new design and all the displayed information. But the design is static and will always display the same information. Not sure newbies or regular users will revisit the home page regularly.

  • 🇨🇦Canada andrew.wang

    There seems to be a white margin on the right on mobile (iPhone 13 mini, iOS 17.7.2)?

    If you can’t see it the first time, try doing the zoom out gesture and the white margin appears

  • 🇮🇳India fadilraj

    After opening and closing the hamburger menu on mobile (iPhone 13, Chrome and Brave Browser), the hamburger menu disappears and takes too long (or until the screen is scrolled? I found different behaviour in different browsers. On the Chrome App, it appeared after scrolling and on Brave Browser it took some time) to come back to visibility. This makes the user experience feel slow and uneven.

  • 🇺🇦Ukraine podarok Ukraine

    Hi, partners
    I love a new design
    The only concern I noticed - small font for menu
    It is obviously smaller than all other elements on a page.

    If no need to send people to the subpages from menu - it is ok, but if we need to people actually use it - we need some bigger font there

    Thank you

  • 🇦🇪United Arab Emirates beautifulmind Dubai

    Hello Team,

    You've been doing tremendous work! Congratulations on the new design!

    I noticed that when clicking on the search icon from the home/front page on a desktop, it redirects to the search page instead of displaying a search field. I'm sure you're already aware of this.

    Best regards,

    Beautifulmind

  • 🇩🇰Denmark ressa Copenhagen

    There should definitely be a link to the Drupal Forum in the menu, thanks for raising this problem @fkelly12054@gmail.com and @xmacinfo.

    About linking directly to Slack instead, I'll share this great comment on that subject by @gisle:

    I recently noticed that the link to "Forums" was replaced with a link to "Drupal Slack" in the "Community" pulldown menu. I haven't seen this radical change to our UI announced anywhere, or the rationale behind this decision explained. I think the Forums on Drupal.org so far has served has the primary locus for support for technical support for community members and they are still needed. I don't perceive Slack as a suitable replacement, for the following reasons:

    • Walled garden. Content not indexed for search by external search engines (this is a blocker for me).
    • Closed source/proprietary (Re: Open Web Manifesto ).
    • The community lose ownership of all content created there.
    • Requires users to register a separate account, not tied to Drupal.org account.

    Slack is not built to serve as a support forum. It seems to mainly be intended to serve as a real time chat service. If nobody happens to be around to answer your support question when you ask it, you usually receive no reply. It is not really designed for accumulating knowledge, but for quick exchanges and announcements. It is very hard to find information on Slack about a specific topic if it has been asked a few weeks ago.

    From 📌 Please put link to "Forums" back in the "Community" pulldown menu Active , see also Forum "deprecated" from home page? .

  • 🇵🇱Poland dmitry.korhov Poland, Warsaw

    After clicking on icon user nothing is happened (see login-issue.mov).
    It might be related to existing session from old www.drupal.org domain present but there is no menu to logout or refresh token in new frontend.

  • 🇪🇸Spain fjgarlin

    Login to the new site is still restricted to a handful of users. The rest are logged out automatically. This is only temporary until we open it for everybody.

  • 🇪🇸Spain fjgarlin

    We are actually going to hide the icon to avoid confusion. Once log in is open to everyone it will come back.

  • 🇨🇦Canada xmacinfo Canada

    @ressa Thank you for raising the issue about Slack. I agree with you all the way. And the points you raised are the reason I never install Slack on any of my computers or devices.

    Forum links should direct to a real forum.

  • 🇬🇧United Kingdom aaron.ferris

    'Get Started' is wrapping in Safari (Mac Osx Ventura, Safari 16.6) in the menu, apologies if this has already been raised.

  • 🇬🇧United Kingdom pdjohnson Manchester

    Are we aware that there are multiple issues on the home page if you are browsing with Safari?

  • 🇬🇧United Kingdom pdjohnson Manchester
  • 🇨🇭Switzerland lukas.fischer

    Hero looks somehow broken and too much zoomed:
    This is how it looks for me as of 4th decemeber


    This is my suggestion

    I just made the spacing a bit better and added two buttons.

    There are other section that look broken/zoomed. The site definitely needs some typographic love.

  • a space is needed, looks like a grammar error

  • Publish images in .webp or .avif to save load time, and promote SEO benefits to Google.

  • 🇺🇸United States amazingrando

    Content missing—Drupal product shots and examples of websites built on Drupal

    I looked at some peer products; they all showed off the product and what could be built. Not having these things on the Drupal homepage is a big missed opportunity.

    If I replace "Drupal" with "WordPress", the page is still valid. I'd like to see it show off more Drupal specific things.

    Here are screenshots of the replacement to get the feel for it.

    https://randyoest.com/random/wordpress.png
    https://randyoest.com/random/drupal.png

  • 🇨🇦Canada Charlie ChX Negyesi 🍁Canada

    I hope this is not offensive but at first sight this reads as if sites were running on "Drupal unicef", whatever that may be.

  • First commit to issue fork.
  • 🇪🇸Spain fjgarlin

    @adam_y - the redirect from www.drupal.org to new.drupal.org is a 302 redirect.

  • 🇧🇪Belgium gillesbailleux La Roche-en-Ardenne

    Greetings Drupalistas,

    Full kudos to the persons who made such a fresh and beautiful layout. I am fond of the menu and the content presented is really attractive.

    Please allow me a constructive criticism: there are no schema types, few Open Graph tags, no Twitter Cards Markup Tag and the HTML headings are not creative.

    This is probably an issue in the pipe.

    The metatag and schema_metatag modules are among the best assets of Drupal. Let's use these modules to broaden the visibility of the Drupal project.

  • 🇳🇱Netherlands Remco Hoeneveld

    Overall it looks nice there are some small issues tho i have encountered. For example the slider height varies based on the next and previous slide.

  • 🇨🇦Canada xmacinfo Canada

    I like very much seeing all the new drupal.org look running on top of Drupal 10 and that all those pages are displaying up-to-date information, including the launch date of Drupal CMS.

    Keep up the good work!

  • 🇭🇺Hungary wahavi

    The main emage on https://new.drupal.org/about/11 is distorted on narrower screen sizes.
    The height: 100%; css code for .hero-cover-image__image-area should be removed.

  • 🇵🇹Portugal jcnventura

    Definitively cut down on the "1 in 8 websites". I don't think it was ever true, but it's just getting less true each day. Maybe add a little (*) to the word websites to mean "as defined by BuiltWith's Top 10K list".

    My problem is that this is such a blatant falsehood that anyone coming to Drupal for the first time would lose trust in us when they try to confirm this extraordinary claim, and then fail to do so.

    At the moment, this value should be:

    Even if we talk only about the Top 10K sites, which is where I think the "1 in 8" (12.5%) value comes from. This is no longer true, and it is now closer to "1 in 16", being 6.46% at this moment (https://trends.builtwith.com/cms/Drupal). The last time that the 12.5% value was true for the Top10K was April 2022: https://web.archive.org/web/20220417100720/https://trends.builtwith.com/...

  • 🇵🇹Portugal jcnventura

    Another issue is just how "US centric" this page is. Of the 4 case studies presented, we have:

    1. UNICEF: international organization, with HQ in New York, US (fully support having this one)
    2. State of Georgia: the government of a US state
    3. Princeton University: a US university
    4. Planned Parenthood: a US NGO

    We have many good examples of significant non-US sites, such as the European Union, paralympic.org who organize the Paralympic Games and Amnesty International to name a few good examples from Europe, and I'm pretty sure we can find one good example from each of the other continents (South America, Africa, Asia and Oceania).

  • 🇧🇪Belgium BramDriesen Belgium 🇧🇪

    Re #137

    Seems like there already is a change in content (case 1 is now SYFY). But I agree the others are a bit too US centric.

  • 🇺🇸United States dianacastillo Miami

    hi in my opinion the new design could be more attractive, it looks kind of childish.

  • 🇫🇷France anne-pierre

    Wow!

    Drupal.org has come a long way in 6 months. From the Maverick style "the offer the best of the best digital experience..." to "Create ambitious digital experiences..." where, Drupal is stepping away from looking at how great it is, and instead is focusing on a persona/target user, and their need.

    I am very impressed, as if my impression matters.

    I like very much the fact that Drupal:
    -uses an action verb in its slogan "create"; The choice of the action verb "create" is, I believe a good choice, because it clearly addresses a specific target : the web professional, and not only. Here, Drupal has managed to remain consistent with its historical positioning, and yet, address (and appeal to - I believe, the new generation of web developers);
    -identified a persona to talk to (the young woman): someone from the younger/next generation.

    Doing this, Drupal is clearly kicking WordPress + Joomla out of the market segment of the web professionals. That is quite a trick to pull off and so far, though the message, is not perfect, the homepage is doing the job.

    Well done!

    Points of improvement:
    -The picture of the young woman is that of a person who looks more like she is studying for an accountant degree than an IT degree. This is my 20 cents, I am French, I am +50, and it is my opinion. I am a conservative, and maybe my understanding is culturally biased, still! I recommend, Drupal uses instead a picture of someone photographed during a DrupalCamp, etc. A picture of a real Drupal user. That picture of the young woman looks too much like it was purchased over the internet; It could be on the front page of the NYT or the WSJ. I believe an AI generated portrait would be better than that picture. Come on guys, be bold, apply your digital creativity. Use AI to create your ideal persona-avatar!

    -The choice of colors as backgrounds. Keep the blue tones and hues. Those are typically associated with an IT environment (take a look here: https://epitech.eu, for a, IT environment built by 20 yo for 20 yo under the supervision of 50+). As is, the look and feel of the homepage is that of an engineer for engineers trying to be cool. I do not think the stripes do the job. Unleash the designers!

    Overall, I feel Drupal is with this homepage on the road to carving a fair and well deserved share of the market among web professionals segment. WordPress should start to feel the heat.

    Congratulations, and thank you to the community for providing such a wonderful software.
    Anne-Pierre

  • 🇺🇸United States dianacastillo Miami

    i agree with anne-pierre's comments, put a picture of a person who looks more sophisticated or techi than that girl maybe a little older too. and the stripes are not very pretty , must be a better design .

  • 🇨🇦Canada chrisck BC, Canada

    Menu hover active link

    After moving your mouse into the submenu, the parent active link loses its bottom border and thus it's very easy to lose which parent link you're browsing on. As the submenu is megamenu style, it's hard to judge based on the horizontal positioning which parent link you're browsing.

    From the screenshot below, one would not be able to decipher that we are on "Solutions" without the red annotated bottom border.

  • 🇨🇦Canada chrisck BC, Canada
  • 🇬🇷Greece fotisp

    Very nice! :)

    Some general thoughts.
    Spacing may need some readjustments so sections and sub-sections can "breath" and have enough white space between them.
    Font sizing may need more hierarchically (Section title / section sub titles) not only based on heading type (h2,h3,h4) but also based on placement.
    Big section titles should not have a 100% width, for me is difficult to read and it's a bit "messy" for my eyes.

    Below are some before / after designs based on the above.

  • 🇮🇳India Parvateesam

    For the 'Download' page (https://new.drupal.org/download), Extend Drupal section middle card (themes) are not at the same height in laptop view (1024) wide. It would be better to have an equal height among all three cards. Please find the attached screenshot for your reference.

    I appreciate everyone's hard work in turning this into a new design. It looks amazing.

  • 🇺🇸United States cromination

    It looks like the Platform section will cause some brand confusion. It looks like there are 3 different Drupal "products". Drupal CMS, Drupal Core, and Drupal 11. For the marketing professional or IT buyer on the client side this will likely cause brand confusion.

    From a UX perspective possibly look to rename that section or rename Drupal CMS to something that doesn't dilute Drupal itself from the buyer's perspective. Just a thought.

  • 🇮🇳India vishal.deshmukh Pune

    The 'Learn More about Unicef on Drupal' button is colliding with slider navigation dots at bottom.

  • 🇮🇳India vishal.deshmukh Pune

    Bottom Menu can be improvised, we can add Drupal logo section and menu section vertically arranged, so the menu will looks clean.

  • 🇳🇱Netherlands Martijn de Wit 🇳🇱 The Netherlands

    On mobile view, the hero is cluttered against the message on the frontpage.

  • 🇳🇱Netherlands Martijn de Wit 🇳🇱 The Netherlands

    I just can't understand the new page Hero at the frontpage.

    It scales the width/height of my entire screen. In my opinion there is no use full information displayed. No call to actions no other use full content. The menu fades away by all the distraction.

    The lines in the background make the overall picture very busy, it seems like a lot is happening, but actually nothing is happening.

    As a new visitor who never visits drupal.org I would just click the page away, it just scares me.

  • 🇮🇳India sourav_paul Kolkata

    I've figured out some issues, which I've mentioned in the attach SS.
    specially look into the menu section which makes the site UX so bad.

    my screen resolution 1280px*780px

    Look forward to discuss..
    SS:

    Thanks..

  • 🇬🇧United Kingdom rossb89 Bristol

    Overall, it's looking great! A massive improvement over the old homepage, but here are a couple of things I immediately noticed.

    Footer primary Section

    Between 640px and the next breakpoint of 1024px, the padding doesn't really work in this section IMO.

    Screenshot of 640px - footer primary section

    It would look better if the padding was removed here so that that the gradient background goes 'full bleed' like the breakpoint below. This would also give more room to the menu items which also look a bit squished at the lower end of this breakpoint. At the moment this looks a bit odd and unfinished.

    Main menu - UX

    I've found myself clicking on the top level links in the mega menu more than once over the last few days because they are underlined, but these aren't actually clickable links. I can see the links below have the light blue text as well as an underline on hover, so I guess that is the indication that the links are clickable.

    Main menu - hovered over 'Download'

    Example screenshot above, still, my brain goes "hey an underline, this link must be clickable!" and it is not.. has anyone else noticed this as an issue or is it just me? 😅

  • 🇭🇺Hungary wahavi

    Sorry to say, but there are so many basic problems with this design, that I would not have made it public... The webdesigner who made it cannot be called precise. When I design a new website, the first thing is to check its responsivity.
    I must agree with #139 that on first glance, this design is a bit childish, not a professional website.

  • 🇳🇱Netherlands tinto Amsterdam

    I think the ZT Gatha font shouldn't be used for headers. It's difficult to read and the kerning / spacing looks off.

    It's probably fine to use for the Drupal logo, but for anything else I would avoid it.

  • 🇺🇸United States jess_m

    Hi, due to a medical condition, I have to use dark mode for browsing. For the most part, the majority of the sites I visit and go through the translation that Chrome does with their flags is sufficient enough not to trigger any reaction. I know that for the most part, it's through Chrome unless a dark mode styling is put in place.

    I'm sure it's low priority, but the color reversal between light and dark mode is quite bright and very in charge. That's okay, I can change my glasses and handle it however there is a section on the home page that my glasses can't adjust for with the patterned background. The Flexible by Design becomes completely unreadable.

    I'm trying to add the screenshot I took - but just in case I can't. Recreation can happen by using chrome://flags/ and enable Auto Dark Mode for Web Contents.

  • 🇪🇸Spain dioni

    Hi.

    Menu icon in mobile (testing with S.Galaxy s24) dissapear opening it, and it is not recovered when you close it.

    I will add screenshot later

  • 🇳🇿New Zealand quietone

    https://www.drupal.org/download shows 'Start developing' and then has a box showing the quick-start command. But the quick start command is really for demo use only, not for developing.

  • 🇧🇷Brazil carolpettirossi Campinas - SP

    I'd like to share a feedback more from a user perspective. I'm not reporting bugs.

    I know carousels in banners are no longer used frequently. However, they have been used for a LONG time. Because of this "expectation" of a carousel in the banner, the dots gave me the impression that I could change to a different slide.

  • 🇺🇦Ukraine _shy Ukraine, Lutsk 🇺🇦

    Seems like it's not possible to access some links from the mega menu. I tried to open a "Drupal CMS" link from the menu and instead of redirecting just another mega menu item was opened.

    Here is an example:

  • 🇺🇸United States cainaru Norwood, NY, USA

    Congratulations on the new design! It does feel refreshing, and full of a very playful and whimsical nature; it is definitely growing on me!

    I have some constructive feedback that I haven't seen anyone else mention yet:

    For links that are styled by the .button--primary class, the text of the link is visually unreadable when focusing on the link (e.g., when navigating the page via keyboard). When the link is in the focus state, the text color gets set to the same color as the background-color. I'm using Chrome 131 on macOS (Sequoia).

    Screenshots below:

    From https://new.drupal.org/about/11

    From https://new.drupal.org/drupal-cms/release-candidate

    Steps to reproduce:

    1. On a laptop or desktop in browser, visit any pages that use the new design (e.g., https://new.drupal.org/home, https://new.drupal.org/about/11, etc.).
    2. Using the Tab key on your keyboard, navigate to the "Get Started" link that is in the main menu to activate the focus state.
    3. Verify that even when focused, you can still read the text "Get Started".
      1. Expected result: The "Get Started" text should still be visually readable when focused on.
      2. Actual result: The "Get Started" text is no longer visually readable when focused on.
    4. Continue to Tab throughout the page to focus on other styled links that are present on the page to verify that text is still readable even when focused.

    Recommended solution:

    1. Verify with the style guide or design system being used what the intended focus state styling for buttons or links that use the .button--primary class is supposed to be (e.g., on focus, should the text color be set to var(--drupal-white), or should the text color remain var(--drupal-navy) but the background-color changes to var(--drupal-white), or something else?) .
    2. Once the intended focus state styling for .button--primary is verified, add the appropriate styling for .button--primary:focus.
  • 🇫🇷France greg.harvey

    Hello!

    Quick note to say I find this Platform menu confusing:

    It leaves me wondering what the difference is between Drupal Core and Drupal 11 when they're essentially the same thing, right?

    Thanks,

    Greg

  • 🇬🇧United Kingdom welly

    Overall, I like the site refresh. It's much more modern so well done to all that was involved in this.

    A few comments that have possibly been already made previously but I'll add mine anyway.

    The three dots on the big blue block - I was expecting those to action something but clicking them furiously left me unsure if something was broken as they didn't seem to do anything. I'm not sure what they're supposed to represent if not buttons. I guess some kind of design motif?

    The striped background when I first saw it, I think I recoiled a bit. Perhaps a bit more subtle - I'm not sure I like it personally (but other people may well do) but I suppose it's not completely offensive :) I'm just not that keen, personal opinion I suppose.

    Drupal CMS and Drupal Core descriptions in the menu - while I know what these are, the description doesn't really make it clear what they are. I think something a little more descriptive than the current, somewhat cryptic, words. It just doesn't say what each thing is. Perhaps a bit less marketing and a bit more clarity on those words.

    The Drupal 11 link doesn't have any hover text - not sure if this might have some impact on accessibility.

    Those are just a few points that immediately jump out at me, but otherwise a great refresh. Must have been a lot of work for a bunch of people to then come in and whinge about background images and so on :)

  • 🇦🇺Australia thursday_bw

    I'm not the first to mention it.. the stripes.. I notice in the description that it's marked as "mostly won't fix", and I wonder the reasoning for that when there is significant number of people recoiling at them.

    I really like the look of the live pages that do not have the stripes, unfortunately the that does have them is the home page.
    I'm also not entirely sure it's the stripes alone that are off putting becuase that page has a differnt layout. The two pages I like have the Drupal Logo overlaid and a picture masked behind it, whereas the home page has a block with another block calling out and it looks unbalanced, the stripes make this feel even worse.

  • 🇺🇸United States Owen Barton

    The diagonal stripes generate an optical illusion for me where it looks like the page is moving: it's extremely distracting and makes it really hard to read any of the other text on the page, or scan around to look for waypoints.

    It seems like a significant accessibility issue for a tool that takes great pride in it's accessibility - given that this affects several people in the relatively limited set of folks who have viewed the new design, it seems like it would affect a large number of visitors.

    Diagonal lines are pretty famous for leading to this type of effect and the foundation for many optical illusions - I think there is a reason you don't often see full-width repeating diagonals used for page backgrounds.

    My suggestion is to drop using diagonals completely here and pick a solid color, color fade or a subtle texture that adds character without distracting from the content.

  • 🇺🇸United States brad.bulger

    Where is my dashboard? Where do I log in? How do I use the site to actually do things, as opposed to browse it while waiting in the dentist's office?

  • 🇪🇸Spain fjgarlin

    The user icon is not visible in the mobile menu (known issue which is fixed but yet to be deployed) so you can go to www.drupal.org/user to log in if you’re navigating from the phone.

  • 🇦🇺Australia PetarB

    This is a very amateur update.

    This redesign is actively hurting the Drupal brand.

    Some issues:

    There is no link to login, or more broadly to actually use the site functionally, like download software

    The graphic elements such as the diagonal bars everywhere will date very, very quickly.

    There is a lot of empty vertical space, meaning the user has to scroll for no good reason.

    The cheap stock photography using generic models will date very, very quickly.

    The different UI styles within the menu look like a incomplete design exercise.

    The circle UI elements are non-functional on the header area - are they a design element? - then functional on the carousel lower down. This is something a first-year web design student would do.

    The footer section with unhidden li tags is simply unfinished embarrassment.

    I applaud the drive to update the site, but this is not it. Very disappointing.

  • 🇯🇵Japan ilfelice

    PC menu updated for enhanced readability: links are in standard case and thus spaced for better clarity.

  • 🇬🇧United Kingdom aaron.ferris

    Is "Start your
Drupal journey" intentional Vs "Start your Drupal journey"

  • 🇬🇧United Kingdom aaron.ferris

    To showcase the above comment

  • 🇨🇦Canada xmacinfo Canada

    “Skip to links” targets are missing:

    <div id="skip-link" tabindex="-1">
      <a href="#main-content" class="visually-hidden focusable">
        Skip to main content
      </a>
      <a href="#search-block-form" class="visually-hidden focusable skip-link-search">
        Skip to search
      </a>
    </div>

    Since the design does not have a search form, the “Skip to search” link should be removed.

    The “Skip to main content” link should instead target “#block-bluecheese-content” as “#main-content”. Or, alternatively, the “#block-bluecheese-content” div should be renamed to “#main-content”.

  • 🇨🇦Canada paintingguy

    Sorry to be negative but the direction 11 is going isn't very impressive anymore. Good luck trying to accommodate the world's finest CMS into a Google snippet formula. I'm having a hard time adjusting to changes.

  • 🇯🇵Japan ilfelice

    Howdy,

    I think we all want to be positive and help here, but this front page with undeniably unfinished design and content is clearly not ready for prime time.

    I think we can all agree that doing a redesign exercise on a live site is not recommended good practice.

    For the sake of avoiding further damage to the Drupal brand, please consider reverting to the original front page and moving this redesign exercise to a staging page where only those people who want to help make it better can access it.

  • 🇧🇪Belgium BramDriesen Belgium 🇧🇪

    For the sake of avoiding further damage to the Drupal brand, please consider reverting to the original front page and moving this redesign exercise to a staging page where only those people who want to help make it better can access it.

    That’s how it was before. The new UI was announced at DrupalCon Barcelona and was actually staged already a few weeks before that on new.drupal.org. Everyone was invited to test and post their constructive comments here.

  • 🇯🇵Japan ilfelice

    That’s how it was before. The new UI was announced at DrupalCon Barcelona and was actually staged already a few weeks before that on new.drupal.org. Everyone was invited to test and post their constructive comments here.

    I understand. However, I can't help but wonder why this moved from staging to live in its current state when people are still reporting issues. It's difficult to reconcile the drive to market Drupal to marketers, designers, and content creators with what seems to be a less-than-ideal redesign process and such lenient criteria for going live.

    But I digress...

  • Shame the site update did nothing about issue 3457398 which if anything is worse than ever.

    But anyway, moving on.

    My ability to check out the site in my normal browser was limited due to the issue above, but I will note the top hover menu seems "sensitive" to me. It's large, so the annoyance is less noticeable, but maybe add a brief CSS transition delay on hiding it to make it more forgiving to mouse hover position.

  • 🇲🇾Malaysia aidil

    Topbar #header element missing left and right margins in mobile up to 1610px breakpoint views. This might be intentional, but seems a bit off.

    How to reproduce

    1. View https://new.drupal.org/home
    2. In Chrome's Developer Tools, go to "Toggle device toolbar".
    3. To see the topbar header without left and right margins, view the page in the Mobile S.. upto Desktop L..

    Screenshot

    Proposed solution

    1. If the intention is to have the topbar with 0 left right margins, then perhaps omit the radius in mobile view.
    2. Else, add left and right margins for mobile upto 1610 breakpoints.
    header, .header {
        @media (max-width: 1610px) {
            right:1rem;
            left:1rem;
            justify-content:space-between;
        }
    }
    
  • 🇮🇳India geekinformatic

    Complete page looks break, Here is the attached screenshot which i have looked on chrome browser.

  • 🇭🇺Hungary atomi

    The new look of the Drupal.org website is pathetically ugly. It looks like a beginner made it from free elements. The old one was nice and easy to understand. Why do they want to kill Drupal? They started by saying that the old, important modules were not made for version 10, e.g. Rules, etc. Instead, there is a rudimentary ECA, which is a piece of crap, buggy, inconsistent, unreliable. It is no coincidence that a few weeks ago it dropped from 7 thousand to 4 thousand, and even 7 thousand is small compared to the 130 thousand of Rules.

  • 🇺🇸United States mherchel Gainesville, FL, US

    The new look of the Drupal.org website is pathetically ugly. It looks like a beginner made it from free elements. The old one was nice and easy to understand. Why do they want to kill Drupal?

    @atomi This is one of the rudest tasteless comments that I've ever seen in my 17+ years on Drupal.org. Lots of people worked on this, and it's a far step above the previous design.

    Delete your comment.

  • 🇺🇸United States markabur

    In the footer, "Signup for Drupal News" should be "Sign up for Drupal news" as on the old site.

    "Signup" is a noun. "Sign up" is a verb.

  • One shock btw, is that the entire site menu is completely non-functional without javascript.
    https://www.kryogenix.org/code/browser/everyonehasjs.html

    It's pretty easy to make menus that work with optional or no JS these days, even with mobile friendly variants.

  • 🇯🇵Japan ilfelice

    I just noticed that Drupal logotype in the header is different from the logotype in the D7 front page.

    BEFORE

    AFTER

    After a little research, I found the following Drupal Brand Guidelines (which I was not aware of):

    https://drupal.widencollective.com/portals/gfvztttq/BrandPortal

    These guidelines explain most (if not all) choices made for the design of this new front page. The new logotype, the background patterns, the boxes, the (wierd) design elements, etc., all is defined here.

    Being that the case, it seems as if there is no room for much change or improvement to the design itself... sigh...

    Anyways, posting for those (who like me) where not aware of these guidelines.

  • 🇪🇹Ethiopia tsega

    The issue with #93 is related to the background color of the hamburger / close (x) icons (spans) which is set to the currentColor of the parent button.

    When the hamburger icon is clicked the color property of the parent button is set to var(--drupal-white) which hides the close (X) icon because it blends with the white background of the menu bar.

  • 🇫🇮Finland anaconda777

    I like the old Drupal.org look much more, because it allows me to log in to Drupal.org when the screen is narrower than 1280px.

    Now the user -icon dissapears somewhere when scaling the browser window smaller than 1280px width, and I cant see the login icon anywhare. Cant also find it from the menus.

  • 🇫🇮Finland anaconda777

    I also found these brand guidelines here:
    https://drupal.widencollective.com/portals/gfvztttq/BrandPortal

    If the new Drupal site is made using these guidelines, and this is made by some advertising company, and these are not gone trough a proper usability testing, I wish Drupal.org a good luck. Because if this is the case (sorry I havent had time to actually find out what is the actual process) we are then repeating the most basic mistake what a web design can do, its called "trust the advertising agency and forget usability testing". Okey, anyway I dont know what is the actual process, but if the user icon already drops out when the screen is narrow, and there is no login link in the header, that is a catastrophic usability issue and for me it looks like there has been not a proper usability testing. Asking feedback from the community is far from usability testing and does not lead proper findings of possible usability issues. So I hope any kind of design change goes trough a proper usability testing with real users and real usability professionals using proper usability testing methods. Advertising agencies usually wont do these. The way is not to put pages in production and then ask feedback, that is 1990 way.

  • 🇦🇺Australia thursday_bw

    That’s how it was before. The new UI was announced at DrupalCon Barcelona and was actually staged already a few weeks before that on new.drupal.org. Everyone was invited to test and post their constructive comments here.

    That's literally amusing.

    I have been doing Drupal News videos and paying very close attention to the developments of Starshot for thr past few motnhs and yet I missed that news entirely even after watching Dries's key note from Barcelone.

    The is zero mention of it on drupal.org/news that I can see, and I've been through that in detail looking for items of interest. A rebrand of Drupal's look and feel would have been front page news.

    I was aware of SDDS; That acronym standing for Starshot Demo Design System, the keyword there being demo.

    I was 100% under the impression that this design was whipped together in a rush in order to demo design system use in Starshot in Barcelona.

    It's a massive shock to now realise this design is meant for production and Drupal's new branding. I never would have imagined it.

    The community is receiving multiple feedback, much of it negative, now because it is now that the community is actually aware.

    If the community was supposed to be aware of this months ago then there has be a serious communication breakdown.

    The argument that "it was announced at Barcelona" is reminiscent of Author Dent's house being demolished and the council claiming he had been informed because therr was a note in a locked file cabinet in a basement behind a door that said "do not enter".

    Now that the community is aware of the situation, it would be wise to consider their feedback rather than make comments that read basically as "you had you chance when didn't fell you".

    Just because you like the new look doesn't mean it:s not sending ripples of negativity into he client, community and customer base.

    Sure, it's a matter of taste but I don't recall anyone ever complaining about the previous look and feel.

    The comments on this issue smack of "no, we won't hear your negative feedback on if it looks good or not because we do not want to know about it"

  • 🇨🇦Canada xmacinfo Canada

    Note that Drupal 7 EOL is today. That may explain the rush to switch to the new home and the marketing pages to Drupal 10.

    I prefer an unfinished home page running on Drupal 10 than a home page still advertising running on Drupal 7.

    Let's hope that other parts or Drupal.org that are still running on Drupal 7 will switch to Drupal 10 or 11 very soon. Changing only the font for H1 to Hx tags is not sufficient.

  • 🇧🇪Belgium BramDriesen Belgium 🇧🇪

    Re #192 Note that I have nothing to do, at all, with the re-design or the development of it.

    The argument that "it was announced at Barcelona" is reminiscent of Author Dent's house being demolished and the council claiming he had been informed because therr was a note in a locked file cabinet in a basement behind a door that said "do not enter".
    ....
    comments that read basically as "you had you chance when didn't fell you".

    You are pulling my comment out of context. My comment was as a reply to a comment that the redesign was "just" published without it being staged and without time for the community to respond and give feedback.

    I have been doing Drupal News videos and paying very close attention to the developments of Starshot for thr past few motnhs and yet I missed that news entirely even after watching Dries's key note from Barcelone.

    It was mentioned here with the preview link below it: https://youtu.be/nhPiL4g972A?si=VkXZoYImcGMZVOE9&t=1088
    The brand redesign itself was apparently even shown in Portland (I did not watch that Driesnote 🙂).

  • 🇭🇺Hungary atomi

    @mherchel Facts are stubborn things. The truth hurts.
    The new look must be placed on a subdomain, not the good and working old site!

  • 🇬🇧United Kingdom welly

    @atomi there are no "facts" or "truth" in your comments. It is nothing more or less than opinion. Please don't use those words if you don't understand the meaning of them.

    Your earlier comment was rude. Even if you absolutely hate the new design, you didn't provide any constructive criticism - you were rude and unhelpful. If you hate the new design, then say why rather than just post nasty remarks.

  • 🇺🇸United States markie Albuquerque, NM

    This discussion appears to include content that may easily be misinterpreted, creating the possibility of escalation. This may lead the thread in a non-productive direction. Please be mindful of how your comment may be understood and think about its impact. Even the best intentions may be lost if the content is not understood to be respectful. It is important to the community that all members are shown the appropriate amount of respect and openness when working together.

    In order for our Drupal Community to thrive, we need to move forward with mindfulness and empathy.

    For more information, please refer to Drupal’s Values and Principles of be constructively honest, and relentlessly optimistic . Additionally, there are resources offered by the Drupal community to aid conflict resolution should those be needed.

    This comment is provided as a service (currently being tested) of the Drupal Community Health Team as part of a project to encourage all participants to engage in positive discourse. For more information, please visit https://www.drupal.org/project/drupal_cwg/issues/3129687 .

  • 🇨🇦Canada andrew.wang

    This discussion seems to be getting spicy... In the spirit of constructive criticism, here's my take on the new design - first thing first, yes, I hate it too.

    Six years ago, the place I worked at hired an agency for a new visual identity. I didn't like it, but I had no say in design so I just kept quiet and complied. Fast forward to today, when I saw the new Drupal.org design, it instantly gave me flashbacks from six years ago - it uses almost the same set of design elements from that design by the agency - logo broken into parts, logo zoomed in to be used as supergraphic, with stock photography of happy people filled into the supergraphics, you name it... It feels exactly the same, just a different logo.

    What irks me the most is that the new design seems to has lost the soul of Drupal. I really like what @amazingrando said in #127 - the new site still feels valid if you replace every instance of "Drupal" with "WordPress". Heck, it even doesn't look too weird if I replace "Drupal" with "UnitedHealthcare" - guess what, their home page is also filled with stock photography of happy people...

    When I go to apple.com, I see a giant picture of an iPhone; when I go to react.dev, I see pictures and examples that give me an ideas of what using React feels like; but when I go to drupal.org, all I see is just stock photography of happy people, testimonials and big numbers. How do I know if Drupal is what I need without seeing the actual product? So Drupal, please show me the damn thing!

  • 🇲🇾Malaysia aidil

    edit:
    Add summary of issue in issue summary.

  • 🇲🇾Malaysia aidil

    Huge image filesizes in the case studies section. All 3 are beyond 1MB each.

    Suggested solution
    Instead of saving these images as PNG, the 'frame' itself could be a png, with its center being transparent. This frame would be positioned absolutely over the photo (which itself should be a jpg or webp).

    This could bring down the file sizes significantly and makes the case study section easier to maintain.

  • 🇩🇪Germany rkoller Nürnberg, Germany

    @aidil in regard of image sizes, there is https://www.drupal.org/project/drupalorg/issues/3265866 ... with drupal 10/11 available that issue might make sense to set active again? and i agree using pngs for images isnt the best choice (photos should better be jpg,webp and/or avif and should also be optimized as well - just optimizing the "woman with laptop" png with imageoptim saved 75,3% in file size)

  • 🇧🇪Belgium BramDriesen Belgium 🇧🇪

    Large images were also reported in #105 there it was suggested to convert to SVG which I think is a better approach. 🙂 But I ain't a front-end developer.

  • 🇲🇾Malaysia aidil

    @rkoller activating that issue once the site is 100% new might make sense. You're right about optimising in imageoptim. Also, knowing when best to use png vs jpg is also crucial, so might help educating editors with the help of micro help text under image upload fields e.g. "For optimal results, use jpg for photos without transparency OR use png for graphics" while limiting image sizes to ~500KB per upload.

    @bramdriesen oh man, I missed that comment 😅.
    Both SVG or 2x PNG might work, just need to test them out to see which works best.

  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    Thank you everyone for your additional comments. I'll provide another update of recent and in-progress fixes as well as triage the additional feedback here in the new year.

  • 🇺🇸United States jennypanighetti

    Echoing the comment above about the blue stripes. Still too strong!

  • 🇨🇦Canada joseph.olstad

    One of my better clients in a meeting just now mentioned that they prefer the previous d.o theme.

  • 🇺🇸United States heatherwoz Seattle

    The very first reported feedback comment was about the overall scale. Some improvements were made there, but it still feels large and cartoonish to me. The use of so many color blocks with tertiary colors may contribute to that. It does not instill confidence in the platform. There are some places where a single sentence takes up the entire screen as you scroll (for example on drupal-cms and about/overview/technical). I think further adjustments to design scale and text size would improve readability and convey the "powerful" and "secure" brand attributes.

    I also find the new navigation overwhelming. Seven site sections each with multiple pages below them with both page titles and descriptions. It is a lot to process. It would be nice if the seven major sections could be organized into fewer. There does seem overlap between Develop and Download, and it's confusing that there is the word Support twice with different purposes. I realize DA wants to attract members and donations, but that is not going to be the primary focus for most users coming to the site. I am not sure it justifies a whole separate item on the main nav.

    Eliminating the text descriptions under the menu items would go a long ways toward cleaning it up. With good menu labels the items should stand on their own. It adds visual clutter and cognitive load having a description under each item. In most cases, I don't think the descriptions add any helpful information that a user wouldn't intuit from the title. I guess this is the debate about the usability of mega menus, whether they are truly more user-friendly than a streamlined dropdown menu.

  • 🇦🇺Australia imclean Tasmania

    In terms of content, I agree with #127 and #199. It would be good to show off the product, including some admin screens.

  • 🇮🇳India Mittal Saurabh Gurgoan

    In Footer social icon section, Twitter icon link should https:// and shouldn't bare domain.

  • 🇻🇳Vietnam niallmurphy-ie

    "Decoupled components" on a slide about an abortion provider..

  • 🇺🇸United States kimble

    I totally agree with others about scale. It so large I have to scroll to see all of any block of content.

    I also agree with another comment that it does not inspire confidence. It's more like billboard after billboard as I scroll to find information I'm looking for.

    What's the goal of making everything so big?

  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    @kimble - a second round of scale adjustments is definitely very high on the priority list, after some key functional issues and bug fixes, and now that we're back from holidays and are going to have Drupal CMS launched next week.

  • 🇺🇸United States emjayess

    I'm five seconds into a forced experience of this new design, and am frantically searching for the option to opt-out!

    A top-level primary navigation bar, with non-navigable menu items... ugh. Instead these appear to be hover-triggered, animated mega menus or some such... might as well start taking side bets on whether these are going to result in seizures, or merely headaches.

    You have to offer something constructive, to invite constructive feedback. I'm old enough to remember an ancient time when Drupal cared about accessibility and user experience.

  • 🇹🇭Thailand AlfTheCat

    I'm sad to see Drupal keeps doubling down on a destructive focus on neo-marxist "wokeism".

    It's anti-thetical to the notion of merit and innovation and it will not end well.

  • 🇬🇧United Kingdom rattusrattus

    On the Drupal CMS Release Candidate is Available page, When the anchor with text "2. Download Drupal CMS zip" is focused the text becomes invisible.

  • 🇺🇸United States rkquigley

    Content area text and images are way too big: there's not enough content in the viewable area. I actually moved my head backwards when I opened the page for the first time.

  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    A top-level primary navigation bar, with non-navigable menu items... ugh. Instead these appear to be hover-triggered, animated mega menus or some such... might as well start taking side bets on whether these are going to result in seizures, or merely headaches.

    🤔 The old D7 drupal.org menu (which we have had since at least 2017?) - is the same on all the points you reference here, though we are doing another pass on keyboard nav and looking at non-js fallback. You can still see this here: https://www.drupal.org/documentation

    I'm sad to see Drupal keeps doubling down on a destructive focus on neo-marxist "wokeism".

    As a member of this community for the nearly 19 years, and CTO of the Drupal Association for the last 10, I will wear this xenophobic word salad as a badge of honor for the rest of my days. 🥇

    To everyone who has been respectful, or even harsh but fair, thank you for your feedback. Many community members (with full time design, user experience, and accessibility backgrounds) have been involved through the whole process - and will continue to help our very small staff iterate and improve on this work in the open source spirit.

    I appreciate the patience and encouragement from those who have offered it.

    Once I complete an issue summary update - I expect to close this mega-issue in favor of focused child issues on the concrete feedback we can work to resolve.

  • 🇨🇦Canada xmacinfo Canada

    @hestenet We know the priorities are to finish the new home and “marketing” pages running on Drupal 10 and fix the various issues along with launching the pages for Drupal CMS tomorrow.

    But what is the official word on the pages that are still running on Drupal 7?

    D7 : https://www.drupal.org/about
    D7 : https://www.drupal.org/node/3060
    D7 : https://jobs.drupal.org/home

    Drupal 7 is not supported anymore but the core pages of drupal.org are still on Drupal 7. Can we consider Drupal.org being secure, now?

  • What I immediately noticed was the lack of contrast between the striped background and the foreground. It overwhelms the eyes, and I wasn't sure where to look at first.

    Possible solutions:
    - Remove Background/Make it more simple
    - Something like a shadow or border between the foreground and striped background

  • After having clicked on the hover bar, there are several unintuive behaviours

    - After clicking, unhovering, then rehovering the mouse, the menu can open/close multiple times instead of exactly once
    - The clicked menu stays underlined after having clicked on it, even though the submenu doesn't show anymore. This is redundant state, as the submenu is not open anymore, and can confuse the users.

    All reports are from Safari on macOs Sonoma

  • 🇺🇸United States jdleonard Austin, TX, USA

    The "Download Recipes" link at https://new.drupal.org/download points to https://new.drupal.org/node/3192814 which redirects to https://new.drupal.org/home which isn't where one "downloads" recipes.

  • 🇺🇸United States jdleonard Austin, TX, USA
  • 🇺🇸United States paramnida


    The link "Read DrupalCMS documentation" on the hero is almost completely unreadable.

  • 🇮🇳India krishnarp

    Any reason why social icons open in same tab?

  • 🇨🇿Czech Republic landsman

    Drupal CMS landing page feedback:

    Please modify CTA to point to anchor on the page where the form is, to avoid following scenario.

    My steps:
    1. visit https://new.drupal.org/drupal-cms
    2. click to "Start building with Drupal CMS" (here is second button "Read DrupalCMS documentation" next to it - invisible... bug...)
    3. kinda did not expect this redirect where I have to look for button again
    4. so I click to "Get Started" in top of the page
    5. nothing happened
    6. so I click again ...
    7. than I realize that I should scroll down probably
    8. there it is... the form ...

    It is stupid, when you read this, but try it on smaller display, for example 13" MBC Air.

  • 🇸🇰Slovakia poker10

    Seems like Drupal CMS is now the default "download" on https://new.drupal.org/download.

    Any reason why the block "Get started with Drupal" is not on the top of the page to clearly explain the differences between these two? I doubt a lot of people will scroll to the bottom to check the Gest started block with the comparision. I am not sure how a user, who visit the download page, should make a decision based on the first "Start Developing" block. Any thoughts?

    I filled 📌 Clearly explain differences between Drupal CMS and Drupal core on Downloads page Active to fix this. Thanks!

  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    @krishnarp - the prevailing accessibility best practice for screen readers and keyboard navigation that we've followed for the last decade plus has actually been to make all links load in the same window rather than extra windows. If there is new documented accessibility research about that being different for external links like social links specifically, please let me know.

    @poker10 - move the comparison cards to the top, and will make further edits in the child issue - thanks.

    @everyone-concerned-with-page scale - you hopefully noticed some iterative, but targeted improvements to header, text, and margins on especially the top level hero components, but in a couple other places as well. My MR for this was merged by fjgarlin on my team this morning. Didn't want to do anything more dramatic, but now any individual component should fully fit on a 13" macbook screen at 100% zoom.

  • 🇺🇸United States jdleonard Austin, TX, USA

    The "Try Out Drupal CMS" link at https://new.drupal.org/docs/drupal-cms/get-started/install-drupal-cms is broken. It points to https://new.drupal.org/docs/drupal-cms/get-started/install-drupal-cms/tr... and when logged out, it requires log in. When logged in, it redirects to https://www.drupal.org/dashboard

  • 🇺🇸United States jdleonard Austin, TX, USA
  • 🇺🇸United States hestenet Portland, OR 🇺🇸

    @jdleonard - thank you - looks like that page wasn't ready yet - so I've linked directly the trial instead

  • 🇺🇸United States benmirkhah

    Let's face it, drupal.org has never been a good looking site to begin with for as long as I can remember (since version 4) and until now one could write off such lack of aesthetic as a no-nonsense utilitarian design approach akin to Craigslist or Google's front page,

    It's truly bewildering how a group of tech savvy stakeholders could ever approve such an ugly design that departs from the utilitarian aesthetic by including random photos and color palettes.

    This the opposite of the proverbial "putting lipstick on a pig" as it looks like the pig took a mud bath, how can anyone consider this an improvement is beyond comprehension.

    Sure, tastes are subjective and this is a volunteered effort, but a quick visit to similar open-source projects like plone.org, joomla.org or typo3.org can shed some light on current design trends, wordpress.com was intentionally excluded because it'd be an unfair comparison.

    Forgive the harsh criticism and don't shoot the messenger, someone had to point out the emperor is naked.

  • 🇳🇴Norway svenryen

    First of all! Great work with Drupal CMS and the kickoff! This really rocks!

    I'm not sure if this is the right venue for reporting issues with the new content on drupal.org, but I've found that the "move your site to a hosting provider" link on this page leads to a 404:

    https://new.drupal.org/docs/drupal-cms/get-started/get-to-know-drupal-cm...

  • 🇩🇪Germany stolzenhain

    Great work and great community approach for refinement!

    1. I second #75 in linking some sort of public styleguide doc for future reference
    2. As #144 notes, text wrapping could improve – “Open Source means no vendor lock-in” would wrap as proposed using non-breaking hyphens/spaces as special chars: “Open Source means no vendor lockin”

    Note: the example above replaces the non-breaking spaces (NO-BREAK SPACE / Unicode: U+00A0, UTF-8: C2 A0) with regular spaces but not the non-breaking hyphen (NON-BREAKING HYPHEN / Unicode: U+2011, UTF-8: E2 80 91) – interesting

  • 🇩🇪Germany stolzenhain

    Looking at the network tab, the 2 biggest visuals take up 987 KB – find attached 2 refined versions using ImageOptim, saving 900 KB

    Specs: 70% PNG quality (for less color bleed), 60% JPG quality (visual comparison on 1920px width)

  • 🇨🇿Czech Republic krutihlav

    Great work and a beautiful new look. A little childish and playful, but still serious and trustworthy.

    I noticed a small error: on the page https://new.drupal.org/download the link "Read the Drupal CMS docs" is leaking out of the white frame. It's hard to read.

    suggested solution:
    Change link to button with background color .

  • 🇨🇿Czech Republic krutihlav

    Great work and a beautiful new look. A little childish and playful, but still serious and trustworthy.

    I noticed a small error: on the page https://new.drupal.org/download the link "Read the Drupal CMS docs" is leaking out of the white frame. It's hard to read.

    suggested solution:
    Change link to button with background color .

  • 🇺🇸United States cellear San Francisco Bay Area

    Let's make it easier to find information about actually using Drupal

    I reviewed the download experience from the perspective of a new user who had never seen the Drupal administration experience. It was hard to find! There were a number of different paths that could be taken, and repeated exhortations to give Drupal a try, while not making it easy to find information about how to make it do anything once you've been convinced to try it. The same information is confusingly repeated in a number of places, and it's easy to get lost.

    Let me illustrate:

    If you scroll down the new Home Page looking for information about "what is this and how does it work" the first CTA you see that answers that question is the "Learn about Drupal CMS" button. The ensuing page (after offering you a second chance to "try") leads you to "Read Drupal CMS documentation"

    The intro text for this page is fine (I realize how difficult it is to write stuff like this) -- my objection is about the structure of the next part, which doesn't offer a clear path for the user to follow. Currently, it looks like this:

    I'll spare you more detail (!) but my fundamental point is this: The hypothetical new user, wondering what this Drupal thing is and how to use it, has to keep scrolling past repeated offers to try Drupal before finally reaching a page that makes any attempt to tell them how -- this one:

    https://new.drupal.org/docs/drupal-cms/get-started/get-to-know-drupal-cm...

    The content on that page is actually pretty good, but I don't think many of the users that need it will find it! It's four clicks in, and each intermediate page offers several ways to get "lost" without getting to the information you need.

    I realize that's a lot of verbiage, so here are two actionable suggestions:

    1. At the Drupal CMS User Guide page, remove the links on h2 headers, and just let them be headers.
    2. Either move the Getting around Drupal CMS page closer to the beginning of the user journey, or provide a clear path to get there.

    We provide lots of opportunities for people to install or try Drupal CMS, but mostly leave them on their own about what they should do when they get there. Let's make it easier for them to find a friendly voice willing to show them how things work.

  • 🇺🇸United States bruna.sd

    There is a typo on this page.

    Text reads "Optimized for colloboration," instead of, "Optimized for collaboration."

  • 🇪🇸Spain fjgarlin

    Just corrected the typo in #244. Thanks.

  • 🇦🇪United Arab Emirates beautifulmind Dubai

    When logged into the site, the homepage doesn't seem to update accordingly. Clicking the 'user' icon still displays the 'login' link.

    I trust that efforts are being made to resolve this.

    Regards.

  • If your already logged in, and you use the user menu. It still just says login. When clicked it skips the login form and go right to the "my account" page.
    Having a menu target to the user dashboard would be awesome. As that is always the first thing i check.

  • 🇨🇿Czech Republic krutihlav

    It's probably good idea to add `text-wrap: balance` to CTA title CSS at https://new.drupal.org/about/11

    .cta-section__title {
      text-wrap: balance;
    }
    

    To avoid orphans .

    I also consider the space above the bulleted list to be a mistake.

    .cta-item__body:empty {
      display: none;
    }
    
  • 🇺🇸United States bsnodgrass

    Looking at: https://new.drupal.org/download there is a section Extend Drupal, which shows a Recipes block, the target link for Download Recipes is incorrect
    Currently https://www.drupal.org/node/3192814 it should be https://www.drupal.org/docs/extending-drupal/drupal-recipes

    This was mentioned and fixed per #223 🐛 Feedback on Modern Drupal.org Design Active However that is the wrong target. It should be https://www.drupal.org/docs/extending-drupal/drupal-recipes per #Recipes channel.

  • 🇨🇦Canada bwaindwain

    I agree with @tinto #154. The ZT Gatha font looks amateurish. Kerning and thickness are wacky.

  • 🇷🇺Russia alex malkov St.Petersburg

    Today I was going to send a link to the main page to partners. But I was surprised to see a redirect to new.drupal.org/home with very questionable design and content [screenshot]. I had to urgently find this page in the old design, which has almost all the information about Drupal and is quite compact [screenshot].

    In my opinion, the community website, from a design point of view, should strive for minimalism in order to avoid creating such controversial issues in the future.

    Well, pay attention to community sites, for example, debian, symfony, nginx or apache - they are not concerned with design, but they make excellent products and are understandable to developers.

    I absolutely agree with the opinion #70 🐛 Feedback on Modern Drupal.org Design Active , #75 🐛 Feedback on Modern Drupal.org Design Active , #77 🐛 Feedback on Modern Drupal.org Design Active , #109 🐛 Feedback on Modern Drupal.org Design Active , #146 🐛 Feedback on Modern Drupal.org Design Active , #150 🐛 Feedback on Modern Drupal.org Design Active , #153 🐛 Feedback on Modern Drupal.org Design Active , #158 🐛 Feedback on Modern Drupal.org Design Active , #162 🐛 Feedback on Modern Drupal.org Design Active , #165 🐛 Feedback on Modern Drupal.org Design Active , #175 🐛 Feedback on Modern Drupal.org Design Active , #191 🐛 Feedback on Modern Drupal.org Design Active , #192 🐛 Feedback on Modern Drupal.org Design Active , #199 🐛 Feedback on Modern Drupal.org Design Active , #208 🐛 Feedback on Modern Drupal.org Design Active , #209 🐛 Feedback on Modern Drupal.org Design Active , #215 🐛 Feedback on Modern Drupal.org Design Active , #218 🐛 Feedback on Modern Drupal.org Design Active , #235 🐛 Feedback on Modern Drupal.org Design Active , #243 🐛 Feedback on Modern Drupal.org Design Active

Production build 0.71.5 2024