I did some sketches on a paper, then used Photoshop to finalize the details and Illustrator to vectorize (otherwise it’d be pixelated if I wanted to resize the image).
To add them into the html, I uploaded all the images to a site called imgBB (https://imgbb.com/) and copied the image address (right click on image > select “Copy Image Address”).
I used imgBB, but it can be any image hosting site
Let me know if you need any help with that. Thanks for your reply!
Thanks! You seem to have a knack for this coding stuff - when I got to the protfolio page, I was nowhere near as good. In fact I’m still working on it (I haven’t submitted it yet), even though I’m at the intermediate front-end projects part!
I just need to add the navigation bar, but this is what I’ve done up until now:
(It looks better when you open the link. I’m no good with responsive designs/Bootstrap etc.)
I’m not that good with drawing, but you can add some pretty neat animations using CSS, and it’s pretty easy too!
I like the minimalistic style of the page and the pictures of course !
Consider this: Too much italic may looks too fancy for some people. I’d recommend to keep the Rubrics (Home, Portofolio, Contact…) clean and simple.
However, that’s my personal opinion, so…
Keep going !
@JullietProjects your portfolio is gorgeous! I love the clean layout, your chosen font, and especially your illustration style. Everything works with everything else stylistically. Responsiveness looks and works great too.
I honestly the only thing that’s a little funky is on my desktop screens (1600 x 900 and 1280 x 1024) there’s a horizontal scroll bar. I went through your code and I’m not 100% on what part exactly is causing it but if I add overflow: hidden; to this style:
I didn’t use italic in my project, but I know what you’re talking about: it’s the style of the font I chose for this project, Pacifico - https://fonts.google.com/specimen/Pacifico, that looks like italic.
I was looking for a thick handwriting font that had a similar style from my drawings, and Pacifico seemed to be a good Font Combination with Open Sans (the font I’m using for the body) - https://fonts.google.com/specimen/Open+Sans?selection.family=Open+Sans. However, I’ll consider trying new styles in the future.
@dlyons, thank you for your contribution!
I already changed it and left a comment for you in my code
In fact, I’ve tested the responsiveness for small devices, but I forgot completely about the bigger ones lol Besides that, Bootstrap is not completely supported in all browsers, so it probably looks odd in some versions of IE too
No worries, you still have plenty of time to feel more comfortable with Bootstrap/Responsive Design, just keep it up and don’t give up! I’ll take a look at your project and give a feedback as soon as possible. See you soon!
No problem! Btw I usually encounter that problem myself when the margins of an element (or sometimes a few) push it beyond the viewport. Or every so often it’s a width issue. Just to give you some ideas if you want to try and debug it in the future.
Granted, I’ve got like zero experience using bootstrap , but I can tell you at least that I’m using Chrome (63.0.3239.84) if that’s any help.
Wow. That was a pretty detailed and critical ‘wall of text’. Thanks for that, I’m sure it’s gonna be pretty helpful for me sometime in the future. But I’m not exactly looking for a job right now (I’m 14 and I still need to learn a lot, lol), so I’m not too worried about ‘attracting any employers’. I’m just trying my best to learn as much as I can by working on these projects.
Anyways, I guess I owe your portfolio a more detailed review too…?
Your portfolio was also pretty good (especially the drawings). My only suggestion would be to maybe use a more simpler font style? Or add a bit more contrast between the text and background? It’d be more easier to read that way. And the icons for codepen and github were ~maybe~ a little…hidden? You could make them a bit bigger, which would also help fill up some space on the right side of the top navbar. Plus, it’d be cool if you could make the navbar follow as you scroll down the page. I think you just need to nest it in a div and add position: sticky; to it…idk, you can check this out if you want more ideas: https://www.w3schools.com/css/css_navbar.asp
Thank you for all your suggestions, and wow… Are you only 14 years old?.. Amazing!
I’m happy to see someone so young studying on his own and looking for improvements so early in life, congrats!
Nice portfolio page! Really like the simplicity. I agree with others who said the font is a little fancy for the menu. I also think the ‘logo’ to the left of the menu should be a bit larger. Great job!
, but I can tell you at least that I’m using Chrome (63.0.3239.84) if that’s any help.
