My first HTML CSS project using also SVG

Projects
1

Hi everybody,

The best way to learn languages is to use them for something that matters to you. So I decided to create a nice Resume that would require to use all my knew knowledge and beyond.

Please find here my first production: [also found in profile]

I am particularly happy with the responsiveness: you can try it on smartphone, tablet or PC… and on you PC don’t hesitate to change the size of the window.

Please, let me know any constructive critics or improvement ideas :slight_smile:

Best,

1 Like
4

Hi @ryfe972,

Your resume looks nice, and you did a good job making it responsive. Visually, I don’t really have any suggestions for changes - it looks fine for an online resume, I think. You could change your title and placeholder name to be in English, since it is your “CV en anglais” after all :slight_smile:

The Technical Skills part is presented in a neat way, but the progress bars don’t really mean anything to me, since it’s difficult to know the upper limit on them. I do think using SVG instead of JPG is a good idea. I’m not sure if you know, but HTML has native elements for a similar effect: <progress> and <meter>, which come in handy sometimes.

I’d also suggest using some more semantic HTML elements, like the <b> tag for bold text. You could also make lists like your work experience use an <ol> and hide the numbers displayed by default with list-style: none; in CSS.

This is quite good for one of your first projects, however.

3 Likes
5

Hi there,

Thank you so much for your feedback, I really appreciate it!
I will definitely translate the title and placeholder name to be in English, you’re right :wink:
The idea to use more semantic HTML is a good one; I’ll be happy to incorporate those in my next project :+1:

When it comes to the progress bars:
first of all, I agree 100% with you that it doesn’t mean much and shouldn’t be in a serious CV; same for the words-cloud. I wanted to play with the SVG technology that I recently discovered.
2nd: I was super happy that i could realise a progress bar in svg… and I had NO idea it was possible with <progress> and <meter> !
That is awesome! I can’t believe that I never found it! Thanks for this great tip :blush:

Thanks for the feed-back!
I’ll improve and move to my next project with more experience!

3 Likes