October 2018 Summaries

Creating knockout text effects on the web can be efficiently achieved using the CSS properties -webkit-background-clip and -webkit-text-fill-color, which allow for real HTML text that is both searchable and easy to edit. This method, primarily compatible with browsers using the WebKit engine like Chrome, Firefox, and Safari, offers significant advantages over traditional graphic-based approaches, which suffer from SEO limitations, larger file sizes, and the need for re-creation upon text updates. While -webkit-text-fill-color is non-standard and may not provide a consistent experience across all browsers, it remains a practical choice for personal projects where cross-browser compatibility is not critical. The tutorial suggests using flexbox for text positioning and emphasizes the benefits of real HTML text, such as searchability and accessibility, despite the known bug that prevents styling when flexbox is applied. This web-friendly approach is preferred over using static images, which can hinder site performance and search engine indexing.

Having a clear purpose for seeking mentorship is crucial to finding a mentor whose skills align with your goals, whether you're looking for short-term portfolio enhancement or ongoing design analytics advice. It's important to understand that mentors are not there to teach foundational skills, which should be acquired through classes and tutorials, but rather to provide feedback on your existing work. Choosing a mentor whose work you admire can inspire you and motivate the mentor to share their expertise with a dedicated mentee. Both parties should value each other's time by maintaining a consistent and respectful schedule, ensuring productive and meaningful mentorship interactions.

CSS grid is a new layout system that offers enhanced control over both horizontal and vertical aspects of web design, providing a more intuitive and efficient way to build complex, responsive layouts compared to flexbox, which controls only one dimension. While it borrows elements from CSS grid, Webflow introduces a unique on-canvas control system that distinguishes it from other layout options, facilitating faster and easier design processes without compromising code quality. CSS grid does not replace flexbox; rather, it complements it by allowing designers to establish positioning rules along two dimensions, which simplifies the creation of intricate layouts without excessive nesting of elements. This two-dimensional capability also enables seamless redesigns across different breakpoints by allowing layout changes without altering the underlying markup. For those interested in exploring CSS grid in more technical detail, resources such as Jen Simmons’ YouTube channel and "The Story of CSS Grid" on A List Apart are recommended.

Whitespace grid design simplifies creating layouts with ample whitespace, a task that typically demands numerous elements when utilizing flexbox, and allows for effortless content reordering across breakpoints. This design approach is particularly useful in constructing layouts such as a news or blog homepage, which are commonly structured on a grid. Users can interact with and explore these designs through platforms like Webflow, where they can clone projects and view them live.

The text highlights a selection of music-related web designs created using Webflow, showcasing their unique features and the inspiration behind them. The Best Albums of 2017 site by Hoog Design presents a visually engaging, single-page layout with interactive features, allowing users to explore top albums with color-coded navigation and artist insights. The Trenchwerk site for producers Nard and B emphasizes their artistic authenticity with a design that reflects their hip hop production style, including dynamic visual effects. Beyond The Valley 2018 offers a festival lineup page that mimics a concert flyer, providing easy navigation and information about each performer. Moonlands' website captures the essence of the band's indie music with a color scheme that mirrors their sound, while Mateus Gageiro's site showcases his versatile music production portfolio, featuring his work in various media projects. Each design serves as an example of how Webflow can be used to create engaging, personalized websites for music professionals and enthusiasts alike.

The text highlights a collection of diverse and creatively designed blogs that showcase various interests and talents. Rahel and Ron Food Studio presents rustic and authentic culinary content with a focus on wholesome ingredients, while Ashley Janelle's blog reflects her expertise in UI/UX design and the creative process through vibrant imagery and organized content. The FASHIONLATTE template offers a stylized, cloneable design for lifestyle and fashion enthusiasts. "I Ate Oklahoma" explores the culinary delights of Oklahoma with witty and engaging writing, and "Drunk by James" combines Canadian illustrator James David Thompson's passion for craft beer and art, featuring beer reviews with stylized illustrations. Each blog utilizes Webflow CMS for easy content management, emphasizing the creators' dedication to their crafts.