Feedback on my website

Hi Everyone,

I took a break from doing my code camp projects and decided to create a webpage for my dad’s burger restaurant in the Philippines. I would appreciate any feedback you might have after viewing it. Here’s the link:

http://zestyliciousfoodhouse.bitballoon.com/

I created it using HTML, Bootstrap, and a little bit of JQuery.
It’s still not complete as it needs more write-ups, but I want to know what I can improve now.

Thanks!
Kevin

1 Like

It’s a nice web, I would add some margin in menu section and open the instagram link in a new tab like the facebook button. It looks good anyway, good job.

thanks kzaru. :slight_smile:
I’m working on it now.

It’s a clean and simple design. Fancy websites look cool, but I feel allowing visitors to quickly get to their desired destination should have a higher priority.

Here are some suggestions.

  1. All A tags don’t have TITLE attributes. This is necessary to ensure webpages are disability accessible.
  2. All IMG tags don’t have ALT and TITLE attributes. Again, for disability accessible.
  3. All graphics need to be optimized. Too large of graphics will make the page load slowly.

References:
Introduction to Web Accessibility
https://www.w3.org/WAI/intro/accessibility.php

Web Content Accessibility Guidelines (WCAG) Overview
https://www.w3.org/WAI/intro/wcag.php

Interactive Accessibility
http://www.interactiveaccessibility.com/services/ada-compliance

How to Optimize Web Images in PNG Formats

Smart PNG and JPEG compression

1 Like

Hey there,

This site is clean, I like the color scheme, orange is known to elicit hunger.

I would recommend customizing all URLs to a post name structure (for Desktop users).

For example:

Menu Page: http://zestyliciousfoodhouse.bitballoon.com/Menu
instead of
http://zestyliciousfoodhouse.bitballoon.com/index.html#mainContent

The font family in white is easier to read on a mobile device than a desktop at 100% view. Try making it a tad bit larger or change the family.

Lastly, the food looks delicious…YUM!

I greatly appreciate all of your feedback. :slight_smile:

I have updated the website and now am thinking how to enhance it. maybe allow customers to add in their reviews?
we don’t really have any plans on letting people order online since the restaurant just started but it could be a possibilty.

thank you once again! :slight_smile:

On the main page, I would modify the displaying of the food items so the scrollbars are not displayed. Resize the containers to be just large enough for the content.

Online ordering

Creating an online ordering system is major under taking. You will need to handle credit cards, coupons, and printing out orders to be fulfilled. It might be good to go with an online ordering service.

Open Dining

Menufy
https://www.menufy.com/

Great and simple! I am vewimg your website on mobile phone.
I will suggest you to:

  • center each food item’s box on the home page or
    Use the bootsrap class “…-md-12” to make them full width on mobile.
  • make links to each items, so that when someone clicks the image, or title, or more can have more details(when I see an item , I keep cliking).

Salivating,
Very well done.Clean and clear cut

Great suggestion nindaclaudel! I do plan on adding a “…read more” link to the gourmet burgers.
An alternative would be a short but catchy description rather than listing down the ingredients, since the menu page already has those down.
The food item boxes have already been centered and the dimensions of the images are now consistent.

The overall website looks great to me good job, just one suggestion.

When the navigation is collapsed upon resizing the browser as shown in the image above heading " Zestylicious" is too close to the edge of the screen.

Add some padding e.g. padding-left: 5px; to your liking.

Thanks! I added more space as you suggested. I’m currently working on the logo that would go into the navbar. I think this will also take care of any spacing problem it will have once I’ve used the image.
Is there any standard dimensions I should be aware of?

You’re welcome :slight_smile: … I wasn’t aware if there were, cause’ logo design is not really my thing but after googling around. I found these links that might answer your question.

Hope it helps!

Standard logo dimensions and format?

Logo and Image Guidelines

Standard Logo Dimensions