Are you a print designer, photographer, fine-artist, or general creative person? Do you have a shitty website that you slapped together yourself in Dreamweaver in that ONE web design class that you took in college? Do you not have a site at all because you’ve been waiting two years for your cousin to put it together for you? Well, we’re here to help. We know that you have little to no desire to do web design professionally, but that doesn’t mean that you want an ugly cookie-cutter site or to settle for one that hasn't been updated since Hackers was in theaters. Through short tutorial videos, you’ll learn how to take a basic wordpress blog and manipulate the css, html (and even some php!) to match your aesthetic. You’ll feel empowered rather than crippled by the internet and worst case scenario you’ll at least end up having a better idea of how professional web designers turn your design dreams into a reality on screen.
Do the fonts look kind of weird? Switch to Safari or Chrome as your browser. You’ll thank me later.
In this episode, we’ll introduce you to the developer tools hidden in your browser that will become indispensable as you begin to look at HTML and CSS code.
Your browser has some hidden functionality you may not know about. Using Developer Tools right in your browser, you can peek beneath the skirt of any website on internet—barring of course websites made in Flash (boo! hiss!). You'll be able to see the HTML and the CSS that actually makes some of your favorite sites like
Apple,
Lost Worlds Fairs or even
Cute Overload.
Peeking at other people's code is a great way to familiarize yourself with the cool tricks that web designers and developers use to pull off some awesome stuff. So, as you travel the tubes, if you see something you like, don't hesitate to inspect it and see exactly how it was done. The more you do it, the faster you'll get comfortable with developer tools and code.
In case someone else has this problem….I’m using Safari and I could not see the “Inspect Element” command when I right-clicked. Turns out you have to go to Safari Preferences, click Advanced, and select the “Show the develop menu in menu bar” checkbox.