Update OpenTelemetry.io End-user resources page #8678
Conversation
vitorvasc
force-pushed
the
End-user-resources-Webpage-update
branch
from
ca8cb29 to
1b095bf
Compare
|
/fix:all |
|
✅ |
|
Hi @VidhyaDivakar! Thanks for your contribution. I've approved the workflows to run so you can see a preview of the changes: https://deploy-preview-8678--opentelemetry.netlify.app/community/end-user/ /cc @open-telemetry/sig-end-user-approvers |
00-44-24.mp4Adding a short video of the screen record from my Github branch repo after making the changes based on this PR. |
vitorvasc
changed the title
vitorvasc
added
the
missing:sig-approval
AndrejKiri
left a comment
AndrejKiri
left a comment
There was a problem hiding this comment.
@VidhyaDivakar Thanks for creating the PR. I left a bunch of comments there. Let me know if you have any questions or need help.
|
|
||
| [Learn more about how we track reactions to issues.](issue-participation/) | ||
| <!--Updated the CTA for "Review Issues")--> | ||
| <!--➡️ TODO: Add a CTA "Review issues" linking to a list of projects in OTel org ) --> |
There was a problem hiding this comment.
What do you think about this TODO? Do you think it would make sense to create such a CTA or you see any possible issues with it? Originally, I thought it could be useful, but now I am not 100% sure anymore.
There was a problem hiding this comment.
I think the CTA could still be a good option, depending on how it's placed and how clearly conveys the User's intent, not interrupting the primary flow. Also, it could be a could add on (as seemed useful initially) guiding users towards the next logical step.
| <a href="https://communityinviter.com/apps/cloud-native/cncf/"> | ||
| <img src="https://img.shields.io/badge/join-CNCF%20slack-ff6a07.svg?style=for-the-badge&logo=CNCF&logoColor=black&labelColor=ivory"> | ||
|
|
||
| <!--Updated the CTA for "CNCF Slack")--> |
There was a problem hiding this comment.
I think it is enough if you mention this in the commit message. No need to add it to the code.
| <!--Updated the CTA for "CNCF Slack")--> |
| <a href="https://opentelemetry.io/community/end-user/issue-participation/"> | ||
| <img src="https://img.shields.io/badge/review-issues-ff6a07.svg?style=for-the-badge&logo=OpenTelemetry&logoColor=black&labelColor=ivory"> | ||
|
|
||
| [Learn more about how we track reactions to issues.](issue-participation/) | ||
| <!--Updated the CTA for "Review Issues")--> |
There was a problem hiding this comment.
For consistency, I would like all the 'Learn more...' links (we have them in Report issues, Respond to survey, and Join podcast sections) to look the same. I think we don't have to change them necessarily and rather keep the link as it was before.
There was a problem hiding this comment.
Consistency is the key, I understand. In that case, do we remove the CTA, which is mentioned in the to-do comment?
Also, the link to the Learn more about how we track reactions to issues. gives a 404 - page not found exception in the GitHub. But works fine in the actual website.
I have come up with a simple HTML button, but like the above error, the index.md shows this as a simple link. But the hugo site displays the button correctly. But we need to discuss through slack or a call to understand the need and if we are on the same page we can resolve this. Can you schedule a slack call?
| <!--Updated the CTA for "Review Issues")--> | ||
| <!--➡️ TODO: Add a CTA "Review issues" linking to a list of projects in OTel org ) --> | ||
|
|
||
| ## Chat on Slack {#slack} |
There was a problem hiding this comment.
For some reason, this heading renders as a link in the preview environment, and that is not supposed to happen. Moreover, it leads to https://opentelemetry.io/community/end-user/issue-participation/, which is wrong. Does it behave like this in your browser? If yes, it would be good to figure out why and correct it.
There was a problem hiding this comment.
The same thing also happens for the 'Respond to a survey' heading below.
There was a problem hiding this comment.
Yes, that is because the was not closed. . I tried closing it in a local repo and it worked.
|
|
||
| [Join CNCF Slack.](https://communityinviter.com/apps/cloud-native/cncf) | ||
| <a href="https://communityinviter.com/apps/cloud-native/cncf/"> | ||
| <img src="https://img.shields.io/badge/join-CNCF%20slack-ff6a07.svg?style=for-the-badge&logo=CNCF&logoColor=black&labelColor=ivory"> |
There was a problem hiding this comment.
I think a badge is not the right UI element here. Have you considered using just a basic HTML button?
It also might be a good idea to use the same font as we are using on the page.
I like that you used an icon there. I think it would be cool to use an icon also in the button. Perhaps it could be Slack icon instead, since it should lead to Slack, instead of CNCF icon. What do you think?
I spend my whole career close to folks that work on UIs, but I am not good at that. Before we merge this, I will request a review from someone who is good at UI design. 🙂
There was a problem hiding this comment.
I have come up with a simple HTML button, but like the above error, the index.md shows this as a simple link. But the hugo site displays the button correctly. But we need to discuss thro slack or a call to understand the need and if we are on the same page we can resolve this. Can you schedule a call?
| [](https://opentelemetry.io/blog/2025/contribex-survey-results/) | ||
|
|
||
| [](https://opentelemetry.io/blog/2025/devex-survey/) | ||
|
|
||
| [](https://opentelemetry.io/blog/2024/otel-docs-survey/) | ||
|
|
||
| <!-- Updated the links as CTA, cos instead of embeds, these looks apt here and bends well--> | ||
| <!--➡️ TODO: Turn links into embeds--> |
There was a problem hiding this comment.
Similar to what I mentioned above, I don't think badges are the right UI elements to use here. I think they haven't really added more value than when using just regular list items.
I was thinking more about something that would give a quick preview of the blog posts before clicking on them. For example a carousel. What do you think about it?
There was a problem hiding this comment.
Yes, I have a sample ready. We can discuss.
| - [OTel in Practice](https://www.youtube.com/playlist?list=PLVYDBkQ1TdyxKgdGE4ThYLkNRCuLLYy9x): | ||
| An interactive enablement session on different aspects of OpenTelemetry by | ||
| contributors and end users. | ||
| [](https://www.youtube.com/watch?v=tTCuTAPE5aQ&list=PLVYDBkQ1TdywIl9xKEo5_u7zlwY38dW43&index=1) |
There was a problem hiding this comment.
Why did you decide to use the markdownd-videos-api? Have you considered using just a simple YouTube embed?
| and implementation. Also, check out the entire | ||
| [OTel Me playlist](https://www.youtube.com/playlist?list=PLVYDBkQ1TdywIl9xKEo5_u7zlwY38dW43) | ||
| of discussions. |
There was a problem hiding this comment.
I don't think it is necessary to add a separate link to the playlist if we already have a link to it above.
What I would consider, though, is to add a subheading heading with the podcast type name, so we keep some reference to the podcast type name.
|
|
||
| {{% /alert %}} | ||
|
|
||
|  |
There was a problem hiding this comment.
I like the idea to have some illustratory images on the page, but this one feels quite generic. Also, the button on the image could mislead users to click on it.
Feel free to further iterate on it if you like. It would be good to clarify what you want to communicate there and who the target persona is. If not, we can just skip it for now.
|
In the description you wrote:
My understanding is that you are allowed to use AI tools when contributing to OpenTelemetry. You just have to review the AI output and make sure it aligns with project guidelines and policies. Feel free to use AI tools; just use them wisely. |
vitorvasc
force-pushed
the
End-user-resources-Webpage-update
branch
from
6e136e5 to
19f0eb5
Compare
|
@AndrejKiri thanks for the review. Regarding the html tags, previously I tried iframes inside our repo index.md it did not work, I needed to add css styles in the repo folder. So to keep it simple, I chose CTAs. The same with Youtube embedds and Carousel. Yes, I will research further and come up with solutions. And regarding other reviews I have started to take a look at. I will comment as and when I complete them. Thank You, |
|
@VidhyaDivakar Good to know that you tried that and it didn't work and that you found a workaround. Let's ask around a bit what would be the right way to approach this. I am not sure. @tiffany76 We are having issues with iframes and embeds on the website. By any chance, do you know why this could be happening? We were thinking about embedding a YouTube playlist on the End-user resources page. |
|
@AndrejKiri, I have given my comments/views/reply in regards to each review comment. We can have a discussion, so that we are on the same page. Please let me know. |
Above my pay grade, unfortunately. @vitorvasc or @chalin, might you be able to help? |
|
@VidhyaDivakar I see that you suggested scheduling a meeting to chat about the changes you suggested. That is a good idea. I will follow up in a DM on CNCF Slack for scheduling. |
VidhyaDivakar
force-pushed
the
End-user-resources-Webpage-update
branch
from
02b5d4c to
196c74f
Compare
|
Today had a discussion with @AndrejKiri and created a new PR for buttons alone in End User Resources Page. Here is the PR link for that #8980. Based on the discussion, I will create new PRs for the other to do items mentioned in the same page in the coming dayes -Thanks |
4 participants
Refers to open-telemetry/sig-end-user#191
Hello @AndrejKiri , @danielgblanco
Please find my changes made to the end user resources page.
contribution guidelines,
including the First-time contributing? note.
the
Generative AI Contribution Policy.
I have kind of enhanced the look and feel of the end user resources page based on the issue open-telemetry/sig-end-user#191 (comment)
The following are the changes made:
Preview: https://deploy-preview-8678--opentelemetry.netlify.app/community/end-user/