You may have observed some good website design or web applications on internet that attracts lots up people like you. It is obvious that it is not a work of a day or two or not a one man show. There might be a whole team involved for many weeks. The process of developing such applications differs greatly, but follows some basic elements commonly. Therefore, here we will discuss some common basic elements of website designing.
Step: 1 – Project Definition
Information and Project Brief
First of all you are to collect information to define your project very well. The information would be what your personal or business goals and how the web can be utilized to help you achieve those goals. Therefore, information would be related to:
* Purpose
* Goals
* Target Audience
* Content
You can prepare project brief based on the information gathered.
Step: 2 – Project Structure
Project Planning and Site Map
After preparing project brief you can start project planning by initializing development of site map, a list of main topic areas as well as sub topics. Site map will serve as a guide to decide what contents would be and where. It is necessary to create good navigation for a site.
After site map go for pre-design step, wire frame development. This step helps your client to interact with your design process. Wireframe is a skeleton of web page layout. It will suggest you to place all essential elements of your website to their proper places. You have to consider few things in creating wireframe:
* Assure that all important elements are included such as logo, navigation, content placement, images/video placement, login box, search, breadcrumbs, etc
* Reference the flowchart or project brief
* Avoids the graphics
* Use text only to label the elements
* Concentrate on clean and user friendly layout, don’t over segment your site
* Define the linking structure
* Consider the SEO point of views
Step: 3 – Visual Design
The selected site map will turn in to the visual design now. Take care of detailing themes, colors, fonts, etc. Put every thing in to drawing software and prepare possible mock ups to approve again from the clients. At this stage you will have design for main page like home page and sub pages. Design sub pages will give you a template design for it. Assure that all texual content should be well written and grammatically correct.
Some key things to keep in mind here:
* Branding or theme
* Target audience
* Grid – keeping the elements structured and to a grid system is important
* Development – bare in mind this has to be produced in CSS so don’t make anything too complicated and keep graphics minimal
A high-quality design should have:
* Balance. Balance is the equal distribution of the heavy and the light elements on a single page.
* Unity. Everything should be pulled into one integrated whole.
* Emphasis. Emphasis involves the main points where the eye is drawn into the design; also known as “focal points”.
* Contrast. Not just color contrast, but also contrasting shapes, sizes, textures, and even typography.
* Rhythm. Also known as repetition, rhythm brings internal consistency into your web design.
Step: 4 – Development
At this juncture real coding starts and graphical design turns into fully functional actual site. Typical first step of coding is development of ‘Home’ page which followed by a ‘shell’ for the interior pages. The shell serves as a template for the content pages of your site, as it contains the main navigational structure for the web site. Once the shell has been created, your designer will take your content and distribute it throughout the site, in the appropriate areas. Multimedia elements are implemented at this stage.
It is necessary to keep in touch with your client frequently so you can make necessary changes according to their wish.
Step: 5 – QA & Testing
After completion of coding an extensive testing is essential step so you can avoid future issues and bugs at this stage. Testing of overall functionality, check for code validation means your site meets current web standards. Cross platform and cross browser compatibility.
Step: 6 – Lunch
When your site passes all tests successfully you will upload it on the server and make it public. Before official lunch, it is better you check for all help documents prepared for it. After lunching think over the maintenance schedule so you can keep it running and make your content fresh time to time.
For more information regarding our custom website design services please visit: http://www.indianic.com/custom-website-design.html
Step: 1 – Project Definition
Information and Project Brief
First of all you are to collect information to define your project very well. The information would be what your personal or business goals and how the web can be utilized to help you achieve those goals. Therefore, information would be related to:
* Purpose
* Goals
* Target Audience
* Content
You can prepare project brief based on the information gathered.
Step: 2 – Project Structure
Project Planning and Site Map
After preparing project brief you can start project planning by initializing development of site map, a list of main topic areas as well as sub topics. Site map will serve as a guide to decide what contents would be and where. It is necessary to create good navigation for a site.
After site map go for pre-design step, wire frame development. This step helps your client to interact with your design process. Wireframe is a skeleton of web page layout. It will suggest you to place all essential elements of your website to their proper places. You have to consider few things in creating wireframe:
* Assure that all important elements are included such as logo, navigation, content placement, images/video placement, login box, search, breadcrumbs, etc
* Reference the flowchart or project brief
* Avoids the graphics
* Use text only to label the elements
* Concentrate on clean and user friendly layout, don’t over segment your site
* Define the linking structure
* Consider the SEO point of views
Step: 3 – Visual Design
The selected site map will turn in to the visual design now. Take care of detailing themes, colors, fonts, etc. Put every thing in to drawing software and prepare possible mock ups to approve again from the clients. At this stage you will have design for main page like home page and sub pages. Design sub pages will give you a template design for it. Assure that all texual content should be well written and grammatically correct.
Some key things to keep in mind here:
* Branding or theme
* Target audience
* Grid – keeping the elements structured and to a grid system is important
* Development – bare in mind this has to be produced in CSS so don’t make anything too complicated and keep graphics minimal
A high-quality design should have:
* Balance. Balance is the equal distribution of the heavy and the light elements on a single page.
* Unity. Everything should be pulled into one integrated whole.
* Emphasis. Emphasis involves the main points where the eye is drawn into the design; also known as “focal points”.
* Contrast. Not just color contrast, but also contrasting shapes, sizes, textures, and even typography.
* Rhythm. Also known as repetition, rhythm brings internal consistency into your web design.
Step: 4 – Development
At this juncture real coding starts and graphical design turns into fully functional actual site. Typical first step of coding is development of ‘Home’ page which followed by a ‘shell’ for the interior pages. The shell serves as a template for the content pages of your site, as it contains the main navigational structure for the web site. Once the shell has been created, your designer will take your content and distribute it throughout the site, in the appropriate areas. Multimedia elements are implemented at this stage.
It is necessary to keep in touch with your client frequently so you can make necessary changes according to their wish.
Step: 5 – QA & Testing
After completion of coding an extensive testing is essential step so you can avoid future issues and bugs at this stage. Testing of overall functionality, check for code validation means your site meets current web standards. Cross platform and cross browser compatibility.
Step: 6 – Lunch
When your site passes all tests successfully you will upload it on the server and make it public. Before official lunch, it is better you check for all help documents prepared for it. After lunching think over the maintenance schedule so you can keep it running and make your content fresh time to time.
For more information regarding our custom website design services please visit: http://www.indianic.com/custom-website-design.html
