Remaking A Website Design Pt. 2

More coding has been done to bring back the features of the original template.

I spent a good part of the day working on this still. No Holidays off for me! I’m happy with the way it’s looking and performing. I got a lot of the original looks recreated. You can see I’m starting to play around with icons and fonts. That was fun!For you professionals out there, this is just kiddie shit, but for me, this has been a learning experience for damn sure. I didn’t realize how much copy and pasting there was to do with this and it had a habit of biting me in the ass a couple of times. I kept getting DIVs misplaced, missing the ; in my CSS, and somehow even repeated CSS lines… I’m such a n00b, lol. I decided to make some changes to some icons and decided to use Font Awesome as icons under the Latest Matches column. Not only will it help keep file sizes smaller, it includes just so many options. Those will help me greatly in future projects.

Like I said in the first blog, this is being remade for mobile devices in mind. Now I did run into issues with the side bar not stretching the whole way down, but I’m too tired to figure out my mistake tonight, lol.

This gives you an idea of how it responds to mobile devices.

This gives you an idea of how it responds to mobile devices.

It is looking alright. However issues with article titles become apparent as it just seems to stack without the title bar increasing in size. I’ll look to see how to make a text limit tomorrow, seen it somewhere already, just have to remember where, lol. You can also see where them side bars just don’t stretch the whole way down. I’m kinda lost on that but maybe it’s because I’m just tired. Everything else is looking fine. The carousel needs work for smaller screens so the icons aren’t in the middle of the image, but I don’t see that as an issue right now. And I just noticed in the screenshot the menu items disappear. Simple Bootstrap fix, may take a little work to style it right, but simple enough. 🙂

I would like to thank all of you programmers and designers out there for the inspiration and knowledge you’ve shared over so many years. I rarely visit forums these days so I spend my time Googling answers to my questions learning myself what works and what doesn’t. This project, while meaningless to you, has a lot of value to me. It all goes back to Windows Metro and the response to the flat UI theme. I didn’t care much for it, but I could deal with it as my OS. But when websites started using flat UI templates, my heart sunk. I had always thought we’d see even more and better designs that looked so unique and open the path to more digital artists to come and play in the HTML sandbox. Instead, I seen websites start looking more and more similar and I started getting frustrated. I enjoy a more old school look, but I appreciate the amenities of modern frameworks. Back in the early- mid 2000’s, if you visited gaming sites and clan sites, they often had some crazy looking design, plenty of Photoshop work, and I just fell in love with them. So to get this far just on this template is a huge step forward for me to learn how to make more classic designs mobile friendly. And because of this, integration into a CMS these days is much easier, giving the template even more function. If I can at least inspire someone that shares the same love for those designs to help people remember what made those look so cool in the first place, then my job is done. Enjoy your day folks! Thanks for reading.


Posted on September 6, 2016, in Blog, Web Design and tagged , , , , , , . Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: