In the first week's challenge of the coding bootcamp, we were instructed to Refactor code from a social solutions website.
- The goal here is to better understand HTML and CSS formatting, as well as the importance of writing clean, semantic code.
- This project was built to get a feel for a hands on approach to refactoring.
- This project solves the problem of repetitive code, and makes the coding easier to understand and more accessible.
- I learned about class structure and website structure with this project, as well as good habits to practice for cleaner code.
Note: In the case of changing multiple occurances, the earliest line will be associated with changes.
- Line 7 in index.html changed to include a better Website title. 'website' changed to 'Horiseon Social Solutions'.
- Line 11 in index.html changed to make code more semantical. Div changed to header
- Lines 13 and 25 in index.html changed to be more semantic. Div changed to section.
- Line 28 changed in index.html to be more semantic. Div changed to img. Added image source to the img tag.
- Line 28 changed in index.html to be more accessible. Alt tag added to img describing the picture.
- Lines 30, 52, 53, 75 in index.html changed to be more semantic. Div changed to article.
- Lines 31, 37, 38, 44, 45, 51, 54, 60, 61, 67, 68, and 74 in index.html changed to be more semantic. Div changed to section.
- Line 31 in index.html changed code to be more consolidated. Class 'search-engine-optimization' changed to 'content-style'.
- Line 32 in index.html changed to be more accessible. Alt tag added to img describing the picture.
- Line 38 in index.html changed code to be more consolidated. Class 'online-reputation-management' changed to 'content-style'.
- Line 38 in index.html removed non-functioning code to make code easier to read. Id 'online-reputation-management' removed.
- Line 45 in index.html changed code to be more consolidated. Class 'social-media-marketing' changed to 'content-style'.
- Line 45 in index.html removed non-functioning code to make code easier to read. Id 'online-reputation-management' removed.
- Line 54 in index.html changed code to be more consolidated. Class 'benefit-lead' changed to 'benefits-style'.
- Lines 55, 62, 69 in index.html changed h3 tags to h2 tags for better optimization.
- Line 61 in index.html changed code to be more consolidated. Class 'benefit-brand' changed to 'benefits-style'.
- Line 68 in index.html changed code to be more consolidated. Class 'benefit-cost' changed to 'benefits-style'.
- Lines 76 and 81 in index.html changed to be more semantic. Div changed to footer.
Note: In the case of changing multiple occurances, the earliest line will be associated with changes.
- Line 18 in style.css changed to make code easier to read. .header tag removed.
- Line 23 in style.css '.seo' changed to remove unnecessary code. removed header, h1 tags.
- Line 29 in style.css changed to be more semantic. Div changed to section
- Line 35 in style.css changed to make code easier to read. .header and div tags removed.
- Line 39 in style.css changed to make code easier to read. .header, div, and ul tags removed.
- Line 59 in style.css changed to remove unneccessary code: background-image not needed.
- Lines 89 through 102 in style.css consolidated into a single class: benefits-style.
- Line 104 in style.css changed h3 tag to h2 tag.
- Lines 104 through 117 in style.css consolidated into a single class: benefits-style h2.
- Lines 121 through 125 in style.css consolidated into a single class: benefits-style img.
- Lines 137 through 162 in style.css consolidated into a single class: content-style.
- Lines 164 through 174 in style.css consolidated into a single class: content-style img.
- Lines 176 through 189 in style.css consolidated into a single class: content-style h2.
- Lines 193 and 200 in style.css changed to be more semantic. .footer changed to footer.