Posts Tagged: Web Design
Want to Receive Email Updates of New Articles About Web Design?
Join My Email NewsletterTake Command of CSS Flexbox
Category: Tutorials
As a kid I loved playing with toy plastic army men. I would line them up and pretend to be in command giving orders to my soldiers in order to defeat the enemy. Since I was in full command, the soldiers would look to me for their orders. Sometimes a hot shot recruit would overstep… Read more »
5 Important Things to Keep in Mind When Making a Responsive Web Design?
Category: Articles
1. Write your CSS mobile first Write as though you are only targeting a mobile device. 2. Work in gradual stages Once the mobile device looks good add styles in media queries for larger viewports in stages working your way to larger sizes. 3. Keep your media queries grouped by component and not in a… Read more »
Why Is Responsive Web Design Good?
Category: Common Questions
I believe responsive web design is good because it solves the mobile friendly website challenge in the least amount of time/cost. One stylesheet for all devices Can be setup by one designer/developer Easy to maintain and update Less expensive – Does not require server side device detection or complicated mobile app programming Does not require… Read more »
5 Things Businesses Should Consider Before a Website Redesign
Category: Articles
Think about all of the things you look at every day: websites, movies, billboards, menus, youtube videos… Your eyes and brain are constantly absorbing information. All of this visual content is influencing your frame of reference. Some streams of images are more powerful and persistent than others. Take for example your computer, you could easily… Read more »
Style Guides are Important but Often Ignored
Category: Articles
“We began to refer to this living document as “a toolkit built in style guide form.” This achieved our goal to communicate our work…” – Mark Otto, creator of Bootstrap Framework Style Guides are Important but Often Ignored Recently at work, one of our websites was redesigned to be mobile responsive. It was developed by… Read more »
Code Comments Hierarchy
Category: Code Snippets
/* #################################################### L E V E L – O N E #################################################### */ /* :::::::::::::::::::::::::::::::::::::::::::::::::::: Level – Two */ /* Level three */ <!– #################################################### L E V E L – O N E #################################################### –> <!– :::::::::::::::::::::::::::::::::::::::::::::::::::: Level – Two –> <!– Level three –> /* #################################################### L E V E L – O… Read more »
Get URL parameter string – jQuery
Category: Code Snippets
var getUrlParameter = function getUrlParameter(sParam) { var sPageURL = decodeURIComponent(window.location.search.substring(1)), sURLVariables = sPageURL.split(‘&’), sParameterName, i; for (i = 0; i < sURLVariables.length; i++) { sParameterName = sURLVariables[i].split(‘=’); if (sParameterName[0] === sParam) { return sParameterName[1] === undefined ? true : sParameterName[1]; } } }; And this is how you can use this function assuming the URL… Read more »
Add class to body based on the URL – jQuery
Category: Code Snippets
// find the pathname var urlPath = window.location.pathname; //convert to lowercase urlPath.match(/\/(.*?)(\+|$)/)[1].toLowerCase(); // remove the first character urlPath = urlPath.replace(/\//g, ‘-‘).slice(1); //remove file extension urlPath = urlPath.replace(/\.[^/.]+$/, “”); // add class to body $(document.body).addClass(urlPath); // If body has no class its propably the homepage $(‘body:not([class])’).addClass(‘home’);
What are the Most Common Problems in Website Design & Development?
Category: Newsletter
When I began learning web design, I built websites using Adobe Dreamweaver because I could see a visual output of what I was building. This was familiar to me because I was used to designing in Illustrator and Photoshop. However, when the site wasn’t working I had no choice but to use the source code tab and… Read more »
7 Steps to Build a Website for Your Business
Category: Articles
1. Dream This is the most challenging and the most fun step in the process. Here you can picture what your website looks like, how it works, what pages will be included, etc. Visit multiple websites and look at their navigation, pictures, colors, and overall presentation. What things did you like and dislike? 2. Plan… Read more »