DESIGNING FOR WEB
We have been asked to judge a list of websites in the first 5 seconds, we have to shut out words, either good or bad to work out our initial reactions.
Content should make the website good, not the design! The design should
be functional and the content appealing.
ollymoss.com - Bland, dark, empty, boring, small, plain, dull, simple
malikafavre.com - Fun, colourful, hectic, bright, GIFs, bright, eye catching
360langstrasse.sf.tv/page/ - Plain, photography, german, google street view
mercertavern.com - Hipster, smart, clean, retro, vintage, black and white, monotone, boxes
noble-design.co.uk - Vector, colourful, smart, girly
caavadesign.com - waves, photoshop, colourful, CD, simple
sb-studio.co.uk - photo, clean, swedish, clinical
smart-heart.ru - minimalist, smart, interactive
formfiftyfive.com - machine, interactive
When Designing a Website consider:
What is the purpose of the website?
Who is the target Audience?
What do the target audience need?
Type, Image and Navigation
How can you find this out?
- Create surveys for the target audience.
- Look at similar websites with the same target audience.
- Research Studios
- Ask studios what they want to see.
- Be creative with emails.
Web Limitations
- You can only use the standard fonts, you have to buy font families.
- Work in RGB - web safe colours.
- Size of the site - width and height
- 72 PPI - but most computers have 96 PPI
- Retina display 227 PPI
- 800 x 600 - Simons standard website size
Check out http://www.fontsquirrel.com/
HTML & CSS Design and Build Websites
For next week draw out how you want the website to look
draw a site map also - where the home page will link to etc.
Web Terminology
HTML - HyperText Markup Language
URL - Uniform Resource Locator
CSS - Cascading Style Sheet
FTP - File Transfer Protocol
CMS - Content Management System
WEB DESIGN TERMINOLOGY
Below is a list of some of the most commonly used terms in web design and development.
Animation
The creation of a series of graphic images or frames so that they have the look of moving continuously. This can include simple animation (created using .gif files), the appearance of animation with JavaScript, or more complex animations using Flash.
Broken Links
Hyperlinks, or links that fail to open a web page, usually producing an error page instead.
The creation of a series of graphic images or frames so that they have the look of moving continuously. This can include simple animation (created using .gif files), the appearance of animation with JavaScript, or more complex animations using Flash.
Broken Links
Hyperlinks, or links that fail to open a web page, usually producing an error page instead.
Composite (Comps)
The look of the website without actually creating it. This is achieved with graphics only, and is usually presented to the client in printed form or as an attachment in an email.
Contact Page
The page in a website that contains all information as to how to contact a business or individual. This usually includes a mailing address, phone number, fax number, email addresses and any other criteria that may be necessary. This page can also include a map and directions.
Content
The body of a web page. Content includes words, selling points, graphics, animations, etc. that do not comprise the framework of the page. This is the information that changes from page to page.
Debugging
Detecting, locating and correcting errors or problems in a computer program or web site.
Design
The process and art of creating a Web page or website. It may involve both the look and mechanics of how a website works. Some of the features that make up design are:
The look of the website without actually creating it. This is achieved with graphics only, and is usually presented to the client in printed form or as an attachment in an email.
Contact Page
The page in a website that contains all information as to how to contact a business or individual. This usually includes a mailing address, phone number, fax number, email addresses and any other criteria that may be necessary. This page can also include a map and directions.
Content
The body of a web page. Content includes words, selling points, graphics, animations, etc. that do not comprise the framework of the page. This is the information that changes from page to page.
Debugging
Detecting, locating and correcting errors or problems in a computer program or web site.
Design
The process and art of creating a Web page or website. It may involve both the look and mechanics of how a website works. Some of the features that make up design are:
graphic creation
animation creation
color selection
font selection
navigation design
content creation
HTML/XML authoring (known as scripting)
programming (PHP, .net, ColdFusion, Perl, JavaScript)
ecommerce development (requires programming)
Design Process
The method that carries a client and their web designer from the idea of a website to the actual creation and implementation of a website.
Digital Photography
Using a digital camera to take photographs. A digital camera stores the pictures electronically and can then place them directly on a computer. An alternative is to scan regular photographs that have been developed and place them on the computer. Scanned photos are usually not as clean and clear as those taken with a digital camera.
Domain Name
Allows you to reference Internet sites. To register a domain name, you can contact an online company that sells them or you can ask your web designer, Internet Service Provider or site host to register your name for you. A few domain name suffixes (also known as top-level domains) are:
The method that carries a client and their web designer from the idea of a website to the actual creation and implementation of a website.
Digital Photography
Using a digital camera to take photographs. A digital camera stores the pictures electronically and can then place them directly on a computer. An alternative is to scan regular photographs that have been developed and place them on the computer. Scanned photos are usually not as clean and clear as those taken with a digital camera.
Domain Name
Allows you to reference Internet sites. To register a domain name, you can contact an online company that sells them or you can ask your web designer, Internet Service Provider or site host to register your name for you. A few domain name suffixes (also known as top-level domains) are:
.com for businesses (the most commonly known suffix)
.net for networking companies, ISPs, and Web hosting companies
.org for non-profit organizations
.me for personal sites like MaryMorris.me
.info for information sites
.biz for businesses
.edu for educational institutions
.gov for government institutions
.mil for military institutions
Dynamic Content
Interactive features on a website. The content the user sees is sometimes updated based upon the users input. Dynamic content can be information stored in a database, user input, or even cookies. Forms and a Search option on a site are perfect examples of dynamic content.
Graphics
A picture or image produced on a computer. These can include .bmp (bitmaps), .jpg (joint photographic experts group), .gif (graphical interface format), and .png (portable network graphics).
Forms
Interactive elements which allow a user to input information to be utilized by the website. Forms can be used to gather information supplied by the user in order to help the user interact with various components within the site.
Homepage
The entry page to a website, also known as the index page. Often mistakenly referred to as the "Portal" page.
Hosting
Most commonly thought of as the place (think of a heavy-duty computer) where your website's files reside. An Internet host has a unique Internet address (IP address) and a unique domain name or host name. A host can also refer to a Web hosting company.
Logo
A company's symbol used to "brand" that company in the customer's mind. Think of the "swoosh" Nike uses.
Maintenance
The act of upkeep for a website. This can include updates, changes, re-design, and troubleshooting.
Marketing
The process of planning and executing the promotion of a website via printed and other media, and the Internet. How you make others aware that your website exists.
Search Engine
A program (website) designed to search a database of information from and about other websites. Google, Yahoo and others use this kind of program to create a directory of sites which you can then search through.
Search Engine Optimization
Search Engine Optimization (SEO) is the skill of designing (or re-designing) a website so that search engines will rank it higher for a particular set of keywords.
Server
A computer that delivers web pages to users. It is the "computer" where website files (the whole website) reside and are accessed through the Internet. A server can also be called a host or node.
Target Audience
Groups of people who are considered a marketing strategy's main objective. For instance, toys are marketed toward the Target Audience of children within certain age ranges. Target Audiences can be comprised of one or combinations of different groups. A few examples of Target Audiences are:
Interactive features on a website. The content the user sees is sometimes updated based upon the users input. Dynamic content can be information stored in a database, user input, or even cookies. Forms and a Search option on a site are perfect examples of dynamic content.
Graphics
A picture or image produced on a computer. These can include .bmp (bitmaps), .jpg (joint photographic experts group), .gif (graphical interface format), and .png (portable network graphics).
Forms
Interactive elements which allow a user to input information to be utilized by the website. Forms can be used to gather information supplied by the user in order to help the user interact with various components within the site.
Homepage
The entry page to a website, also known as the index page. Often mistakenly referred to as the "Portal" page.
Hosting
Most commonly thought of as the place (think of a heavy-duty computer) where your website's files reside. An Internet host has a unique Internet address (IP address) and a unique domain name or host name. A host can also refer to a Web hosting company.
Logo
A company's symbol used to "brand" that company in the customer's mind. Think of the "swoosh" Nike uses.
Maintenance
The act of upkeep for a website. This can include updates, changes, re-design, and troubleshooting.
Marketing
The process of planning and executing the promotion of a website via printed and other media, and the Internet. How you make others aware that your website exists.
Search Engine
A program (website) designed to search a database of information from and about other websites. Google, Yahoo and others use this kind of program to create a directory of sites which you can then search through.
Search Engine Optimization
Search Engine Optimization (SEO) is the skill of designing (or re-designing) a website so that search engines will rank it higher for a particular set of keywords.
Server
A computer that delivers web pages to users. It is the "computer" where website files (the whole website) reside and are accessed through the Internet. A server can also be called a host or node.
Target Audience
Groups of people who are considered a marketing strategy's main objective. For instance, toys are marketed toward the Target Audience of children within certain age ranges. Target Audiences can be comprised of one or combinations of different groups. A few examples of Target Audiences are:
Gender-Based Groups
Age Groups
Ethnic Groups
Religious Groups
Political Groups
Testing
Checking a computer program or website for errors. Depending on the complexity of a program, testing (and debugging) can take nearly as long as the actual creation of the program.
Usability
A generic term that refers to design features that enable a website to be user-friendly. This generally refers to how easily a user can find their way around a site. There are five basic components to usability according to Jacob Nielson (known as THE authority on usability):
Checking a computer program or website for errors. Depending on the complexity of a program, testing (and debugging) can take nearly as long as the actual creation of the program.
Usability
A generic term that refers to design features that enable a website to be user-friendly. This generally refers to how easily a user can find their way around a site. There are five basic components to usability according to Jacob Nielson (known as THE authority on usability):
Usability also refers to the W3C's accessibility guidelines for people with disabilities.Learnability: How easy is it for users to accomplish basic tasks the first time they encounter the design?
Efficiency: Once users have learned the design, how quickly can they perform tasks?
Memorability: When users return to the design after a period of not using it, how easily can they reestablish proficiency?
Errors: How many errors do users make, how severe are these errors, and how easily can they recover from the errors?
Satisfaction: How pleasant is it to use the design?
User Testing
The method of studying usability. There are three components to User Testing:
The method of studying usability. There are three components to User Testing:
Ask some volunteer users to perform representative tasks with a website design.
Observe what the users do, where they succeed, and where they have difficulties with the user interface.
Allow the users to solve any problems on their own.
The results of User Testing are then compiled and any necessary adjustments are applied to the website design. Testing may be performed one or more times.
Website
A collection of files or "pages" linked together and available for viewing on the World Wide Web (a.k.a. the Internet). Websites are provided by companies, organizations and individuals.
Website
A collection of files or "pages" linked together and available for viewing on the World Wide Web (a.k.a. the Internet). Websites are provided by companies, organizations and individuals.
No comments:
Post a Comment