Coded Website Redesign - Lush
Web development has always been a huge passion of mine, in college I wanted a major that would allow me the creative expression to gain more knowledge on coding and web development. Luckily, my major allowed me to dip into coding through a web development course which excelled my passion and knowledge in this realm. In the Web development course, for a project I had to redesign a website and code it by hand. By learning the basics of coding a simple website through sublime text, I was able to redesign Lush’s website.
Learned how to code a basic website containing multiple html and CSS files (Divs, headings, body, images, buttons, dropdown menus & items, carousel, fonts, etc.)
Navigated through any technological errors efficiently by maintaining a positive mindset and communicating with professor.
Excelled proficiency in coding through Sublime text.
Used external sources such as Lush.com for reference and inspiration.
Advanced skillset & passion in web development.
Using external resources for inspiration, I first produced a site map to organize the content as well as lay out a basic map of what my site would contain. This site map aided me in organization as well as a scope of what needed to be coded.
Site map
Project Process
Began Coding
After producing my site map, I was ready to start coding. I first started by coding the index.html and linking it to the style CSS to construct the basics. Then on the index.html file I coded the carousel, header, title, and nav bar to organize my content.
I made sure to stay organized with my site by using divs to separate my pages. I then coded buttons for those pages in the nav bar, and linked those buttons to separate html pages while creating drop down menu’s for each of those buttons.
Coded html pages
After my index page was coded and I established the basic layout for my site, I was ready to code all html pages separately.
Each nav bar button was then coded and linked to separate html pages to advance my site. I made sure to stay consistent with my site and copy the basics (nav bar, title, header, style) from my index.html page and paste it into my separate html pages so that the nav bar and title could be viewed on the other pages.
Then, I coded images and text using divs, headings, and paragraphs to not only separate the product listings on the page but mimic what would be seen on an actual website.
After staying consistent with style, color, font, and layout, through lots of trial and error I was able to finish the production of my coded website. This project overall increased my passion for web development as well as offered me a chance to gain more knowledge about coding. I also learned a lot about the importance of organization and patience when it comes to coding. Through my positive mindset and devoted work ethic I was able to overcome and learn from any errors as well. I would love to continue my growth in this realm by learning more about coding and web development to advance my skillset and further increase my passion.
