Mastering Responsive Typography

I am so excited my buddy Zell came out with a class Mastering Responsive Typography. As you know he has written two books, Automating Your Workflow and Learning Susy, which I have written about in the past. Well NOW, I get to learn about Mastering Responsive Typography. Recently I came across responsive logos, and thought how am I going to tackle this new design mindset, as well as setting pages so while the blocks look right, the font or typography is usually small and hard to read. I want it to be small screen, but sort of normal size font. I know in the past I learned a lot about this from his blog, Everything I know about Responsive Web Typography. The other one I had read a couple of years ago, kind of left ya hanging. Good ideas in The Lazy Person’s Guide to Responsive Typography, but I wanted more.

Mastering Responsive Typography Lessons

First, you’ll learn the fundamentals to good typography. You’ll learn how to choose a good font-size, how to set your text properly, so it looks good on any device. You’ll also gain confidence that your typography choices are sound even if you don’t have a great eye for design.

Second, you’ll learn the technical aspects to typography.

He says “… wrote Mastering Responsive Typography because it’s something I wish I had when I started to learn web typography. Although there’s a ton of information out there, only a few ones are truly gems. These gems were incredibly hard to find. I often drowned in the vast amount of information out there on the internet.

In short, Mastering Responsive Typography is right for you if:

  1. You want to understand and internalize design principles to help you design better-looking websites without the help of a designer.
  2. You want to code in a simple and efficient manner while utilizing everything you’ve learned.
  3. You want to learn things quickly so you can produce work you’re proud of.

Mastering Responsive Typography(https://gumroad.com/l/ZpmBL)

 

I tell you what, from what I have seen of his book this course will be worth it. I am excited to see if I can make it happen.

Automating Your Workflow Architecture

Automating Your Workflow with Gulp by Zell Liew
Automating Your Workflow with Gulp by Zell Liew

Last nights SASS Meetup was about Modular Awesomeness, so of course I went. Anthony Daniel’s presentation was an overview a powerful new approach he has come up with to developing workflows, architecture, and components using GulpJS, SASS, Flexbox, and PostCSS at the Big Nerd Ranch. I had heard about Flexbox, and Gulp and wanted to see them in action. I got very excited about learning more about workflows, since my Monday & Tuesday parallax project was a bit wonky.

My buddy Zell Liew had written a book, Automating Your Workflow, which I shared with them, and a Learning Susy book, so I figured this was a perfect place to see the other side in action. I remembered that about 6 months ago, I had seen a blog somewhere comparing Suzy and Flexbox somewhere. The presentation was like biting off more than we could handle in one setting, and we discussed how to do a more simple example set and show only one topic of the 3 main ideas he was trying to present on in future presentation, and that there was enough material to do all three. I hope Anthony comes back with one of the topics more refined. Meanwhile on to Susy designs.

 


Website Layout Tools Compared: Flexbox Vs. SusyLearning Susy
By Zell Liew

Yes, you should check out the book. Even a couple of samples was worth the time to see inside this mindset and methodology of how to make ultra flexible layouts easily with the Susy framework.

Some notes that don’t really relate to this meetup, but fits
(http://www.slideshare.net/webbeh/atlanta-drupal-users-group-april-2015-sasstronauts-advanced-sass-topics)

Basic Skills of a Front End Developer

Front end developers use HTML, CSS, and JavaScript to code the website and web app designs created by web designers. I’ve combed through dozens of front end developer job listings to see which skills are the most in-demand right now. These are the things that real employers are looking for in job applicants today (and will still be looking for in the near future). Master these things and you’re certain to land an awesome Front End Developer job!

  • HTML (Hyper Text Markup Language)
  • CSS (Cascading Style Sheets)
  • JavaScript is the core of the rest, such as
  • jQuery, a JavaScript library
  • JS frameworks like
    • AngularJS
    • Backbone
    • Ember
    • ReactJS
  • Front End Frameworks like
    • Bootstrap
    • Foundation
    • Susy
    • Material
  • CSS Preprocessors like
    • SASS
    • SCSS
    • LESS

And then digging into experience with RESTful Services and APIs. REST stands for Representational State Transfer. In basic terms, it’s a lightweight architecture that simplifies network communication on the web, and RESTful services and APIs are those web services that adhere to REST architecture.

And of course all of these sites you build need to be Responsive and of a Mobile-first Design mindset (which Bootstrap can help). Cross-Browser Development is a given, with the wide range of IE, Chrome, Firefox and others out there. Shims, resets, and browser prefixes help.

And lastly you need to cultivate a Testing and Debugging mindset. Test-Driven Development is not hard, but it is time consuming and rarely taught in tutorials and bootcamps, and this will set you apart as a professional. Which of course, you also do really need to know Git and Version Control Systems. So when you go to build your portfolio, try to find ways to show off your Problem Solving Skills. This is really want any good employer wants, someone who can solve problems.


Creating A Successful Online Portfolio

My (Simple) Workflow To Design And Develop A Portfolio Website

Advanced Sass Integrations with Drupal Theming

This presentation, Advanced Sass Integrations with Drupal Theming, takes a deeper look into Sass and some of the advanced configurations, options, and features you can deploy and integrate into your Drupal themes.

This presentation does not require an introductory knowledge of Sass, although it is recommended for implementing any of these features. For an introductory look into Sass, please see our May 2014 presentation ( https://vimeo.com/94197637 ).

 

As the Web Manager for the College of Engineering, Eric Sembrat serves as a subject-matter expert to all things Drupal both inside the college and across campus. He also serves as the newly-elected President of the Atlanta Drupal User’s Group.

Eric first started with Drupal in 2011, and has been at Georgia Tech since 2012.

 

Bootstrap SASS with Front-end Drupal

Get help with your front-end Drupal project by using some of today’s most popular technologies. Leveraging Bootstrap and SASS will make it easier to tap into the larger developer community. This months topic, Front-end Drupal with Bootstrap and SASS, looks good for our Atlanta Drupal Users Group

We’ll explore how to make the most of a few well-maintained Drupal modules and themes that will minimize your markup and make your site more HTML5+CSS3 friendly.

Brian Danin is a Senior Developer at CSE and specializes in digital media, web development, video, photography, Drupal, and PHP. He has worked for the Georgia Institute of Technology, Turner, CNN, the Univserity of British Columbia, and more. He’s originally from the small mountain town of Manitou Springs, a few miles from Colorado Springs, CO.

THANKS TO OUR SPONSORS
We will have food and refreshment sponsored by LEHAN Partners. Thanks also to our sponsors Matrix Resources for the meeting space, and to TRC Professional Solutions for helping with organization and planning.


We all enjoyed Brian Danin’s presentation “Front-end Drupal with Bootstrap and SASS” back in May. The video is now available at: http://vimeo.com/102867822
Here is a starter theme that gets everything setup and ready.
https://drupal.org/node/2116345

This assumes you have a Compass-Bootstrap setup running. I usually use command-line to compile and watch my code, but you can also use code-kit.

For Thursday, I will be focusing on Bootstrap 3.x.
These are the basic gems you need installed to compile the SASS (other instructions are linked in the Drupal link above):

  • bootstrap-sass (3.x)
  • compass (0.12.x)
  • sass (3.2.x)