Posts Tagged: Web Design
Want to Receive Email Updates of New Articles About Web Design?
Join My Email NewsletterHow to Visually See What Your jQuery Selection is Selecting
Category: Code Snippets / Tutorials
I was recently working on form validation and wanted to mark a.form-group as successful if it contained a particular icon inside the label. The icon was set using PHP depending if the data existed in the database. I was writing .prev() and .parent() to try and select the wrapping .form-group but it wasn’t working and […]
How to Create a List of Urls and Meta Titles from a Domain
Category: Tutorials
I was working on a site migration and I needed to create an excel spreadsheet of all of the urls, page titles, and meta description. This document would then be shared with the copywriters to work on editing the page copy. I found some nice online tools to make this process easy. Step 1: Generate […]
What are the Open Sans CSS Font Weights?
Category: Common Questions
I often want to use different font weights for Open Sans and so am adding them here for quick reference later. Open Sans light font-weight: 300; regular font-weight: 400; semi-bold font-weight: 600; bold font-weight: 700; extra-bold font-weight: 800;
How to Add a Featured Tag with Text Over an Image
Category: Tutorials
In this tutorial I will show you how to place a featured tag over an image using CSS3 ::before pseudo elements. A common use case for this is eCommerce where you might want to visually show a product is featured, on sale, or out of stock. Since your products are displayed dynamically using a database, […]
My 7 Tips for Learning the Artistic Side of Web Design
Category: Newsletter
This is a great question and something I have been thinking a lot about. Especially in how to teach this skill online vs a classroom setting. If I had to pick four important factors to becoming a good designer they would be. Pencil sketch before moving to the computer Sketch a lot of thumbnails with […]
HTML5 Responsive Autoplay Video Code Snippet
Category: Code Snippets
In order to make your HTML5 video responsive you will need to add the following CSS style properties: width: 100%, and max-height: 100%. Your browser does not support the video tag.
How do I design and build a industrial website?
Category: Common Questions
Building an industrial website is one of the greatest experiences. It is a convergence of creativity, technology, and service. So congratulations on embarking on the journey. Below is a very high level look at the 3 major steps. If you have questions, please let me know. Creativity Before you start building you need a plan […]
What Is the Best Way to Learn Web Development?
Category: Newsletter
Learning Web Development is Like Learning How to Paint Let’s say you wanted to become a painter. Where would you start? How would you feel if your first painting looked like the one below? I believe painting by numbers teaches the mechanics and joy of painting to beginners. It quickly builds confidence. You […]
Web Hosting Options and What I Recommend
Category: Common Questions
It can be hard finding a good web hosting company. I have used some good ones and some really bad ones. Below are my recommendations based on the following criteria. Provide quality customer support Based in the USA. I want my server to be in the same country as my audience to improve the speed […]
What is Visual Hierarchy in Web Design and Why is it Important?
Category: Articles
When designing a page layout it is important to consider the overall visual hierarchy of the page. In other words, what grabs your eye first, second, third? What are the goals of the page and how can you make those goals easier to achieve? Your design can use size, color, position, and proximity to define […]