Web Design Of Fish And Chips Website English Language Essay

Harmonizing to the intent of site is to advancing fish and french friess as a tasty traditional nutrient, the following are references with information with information about fish and french friess, that are ;

Address

We Will Write a Custom Essay Specifically
For You For Only $13.90/page!

order now

Description

hypertext transfer protocol: //www.taylorsfish.co.uk/

hypertext transfer protocol: //www.colmansfishandchips.com/contact.php

hypertext transfer protocol: //www.clickfishandchips.co.uk/fish-and-chips2826.asp

hypertext transfer protocol: //www.fishandchipsbath.co.uk/

hypertext transfer protocol: //www.seashellrestaurant.co.uk/

hypertext transfer protocol: //www.whelansfishandchips.co.uk/

Addresss contains

Good quality of images

clear description of the its eating house location

Image of its eating house location

General information on the eating house for illustration it open at what times, monetary values on each points selling from eating house and besides provides specials offer they brought.

hypertext transfer protocol: //www.learncooking.co.uk/how-cook-perfect-fish-chips.html

Address contains

Good quality of images

General information on how to cook fish and french friess such as what are resources needed, standard sum of heat to be set up and stairss to follow

hypertext transfer protocol: //en.wikipedia.org/wiki/Fish_and_chips

hypertext transfer protocol: //pt.wikipedia.org/wiki/Fish_and_chips

Address contains

Good quality of images

Explanations about different nutrition benefits will be obtain after eating fish and french friess

Besides reference is rich with different disadvantages will be obtain to some one after eating fish and french friess

hypertext transfer protocol: //en.wikipedia.org/wiki/Fish_and_chips

hypertext transfer protocol: //pt.wikipedia.org/wiki/Fish_and_chips

Address contains

Good quality of images

General information about history for exigency of fish and french friess,

Besides contains inside informations about nutrient is often used at what event

hypertext transfer protocol: //www.roadfood.com/photos/6936.jpg

Address contains

Good quality of images that enable to depict about different points available on a bit store bill of fare for illustration point is selling for what shilling.

hypertext transfer protocol: //www.electricscotland.net/canada/pics/ron2.jpg

hypertext transfer protocol: //www.google.co.tz/images? hl=sw & A ; q=pictures % 20of % 2

0fish % 20and % 20chips & A ; um=1 & amp ; ie=UTF-

8 & A ; source=og & A ; sa=N & A ; tab=wi

Addresss contains good quality of images

Fig_1

Task_2

Site Map

Bunch construction:

Fig_ 2 Cluster Structure

Site is designed by utilizing power of hypertext associating to steer users to snap text in order to switch in to another page that makes it unlike paper-based.

The construction of site is cluster construction in which all every subject country is island of information, with all pages in each bunch linked to each other.

This construction encourages geographic expedition within a topic country like description of fish and french friess stores and eating houses, in which leting user to voyage freely through the content.

All pages besides contain a pilotage saloon with links to the subdivisions pages, chief pages, and site map.

Task_3

Web Site Deign Principles.

Site viewable on proctors with screen declarations of 800*600 without users holding to scroll horizontally

See Fig.3 below

Fig_3

Site is design without utilizing of Times Roman fount which is designed for print, is difficult to read online. All founts within a site are designed for online reading.

Italic text is difficult to read online, so that is non used in a site, it ‘s used merely for particular accent.

There ‘s no light text on light background and dark text on a dark background.

See Fig_4 below

White infinite on both sides creates a text column that enforces the perpendicular flow of the page.

Text designed for exposing online that is text breadth is short and easy to read without horizontal scrolling.

Site design for Low bandwidth for the intent to guarantee that users with low connexion velocities can non snap off from site

Pages contain few images make totaling of few KB in file size which is little in figure. Small figure of images within a pages means that pages downloaded faster.

Site design for easy entree of information to guarantee that users can entree its required information easy

Site design for clear representation of site to guarantee that users read information easy, site does n’t incorporate colourss that does non do easy to read pages on oculus easy.

Pages besides contain many headers so that users can happen content rapidly.

There ‘s little length of transitions of text to supply complete, easy to read columns.

There ‘s active white infinites separates page elements which adds to easy readability of the page.

Site design for users can non experience there ‘s out of Site by avoiding dumping of a batch of pages that does non reassemble that is all pages are unvarying that making incorporate expression of among the Sections and Pages of Site, to guarantee that all subdivisions and pages within a site expression unified

Site is design for sing comparative countries of screen importance

Harmonizing to the site

Important information placed at the center of screen window.

Popular links placed at the top of screen window

Linked Related subjects placed at the right

Form and other information placed at the right-bottom of screen window

External links placed at the center of pages

Site is designed to accommodate to different screen declaration by staying centered in the user ‘s browser.

Focus oning site dividing the staying infinite in to equal sums on the left and right side of the browser window

Contentss within a site remain unchanged no affair what the user ‘s screen declaration

Task_4

External CSS File:

# Link {

font-size: 14px ;

font-family: lucida console ;

}

# p1 {

font-family: lucida console ;

font-size: 13px ;

}

# p2 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -350px ;

underside: 15px ;

}

# p3 {

font-family: lucida console ;

font-size: 11px ;

}

h2 {

letter-spacing: 8px ;

line-heigth: 1px ;

font-size: 14px ;

# itm3 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

underside: 200px ;

}

# itm4 {

place: relation ;

underside: 200px ;

right: -306px ;

}

# H1 {

font-size: 13px ;

font-family: lucida console ;

place: relation ;

underside: -50px ;

right: 20px ;

}

# H2 {

font-size: 14px ;

font-family: lucida console ;

place: relation ;

right: -100 ;

top: -700px ;

letter-spacing: 8px ;

}

# H3 {

font-size: 13px ;

font-family: lucida console ;

place: relation ;

right: -100 ;

underside: 350px ;

}

# Img1 {

place: relation ;

right: -100px ;

top: -580px ;

}

# F {

place: relation ;

right: 120px ;

top: -1015px ;

}

# C1 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

# Img12 {

place: relation ;

right: -150px ;

underside: -200px

}

# S1 {

place: relation ;

right: -70px ;

underside: -100px ;

}

# S2 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -350px ;

underside: -200px ;

list-style-type: none ;

}

# S3 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -10px ;

top: -35px ;

}

# S4 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -10px ;

Bottom: -50px ;

}

# S5 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -450px ;

Bottom: 10px ;

}

# S6 {

font-family: lucida console ;

font-size: 13px ;

underside: -100px ;

}

# Img1 {

place: relation ;

right: -500px ;

top: -225px ;

}

# L1 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

underside: -150px ;

right: -230px ;

}

# LL {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

top: -220px ;

right: -245px ;

list-style-type: none ;

}

# L2 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

underside: -px ;

right: -290px ;

}

# L3 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

top: -15px ;

right: -340px ;

}

# LL1 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

top: -35px ;

right: -340px ;

list-style-type: none ;

}

# L4 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

top: -15px ;

right: -10px ;

}

# L5 {

place: relation ;

underside: -200px ;

right: 150px ;

}

# L6 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

underside: 10px ;

right: -50px ;

}

# L7 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

underside: 30px ;

right: -50px ;

list-style-type: none ;

}

# L8 {

place: relation ;

underside: 0px ;

right: -500px ;

}

# L9 {

place: relation ;

right: -10px ;

top: -35px ;

}

# SW4 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -10px ;

Bottom: -50px ;

}

# SW5 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -450px ;

Bottom: 10px ;

}

# SW6 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

Bottom: -60px ;

}

# SW7 {

font-family: lucida console ;

place: relation ;

right: -10px ;

top: -35px ;

}

# ST4 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -10px ;

Bottom: -50px ;

}

# ST5 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -450px ;

Bottom: 10px ;

}

# ST6 {

font-family: lucida console ;

place: relation ;

right: -10px ;

top: -35px ;

}

# SF4 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -10px ;

Bottom: -50px ;

}

# SF5 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -450px ;

top: -35px ;

}

# ST4 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -10px ;

Bottom: -50px ;

}

# ST5 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -450px ;

Bottom: 10px ;

}

# ST6 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

Bottom: -60px ;

}

# ST7 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

Bottom: 150px ;

right: -550px ;

}

# ST8 {

font-family: lucida console ;

}

# Link {

font-size: 14px ;

font-family: lucida console ;

}

# ST1 {

place: relation ;

right: -70px ;

underside: -100px ;

}

# ST2 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -450px ;

underside: -200px ;

list-style-type: none ;

}

# ST3 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -10px ;

top: -35px ;

}

# ST4 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -10px ;

Bottom: -50px ;

}

# ST5 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

right: -450px ;

Bottom: 10px ;

}

# ST6 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

Bottom: -60px ;

}

# ST7 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

Bottom: 150px ;

right: -550px ;

}

# ST8 {

font-family: lucida console ;

}

# ST25 {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

Bottom: -70px ;

right: post exchange ;

}

# Img00 {

place: relation ;

right: -100px ;

underside: 2px ;

}

# STWrong {

font-family: lucida console ;

font-size: 13px ;

place: relation ;

Bottom: -60px ;

}

Task_5

Differences between Internet Explorer and Firefox

There ‘s over equitation of text when Firefox is used

Fig_ page layout as opened with fig_ page layout as opened with Firefox Internet Explorer

Report:

Differences between Internet Explorer and Firefox

There ‘s over equitation of text when Firefox is used

Firefox gives more web page infinite to see more of a web page without scrolling

Internet Explorer has gray behind its images, Firefox does n’t.

Content within marquee component is non seen on Firefox browser

Check for CSS Code Validation:

Problem 1

Line 673, Column 2: terminal ticket for “ hypertext markup language ” omitted, but OMITTAG NO was specified

}

Component is neglected to be closed, that is element should be ended with shuting ticket like this / & gt ; alternatively of “ & gt ; ”

Problem 2

Line 673, Column 2: “ hypertext markup language ” non finished but papers ended

}

Html should be finished foremost before papers ended

Problem 3:

Line 3, Column 1: character informations is non allowed here

# Link {

Character information is used which is non permitted to look, errors that can do this mistakes include

Puting text straight in the organic structure of the papers without wrapping it in a container component ( such as a & lt ; p & gt ; aragraph & lt ; /p & gt ; ) or

Forgeting to cite an property value ( where characters such as “ % ” and “ / ” are common, but can non look without environing quotation marks ) or

Using XHTML-style self-closing tickets ( such as & lt ; Meta… / & gt ; ) in HTML 4.01 or earlier. To repair, take the excess cut ( ‘/ ‘ ) character.

Check for HTML Code Validation

Problem 1

Line 11, Column 49: required attribute “ elevation ” non specified

aˆ¦CAPEFTDE.jpg ” width= ” 65 ” height= ” 75 ” / & gt ; & lt ; img src= ” images3.jpg ” width= ” 65 ” heighaˆ¦

The property given above is required for an image component used, but omitted

Problem 2

Line 11, Column 97: required attribute “ elevation ” non specified

aˆ¦ ” images3.jpg ” width= ” 65 ” height= ” 75 ” / & gt ; & lt ; img src= ” CA2VYNQ1.jpg ” width= ” 65 ” heigaˆ¦

alt property of image “ images3 ” is forgotten to be included in image component

Problem 3

Line 11, Column 146: required attribute “ elevation ” non specified

aˆ¦CA2VYNQ1.jpg ” width= ” 65 ” height= ” 75 ” / & gt ; & lt ; img src= ” CA2NW9YB.jpg ” width= ” 200 ” heiaˆ¦

alt property of image “ CA2VYNQ1 ” is forgotten to be included in image component

Problem 4

Line 11, Column 196: required attribute “ elevation ” non specified

aˆ¦A2NW9YB.jpg ” width= ” 200 ” height= ” 75 ” / & gt ; & lt ; img src= ” images2.jpg ” width= ” 65 ” heighaˆ¦

alt property of image “ A2NW9YB ” is forgotten to be included in image component

Problem 5

Line 11, Column 244: required attribute “ elevation ” non specified

aˆ¦ ” images2.jpg ” width= ” 65 ” height= ” 75 ” / & gt ; & lt ; img src= ” images.jpg ” width= ” 65 ” heightaˆ¦

alt property of image “ images2 ” is forgotten to be included in image component

Problem 5

Line 11, Column 291: required attribute “ elevation ” non specified

aˆ¦= ” images.jpg ” width= ” 65 ” height= ” 75 ” / & gt ; & lt ; img src= ” CA47MHU5.jpg ” width= ” 65 ” heigaˆ¦

alt property of image “ images ” is forgotten to be included in image component

Problem 6

Line 11, Column 340: required attribute “ elevation ” non specified

aˆ¦jpg ” width= ” 65 ” height= ” 75 ” / & gt ; & lt ; img src= ” CA47MHU5.jpg ” width= ” 65 ” height= ” 75 ” / & gt ;

alt property of image “ CA47MHU5 ” is forgotten to be included in image component

Problem 7

Line 29, Column 6: papers type does non let component “ hour ” here ; losing one of “ object ” , “ applet ” , “ map ” , “ iframe ” , “ button ” , “ Immigration and Naturalization Services ” , “ del ” start-tag

& lt ; hr / & gt ;

The mentioned component is non allowed to look in the context ; the other mentioned elements are the lone 1s that are both allowed there and can incorporate the component mentioned. This might intend that you need a containing component, or perchance that you ‘ve forgotten to shut a old component.

One possible cause for this message is because of attempted to set a block-level component ( such as “ & lt ; p & gt ; ” or “ & lt ; table & gt ; ” ) inside an inline component ( such as “ & lt ; a & gt ; ” , “ & lt ; span & gt ; ” , or “ & lt ; font & gt ; ” ) .

Problem 8

Line 30, Column 85: required attribute “ elevation ” non specified

aˆ¦c= ” 300px-Fish_and_chips_in_Pakistan.jpg ” width= ” 350 ” height= ” 170 ” id= ” Img1 ” / & gt ;

alt property of image “ c= ” 300px-Fish_and_chips_in_Pakistan.jpg ” is forgotten to be included in image component

Problem 9

Line 31, Column 11: papers type does non let component “ P ” here ; losing one of “ object ” , “ applet ” , “ map ” , “ iframe ” , “ button ” , “ Immigration and Naturalization Services ” , “ del ” start-tag

& lt ; p id= ” p2 ” & gt ;

The mentioned component is non allowed to look in the context in topographic point which is placed ; the other mentioned elements are the lone 1s that are both allowed there and can incorporate the component mentioned. This might intend that need a containing component, or perchance that forgotten to shut a old component.

One possible cause for this message is that attempted to set a block-level component ( such as “ & lt ; p & gt ; ” or “ & lt ; table & gt ; ” ) inside an inline component ( such as “ & lt ; a & gt ; ” , “ & lt ; span & gt ; ” , or “ & lt ; font & gt ; ” ) .

Problem 10

Line 40, Column 26: papers type does non let component “ P ” here ; losing one of “ object ” , “ applet ” , “ map ” , “ iframe ” , “ button ” , “ Immigration and Naturalization Services ” , “ del ” start-tag

& lt ; p align= ” centre ” id= ” p3 ” & gt ; & lt ; u & gt ; fish & A ; Chips is a traditional nutrient from the United Kaˆ¦

The mentioned component above is non allowed to look in the context in which in country placed ; the other mentioned elements are the lone 1s that are both allowed there and can incorporate the component mentioned. This might intend that is needed a incorporating component, or perchance that forgotten to shut a old component.

Problem 11

Line 40, Column 35: can non bring forth system identifier for general entity “ Chips ”

& lt ; p align= ” centre ” id= ” p3 ” & gt ; & lt ; u & gt ; fish & A ; Chips is a traditional nutrient from the United Kaˆ¦

An entity mention was found in the papers, but there is no mention by that name defined. Often this is caused by misspelling the mention name, unencoded ampersands, or by go forthing off the tracking semicolon ( ; ) . The most common cause of this mistake is unencoded ampersands in URLs as described by the WDG in “ Ampersands in URLs ” .

Entity mentions start with an ampersand ( & amp ; ) and terminal with a semicolon ( ; ) . If it needed to utilize a actual ampersand in papers must be encoded it as “ & A ; amp ; ” ( even inside URLs! ) and must be end with entity mentions with a semicolon or entity mention may acquire interpreted in connexion with the following text, a portion from that entity mentions are case-sensitive ; & A ; Aelig ; and ? are different characters.

Problem 12

Line 7, Column 1: start ticket was here

& lt ; table border= ” 0 ” width= ” 770 ” align= ” centre ” & gt ;

Problem 13

Line 44, Column 7: terminal ticket for “ table ” omitted, but OMITTAG NO was specified

& lt ; /body & gt ;

Problem 14

Line 42, Column 5: terminal ticket for “ P ” omitted, but OMITTAG NO was specified

& lt ; /td & gt ;

Neglected to shut an component, or possibly intend to “ self-close ” an component, that is, stoping it with “ / & gt ; ” alternatively of “ & gt ; ” .

Problem 15

Line 41, Column 6: terminal ticket for component “ div ” which is non unfastened

& lt ; /div & gt ;

Task-6

Report

The manner user generated remarks will be implemented functionality:

During design for the signifier to map, organize component contains some properties that are necessary for interacting with the form-processing plan on the waiter. Let ‘s expression at each

action property:

action property provides the location ( URL ) of the application or book ( action page ) that will be used to treat the signifier.

& lt ; signifier action= ” Calciferol: MH.S1_filesform.asp ” method= ” station ” & gt ;

form.asp is form action that sends informations to a book

URL must fit with location of book on the waiter, here book is found within server computing machine at local disc D in side MH.S1_files booklet.

The.asp postfix indicates that this signifier is processed by a Microsoft ‘s ASP ( Active Server Pages ) pro

method property:

method property specifies how the information should be sent to the waiter.

There are two methods for directing encoded informations by browser to the waiter, when the signifier ‘s method is sent to POST ; the browser sends a separate waiter petition incorporating some particular headings followed by the information. Merely server sees content of this petition, therefore it is the best method for directing unafraid information such as recognition card or other personal information.

POST method directing a batch of informations, such as a drawn-out text entry, because there is no character bound.

Or encoded informations can be sent by browser by utilizing GET method, but there ‘s 256 characters bounds can non be used to directing a batch of informations or when a signifier is used to upload a file.

For the my site POST method is used for sent informations to server, because estimate for characters that made user remarks may transcend more than 256 characters.

name property:

name property identifies the variable name for control. Variable shop informations for later to be processed, When a user enter remark in the field will be passed to the waiter as a name/value ( variable/content ) brace like this:

Comment=Your % 20site % 20is % 20good % 20enough % 20no % 20change % 20will % 20be % 20made.

All signifier control elements must include a name property so the form-processing application can screen information. The lone exclusions are submit and reset button elements because they have particular maps ( subjecting or resetting the signifier ) non related to informations aggregation.

A portion from that web application that processes the information is programmed to look for specific variable names, so that

During planing a signifier to work a plan or book, variable names should be found it to be used in a signifier so they talking the same linguistic communication, variable names obtained from developer or from the instructions provided with a ready-to-use book on waiter.

If the site is built first and application or book created subsequently, its of import to be cognizant for brand sure that all names are unambiguously, that is same name may non be used for the two variables.

Character infinites in variable names non accepted, underscore or period should be used alternatively of that.

During planing of signifier multiline text entry field should be used alternatively of single-line text field to let users to be able to come in more than merely one line of text, otherwise signifier will rectify few remarks from users.

Site contains more than one signifier and each signifier should be given alone name ( Idaho ) to place it from other, otherwise will take confounding for book to cognize informations from what signifier demand to be processed at that clip.

Problems that will get the better of

During planing a signifier to work a plan or book, variable names should be found from developer or from the instructions provided with a ready-to-use book on waiter it to be used in a signifier so they talking the same linguistic communication. At that point if developer brought us incorrect variable names and used within a site signifier will non run.

If GET method is used during planing form alternatively of POST method, will do users of site to directing few remarks because GET method limited with 256 characters, if characters exceed more than 256 characters, exceeded characters will non be allowed to be sent from browser to a book or application.

action property provides the location ( URL ) of the application or book ( action page ) that will be used to treat the signifier, so that URL must fit with location of book on the waiter, otherwise signifier will non work.

value property specifies the value to be sent to the waiter. During planing of signifier when there ‘s incorrect value inputted, signifier will direct something which is non intended to direct that may take job. For illustration during a clip when users fill a signifier for a pick as a male or female and a signifier is design as in a topographic point of male value will be sent is female it may take database to hive away informations that is non intended and mismatching of two value one that stored in database and one corrected from signifier. This will go on at a point in a site before users login must come in rectify its electronic mail and watchword in order to post remarks to us. Email and watchword are compared from inside informations already store from database when during a signifier planing there ‘s incorrect value inputted comparing that will non be true and users may non let to entree database, that may take job to us.

The followers are the ways make this portion of Website easy to keep ;

There ‘s big active white infinite reserved in each portion of site, when there ‘s a demand for adding something within a site reserved active white infinite may be used.

Some portion is given alone individuality, do it easy for subsequently altering it ‘s layout by utilizing external cascading manner sheet and

Because site is built with external manner sheet more than one portion may be affected to alter its layout that save reserving a clip and energy and do easy to keep big portion of site by doing few alterations.