banner
Welcome to HTML.co.uk, the number one resource for all news, information, and happenings regarding HTML.

Updates: HTML.co.uk has just been relaunched. Subscribe to our RSS Feed to stay on top of HTML news and techniques.
Apr
29th

Detailed Guide to Building an External Style Sheet

Advantages and disadvantages of using the external style sheets
The finest things that cane be done using this Cascading Style Sheets is that it would help you to keep your site in consistent. The simplest way to keep the site in consistent is to import an External Style Sheet or link the site. If the same external style sheet is used for each and every page of the site, it is sure that all the fonts of the site will be same.

Advantages of using the External Style Sheets
At once you can control the feel and also the look of many documents.
If you work with a team of people to create a Website, especially the External sheets is very much useful. Several style rules is pretty difficult to bear in mind and if you might taken a printed style guide and it is tedious and inefficient to be continuously go on flipping through out in order to determine if at all a example text has to be written in 14 point courier and 10 point Arial font.
You can even create classes of more styles that can be used on with various HTML elements as well.
If you want your fonts to be more efficient, you can easily group it.
All of the grouping methods that are used in CSS also can be used in this External Style Sheets as well and also this even provides you more flexibility with on your pages.

Disadvantages of using External Style Sheets:
If these External style sheets are very large, the download time will be increased.
They can increase the proximity of the site if there are small numbers of font styles.
These External style sheets get larger pretty quickly as it’s very hard to tell whether and when a style is no longer in use as it is deleted when the page s shut down or closed.

Creating an External Style Sheet
These External style sheets are produced or generated with a related syntax to the document level style sheets. Though all of the things that you need to include are the declaration and selector the syntax for the rule is and it is just like the document
Selector (property: value ;}
This rue has to be saved into a text file along with the extension of .css. Actually this is not required, but having this habit is good. By using this, you will be able to immediately recognize your style sheets.
You can link the style sheet documents in 2 different ways.

Linking
to link a style sheet document, use the HTML tag

Importing
Within the document level of style sheet, you can import the style sheet and with this you can import any URL and continue the style attributes of the External Style Sheet even without losing any document.


Apr
25th

Create a Design Brief for your Contract

Author: Editor | Files under General Website Information
Tags for this article: , , ,

What do you mean by design brief?

This Design Brief is nothing but a document that is written to describe the features and scopes of a particular project. This Design Brief is jointly developed by both the web designer and the client.

This design brief is not planned to be just a description of the genuine design. In words we can tell that the look and feel is not accurately defined in a particular Design Brief but instead a design brief will outline the objectives and goals of that website and also provides details on how they will be able to meet. Most of the Design Briefs are used in Conjunction along with a contract in order to define the terms of a web design profession.

Why to build a design brief?

This Design Briefs must be the part of that particular planning stage of any big design process. These Design brief are useful for both the client and designer because they provide a roadmap for both of theirs objectives and goals of their site. Designers will know on what to be focused on and also clients will know on what has to be achieved.

Where and when to start building a Design Brief

If you are a freelance web designer, now you will be the instigator of any Design Brief. It is also possible that even client will have lot better ideas of what he wants from their website beyond on “How to Make Money Online” or else “Get More Page Views” but most of the clients do not have so. So it is entirely up to the client’s interviews and also the project planning. So do the client interview in an efficient way.

What the matter should be there in a Design Brief?

All the Design briefs should contain information regarding on what is the project objectives and goals and as well as the deadlines and also the billing or else the contractual issues.

Some of the Site objectives and goals

Overview of the website as a total thing
Descriptions of the objective and goal
Explanation of the objectives and goals and of the project

Website’s audience
An explanation of the typical members they are trying to draw.
Gender
Age
Employment
Interests
Where should be the site particularly is used:
At home over slow connection or high speed connection
At an office
On PDA’s or cell phones
On a CDROM or over a kiosk

Scope of the project
The technology required for the project:
Redesign or full site build?
Development of HTML
Development of Ajax or JavaScript
Development of CSS
ColdFusion, ASP, PHP or any other server related technology
Flash
Ecommerce storefront
Content of both the clients and the designer
Text


Apr
21st

A look at the Basic Design Principles of Web Design

Author: Editor | Files under General Website Information
Tags for this article: , , , , ,

Webdesign’s basic principles are true for both the Web design and other type of designs. These principles show you how put your design elements in a manner which is more effective. Design is nothing more than slapping the HTML tags onto your pages and by using some the basic principles of designing, you can build designs that more useful and pleasing.

These principles include:

Balance:
Balance in design is nothing but the distribution of light and heavy elements on your page. Than smaller and lighter elements, those elements which are darker and larger appear heavily on your design. The balance principle will show you how to lay out your pages so that they work pretty well. There are 3 types of balancing your design and they are symmetrical, asymmetrical and discordant or off balance.

Contrast:
When there is a thought of contrast, most of the people will think of colours or white and black. But the fact is there is more to contrast than your colors. In contrasting, you can have contrasting sizes (small vs large), contrasting shapes (circle vs square) and contrasting textures (rough vs smooth). It is just an accentuation of elements differences in your design. It can work with any kind of design. In a design, contrast can be implemented in several ways like: change the fonts, links, headlines and images.

Emphasis:
In any design, emphasis is the place where everybody’s eyes are drawn. It is one of the ways to provide stand out for the important element in your design. It’s very much tempting to provide equal emphasis or to give emphasis on everything in a design but if equal emphasis is not given to your design; it might look flat and bland. To avoid this problem of flat look, as a designer, you have to determine the page’s hierarchy and then you have to apply your emphasis to elements that are based on your page’s hierarchy.

One of the biggest mistakes done by the designers is that they will emphasize all the elements in their design. When all the elements in the design have equal emphasis, the page looks too busy and your design will be unappealing and boring. So you have to emphasize the elements which are most important. In Web designing, emphasis can be implemented in few ways like by using semantic mark up and by changing the font size.

Rhythm:
It is also called as repetition. Rhythm brings comprehension for humans and is pretty easy for the humans to comprehend and also this repetition offers patterns that will make you sites easier to comprehend. It lets your design to develop its own internal consistency and this makes your customer easier to understand. Anything in your design can be repeated to produce rhythm to your design.

Unity:
In design, unity is also known as proximity. If you want to have cohesiveness to your design, unity provides you that. In your design the element that are positioned farther apart are relatively less related and those elements that are close to each other are more related.


Apr
17th

Position and Placement: The Basics of Web Design

Author: Editor | Files under General Website Information
Tags for this article: , , , , , , ,

When you are starting new designs, it is of no matter which design methodology you use but you have to start with a blank page. Initially your WebPages will be having nothing, so you have to put something into that.

If you want to make your WebPages have good designs, you shouldn’t allow the placements and positions to occur randomly and to have to think of things like

What is an element?
How these elements are related to page goals?
Where do the elements fit with other elements in your page?

What is the element that you are going to place?
In a Webpage, there are several common elements such as navigation, headlines, textual content, images and administration. You should know what type of element that you are going to place because it is important to place it at the correct position.

How do these elements relate to your page goals?
If you know your goals and your page’s goals, these goals will be the key for placements. If your goal is to make people click and want to take notice of them, you have to place your elements at the place where people often look at.

Where should be the other elements be placed?
It is the most important part of your design. If you have your logo on the upper side of your page and if you don’t have content, it will not have any meaning. So, you should also think of placing your content at the right positions.

The place where you place your elements will make you feel the difference
As the people in real estate say that location, location is the important factor. Instead of keeping the paintings of Michelangelo in museum, if it is put in your garage does it have any value? So you have to place your elements in an effective place and if you place your element in an effective place it provides structure and visual hierarchy to your Webpage. Your work will be half done if you have engaged your customer via compelling and interesting design.

Place your elements in the center of your Webpage
One of the simple design techniques is to place their elements at the center of the Webpage. This technique is used by new designers as their goal. Placing in the center appeals to most of the people because it is very simple.
Centering might appear boring and on the screen it might look flat but it is rarely done. Centering is done because it catches the people’s eye immediately.

In your Webpage find the point of interest.
The focal point of design is the place of interest and this is the place where you eyes are drawn. If you change the spacing styles in those places, you will come to know how the items are viewed in your page.
If you make certain small changes to the positions where your elements are going to be placed like putting up of margins around your images, then your resulting image layout will be more visually appealing.


Apr
14th

The Pros and Cons of Freelance Web Design

Author: Editor | Files under General Website Information
Tags for this article: , , , , , , , ,

It’s great to be a freelancer as there are lots of things in this to learn and experience. Before getting into the freelancer job, you have to know the facts that are associated with this job. Just like a corporate web designer, even in freelance there a certain pros and cons associated. Before you jump in to this job, ensure the advantages outweigh the disadvantages in this job.

Advantages of being a freelance Web designer

Work whenever you want to do:
This is one of the popular reasons why people become a freelancer. If you’re a person who will be up all night, a 9 to 5 job is very much challenging. But you as a freelancer can work whenever you feel like to work. This job is a perfect one for house wives and for daddies who need time to arrange their work along with their babies. This job also means that, you can for any people in different time zone and can also work after you return from the job as well.

Work from wherever you wish to do
Most of the freelancers work at the comfort of their houses. It is also possible to work from your nearest libraries or even from your local coffee shops as well.

You can be your own boss.
As a freelance worker you will not be working under any company or any person, instead you are the boss for yourself. So as a freelancer, you need not worry about micromanagers or from any unreasonable expectations from your company or your boss. In any ways the clients who give you the work is your boss. The clients can be demanding and unreasonable but that may leads to your next advantage.

You can be your own boss.
As a freelance worker you will not be working under any company or any person, instead you are the boss for yourself. So as a freelancer, you need not worry about micromanagers or from any unreasonable expectations from your company or your boss. In any ways the clients who give you the work is your boss. The clients can be demanding and unreasonable but that may leads to your next advantage.

Choose the projects that you will be able to do
As a freelancer you will not be choosing the projects but also the clients as well. If at all you feel that the job has trouble and working with company may ask you to do some work and if you feel it is unethical you can quit that work and if you feel that the job is boring, then also you can reject the work.

As you go learn whatever you want to do
You can learn many new things as a freelancer suppose if you decide on get fluency in PHP, you needn’t take permission from your boss in order to put PHP scripts on take a class or server. You can just do it. The fact is that a good freelancer will be learning all the time.

No fear of dress code.
As freelancer you will be in your own world and nobody will question about your dress sense. But you need to have some business outfits for client meetings, presentations and but you won’t need nearly as many as you would if you worked in an office.

You will not be working on only one project and only one site and you can incorporate your hobbies into your work
As a freelancer you can choose wide variety of projects and can work on different sites as well. While doing the work you can even incorporate you hobbies as well.


Apr
11th

Tips on creating a Site Plan

Author: Editor | Files under General Website Information
Tags for this article: , , , , , ,

A site plan is nothing but it helps you to create your own business website so that it meets your business and customer needs. At the beginning of creating a site if you take more time, you can avoid all the kinds of pitfalls and can ensure that you have all the contents required to get your site off to a good start.

When you’re building site, your plan should include

The purpose of your site:

What is the main point for which you’re creating your site? How is your site going to fulfil the main purpose better than many other sites that are available in the Web?

The site goals

If you do have some smart goals, these goals can help much better to take a mediocre site and you can make it great. If you the goals for your site, you can go and play around.

Your customers

For whom you’re creating the website? Try to be precise as possible as you can regarding to your targeted customers. Include the details like hobbies, age, job (titles) etc. you might envision that different people will be visiting different parts of your website and it will not be a problem at all. It’s important to know what kind of audiences you’re targeting at. Already if your website is active or live, you should include some more data to the targeted audiences that you currently maintain.

The content

It’s important to know what content you have on the site, will the content that you have will change regularly, are going to sell your products without any product page or will just focus on providing the product details through some articles. You have to decide whether your site is going to have only text, multimedia or images, do you have already created content or you have to get the content newly.

The design of your website

When planning the site, you have to think what colour will match your site. Keep in mind that design aesthetic will vary across different demographics. So if you planning your site for cutting edge designers, it definitely have entirely diverse look than the one that is designed for stay some designers who are called as home dads (this except for the designers who stay at home). The website’s designs include things such as graphic element, fonts, colours and typography. If you have more plans in your head before you create the site, then it will be easier at the phase of design.

The timeline

If you have all the plans altogether at once, you have to take decision on a particular design. While fixing the schedule, do not forget to include time for revision, feedback and testing.

Altogether write down your plan

If you have several plans altogether, you can plan in lots of ways and capture many ideas so that you will be in a better shape. Sessions of planning will quickly become a brainstorming session. Fortunately this is good, but don’t let that to make you down.


Apr
8th

How long should your webpage be?

Author: Editor | Files under General Website Information
Tags for this article: , , , , , , ,

There is lots of focus on the Web design sites on how wide and your webpage should be as width is very much important to a webpage. Have you ever thought on how long should your webpage be? Conventional wisdom tells that one shouldn’t make a page longer than a particular screen full of text as readers will hate to scroll down the page. The content below the screen full is called as fold and most of the webpage designers have a belief that the fold will not be visible for the readers.

The study done by UIE has found that most users will be ready to scroll over the pages without a single comment.

Scrolling is not the only thing that hides the information

One of the most common arguments that are found against writing long pages is that it more often causes the information on the page to be hidden that is below the field and readers will not be able to read or see that. When you put that information on any other page will altogether will hide the entire information. In other words we can tell that, if some 100 people visit the first page and later only 50 make it to the second page and only 25 visits the third page and so on. The viewing drop rate will be very much high from second page.

Normally when a page is long, for the reader there will be a visual cue in the form of a scroll bar on to the right side of the page. In order to make their pages to look too short, most of the designers will change the length of their page’s scroll bar. If it is done in this way, people will not see that and will be reading the entire page. When you create small pages and provide a link to the nect page where you can give more information without telling the user on how long is the page. If the information is put in only one page, the readers will show interest and will scan the entire page.

Some thing block the scrolling

If at all you have long pages and want your users to scroll through the entire page, you have to see that nothing blocks the scroll bar. These are some of the elements on your webpage that implies that the page is over. The elements are
Lines of text links
Horizontal lines
Social media links or navigation icons
Short or wide graphics

Finally how long should be your webpage?

Your page length will ultimately depend on your audience. Like adults, children will not be having long attention spans and here if a topic is good to read, then it will be of no matter how long is your page.
So no article should or must exceed two printed pages
If your content is merited, you can put it one page and make your reader read the page and make them to go to nect page.


Apr
3rd

What is the HTML download tag?

Author: Editor | Files under HTML Tags
Tags for this article: , , , , , ,

Whenever you create a link in a particular Webpage, it’s obvious that most of the Web browsers will automatically attempt to open that particular link in the browser window. At present, with the use of various plug-ins and many other features, browsers will be able to open more files the files that they were forced to download. In times, this is the one we want mostly as after all we are building WebPages. You’ll also post your files sometimes to your Website where you want the browsers to download in to their hard-drive rather than just viewing in the Website’s browser window.

If you want the browsers to download the content from your Website, an HTML download tag would be the perfect solution. But unfortunately there is no such tag as an HTML download tag. If you want to set up some file download files in your Website, you just link the file in same way as you would link a particular file in order to open in that browser window. Without a HTML download tag, you can initiate your download, as there are some ways to do it.

Do tell your Website readers regarding their Browser functionality

The browsers that are coming today are very modern in nature that has context menu. If you right click the mouse button this context menu will appear (or options plus mouse button for a one button Macs). Whenever you right click on a particular link, one of the options that appear on the context menu is “save link as…” or “save as…” if you choose this, that file which is on the other side of that link will be downloaded to a hard drive even though it could be opened in that browser.

To emulate HTML download tag, the simplest way or method is by telling the people to just right click on any of the particular link that is to be downloaded and you can write some thing like this as mentioned below

(Option-click or right-clicks on that particular link and then choose to do “save as…” in order to download that link to the hard disk directly)

In Order to download, compress the file

If you want to automatically download the file, then compress your file using your using your operating system and the compression is done by just zipping the file. The files that are zipped will automatically download.

With PHP trick the browser

At last, if you have the knowledge of some PHP, you can just use 5 simple line of PHP script, so that you cab force the Web Browser in order to download the particular file even without zipping the file or else you can ask the readers to do whatever they want. This type of method relies only on HTTP headers in order to tell the browser that this file is just an ordinary attachment rather than it is a Web document. (This PHP will just allow you to change HTTP headers).