Pradhanbros Tutorial

Web site design and development

Definition of a Website

• A website is a collection of Web pages, images, videos or other digital assets that is hosted on one or several Web server(s), usually accessible via the Internet, cell phone or a LAN.

• The definition of web page is a document, typically written in HTML(HyperText Markup Language (html) is the main markup language for

creating web pages ), which is almost always accessible via HTTP,(hypertext transfer protocol: the standard protocol for transferring hypertext

documents on ) a protocol that transfers information from the Web server to display in the user's Web browser.

What Makes a Website

Domain

• Domain Names• A Domain Name is a unique 'web address name'

that is used to direct people to your website across the World Wide Web. You can obtain a domain name thru company that specializes in registering web addresses which are called Domain Registrars.

• Domain names and IP addresses are linked in a computer that carries domain information called the domain name system (DNS).

Hosting

• A web host is the computer that has the ability to display the website on the World Wide Web so that everyone can see it worldwide. The web host is a computer, just like you have at home, except that all it does is display websites on the World Wide Web. Web hosting is the service that provides you with the ability to display your website.

Three main elements of website

Structure of your website– The form of your website and its method of navigation go hand in hand.

This is the framework that will support your website like your skeleton supports your body. Don't confuse structure with layout

Content and body of your websiteThe body and substance of your website is its content. What do you want to sell,

say or present? That should be the focus of your website's content.

Layout and presentation of your websiteThe method of presenting your website theme or message is

determined by your webpage construction and layout of your individual web pages.

Basic website structure

• As the diagram below shows a website is composed of three main website sections: The homepage, the main sections and the subsections.

Typically, a web site falls under one of the following broad categories;

• Non-editable brochure web site (often referred to as static site).

• Editable brochure web site (requiring a content management system).

• Editable, dynamic web site, with more user engagement (login areas etc) and self managed through a content management system.

• E-commerce site – integrated with a payment gateway such as Paypal, Worldpay or banks like Barclays or HSBC.

• A web application – when a web site requires lots of bespoke functionality or processes it generally falls under the web application category

Types of websites

On-line promotion

• The on-line promotion of a website is often overlooked when considering the website brief. The promotion of your website on the internet, both in terms of getting it on the search engines and also building links with other websites, is vitally important to the continued success of the site.

• You should consider:• Building link partners.• Search engine optimization and submission.• Search engine paid listings (the sponsored links you see on the side of your

search results – Google Adwords).• Email marketing – commonly HTML emails that are branded inline with the web

site.• Social media• Banner advertising on related web sites.• - See more at: http://www.methodandclass.com/article/how-to-write-a-brief-for-

a-web-site#sthash.HKlBO18P.dpuf

Web Brief

• A couple of paragraphs about your company• The products your sell or services you provide• The size of the company – e.g. the number of employees,

a rough turnover figure (if you want to provide it – there is a lot of difference between how a £100,000 company and a £100,000,000 company should look!)

• Are you an international company? If so, which countries?How long have you been established?

• Describe the company using five or ten words (e.g. young, vibrant, technology based etc.)-

Question to be asked for old Websites: redesigning brief

• What is good about the web site?• What is bad about the web site? (i.e. old colour schemes,

out-dated design)How long ago was it built? and who built it?• What levels of traffic is it currently receiving?What

percentage of the traffic is from smart phones & tablets?• Which countries are you visitors from?What are the top 5

web browsers and platforms (Mac/PC/Android/iOS) visiting your web site?

• How often do you get a genuine sales lead through the web site?

• Who is responsible for updating the site?

Details• Outline the aims of the web site ( e.g. to increase traffic, increase product awareness,

generate more sales, offer e-commerce, advertise a new product or service)• Who is the target audience? • Has this changed from the old site? • What are the demographics (e.g. children, adults, social class, income levels,

location, etc.)How will your target audience be accessing your site – via their phones, tablets or desktops?

• Is the new web site part of a re-brand, or a new product launch?• Is there other advertising taking place that the new web site should tie in with?What

are the unique selling points for your company, your products or your services?• What industry are you aiming the web site at?• Is the market already saturated with competitors?• List a few competitors’ web sites.For e-commerce web sites, you should detail who

you bank with – this will be important for deciding on which payment gateway you should use

Budget

• What is the budget for design and development of the web site?

• Is there a budget for ongoing support and maintenance?

• What is the online marketing budget for the next 6 months

Design Process

5 Basic Rules of Web Design

• You should choose your text and background colours very carefully. You don't want to use backgrounds that obscure your text or use colours that are hard to read. Dark-coloured text on a light-coloured background is easier to read than light-coloured text on a dark background.

• You also don't want to set your text size too small (hard to read) or too large (it will appear to shout at your visitors). All capitalised letters give the appearance of shouting at your visitors.

• Keep the alignment of your main text to the left, not cantered. Centre-aligned text is best used in headlines. You want your visitors to be comfortable with what they are reading, and most text is left aligned.

• Your web site should be easy to navigate• All of your hyperlinks should be clear to your visitors. Graphic images, such as

buttons or tabs, should be clearly labelled and easy to read. Your web graphic designer should select the colours, backgrounds, textures, and special effects on your web graphics very carefully.

Thank YOU

www.pradhanbros.com