One Page Portfolio Love

Want to design and code your own one page portfolio? Click here!

The best way to showcase any art or design work is with a portfolio. Thanks to some great websites, you can create an online portfolio for free. There are so many ways you can display your work but lately, I’ve been loving the one page portfolio look.

The one page portfolio consists of different sections created by div tags. These sections are usually the introduction, about me blurb, your work and a contact me section. One Page Love is a great website dedicated to a ton of one page style websites.

Taking a look at all those gorgeous websites inspired me to design my portfolio one page style. I decided to code my portfolio using html and css. I was also able to include a bit of javascript for added flare thanks to some great javascript codes I found online. For example, when clicking the navigation links, the scrolling is smoother thanks to javascript. There is also a nice fade in/fade out effect when hovering over the social media icons in the sites footer.

The actual portfolio section has a neat hover effect that not only shows the title of each piece but upon clicking the image, the Lightbox function allows a new window to open up with an image and a short description of the project.  Now, I’m trying to practice my javascript skills as I would love to be able to code my own cool function to my future sites.

marisablair.me

Now It’s Your Turn!

Do you have an online portfolio? Share it with us in the comments below! Where do you find your creative inspiration (specific site, book, youtube video, etc.)?

Like this article?

I'm a Content Creator, Front-End Web Developer, UI Designer, based in Toronto, Canada. I have a healthy addiction to the internet, technology, and digital media. I'm so passionate about all things design and tech that I write about it any chance I get on my blog xopixel.com!

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.