Latest comments
- @ProbablyOmar@JohnIdenyi
Hi you did pretty good for first challenge.
-
You used inline and internal CSS to style your webpage. It is okay to use internal css for a single page but is not advisable you use it for a website with multiple pages. You shouldn't use inline CSS in styling your document. The recommended way which is the best practice is to use external stylesheets.
-
Your texts don't have space around them making them touch the container. Add a padding property to the div wrapping the texts.
-
You have some accessibility issues. You don't have an h1 element in your document. Change the first paragraph to an h1 element. Every page must have an h1 element because screen readers make use of it to identify the main content to visually-impaired persons. It also helps in better optimization by search engines.
-
You should use semantic HTML elements like <main> or <section> to wrap contents in your document. So instead of this <div class="center"> you should do this <main class="center"></main>.
I hope this was helpful!
Marked as helpful -
- @TimPava@JohnIdenyi
Nice work! Though you have some accessibility issues.
-
You don't have an h1 element in your document. Change the h2 to an h1 element. Every page must have an h1 element because screen readers make use of it to identify the main content to visually-impaired persons. It also helps in better optimization by search engines.
-
Your html root element is meant to have a lang attribute set to a value, for example lang="en" indicates the page is in english.
I hope this was helpful.
Marked as helpful -
- @adamwozhere@JohnIdenyi
Hi, you did good for this challenge. You don't have an h1 element in your document that is why there is accessibility issue. Change the h2 to an h1 element. Every page must have an h1 element because screen readers make use of it to identify the main content to visually-impaired persons. It also helps in better optimization by search engines.
Marked as helpful - @RosinskiPawel@JohnIdenyi
Nice work Pawel! But you have some accessibility issues.
- <p class="creation">Creation of <x>Jules Wyvern</x></p> "x" is not an html element so it shouldn't be used rather use <span> which is meant for inline elements.
-
Secondly, you should use semantic HTML elements like <main> or <section> to wrap contents in your document. So instead of this <div class="background"> you should do this <section class="background"></section>.
-
Thirdly, your webpage is not responsive on mobile device. Try using a media query to create styles that apply to mobile devices. You should try reducing the width of the container and the background class.
I hope this was helpful.
Marked as helpful - @notorioustomijo@JohnIdenyi
Hey, great design! I think the only thing to point out is it is not responsive. Add a media query so it can scale properly on a mobile view
Marked as helpful - @Phacharapol18@JohnIdenyi
Hi, you did pretty well for first challenge. I would suggest using flexbox to center everything on the page and also try reducing the width of the the .background-middle class.