Skip to content
OverviewSolutions
4
Comments
42
Sam Guliker
@Sam-Guliker

All comments

  • Sam Guliker•540
    @Sam-Guliker

    Hi, jlcesarr

    Try to use landmarks like so: <main> {your content}</main> instead of section. https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles#abstract_roles

    Happy coding

    Marked as helpful
  • Sam Guliker•540
    @Sam-Guliker

    Hi Drunken,

    Looks good! I would recommand you to check out the fonts. They seem a bit off.

    Goodluck

    Marked as helpful
  • Sam Guliker•540
    @Sam-Guliker

    Hi Daniel,

    Looks good! To remove the HTML issues:

    • Use an alt tag on your <img> tag
    • If you use sections use a heading, else try to use a div

    Happy coding

    Marked as helpful
  • Sam Guliker•540
    @Sam-Guliker

    Hi, Abhisek

    Double check the paddings and fonts? They seem a bit off. Next to that try to use landmarks like so: <main> {your content}</main> https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/main_role

    A heading is also nice to have :) https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements

    Happy coding

  • Sam Guliker•540
    @Sam-Guliker

    Hi Josephine,

    You can find a lot of feedback in the report. There are some issues when it comes to images and structure of the headings.

    And the design seems a bit off on desktop. Take a good look at paddings, font-size and buttons.

    Happy coding

  • Sam Guliker•540
    @Sam-Guliker

    Hey Rathore,

    Good stuff, keep it up!

  • Sam Guliker•540
    @Sam-Guliker

    Hi Captress,

    You're almost there. You can still improve the HTML by using aria labels on the <a> tag. Next to that check the headings, H5 doesn't seem neccisary.

    Design wise, check the fonts, paddings and buttons.

    Have a good day

  • Sam Guliker•540
    @Sam-Guliker

    Hi Stefan,

    Looks good! I'm not sure if the rendering isn't good but it seems like the fonts in the design are a bit lighter(like thin or regular). The request button needs a bit more padding on the right side.

    Have a good day

    Marked as helpful
  • Sam Guliker•540
    @Sam-Guliker

    Hi, Nerijus

    Looks good but there are a couple of things design-wise that needs some attention.

    • The text on the bottom left should be aligned left.
    • Where did the discount go?

    Happy coding

  • Sam Guliker•540
    @Sam-Guliker

    Hi Enrym

    Good solution you've got there. Try to use landmarks like so: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/landmark_role

    Normally you don't use section's like that. For styling always use a div :)

    Have a good day,

  • Sam Guliker•540
    @Sam-Guliker

    Hi Eblite,

    Nice solution you've got there, there are a couple of things you can pay attention to. HTML:

    • Try to use landmarks like main, header or footer. link: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/main

    CSS:

    • The paddings seem a bit off, you can play a bit more with that.
    • The button seems a bit off in color and doesn't have a drop shadow.
    • The font color in the main section is a bit off.
    • The image within the anual plan needs a width and no height, it will scale accordingly.

    I hope this was helpfull

    Happy coding

  • Sam Guliker•540
    @Sam-Guliker

    Hi Walker,

    Nice solution you've got there. The main doesn't really need a role since the html is already telling that it's a main.

    For the design you are really close. Try to play a bit with paddings and you can do a "50/50" width solution.

    Happy coding.

    Marked as helpful
  • Sam Guliker•540
    @Sam-Guliker

    Hi Devlancer

    Looks good! Try to use landmarks like main, footer and header. source: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/landmark_role

    You don't really use H3 like that for more info on that you can find it here: -https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements

    Happy coding.

    Marked as helpful
  • Sam Guliker•540
    @Sam-Guliker

    Hi Bolu

    Good solution you've got there. Try to use landmarks like: main, header or footer. Source: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/landmark_role

    Your solution seems a bit wider than the design. When you reduce the font-sizes and put a max width on the container you can get closer to the design.

    Happy coding

    Marked as helpful
  • -•70
    @NadiemM

    FAQ-Accordion

    #tailwind-css#react
    2
    Sam Guliker•540
    @Sam-Guliker

    Hi,

    Nice solution you've got there. There are a couple of things you can pay a bit more attention towards to.

    • Try to use landmarks like: main, header or footer. source: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/landmark_role

    • I see that you've got a programming background by the way you're structuring your JSX/html. Try to keep it more together it's difficult to read.

    Happy coding

    Marked as helpful
  • MingZoox•330
    @MingZoox

    A

    1
    Sam Guliker•540
    @Sam-Guliker

    Hi,

    Looks pretty clean, I checked your HTML and you're using divs for Heading elements. Try to use h1,h2,h3 etc. Like so: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements

    Also try to use landmarks like main, header or footer. https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/landmark_role

    Happy coding

  • Sam Guliker•540
    @Sam-Guliker

    Hi, nice solution youv'e got there.

    I think you should go a head and take a more difficult challenge :)

    Happy coding

  • Sam Guliker•540
    @Sam-Guliker

    Hi,

    Nice solution you've got there! Did you center align the text on purpose? Else you can use text-align: left; in the css.

    Happy coding

    Marked as helpful