Tag Archives: Design Phase

Display Your Work with a Portfolio Header

Portfolio Header

When it comes to page headers there are sooo many creative options to choose from. I have been researching some of the unique headers over the last couple of months and here are my favourite picks. Hero Header Parallax Header Portfolio Header In this last article of this series, I will share something about Portfolio Headers. #3 Portfolio Header Portfolio …

Read More »

How to Get Free Icon Packs for your Website?

Free Icon Packs

If you are all excited about adding icons to your website after reading my last article on the topic, then this article is a must-read. Here I will share with you 4 ways to get some fancy icons for your website. #1 Font Awesome Font awesome is one of my favourite free icon packs. There are over 600 icons to choose …

Read More »

Icon – the Best Visual Clue for your Website Content

Sector Theme - List Icons for Services

Apart from colours and fonts, images also are an important visual aspect of websites. Images are the perfect way to give a visual clue of your content in a clear, concise and aesthetic way. And icons play an important role in this. An icon is a small picture that serves as an intuitive representation of the content of a website. …

Read More »

Hero Header: Three Headers that make an Impact (Part 1)

Hero Header

When it comes to page headers there are sooo many creative options to choose from. I have been researching some of the unique headers over the last couple of months and here are my favourite picks. Hero Header Parallax Header Portfolio Header In part 1 of this series of articles I will tell you more about Hero Headers. #1 Hero …

Read More »

Page Layouts – Responsive Web Design (Part 2)

Responsive Web Design using Fluid Grid, Fluid Images and Media Queries

In my previous article, I shared two types of page layouts. In this day and age of smartphones, and tablets, there is another design approach that is very effective. This is popularly known as the Responsive Web Design (RWD). In one of my previous articles on creating Fluid Grid System for your website, I mentioned about this approach.   allows users …

Read More »

Page Layouts – Fixed Width vs Fluid Width Layout (Part 1)

Page Layout: Fixed Width Layout vs Fluid Width Layout

When developing a website, there are traditionally two types of layouts based on how the dimensions of the web pages are set. These are referred to as Fixed Width Layout and Fluid Width Layout. In this article, I will compare and contrast the two for you and give you a few tips to work around some of the common problems …

Read More »

How to Create a Fluid Grid System for your Website

Responsive Web Design allows users to view the web pages across a broad range of devices and browsers in an easy to read layout and navigate with a minimum of resizing, panning, and scrolling. A site designed with adapts the layout to the viewing environment by using fluid, proportion-based grids, flexible images and CSS3 media queries These days, many websites …

Read More »

How to add your Typography to your Frontify Style Guide?

Setting up Typography in Frontify Style Guide

As promised in my previous article about showing you how to set up a Style Guide in Frontify, here is the second article in the series to set up the next design element – Typography. Before you set about creating your style guide, you need to ensure you have selected your fonts. Here are a couple of my previous articles that …

Read More »