Checkpoint 1 - Blog

 Blog 1  & 2


Home Page:
All the pages will include a footer that has contact info. All Nav bars are fixed.



NAV(Right): the nav itself will span 100%width will include the header and hyperlinks to other pages.




Parallax(Left): will be an image of a spirit shelf at a bar.




 History: Brief history of cocktails.  




 Equipment Page:

NAV: the nav itself will span 100%width will include the header and hyperlinks to other pages.

Parallax: will be an image of bartender equipment.

Equip 1: are the divs that will be holding the images of individual equipment and their description.  

Classics Page
(Will be the same as the Variants page only difference will be that the cocktails are variations of the classic)

 NAV: the nav itself will span 100%width will include the header and hyperlinks to other pages.

Parallax: will be an image of Cocktails.

Cocktails/Variants: will include a picture of a cocktail made with specific spirits and the recipe for it.

To the left is a snippet of the bootstrap MDN link, allowing me to use bootstrap framework within my code.



The importance of the task of showing my code and explaining is going to positively affect my long term site maintenance, because this acts as a base to let maintenance people read and be able to understand the code faster, than trying to read and rewrite code when there is no documentation about the code, meaning the individual will have to find his way around and this can become a time consuming task depending on the size of the site and depending on that size of the task.

Comments

Post a Comment

Popular posts from this blog

Checkpoint 4 - Blog

Image
Blog 7, 8 & 9 7.  Image and media plugins:  This code is similar to all of my img codes i tried to reuse alot of my code, to find more efficient ways.   This code is for my parallax img and is the same on all the pages excluding the img url. 8. Below I have screenshotted the code that i have used for the boxes that include the cocktail images and text, which includes my unordered lists for the ingredients and p tags for instruction and other text. 9. Below i have included a screenshot of the variable i created to quickly add the colors that i want to text and one for header/footer color. And finally I took a video of the website while it was live using github.
Read more

Checkpoint 2 - Blog

Image
Blog 3& 4 Home : To left shows my header code  within the nav for the home page. To the right I have the html code for my card box that holds my bartender picture and includes a title and content div. When creating this page I came across a few problems such as making the bartender card above responsive to be able to scale with the dimensions of the device that is being used to view the site, also took me awhile to choose a color scheme and i am happy with what I have chosen. Equipment : Left is the code that i used to create my containers that hold my images of the ewuipment and their title + description, 6 divs using the same variable (equip1 - which i didn't understand why I would do it until this assessment.) The code on the left shows my navigation bar with the working links to the other pages for my site, and above I have the header that I figured I'd change up, saying the name of the page ...
Read more