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.

How to Improve Readability Using Text Overlay
Web Design Sliders

How to Improve Readability Using Text Overlay

Ensuring readability is challenging when displaying text over a background image. With a dark overlay behind the text, you can add contrast and increase readability.

Read more

How to Integrate Tabs into Your Content with a Page Navigation Toolbar
Web Design Bootstrap Navigation

How to Integrate Tabs into Your Content with a Page Navigation Toolbar

You may find that you have too much page content to ideally fit a single page. Rather than creating a series of child pages, however, you can include a Page Navigation Toolbar that allows you to tab between content on a single page.

Paris Tuzun

How to Showcase Your Team and Organizational Leadership
Bootstrap Web Design

How to Showcase Your Team and Organizational Leadership

Showcasing your team or leadership can help personalize a brand or organization. This tutorial walks you through how to build a team page that humanizes your brand and messaging.

Paris Tuzun

How to Add Social Share Icons with Unique Hover Effects
Social Web Design

How to Add Social Share Icons with Unique Hover Effects

Creating social share icons with unique hover effects helps encourage social media interaction.

Paris Tuzun

How to Use Bootstrap to Create a Form with Inline Inputs
Bootstrap Form Tutorials Web Design

How to Use Bootstrap to Create a Form with Inline Inputs

In order to conserve design space, you may need to have your form inputs inline rather than stacked. Bootstrap makes this incredibly easy to do.

Paris Tuzun

How to Create a Department Listing or Directory Page (Part 2)
Web Design Bootstrap Navigation

How to Create a Department Listing or Directory Page (Part 2)

The most important information when showcasing a department or directory is a mission statement, leadership biography, and pertinent contact information. Here's how to design a website that makes those details look as important as they are to your organization.

Paris Tuzun

How to Create a Department Listing or Directory Page (Part 1)
Web Design Navigation Bootstrap

How to Create a Department Listing or Directory Page (Part 1)

If you have multiple departments or directories in your organization, it’s important to create a single page that lists important info as well as links to separate pages.

Paris Tuzun

How to Add Additional Links with Easy-to-Use Boxes Based on Bootstrap Columns
Bootstrap Navigation Search Web Design

How to Add Additional Links with Easy-to-Use Boxes Based on Bootstrap Columns

Often you need to add additional or relevant links to the bottom of your content. Do so with style using some simple boxes and default Bootstrap columns.

Paris Tuzun

How to Create a Search Bar That Overlays Your Top Navigation
Search Web Design

How to Create a Search Bar That Overlays Your Top Navigation

Adding search bars can be difficult, and they often lead you to make sacrifices to shove new input elements into your design. With a search bar that replaces your top navigation, however, you can direct user behavior while maintaining the consistency of your design.

Paris Tuzun

How to Create Stylish, Informative Breadcrumbs
Web Design Navigation Bootstrap

How to Create Stylish, Informative Breadcrumbs

Breadcrumbs are fantastic UI components that help the user navigate across a given website. They can also further your branding and web design efforts.

Paris Tuzun

How to Use Absolute Positioning with Your Images
Web Design Bootstrap

How to Use Absolute Positioning with Your Images

Your guide to using absolute bottom positioning with your images so that they are fixed and appear to peek over a designated break line.

Paris Tuzun

How to Use Javascript to Make Bootstrap Rows Clickable
Web Design Navigation Bootstrap

How to Use Javascript to Make Bootstrap Rows Clickable

You can make basic Bootstrap rows entirely clickable as a link utilizing the JavaScript “onclick” function.

Paris Tuzun

Build a Fixed Top Navigation that Disappears as Users Scroll
Bootstrap Web Design Navigation

Build a Fixed Top Navigation that Disappears as Users Scroll

Fixed top navigation better allows your users to navigate your site as they go through its content. However, fully fixed navigations can often take up precious real estate as a user scrolls down a page. The solution? Have fixed navigation that only shows as a user scrolls back up.

Paris Tuzun

How to Use Bootstrap Columns to Create a Stacked List of Features
Web Design Bootstrap

How to Use Bootstrap Columns to Create a Stacked List of Features

Need to highlight your product’s features? List them in a distinctive column using default Bootstrap.

Paris Tuzun

How to Make an Image Fill the Page Margins
Web Design Bootstrap

How to Make an Image Fill the Page Margins

When using Bootstrap containers, your image and text section will by default have padding on either side of it. Often, however, you will want your image to meet the page’s edge without padding.

Paris Tuzun

How to Combine FontAwesome with a Slider to Create Quick Links
Web Design Navigation Bootstrap Sliders

How to Combine FontAwesome with a Slider to Create Quick Links

Getting users quickly to their end destination can be tricky. With strategic icons and simple text, however, you can help your audience quickly find what they need.

Paris Tuzun

How to Use jQuery Validator for Your Form Validation
Web Design Form Tutorials

How to Use jQuery Validator for Your Form Validation

Keep your forms validating properly with jQuery validator.

Paris Tuzun

Create Showcase Section with Bootstrap Nav-Pills
Web Design Bootstrap

Create Showcase Section with Bootstrap Nav-Pills

With nav pills, you can highlight your products, services, or values in an easy-to-use content showcase.

Paris Tuzun

How to Create Service Boxes with Text Hovers
Web Design Bootstrap

How to Create Service Boxes with Text Hovers

Give your visitors additional information without compromising on sleek visual design by using these service boxes with text hovers.

Paris Tuzun

How to Create Clickable Image Overlays
Web Design Bootstrap

How to Create Clickable Image Overlays

Are you an organization with multiple locations? Here's how to make a custom map to showcase more information about your business on your map feature.

Paris Tuzun

How to Create a Hero with a Video Background
Bootstrap Web Design

How to Create a Hero with a Video Background

Video content remains some of the highest-converting content on your website, and hero images are one of the first ways your audience interacts with your brand. Here's how to combine the power of video with the eye-catching design of a hero banner.

Paris Tuzun

Welcome to the New Solodev Digital Customer Experience (DCX) Platform
Solodev

Welcome to the New Solodev Digital Customer Experience (DCX) Platform

Notice anything different? Solodev launched something new, and we've got more on the way...

Get started today

Join people and businesses across the globe that trust Solodev.

We never share your information with anyone. Learn more

We use cookies to provide and improve our services. By using our site, you consent to cookies.