Personal Portfolio Webpage [feedback appreciated]

Hello there code campers,

I just finish my Personal Portfolio Webpage and would really appreciate if you could give me your feedback and how I could improve my code and design etc… :slight_smile:

Also if you could have a look at all my projects and give your feedback as well that would be great!

https://codepen.io/fbclh/full/MxJRWL

Thank you in advance!

Looks clean and modern overall. Although there isn’t much content to evaluate, here is my 2 cents.

  • Try breaking your portfolio into multiple sections visibily. They look crammed together. Use paddings/margins to give sense of separations to each point you have.
    http://blog-en.tilda.cc/articles-website-design-mistakes

  • Don’t rely too much on css frameworks. Looks like you are using bootstrap for most of your projects. Although your website can’t look bad by using bootstrap, you will learn the most by coming up with your own styles.

  • Your images on projects are broken on codepen.

Good luck! :fist_left:

2 Likes

Thank you very much shimphillip, I really appreciate it.

*I have removed the HTML elements <br> and have added CSS margin properties to give a little bit of space. As I add more information about me and more projects I will experiment with the margin properties. By the way very nice article!

*I know what you mean and I did want to get used to vanilla CSS, but at the same time, I wanted to get used to Bootstrap because I have seemed quite a few jobs asking for it. So I decided to use Bootstrap on my projects to get familiar with it and learn it well, but also try to learn CSS at the same time.

*Yes I am using imgur.com, I do not know and I am not so sure why the images are broken, if the problem is on imgur or on codepen. If you have any suggestion or a better place to host images please let me know!

:metal:

Hello,

I’m totally new here and I don’t know the requirements for the Submit Form challenge, so discard my input if I’m wrong.
Maybe you could add a form validation for the Name, Email and Age? Just to make sure that people (or robot) don’t enter non-valide information.
I entered “.”, “1” and “.@com”. Obviously the data isn’t what you expect.

Cheers!

Hello there and thanks, I am always looking to improve my projects.

I just follow the instructions for this project!

#6: If I enter an email that is not formatted correctly, I will see an HTML5 validation error.

#8: If I enter non-numbers in the number input, I will see an HTML5 validation error.

#9: If I enter numbers outside the range of the number input, which are defined by the min and max attributes, I will see an HTML5 validation error.

Good job.

You should never really use
it’s always better to give spacings using padding/margin.

I am pretty sure imgur images get broken on codepen. You can use pixabay photos.

It’s as simple as
<img src= "https://picsum.photos/200/300/?random" />

where it will generate a random photo of width 200 and height 300 px.

1 Like

Hi shimphillip thank you again!

That Lorem Picsum website seems useful, and I know pixabay and there is also unsplash both very good.

However I was looking for a quicker and easy way where there is no login to upload my own images like imgur, but as imgur seems not to work with CodePen I will try others alternatives that may work such as imgbb.com