I’ve been working on re-designing/optimizing this website for a while now, almost two months. During this time, I learned a lot about HTML, CSS, SVG, Adobe AI, Fonts, Chrome’s DevTools and many many other things that allowed me bring this new look to the site and improve its performance.
I had a lot of fun while trying to make the site as fast as possible, and I think I did a pretty damn good job considering these high scores I got in GTMetrix, Pingdom and WebPageTest.
I challenged myself to achieve the highest score possible, which at one point meant deleting a big chunk of the CSS codes that I wrote because honestly, things went out of control at one point.
I also went as far as inserting the site logo manually just so I can get rid of the ‘Serve scaled images’ in GTMetrix, all thanks to Tom Usborne, the developer behind the GeneratePress framework which is what the site is running on at the moment.
Let’s take a deeper look at what’s new in /news47ell
# GeneratePress Framework
I tried so many other options but I think I made the right choice when I switched to GeneratePress, and here’s why:
- Looks great.
- Fast.
- Has its own website and support forum.
- Made by one person only. Tom Usborne.
- Tom is working only on this theme, meaning that he have all his focus and energy on making GP as perfect as possible.
- Available in the official WordPress theme repository which means It’s secure and the code well written.
- Schema.org Integration.
- Font Awesome built right in.
# New Logo /
Yeah, so that happened, and I wasn’t even thinking about it, but one day I was like: hmm…I think I need a new logo. After few weeks of looking around, sketching some ideas in Adobe AI, I finally decided that the best logo for me must be a Unicode.
After spending some time looking for the perfect Unicode, I found one and it’s /, why?
Visit this and try to find out the reason why I picked it.
And for the text beside the slash ‘/news47ell’ am using the font alef by hagilda.
# Fonts
Before I decided to change the theme, I never even thought about fonts. I’ve used Oxygen and that is it.
But now, I did all kind of research and learned all kind of crazy shit about fonts like:
- Difference between Sans & Serif
- Font stacking
- Hosting fonts locally
- SVG Fonts
I believe I made the right choice when I changed ‘p’ tag font to Open Sans, I love how thin it is. And for H1, I decided to go with a web safe font, Georgia, because I didn’t want to have browsers doing extra requests for multiple fonts. And I decided to host Open Sans locally on my server, which, combined with using Web Safe fonts, make my site even faster to load.
Oh and for all of my website readers who use their Apple devices to read my site, you will take advantage of Apple new font San Francisco
# Ads
As you can see ((Technically, you can’t see the ads yet because you didn’t finish reading the article yet)), with the new design, Content/No Sidebar, I put 4 ads at the bottom of each page.
These ads are also hosted locally on my site, so there’s no extra time spent loading the images from external domains, or ad link redirecting like crazy.
# Final Words
I spent 2 or more months working on this design, trying to bring what’s in my mind to reality, Plus, many cups of Nescafe coffee were consumed, and by a lot, I mean really a lot. Now, I feel like I finally reached the point where I feel satisfied with what I did and feel ready to start writing news, reviews, and personal thoughts again on this site.
But, that doesn’t mean that I won’t change anything anymore on this site. There’re few things here and there that I will tinker with, both in the visual and performance department. Because I know that there’s a lot of things out there that I must learn and test on my site.
Until next time!