Bootstrap Template analysis and Graphics
Bootstrap Template Analysis
This is my final selection of my template: https://startbootstrap.com/template-overviews/heroic-features/
Looking at the HTML: Taking what I learned from bootstrap I can see a lot of lists, divs, and the use of Jumbotron
Looking at the CSS: most of the class that represents the div defines the margin, the font size and the text decoration.
3. I know I am going to have to make 4 additional pages that will hold all of my content while also changing the a href
to the file name that will redirect it to the content.
I also know that I have to add an image that represents the card. I know I have to make the content more personalized by
using css to change colors, margins, borders.
I will also have to personalize the navbar with my content by also linking the files in place of the # in the a href tags
Graphic Editing
I will be using pixlr.com to crop, resize, and export
To Crop: The function is under the image tab
To Resize: Under the image tab click image or canvas size and resize based on your site length
To Export: Save format that gives me options of .jpeg and .png
Exporting Design Assets
.svg- scalable vector graphics
Icons, logos, ideal way to put up graphics
svgomg can compress the file to get a smaller file
.png and .jpeg
Exporting with the right size
Tinypng.com
