For my final project in this class, I wanted to redesign the website of New Wave Coffee in Logan Square (where I am currently enjoying a cup of coffee and editing my blog). Their current site consists only of their logo, their hours, their address, and their phone number. I felt they should have a little bit more robust website.
Author Archives: Brian Lancaster-Mayzure
EXTRA CREDIT: OpenType features and the web
I ran across an article on the TypeKit Practice blog about OpenType features and how to enable and use them on the web.
OpenType features are more than just fancy swashes, they’re the superpowers of fonts! The best typefaces are full of sophisticated reasoning and little surprises — things that are often integral to the design of the typeface itself, or that help it work better for specific typesetting tasks. Being a graphic design student, I can appreciate the nuances of ligatures and old style numbers, and have always struggled to bring these same features from print over to the web.
EXTRA CREDIT: ‘Let’s Encrypt’ makes HTTPS easier
Ever since Edward Snowden brought the breadth and scope of governmental snooping on our online activities, there’s been a call across the internet for all websites to be secure their traffic through encrypted HTTPS connections. And now with HTTP/2.0, a much awaited update to the HTTP protocol which speeds up connections, specifies that all traffic should be encrypted with HTTPS, HTTPS everywhere is becoming more of a reality. But still, the barrier to entry has been high. SSL certificates, that make encryption trusted and possible, can cost anywhere from $20 to $300. But one group of programmers thinks that’s not good enough.
Awesome CSS drop shadows
You can create beautiful drop shadows in CSS without the need for images (you know, like back in the olden days). With just a little CSS, you can create a few different drop shadow effects, like lifted paper drop shadows, perspective drop shadows, horizontal curved drop shadows, and vertical curved drop shadows. The example code is taken from a drop shadow demo page from a few years ago.
Update: Working with flexbox
I’ve been working on my final project website, and have decided to incorporate flexbox into my project. I’m surprised at how easy it’s been to work with once I got over the learning curve. Fortunately, the learning curve isn’t that steep.
Be careful what you sign
This week on Creative Bloq, Ben Tallon brings us the warning to be careful of what we sign. He tells us the tale of a friend and colleague that unwittingly signed away the digital rights to his work. Continue reading
More Flexbox: A complete guide
In case you didn’t get enough flexbox from the Smashing Magazine article in my last post, our friends at CSS Tricks have “A Complete Guide to Flexbox” waiting for you. There are plenty of how-tos and coding examples. I’m super-eager to get my hands dirty and implement flexbox into my next project!
Forget floats and margin tricks. Flexbox is here!
I ran across an interesting article on Smashing Magazine that might just change everything. Flexbox is here, and we should all be using it now! CanIUse.com reports that flexbox is supported across all major current browsers. According to the Smashing article:
The days of floats and margin trickery are finally behind us, as CSS furnishes developers with new and improved properties perfect for those delicate layouts. Layout features such as vertical alignment, evenly distributed spacing, source-order control and other patterns such as “sticky” footers are quite effortless to achieve with flexbox.
Flexbox looks like an absolute game-changer. I will admit that I haven’t yet tried it, but am eager to try it out and use it. Anyone else have any experience with flexbox?
Printing with CSS?!? No way! YES WAY!!
So you have designed a spiffy new website for a client. For argument’s sake, let’s say it’s a restaurant. Everything is there, the menu, specials, location, hours, etc. It looks great, at least on the screen. Now imagine that you want to print out the menu to share with co-workers or friends. Hit ⌘ P. It looks horrible, doesn’t it?
Well, fear not. Our friends at Smashing Magazine show us how we can make our pages look great in print with CSS through the use of @media! If you’ve got a website that you can even remotely imagine that someone would want to print, this is the tutorial for you!
Want to learn JavaScript? JavaScript for Absolute Beginners
Want to learn JavaScript, but can’t find a tutorial that doesn’t assume you already know the basics? The folks over at <code /> have just the tutorial for you: “JavaScript Tutorial for Absolute Beginners.”