Finished my portfolio page!

Finished my portfolio page!
0.0 0

#1

Ugh, took me the better part of 2 weekends, and I’m not nearly happy with all of it yet. Then again, I guess I shouldn’t expect to be able to fulfill all my design-wishes already at this early stage. :slight_smile:

Here we go!

The page behaves “okay” on smaller screen sizes, but it’s not particularly responsive.

I actually learned and struggled a crap-ton this last week, so all-in-all I’m happy with the experience. I can live with all the little imperfections for now, since I’m sure this’ll be overhauled a couple of times before I start looking for actual jobs.


#2

I liked it! It’s very good and I like the transition on :hover event. If you like to be a bit more responsive on smaller screen with your navigation bar, Bootstrap comes up with a very good solution. Firstly, implement Bootstrap in your html code with a <script type='text/javascript' src=' '></script> (note: the type attribute is not necessary for the latest versions of the most popular browsers, but it’s a good habit). Secondly, use a <nav> element with the class .navbar and see the results. Happy coding and practise every single day. You won’t be satisfied from the start, but the more you practise the happier you’ll be :slight_smile:

Update:

  1. I would like it better if you could stick that navbar always on top of the page :slight_smile: . For me it’s a bit frustrating to always go to the top in order to go somewhere in the page.
  2. Add a to-the-top button. It’s a good practice :slight_smile: .
  3. Fill your portfolio PLEASE!! We all want to see what you know and what are the ambitions you have :slight_smile: haha!

#3

It’s really smart looking - I think your design is great. I love that you’ve not gone for a collapsible menu on mobile but that it still looks really nice at a smaller width.

I would second what @Litarhis said and make the navigation sticky. There are plenty of sites that annoy me with sticky navigation taking up screen space, but on a single page site there seems to be a good case for it.


#4

Looking at it on a laptop with Google Chrome and the page is broken. Your “Who?”, “What?”, and “Hit Me Up” sections are just black spaces. I looked at it on Firefox though and I love how clean it is. It’s balanced with pictures on one side and text on the other. It responds well with change in window size. You just have to look in on the Google Chrome browser!


#5

ye im on a laptop with Google chrome and i only see main images … no portfolio or contact … weird though i can see them if i go to dev tools and hit the mobile icon to check out how it looks on mobiles and tablets etc


#6

Argh! I run chrome on my laptop, and there it looked fine! :frowning: I’ll definitely look into it!

About the sticky navigation: That was my initial intention, but it turns out the parallaxing images made it extremely hard to include the sticky navigation. And so, I made the worst possible decision of keeping the fancy effect instead of the usable interface. :smirk:


#7

Really nice artwork :slight_smile:

Same issue here. I just see black space between full-page image on Chrome (Mac), but it’s ok in FF.


#8

really love the design, nice and clean and stylish


#9

Mine is close, just having CSS issues. Can someone take a look at this, and let me in on the secret of getting around a ‘position: fixed’ that I’m trying to render below. Here’s the codepen.

https://s.codepen.io/MJFoster/debug/QjpwQX/PNrvYLXqaGxM