NMC Web Development

Over this course, we had 4 main projects. We learned how to build a website from the bottom up by coding it to making a professional looking website on WordPress and using the skills we learned to enhance each website. Below is each different project and each button is linked to the correlating website.

I learned how to build a website from the bottom up. Before this, I had no idea where to begin. I learned how to add text and then style that text to look bigger and then change the color of the text. I then learned how to upload images as well and make them look uniform. I also learned how to correctly access and organize files. Although this is very basic, these are the fundamentals and very important. I struggled with sizing my images to make it look uniform and neat. I wanted multiple images to be on the same line so I had to have them be correctly size them. I fixed that problem adding an img section to the CSS and then having them all be the same height. I am proud with the style and the look of my website. It has a light blue background, navy text, white headers. I also am proud that I used google fonts in my project that is shown for the headers for my website. My text and images also look nice together as they closely stay with in the same margins.

For the first panel, I learned what bootstrap was and how bootstrap allows one to develop their website in a much faster and easier way as the code is ready for you. With bootstrap, I learned how to use containers, accordions, navbars, carousels, and buttons to make my website more appealing and advanced. I struggled in this panel on how to change bootstrap in the css. There is a lot more to change in the CSS with bootstrap and therefore gets more complicated. When I wanted something more centered or sized appropriately, I struggled with that. I am proud of all of the images I incorporated into my website as I had to change them into jpegs, resize them, name them, have alt text for all of them, and they correctly format them. 

In panel two, I chose a template with bootstrap features and used the same content I did on panel one yet I did not change the CSS the new template had. I learned how there are so many templates available for people to use and easy to use as long as you understand how to do basic coding. I struggled with using all of the different components the new template had to offer and transferring my information to the new layout. I am proud of how all of the information looks better on the new panel and is organized well. 

In panel three, I changed the CSS and kept everything else the same. I learned how to use the inspect element and then change it in my custom.css. There are so many things listed when you look at the CSS that comes with the website so it gets confusing when you look at it all which was a part I struggled with. Since the website is so much more complex, it makes the CSS much more complicated and longer which is why the inspect element is very useful. I am proud of how I changed the CSS to make my website so much better with different colors and fonts. Before there was an ugly orange and now my website has pretty blues.

I learned how to use the products section of WordPress. I also learned how to change things in the customize section such as font size, font color, and change the image background. I struggled with learning how to use WordPress as a whole. I was sick for a few weeks so got behind on how to use WordPress. I also struggled with the category section for my products. I wanted to be able to have a sweet and savory section but struggled finding out where to change that in the settings. All together, I struggled with figuring out where to change thing and add things. I am proud of all of the products and pictures I have because I took all of those pictures. It is cool because this website could be true and I could sell all of these products and use the website I built. I am excited to learn how to become more efficient in WordPress. I felt it took me a while to figure things out and the project took longer than it should have compared to my other websites that I built from scratch.

I learned how to use the post section of WordPress and how each post you make goes onto a page. I never realized that when people use blogs, they make posts instead of directly posting on their website. I also learned how to make the categories of each news story a menu option. I struggled with figuring out how to edit things and how to change and add things. For example, I wanted my categories to have their own page. I didn’t know if I should go to pages, customize, or categories. But I had to go to menus and change the settings there. I am proud of the theme I chose and how my website came all together. I wanted a UGA theme and colors since all of my news was UGA based. I am also proud of all of the stories I selected I am excited to learn how to become more efficient in WordPress. I felt it took me a while to figure things out and the project took longer than it should have compared to my other websites that I built from scratch.

For my final project, I made a portfolio for my friend Ben who is into creative work but never had a way to show off his work. He wanted a simple yet creative portfolio and so I went with a one-page portfolio where you can see all of his work on one page but can also access the different pages on the menu. When first opening the website, a video of Ben’s clips are shown automatically in the header. Instead of doing a picture what most people would do, we both wanted something that would grab the audience’s attention and show off his work. I did this in the customization settings in the header option. After the header, there is a menu. Each of the pages are displayed here in case the user wants to quickly access a page but it is intended to be a one page portfolio. After the menu, there is a picture break that separates content and too make the website more fun and unique. Each of the photos are either pictures of Ben or taken by him. The pictures are added by adding a featured image for each page. The picture goes above each page. There are then four pages within this “one page portfolio”. There is an about me, videos, photos, and contact. The about me is very simple, just an image and text. The videos were a bit more challenging. First, I had to learn how to link instagram videos as Ben has done work with the UGA basketball team. I also then had to embed his youtube videos and created columns so the videos were not too big. The photos page is one of the things I am most proud of. I installed a gallery plugin so it looked more unique. I like how they fade in when you scroll. I had to mess with the settings of the plugin for a while to get the pictures to look nice. Lastly, there was a contact form. This was also a plug in that I installed. I customized the contact for and added checkboxes too. I also added a footer and created two links: email and instagram.

One small thing that I am proud of is the site icon. This icon is shown in the browser tabs. I created the logo which is his initials and think it adds a nice touch. One thing I was challenged with was a way to present his work in a simple yet creative way. I had to restart my project because I was not happy with the theme and felt it did not display his work in an easy or good way. I feel that my new theme does a great job of showing off his work. Although the site is simple, my client loves it and can’t wait to share it to future employers.

css.php