Web Design Blog
A web design resource for developers and designers. It’s your one-stop shop for free code examples and responsive design ideas.
Weekly Roundup: Four Days of Code
Phone Number Validation, Password Strength Indicators, Scrollspy, Parallax with Multiple Backgrounds...
Using Parallax with Multiple Backgrounds
In this article, Solodev will teach you how to add Parallax Images with multiple backgrounds to your website.
Adding ScrollSpy to your Website
This article adds ease of navigation to your website using ScrollSpy, a tool that automatically updates links in your website navigation based on the scroll position of your website.
Creating a Password Strength Indicator
This tutorial utilizes strength.js to test the strength of your password and can be utilized on your own website's registration page.
Validating Phone Numbers with JavaScript
This tutorial will teach you how to add validation to your phone number input fields using jQuery.
Weekly Roundup: Five More Days of Code
Pure JS Hero Sliders, Parallax Hero Images, Magnific Popups, Pagination, JavaScript Progress Bars...
Creating a Progress Bar with JavaScript
Progress bars are all over the web but not all are created equal. This tutorial gives you the code you need to craft a beautiful progress bar with jQuery.
Adding Pagination to your Website
In this article we teach you how to add pagination, an excellent way to navigate large amounts of content, to your website.
Adding Magnific Popup to your Photo Gallery
This tutorial shows you how to add interactivity to your photo galleries with magnific popup.
How to Create a Parallax Hero Image
A Parallax Hero Image creates a depth and transition effect when scrolling down your web page and makes website navigation seamless.
Build a Hero Slider with Javascript and jQuery
Learn how to build a slider with just JavaScript and jQuery.
Weekly Roundup: This Week in Code
Tooltips, Button Rollover Effects, Responsive Image Grids, Loading CSS/JS Faster, Google Display Network Experiments...
How to Create Display Network Experiments in AdWords
This tutorial will teach you how to set up Google Display Network Experiments in Google AdWords.
How to Load CSS and JavaScript Faster
This tutorial walks you through a series of tools and tips to optimize the way you load CSS and JavaScript to help your web pages load faster.
Creating a Responsive Image Grid with CSS
This tutorial walks you through creating a mobile responsive grid of images for your website using simple CSS.
Fun with Button Rollover Effects
Adding a rollover effect to your buttons provides a more interactive user experience and has statistically driven more conversions than static buttons.
Using Tooltips on your Website
Tooltips aid the User Experience of your website by allowing you to add a bit more information to help guide visitors.
The Weekly Roundup: Five Days of Code
Scroll Down Anchors, CSS Best Practices, Building Galleries with Solodev, Designing Client Showcases, Contact Us Pages...
Design a Contact Us Page for your Website
In Part III of our series on Contact Us Pages, we provide a clean, simple design for a responsive contact page.
Designing a Client Showcase with Bootstrap
Showing off your clients and how your product or service has benefited them is integral to sales growth.
Building a Photo Gallery with Solodev
Graphics have taken on an increasingly central role to online content and the need for interactive and beautifully designed photo galleries has never been more prevalent.
Inline CSS Is Out of Style
This article aims to address some best practices when styling web pages and other practices to avoid.
©2025 Solodev. All rights reserved worldwide.
