SCRIPTING AND WEB
TECHNOLOGIES
Assessment 1
Student ID:
100785312
Abstract
Review the current Pizza UNO Sunderland website and produce a study report of it.
1
Table of content:
1. Introduction 2
2. Structure of content 2
2.1 Observation 2
2.2 Recommended improvements 10
3. Typography, colours, layouts 10
3.1 Typography 11
3.2 Colours 13
3.3 Layouts 15
4. Dynamic elements 15
4.1 Forms 15
4.2 Pop-ups and cookies 17
4.3 Animations 18
5. Front-end use case testing 18
6. Cyber security issues 19
7. Conclusion 20
2
Assessment 01
Website Evaluation Report: Pizza UNO Sunderland
1. Introduction
This report provides a detailed analysis of the Pizza Uno Sunderland website
(https://sunderland.pizzauno.co.uk). The site serves as a digital storefront for a local
takeaway/restaurant, primarily designed to showcase menus and facilitate orders.
The website functions as a basic business listing and ordering portal. It appears to utilize
a third-party template or ordering platform, which is common for independent
restaurants. However, while it achieves the core function of displaying information, it
suers from signicant shortcomings in user experience (UX), visual design consistency,
and technical optimization.
The primary issues stem from an over-reliance on generic stock photography,
inconsistent typography hierarchy, and a lack of modern interactive feedback. From a
security standpoint, while no obvious critical vulnerabilities are visible on the surface, the
dependence on external libraries and frame structures presents potential risks regarding
data handling.
This report provides a comprehensive evaluation of the Pizza UNO Sunderland website.
The analysis focuses on:
• Structure of content
• Typography, colours, and layout
• Dynamic elements (forms, pop-ups, animations)
• Front-end use-case testing
• Cybersecurity issues
• Recommendations for improvement
The goal is to identify shortcomings that may contribute to customer complaints and
propose enhancements to improve usability, accessibility, and customer satisfaction.
2. Structure of the Content
2.1 Observations
The homepage displays the following elements in a linear order:
3
• Header with logo and navigation in gure 1:
Figure 1. Heater with logo and navigation
• “Download our app” banner show in gure 2:
Figure 2. Download our app
4
• Contact number show in gure 3:
Figure 3. Contact number
• Navigation links (Home, Order Online, Feedback, Contact Us) show in gure 4:
Figure 4. Navigation links
• “Order Now” call-to-action show in gure 5:
Figure 5. Order Now
5
• Contact information and opening hours show in gure 6:
Figure 6. Contact information
• Footer with legal links and copyright show in gure 7:
Figure 7. Footer with legal links and copywright
This structure is functional but outdated, with several issues:
2.1.1 Lack of Hierarchy
The content appears in a single vertical block with minimal visual separation. Important
elements such as Order Online and Menu do not stand out. The "Order Online" section is
functional but lacks a clear "Deal" or "Special Oers" landing page, forcing users to scroll
through long lists to nd value meals show in gure 8:
Figure 8. Lack of hierarchy
6
2.1.2 Missing Menu Preview
Most modern takeaway websites show in gure 2.1:
Figure 2.9. Most modern takeaway websites
• Popular items show in gure 2.2:
Figure 2.10. Popular items
7
• Deals show in gure 2.3:
Figure 2.11. Deals
• Images of food show in gure 2.4:
Figure 2.12. Image of food
8
• Category previews show in gure 2.5:
Figure 2.13. Category previews
Pizza UNO’s homepage lacks all of these, reducing engagement.
2.1.3 Repetitive Information
The phone number appears multiple times without formatting or icons to improve
readability show in gure 2.6:
`
Figure 2.14 Phone number
3 times at the
same time on
the page
9
2.1.4 No Visual Content
There are no images of food, the restaurant, or promotions. This signicantly reduces
appeal and conversion show in gure 2.7:
Figure 2.15. There are no images of food, the restaurant, or promotions on the homepage
2.1.5-Footer Clarity
Key legal documents (Privacy Policy, Terms) are present but often lead to generic
templates that are not specic to the Sunderland branch in gure 2.8:
Figure 2.16. Key legal documents (Privacy Policy, Terms)
10
2.2 Recommended Improvements
2.2.1 Introduce a Modern Homepage Layout
Include:
• Hero banner with food images
• Prominent “Order Now” button
• Menu categories (Pizza, Kebabs, Burgers, Sides, Drinks)
• Customer reviews
• Delivery areas and minimum order information
2.2.2 Improve Navigation Structure
Add:
• Menu dropdown
• Deals page
• About Us page
• Delivery information page
2.2.3 Add Visual Hierarchy
Use headings, icons, and spacing to guide the user’s eye.
2.2.4 Include Food Photography
High-quality images increase conversion by up to 30% in takeaway websites.
2.2.5 Wireframe Example (Insert in Report)
Include a wireframe showing:
• Top navigation
• Hero image
• Menu categories grid
• Testimonials
• Footer
3. Typography, Colours, and Layout
11
3.1 Typography
3.1.1 Issues
• Font appears generic (likely default sans-serif) show in gure 3.1:
Figure 3.1. Font
• No typographic hierarchy (H1, H2, body text look similar) show in gure 3.2:
Figure 3.2. No typographic hierarchy
12
• Text alignment is inconsistent show in gure 3.3:
• Some text is too small for accessibility standards show in gure 3.4:
Figure 3.4. Text
Text
alignment
13
3.1.2 Recommendations
• Use a modern, readable font such as Montserrat, Poppins, or Roboto.
• Establish hierarchy:
o H1: 32–40px
o H2: 24–28px
o Body: 16–18px
• Increase line spacing for readability.
3.2 Colours
3.2.1 Issues
• Colour palette is minimal and lacks brand identity in gure 3.5:
Figure 3.5. Colour palette
• No consistent use of accent colours in gure 3.6:
Figure 17. No consistent use of accent colours
14
• Buttons do not stand out visually in gure 3.7:
Figure 18. Buttons do not stand out visually
• Background is plain white with no visual depth show in gure 3.8:
Figure 19. Background
• Contrast and accessibility (e.g., red text on green background) show in gure 3.9:
Figure 20. Contrast and accessibility
15
3.2.2 Recommendations
• Develop a brand palette (e.g., red, green, and cream for Italian theme).
• Use accent colours for CTAs (e.g., bright red “Order Now”).
• Add subtle background textures or gradients.
• Ensure colour contrast meets accessibility guidelines.
3.3 Layout
3.3.1 Issues
• Layout is narrow and does not use full screen width.
• Content alignment feels unbalanced.
• No grid system is evident.
• Footer is oversized compared to content.
3.3.2 Recommendations
• Implement a responsive grid layout.
• Use consistent spacing and padding.
• Add visual sections (hero, menu, reviews, footer).
• Reduce footer height and reorganize links.
4. Dynamic Elements
4.1 Forms
4.1.1 Observations
The site includes:
• Login/Register form show in gure 4.1:
16
Figure 4.1. Login/Registration form
• Feedback form show in gure 4.2:
Figure 21. Feedback form
17
• Order form (within ordering system) shows in gure 4.3:
Figure 22. Order form
4.1.2 Issues
• Forms lack inline validation.
• No conrmation animations or success messages.
• Error messages are generic.
• Input elds are small and not mobile-friendly.
4.1.3 Recommendations
• Add real-time validation (email format, required elds).
• Use larger, touch-friendly input elds.
• Provide clear success/error messages.
• Add progress indicators for multi-step ordering.
4.2 Pop-ups and Cookies
4.2.1 Observations
The site displays a cookie notice:
“We use cookies to track usage and preferences – I Understand”
sunderland.pizzauno.co.uk
4.2.2 Issues
• Cookie banner lacks a “Reject” option.
• No link to cookie settings.
18
• Banner design is plain and uninviting.
4.2.3 Recommendations
• Add Accept / Reject / Manage options.
• Provide a cookie settings modal.
• Improve design with icons and branding.
4.3 Animations
4.3.1 Observations
• No animations or transitions are present.
• Page feels static and outdated.
4.3.2 Recommendations
• Add subtle hover animations on buttons.
• Use fade-in eects for content sections.
• Add loading animations during order processing.
5. Front-End Use Case Testing
5.1 Use Case 1: Placing an Order
Steps Tested
1. Click “Order Online”
2. Select items
3. Add to cart
4. Proceed to checkout
5. Enter details
6. Submit order
Issues Identied
• Slow loading between steps
• No visual conrmation when items are added
• Cart icon does not update dynamically
• Checkout form lacks address auto-complete
19
• No delivery time estimate shown
5.2 Use Case 2: Submitting Feedback
Issues
• Form does not conrm submission clearly
• No CAPTCHA → vulnerable to spam
• No rating system (stars, emojis)
5.3 Use Case 3: Mobile Browsing
Issues
• Buttons too small
• Text overlaps in some sections
• Cookie banner covers content
• No sticky navigation bar
• Images (if any) do not resize properly
6. Cybersecurity Issues
6.1 Missing HTTPS Enforcement
Although the site loads over HTTPS, there is no forced redirect from HTTP to HTTPS.
This can expose users to downgrade attacks.
6.2 Weak Cookie Compliance
• Cookie banner does not meet GDPR requirements.
• Cookies may be set before consent.
6.3 No CAPTCHA on Forms
This exposes the site to:
• Spam submissions
• Bot attacks
• Brute-force login attempts
6.4 No Two-Factor Authentication
• Customer accounts rely solely on passwords.
20
7. Conclusion
The Pizza UNO Sunderland website functions at a basic level but lacks the modern
design, usability, and security features expected by today’s customers. By implementing
the recommended improvements - particularly in visual design, form usability, mobile
responsiveness, and cybersecurity - the business can signicantly enhance customer
satisfaction, reduce complaints, and increase online orders.