All posts in web design

Designers Know Your Code: Web Design Tutorials


As almost any web designer worth their salt, and a large percentage of web developers will tell you, to be fully considered a web designer you have to have some background in code. Not to the depth that full on developers must, but it really is unfair to the rest of those working on a website with us if we do not have some knowledge in a handful of key areas. Which is where these web design tutorials come in.

In this post we have gathered a handful of useful tutorials from these various areas of code that designers should have their hands in. We have standard CSS and CSS3 tutorials, HTML5 and also Javascript tuts as well. A little something for all three of the main code branches that web designers need to always be improving their grasps on. We hope that you find these web design tutorials helpful in your next or current project!

7 Tips to Create The Mobile Version of a Website


Not long ago developers considered browser-rendering differences to be one of the most challenging problems. IE6 probably a nightmare to the online industry, is gone but there are still a lot of issues with browsers that make coding a tough job. Along with the exponential evolution of smartphones and handheld devices other issues have emerged and left the browser problem somewhere in the background.

Making a mobile version of a website is apparently simple: minimize the amount of content and pictures, tests and maybe some enhancements. Still, the big dilemma in every web designer’s head is how to increase compatibility as mobile devices have various screen resolutions: 128×160, 176×220, 240×320, 320×480. Most likely, soon, we will witness devices with even more resolutions and choosing a screen size for the website will be even harder. Still, mobile sites are a necessity and ignoring it would be foolish. And to stay in the bad news section: usually people who access the Internet from smartphones are rather selective: only a small number prefer the phone when they’re browsing for fun; most people still stick to the old desktop…

Tips in Using Background Pattern for Web Design


Patterns are combination of tiles, templates and cells arranged together. Most patterns are based on repetition and periodicity while others use magnification and scaling. There are patterns used in cloths and other materials that symbolize a tribe or culture. But these days, patterns are used in different manners and are not merely limited to flowers, swirls and lines. There are already hundreds and thousands of designs created by various artists which can be used in many manners.

Background patterns had been used in designing various graphic materials and websites. We can see this in wrappers, wallpapers, business cards, web designs and others. In today’s post, we will give you crisp tips that can be your guide in using patterns in web design. Also, we will feature some websites that uses patterns in their design so that you can see how effective background patterns could be.

The Art of using Illustrations in Web Design


There are many of elements that go into enhancing a web design project. Typography, new technologies and UX design patterns are only some of them. One the most powerful is illustrations and vector graphics. They can be handy in a broad range of applications. Remember the cliché, a picture is worth a thousand words? In using them, we designers are able to do more while spending less. Illustrations are a good way to make a design unique and memorable. When they are used appropriately, users will associate them with your website, thus enhancing your brand. They also make the page more attractive, and draw attention to particular parts of the layout. They can also be informative or directive, such as to show steps in a process or how to use a service. While most designers will use illustrations to supplement their design (for example using them for characters, landscapes and so on), others go so far as to base their entire layout on them. This can lead to problems, such as SEO and page-loading time, but such designs do look fancier. Also, illustrations are ideal for humor. It’s up to the designer to decide what kind of illustration fits their needs. But they can be used effectively in some way in almost every project.

Best Approach to Mobile Website Design


We’ve heard 2011 being many times named as the year of the mobile web, although the last couple of years we heard this association many times. As technology advanced, so did the mobile phones, which we call smartphones today. The internet usage increases every month and the tablets and smartphones start being adopted by every family. 53.6 million people in Japan access the internet from a mobile phone per month, which is almost as much as the users who access the internet from a PC. In the United States around 20 million users use Facebook to check-in every month, so the number of people who access the internet has to be somewhat bigger. According to different sources, the number tends to get past 100 million users monthly. Nobody expected this to happen 10 years ago, but here it is.Therefore the developers have more work to do now with so many companies asking for their own mobile website. In this article we will focus on a user-centered approach of the mobile webdesign which became popular in the last couple of years. With
smartphones having a narrow screen, limited space and less keys, the mobile webdesign is quite different compared to the classic one, for computer screens.

8 Tools and Scripts for Responsive Web Design


At Theme Trust, we recently launched our first responsive WordPress theme. Since it was also my first time building a responsive website, I had to do some learning and research. Along the way, I discovered some interesting techniques, useful resources, and handy tools to help with the task. So in this article, I’m sharing some of those tools and scripts I came across that make developing a responsive website a whole lot easier.

How to Create An Effective Complex Footer: Content Design and Examples


In the past, copyright information and the website name were the main elements found at the bottom of a website. Sometimes, the most heavily used navigation links would be included as well. Users expect to get information from the internet faster and faster – and it’s only going to continue. By creating a complex footer on your website, you can cater to the individuals looking for specific information quickly.

Grid Layouts in Modern Web Design


The use of grids in web design is a popular topic that has inspired many designers in their pursuit of the perfect site design. Although this concept is just a few years old, the use of grids has been ever-present in field engineering and architecture, where precision is key. However, the concept of grid theory, where proportion is given as much emphasis as structure, has been around for thousands of years and is exemplified in the works of Pythagoras, who proposed numbers as ratios rather than single units.

How to Use Typography Effectively in Web Design


Typography is always used in whatever design one will work at. There could be similar things that one should take into consideration but there are also some different things that one should look at especially in web designing. When some visits your site, they will surely be curious about what your website or blog is. Hence, they will read what is there. You have to prepare your website to make it readable and pleasing for the readers so that they will stay longer in your page and be a regular reader.

Aside from choosing colors and images, typography is one of the priorities of a web designer. The art of arranging type has a great impact on the entire appearance of the website. That is why we will share to you some important things to keep in mind when designing a website using typography.

Adopting Feng Shui in Web Design


Feng Shui, pronounced fung-SHWAY, is an ancient Chinese practice of aesthetically placing things in a specific way in order to allow positive Qi to flow through the environment. Qi, also referred to as chi or ch’i and pronounced in English as CHEE, is the Chinese word for that active principle within all living things. The literal translation of Qi is air or breath. has been hailed ” Feng Shui has been hailed as the Environmental Science of the 21st Century.