Responsive landing page with single introductory section with HTML/CSS
Design comparison
Solution retrospective
Mobile first approach ....
What specific areas of your project would you like help with?Any feedback is welcome
Community feedback
- @aouintihouariPosted 2 months ago
Well done! Keep practicing and improving.
However, I've noticed that you've used the @import in your CSS file rather than linking them directly in your HTML. For a very small and simple project like this one, it's not a problem, but you should know that it's not a best practice. You should link the fonts directly in your HTML for better performance.
Linking fonts directly in the HTML <head> is better for performance due to a few key reasons:
-
Early Loading: The browser can start loading the font as soon as it encounters the <link> tag, reducing the time it takes for the font to be available for rendering.
-
CSS Parsing: When using @import, the CSS file must be fully loaded and parsed before the font can be requested, adding an extra step that can delay font availability.
-
Parallel Requests: Linking directly allows the browser to initiate multiple requests simultaneously, which can improve overall loading speed compared to the sequential nature of @import.
-
Reduced Render Blocking: Using a direct link can help avoid blocking rendering, allowing the page to display content faster.
Overall, these factors contribute to a smoother user experience and better performance metrics for your site.
Marked as helpful0 -
- @Djamel1133Posted 2 months ago
Thank you, I appreciate your comment and i'll fixed it soon inch Allah
1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord