Archive for the ‘Website Templates’ Category

Years ago, when I first started working online and long before I learned how to design my own sites, I relied heavily on Web templates. I loved them. They made my life easier and they were an affordable option for a new start-up. Over time I came to realize that the most attractive Web templates were also often the most problematic for a new site owner — they relied too heavily on images (stock images to be exact). Today I’d like to talk about how stock images can pose problems for new site owners, and why designers might benefit more from creating less image-intensive designs.

What I Mean by “Stock Photos”

I want to be clear. When I’m talking about stock photos in Web templates causing a problem for the webmasters using them, I’m not talking about images that make up the basic site structure (like buttons or navigation link backgrounds). I’m talking about those creepy corporate smiling faces and very niche-specific photos so many designers love to use.

Most often I see these types of photos used in headers of Web templates. However, I’ve seen a few with stock images peppered throughout. Let’s look at why adding them might not be the best idea.

Why Stock Photos are a Problem

There are a few reasons stock photos can be a problem for people using a Web template. But first, let’s look at a common target market for these templates. Yes, some more experienced site owners still like to use templates and just customize them for their own use. But many Web template users (whether buyers or users of free templates) are new to managing their own websites. (more…)

I know that some of you are probably designers yourselves, or are at least somewhat familiar with CSS and WordPress theme styling. However, I usually work with writers. Many of them love WordPress for hosting either blogs or professional websites, but they often aren’t sure how to make simple CSS and HTML changes to improve their designs or alter a free theme they’d like to customize.

I’m sure there are plenty of bloggers outside of the writing community with the same problem. They use themes out-of-the-box not necessarily because they want to but because they don’t know how to change things. With those WordPress or CSS newbies in mind, let’s take a non-technical look at some quick HTML and CSS tips and tricks a new WordPress user can use to improve their blog design. Note: I’m not a designer — these are meant to be practical tips to help non-coders work around common WordPress design issues on their own. I do not claim that they’re necessarily the best solutions in all cases. If you’d like to share other methods, please do so in the comments.

1. Replace your blog title with a logo

By default, your WordPress theme might include a blog title link in the header, but to customize and brand your site you want to replace it with a logo. Here’s how to do that. First upload your logo image and have the URL / address for the file on-hand. Then go to the WordPress templates editor in your admin panel and find header.php. You might see something like this:

<h1><a href=”<?php echo get_option(‘home’); ?>/”><?php bloginfo(‘name’); ?></a></h1>

That code adds a link to your home page (with the text of your blog title). On my business site, this is what the site name looks like without a logo: (more…)

Web 2.0 is still here and hasn’t been renamed yet, but it seems that its design has evolved for the better. From soft gradient and glossy buttons it has gotten more handmade looking. Following are some trends that we’ve started to see more in, and that will be all the rage in.

1. Grungy & Rusty
Grungy designs are quite common for music band, they’ve also been around for quite a while in graphic design. However, a few talented designers have brought this trend to blog design. Dirty lines and lavished backgrounds are becoming common and will be even more in a near future.

2. Watercolour
With its irregular gradients, watercolour is one of the most enjoyed type of paintings. Webdesigners using this effect will add a soft touch to their designs and a kind of dreamy effect.

3. Collage
Before Photoshop, collage used to be a commonly used technique to mix elements together. It is also a good way to put colorful elements together and will often turn to joyful designs.

4. Vintage
Stylized old school drawings or photos will add a charming touch to any blog design. While not appropriate for every niche, vintage blog designs will definitly keep on being trendy.

5. Sketches
The first impression I get when confronted to a webdesign sketchy background is that there is some work in progress. Sketchy webdesign can definitly be a good choice if you want to make your blog or website a more lively place.

This article was written by Mirko Humbert, a swiss designer running a popular graphic design blog.

If your website doesn’t achieve the success you’re hoping for, it might be due to a very simple reason: bad design. While professional templates are hard to achieve for a non-designer, these simple CSS tweaks can dramatically improve your design, make it more accessible, and make it more efficient.

1. Nice Pull Quotes
Using the blockquote HTML tag is a good practice that many web writers use to differentiate quoted text from the rest. However, you can improve the rendering of these by tuning it with CSS. Adding nice typographic quotes and a background color will make your citations really stand out.
Tutorial on SitePoint

2. Background Images for Bullets
Bulleted lists are a nice way to display links, archives, or categories but they do look very common and fail to blend into your site’s design if to stick to displaying default bullet points. Did you know that you can replace these bullets with custom images? Doing this, you’ll have a more coherent design.
Tutorial on MaxDesign - Tutorial on MacWorld

3. Rounded Corners
When creating a box in your design using basic HTML and CSS, it will look very square with hard corners. You can smooth those out and make them look less aggressive using one of these two easy techniques.
Tutorial using images - Tutorial without images

4. Styling Your Forms With CSS and Labels
Unfortunately, it is still very common to see people use tables to align their forms. It is actually easier and more accessible to use CSS and labels to achieve this.
Tutorial on Pete Freitag’s blog

5. Styling hCard with CSS
hCard is a simple, open, distributed format for representing people, companies or organizations using a 1:1 representation of vCard properties and values in semantic HTML or XHTML. It is a nice way to display your contact information and it is easy to set up using the hcard creator.
Tutorial on 24Ways

6. Creating Your Print Stylesheet
If your article is long, chances are that people will want to print it out to read it. Improving the layout of the printed version is quite quick to do, so why don’t you do it?
Documentation on CSS discuss

7. Link Labeling
Ever clicked a linked and been taken to a PDF, DOC or MP3 file? Remember how annoying it was? Knowing this, you should be kind to your visitors and give them a way to know what kind of file a link will open. This can be done by adding a little application icon using the following technique.
Tutorial on Maratz.com

8. Removing Dotted Outlines
Ever notice this dotted outline coming around focused or active anchor links? It makes your site look less professional, so you should get rid of it using the following technique.
Tutorial on CSS tricks

9. Image Replacement for Submit Buttons
There are three ways to deal with submit buttons when designing: leave the default browser button, customize the background and border with CSS, or replace the button with an image. The last solution is the one that will blend in with the rest of the design the best.
Tutorial on Ampsoft

10. Styling Tables with CSS
Even though you should avoid using HTML tables for layout purposes, there are still cases where it’s the best solution, such as for presenting tabular data.
Tutorial for zebra table with CSS on A List Apart - How to style tables with CSS

This article was written by Mirko Humbert, a Swiss designer running a popular design blog.

A web template can be defined as a pre-defined schematic or pattern which you can re-use to fulfill you own requirements. A template can be of various types ranging from a formula based electronic calculator to a web design. It is a ready to use design created by web designers and sold for profits. Web templates are similar to any other website that allows the integration of text, audio, video and various other applications with it. A web design also makes use of certain strategies with which it can be deployed and distributed using the internet as a medium. A web design system is a methodology used to develop web templates. Web design systems are meant to work three functional levels; the principles to carry out these functions are pre-defined.

The core principles or functions can be listed as follows:

1. Web design systems work towards saving development time
2. Web design systems also work towards building a cost effective website or a cost effective online presences
3. A good web design system ensures that a webmaster or the owner of the website needs to spend very little time on maintaining his website

Web templates are a result of these three requirements. A web design system can enable you to produce a large number of replicas quickly and accurately, similarly, web templates can be used to create as many web pages and web sites as possible without having to worry about extra development costs. (more…)

Presently there are a few irrefutable advantages to properly designed Flash web page. Profound importance is given to the well framed content with the raged Flash technology. Without a strong regulation and exceptional coding, implementing Flash could turn out to be really atrocious and might cost you a lot of prospective customers. But, in this era where everything seems to be a blind maze it is advisable to install flash applications for your website or your template only if it satisfies the genuine need and intention with no explanatory troubles. Coming to a conclusion of when and how to exercise Flash are the larger concerns at this point. Above and beyond esthetic expressiveness and skilled rules of coding there are a number of incredibly sensible requirements to be understood in the greatest Flash webpage. (more…)

A web template is a framework of graphics and style created to simplify the web design process. A template is created with design elements excluding unique content effectively separating design and content elements. Templates vary in style and complexity.

Types of Web Templates

All-Page Template – a template encompasses an entire page including all design elements. Most elements including a header, footer, graphics and content location are fixed.

Block Templates – Only a portion of a website is included in template format. Menu bars or headers might be fixed on an otherwise dynamic website.

Template Engines - Templates used in conjunction with a template engine can be used to create mass-produced pages. Customized content contained within a database is combined with a pre-selected template to create mass-produce pages of a website. The template engine creates slightly differing pages based on database entries with little or no manual input of content into the web design.

Web Design Templates – Templates used for more personalized customization to create a more complex and unique website. These pages are updated in a more manual fashion. They may also contain fewer pages as they are not mass-produced via template engine.
(more…)

The main reasis to get an advantage in the form of it being faster in making the website that can often be as many as five to ten times faster than other means of creating a website. Professionals who are expert web designers can do the job, but the whole process is much slower.

You would also get better quality of finished product if you use a website template since the one’s that are already created are aesthetic as well as professional and provide maximum functionality as well. With ease of editing of the website template possible, you can create truly artistic websites without much fuss or bother.

A website template will also not necessarily mean spending a lot of money, as for a small sum of money; you can get a quality design that will provide a basis for creating your own website. Spending fewer than one hundred dollars provides you with a full-site creation with many pages, and for two hundred dollars you can get the templates adapted to your particular requirements. (more…)

If you aren’t a web designer and need to create a webpage, you don’t have to go through all that painful process. If there is one thing that Internet has shown us is that you can find services of any kind inside it. Web templates aren’t the exception. You only need to enter the following keywords: web templates, website templates or web templates and you will obtain thousands of results.

However, what are web templates exactly? Basically, website templates are the structure for the “text side” of your website. That means that within web site templates you will be able to find the content plus the html code.

Remember that web templates come empty. The only thing that you need to do is to insert your content in the predefined spaces of the website templates; the programming does the rest. You’ll see how the pre-programmed code of web site templates arranges the content perfectly. (more…)

If you are building a consumer driver website, it needs to look the part. Websites designed for search engines and spiders are not of the same caliber as websites for actual customers or clients. All marketers know it is best to start dabbling in a project to test its possibilities before committing full-scale, and the best way to do so is to create a basic site, and see if the target customers start arriving.

To build this site, you need to use better techniques than with previous, non-visually based websites. The cheapest and easiest way to do so is to use web design templates. These can help bridge the gap between concept and success, and most templates are so professional in appearance; they might be exactly what you need when the business really gets rolling, too.
(more…)