Skip to content

This is my personal recreation of the Little Taco Shop challenge by Dave Gray for HTML5.

Notifications You must be signed in to change notification settings

gmovernight/Little-Taco-Shop

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Screenshot (29) Screenshot (30) Screenshot (31) Screenshot (32) Screenshot (33)

What I learned about HTML5 from this challenge:

NON-TECHNICAL ASPECTS

  • EVERY WEB DEVELOPER SHOULD KNOW HTML.
  • SEMANTIC HTML IS VERY IMPORTANT!! Semantic HTML is great because it structures your html and makes it more easily readable for screen readers, plus it provides more logical flow structure to your html.
  • Always add as much information and attributes to your html elements for good development practice.
  • IT IS VERY IMPORTANT TO ALWAYS HAVE GOOD MEDIA SOURCES FOR FREE IMAGES, FONTS, ICONS ETC.
  • Every webpage on the internet uses html to some degree.

TECHNICAL ASPECTS

  • HTML is the most basic building block of the Web.
  • Every HTML file should contain a head and body tag enclosed in the main "html" element.
  • The "meta" element is used in the "head" element to include more detail about the file i.e author, decscription, charset.
  • The "title" element in the head is used to specify the name of the webpage in browser tab section.
  • The "link" element is necessary for any external files you would like to link that have an impact on your html webpage.
  • "h1" element specifies the main heading of your webpage
  • You get three main types of list elements: Ordered list, Unordered list and description lists.
  • Use the "img" element to add images, where you can specify the "src", "alt", "title" or "width" attributes.
  • "a" element allows you to add links and specify the source using the "href" attribute.
  • "article" and "section" elements are useful to create individual segments in your webpage.
  • "figure" and "figcaption" elements are useful for encapsulating images and giving them captions.
  • "details" and "summary" elements are useful for adding dropdown information on your webpage.
  • Use the "table" element to create tables.
  • User the "tr" and "th" elements to create the rows and the col with headings, and attribute such as "scope", "rowspan" and "colspan" to specify the scope and span of the rows and columns.
  • The "tr" columns writes from left to right and every "tr" element declaration writes to the next row.
  • Use the "td" element to fill in the details of the table.
  • The "id" attribute is useful for reference and linking to different locations in the webpage.
  • Use the "address" element to add an address.
  • Use the "form" element to capture data from the user.
  • Different types of inputs: Radio, text, number, password and checkbox.
  • POST and GET methods are used when submitting a form and the action is the location to send the information.
  • User the "fieldset" element to demarcate different form section in your form.
  • "label" element specifies the name of the field and the "input" element specifies the input area.
  • "for" attribute in the "label" element and the "id" attribute in the "input" element should always be the same.
  • The "list" attribute in the "input" element is useful for displaying different option selections.
  • "datalist" element is used to specify the different option selections.
  • "button" element creates buttons and the common types are the "submit" and "reset" buttons.

"HTML Project for Beginners"

Check out my YouTube Channel with all of my tutorials.

This repository shares the completed code for the YouTube Tutorial.

Your Challenge: Utilize the knowledge you have gained from the HTML for Beginners tutorial series to build a website for The Little Taco Shop.

Directions:

  • There are images of the 3 web pages you need to build in the examples folder. Use them as references for what you build.

  • You should name your files: index.html, hours.html, and contact.html

  • There is minimal CSS already available in css/styles.css. You need to link that file to your HTML files.

  • All images are provided in the img folder.

  • If you need to find taco emojis, try Emojipedia.

  • A favicon is already included. You'll need to add it in the head section of each page.

Academic Honesty

DO NOT COPY FOR AN ASSIGNMENT - Avoid plagiargism and adhere to the spirit of this Academic Honesty Policy.

About

This is my personal recreation of the Little Taco Shop challenge by Dave Gray for HTML5.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published