Category Archive for: pre

rfp-robotRFP ROBOT: Website Request for Proposal Generator

The time has come for a new website (or website redesign), which means you need to write a website request for proposal or web RFP. A Google search produces a few examples, but they vary wildly and don’t seem to speak really to your goals for developing or redesigning a new website. You need to write a website RFP that will clearly articulate your needs and generate responses from the best website designers and developers out there. But how?

Have no fear, RFP Robot is here. He will walk you through a step-by-step process to help you work through the details of your project and create a PDF formatted website design RFP that will provide the information vendors need to write an accurate bid. RFP Robot will tell you what info you should include, point out pitfalls, and give examples.

Facebook Lets Pages Post Pre-Recorded “Live” Videos by @MattGSouthern

Facebook is making its ‘Premieres’ feature available to everyone, which allows pages to publish pre-recorded video as “live” content.The post Facebook Lets Pages Post Pre-Recorded “Live” Videos by @MattGSouthern appeared first on Search Engine Journal. Source:

Preventing a Grid Blowout

Say you have a very simple CSS grid layout with one column fixed at 300px and another taking up the rest of the space at 1fr. .grid { display: grid; grid-template-columns: 1fr 300px; } That’s somewhat robust. That 1fr column will take up any remaining space left behind by the fixed 300px column. It’s true that the auto value would do the same, but auto isn’t quite as robust since it’s size is based on the content inside. So, if you had too little content, then your column might not fill the entire space you want it to. But while 1fr is slightly more robust, it won’t quite protect you from content that is too big! Here’s the grid behaving just fine with some text content: Now, watch that right column get blown off the page when we drop a gigantic image in that column: That one is easy to…

Read More →

HTML elements, unite! The Voltron-like powers of combining elements.

Guides, resources and discussions about Semantic HTML are often focused around specific elements, like a heading, or a sectioning element, or a list. It’s not often that we talk specifically about how we can combine HTML elements to increase their effectiveness. Normally, when we introduce HTML, we talk about how it is used to apply meaning to content in a document, and we do this by using examples like: “Is it a paragraph?” “Is it a heading?” “Is it a numbered list” “Is it a button” We use these examples because they are easy to understand — it’s a single piece or chunk of the same content that needs to be represented in a particular way. This is useful, but it only scratches the surface of how we can use and combine elements to provide more context and meaning. You remember Voltron, right? Each member of the Voltron force was…

Read More →

Old Timey Terminal Styling

I saw a little demo the other day called HTML5 Terminal. It has some functionality, but it seems like it’s just kinda for fun. That said, I loved the aesthetic of it! Blurry monospace type with visible monitor lines and a glowing green background — nice! Let’s re-create that, bit-by-bit. A radial gradient is perfect for the glowing green background: body { background-color: black; background-image: radial-gradient( rgba(0, 150, 0, 0.75), black 120% ); height: 100vh; } I’m so used to using <pre><code> to display space-formatted text (like code), but you could say terminal text isn’t always code, so I like the use of <pre><output> here. Might as well use a nice monospace font: body { … color: white; font: 1.3rem Inconsolata, monospace; } The text on the demo appears a bit blurry. We could go with a slight filter like filter: blur(0.6px);, but it seems blurring that way comes out…

Read More →

Super-Powered Grid Components with CSS Custom Properties

A little while ago, I wrote a well-received article about combining CSS variables with CSS grid to help build more maintainable layouts. But CSS grid isn’t just for pages! That is a common myth. Although it is certainly very useful for page layout, I find myself just as frequently reaching for grid when it comes to components. In this article I’ll address using CSS grid at the component level. Grid is neither a substitute for flexbox nor vice versa. In fact, using a combination of the two gives us even more power when building components. Building a simple component In this demo, I’ll walk through building a text-and-image component, something you might commonly find yourself building on a typical site, and which I have frequently built myself. This is what our first component should look like: Simple component with text and an image Let’s imagine that the elements that make…

Read More →

5-Day Drupal 8 Training – Toronto

Start:  2018-10-01 09:00 – 2018-10-05 16:30 America/Toronto Organizers:  Meyzi Event type:  Training (free or commercial) Learn how to build a website with Drupal from top to bottom. This week-long Drupal class is divided into three parts: site building, theming, and module development. You can register for all five days, or just the days of interest to you. Day 1: Drupal 8 Site Building & Architecture This course will give participants a thorough understanding of the Drupal site building process. You’ll get hands-on experience creating an information architecture for Drupal, and implementing advanced features with Drupal core and contributed modules. Planning and implementing content types Techniques for organizing content with Views Building layouts with configuration Structuring content with Paragraphs Setting up landing pages Selecting and installing contributed modules Site maintenance best practices Pre-launch checklist Days 2-3: Drupal 8 Theming You’ll learn how to build a responsive Drupal theme to customize…

Read More →

A Dozen Reasons Why You Should Attend DrupalEurope in Darmstadt, Germany this September

DrupalEurope, which will be happening from September 10 through 14, 2018 in Darmstadt, Germany, describes itself as “both a technology conference and a family reunion for the Drupal community.” 1600+ attendees are expected. The buzz around this event has been unusually high, especially in the greater Acquia metaverse, for 12 reasons. Here they are: 1. Drupal Europe is put on by a group of community volunteers in collaboration with the German Drupal Association and the Drupal Europe Foundation. The fact that this is an 100% community-spun, DrupalCon-scale event is amazing, and shows how the community in Europe is committed to support it on its own. One of those community organizers, btw, is Acquian Gábor Hojtsy. Another Acquian volunteer is Ricardo Amaro, who is chairing the DevOps + Infrastructure track. A big bunch of Acquians are speaking, but we’ll get to them later in this post. 2. But first, back to…

Read More →

How to Give a Great Agile/Scrum Sprint Demo

Overview The Sprint Demo (often part of the Sprint Review ceremony in Agile/Scrum methodology) is a critical step in completing a sprint, an opportunity to excite stakeholders, and a chance for developers to show off their work. For presenters, however, the demo can be a stressful exercise due to a lack of confidence, structure, or practice. If you’re nervous about giving your first demo, haven’t enjoyed giving demos in the past, or you just want to get better at demoing, this post is for you! Note that I’m not going to spend much time describing what a demo is–there are plenty of other posts online about that. This post is specifically geared towards helping you give a great one. Okay, so you’ve been tapped / elected / volunteered to give a demo, what’s the first step? Start by gathering information and setting some boundary conditions for the demo. I like…

Read More →

​Experience a Simpler Cloud Computing Platform with DigitalOcean

(This is a sponsored post.)From deploying static sites and blogging platforms to managing multiple client websites, DigitalOcean provides a flexible platform for developers and their teams to deliver an unparalleled end-user experience with a lightning-fast network, pre-configured applications, and a 99.99% uptime SLA. Simply let us know your needs and our solutions engineers will provide the best options available. Direct Link to Article — PermalinkThe post ​Experience a Simpler Cloud Computing Platform with DigitalOcean appeared first on CSS-Tricks. Source: CssTricks

Brizy Review: Visual Page Building Reinforced

Meta: This Brizy Page Builder review covers everything you need to know about the WordPress plugin, with focus on how it would potentially impact your business. Well, of course, we love WordPress for its usability, and most importantly, its wide array of third-party plugins optimized for pretty much everything to do with websites. Come to think of it, we could spend a fortnight comparing different plugin categories, debating about the most essential one. However, if you’re honest, you’d acknowledge that nothing comes close to web design plugins especially when it comes to ecommerce sites. Consider this. The first impression visitors have of your website is 94% related to its overall design. That’s according to a study conducted by Northumbria and Sheffield Universities. The University of Surrey, on the other hand, released a separate report revealing that users’ assessment of your business’ credibility is 75% based on the website design. And…

Read More →

Building “Renderless” Vue Components

There’s this popular analogy of Vue that goes like this: Vue is what you get when React and Angular come together and make a baby. I’ve always shared this feeling. With Vue’s small learning curve, it’s no wonder so many people love it. Since Vue tries to give the developer power over components and their implementation as much as it possibly can, this sentiment has led to today’s topic. The term renderless components refers to components that don’t render anything. In this article, we’ll cover how Vue handles the rendering of a component. We’ll also see how we can use the render() function to build renderless components. You may want to know a little about Vue to get the most out of this article. If you are a newbie Sarah Drasner’s got your back. The official documentation is also a very good resource. Demystifying How Vue Renders a Component Vue…

Read More →

Experience Express in Lisbon: Forging the Future of Drupal Architectures and Initiatives at Drupal Developer Days

In Lisbon, steep slopes and sweeping vistas towering over placid waters and crowded ports characterize the topography of one of the most beautiful cities in Europe. This year, the Portuguese capital played host to Drupal Developer Days, possibly the most important event for developers specializing in Drupal. Held at the University Institute of Lisbon, it was a conference not to be missed, with innumerable insights from Drupal core contributors and maintainers. As the summer reaches its peak and beachgoers throng the seaside, the Experience Express stopped in this beach-filled city to sit and sprint with developers as they improve Drupal on many different fronts. In this blog post, we take a tour through some of the most compelling talks, covering topics like decoupled Drupal, progress in core initiatives, and dynamic migrations. Should Drupal 9 be decoupled by design? I joined forces with Lauri Eskola (Senior Front-end Developer at Acquia) to…

Read More →

Learn Data Science: My Favorite Resources

When I started learning about data science, I was overwhelmed by the ocean of resources available online. Thankfully, a few practicing data scientists and professors guided me in the right direction. Below is a list of resources that I found most useful — hopefully they will kickstart your data science fascination, as they did for me. Python If you are completely new to programming, learning the basics of Python on Codecademy is your most-logical first step. You don’t need to be a software developer to practice data science, but you should work to become proficient at programming. As you grow your data science career, expect your programming skills to also grow. Data Camp is a great introduction to applying Python for data science. They have many courses that will help you nail down the basics of data science. Data Camp is not free, but its pricing is approachable at $30…

Read More →

CSS Grid in IE: Faking an Auto-Placement Grid with Gaps

This is the third and final part in a three-part series about using CSS grid safely in Internet Explorer 11 (IE11) without going insane. In Part 1, I covered some of the common misconceptions that people have about IE11’s native CSS grid implementation. In Part 2, I showed the world how easy it actually is to write IE-friendly CSS grid code. Today, I’m going step away from CSS grid for a moment to show you a flexbox technique that replicates basic CSS grid auto-placement functionality. This CSS grid replica will even look like a grid-gap has been applied to it. I need to be super clear though: this is not about how to make actual CSS grid auto-placement work in IE. Article Series: Debunking Common IE Grid Misconceptions CSS Grid and the new Autoprefixer Faking an auto-placement grid with gaps (This Post) How to make a fake grid with cell…

Read More →

CSS Grid in IE: CSS Grid and the New Autoprefixer

In Part 1 of this series, I debunked a few misconceptions that many people have around the Internet Explorer (IE) implementation of CSS grid. This article builds on that knowledge. It would be best to go back and read that article first if you haven’t already. Today I’m going to be tackling the biggest misconception of all: that utilizing the IE implementation of CSS grid is extremely difficult. You can easily use CSS grid in IE right now without having to give it any sort of crappy fallback layout. It really isn’t that hard. Article Series: Debunking Common IE Grid Misconceptions CSS Grid and the new Autoprefixer (This Post) Faking an auto-placement grid with gaps (Coming Soon!) Giving IE a crappy fallback layout is a bit of a tough sell to clients. It is especially tough if this is for an intranet where 90% of the users are using IE.…

Read More →

CSS Grid in IE: Debunking Common IE Grid Misconceptions

This is the first in a three-part series all about how to use CSS grid in a way that will work not only in modern browsers but also in Internet Explorer (IE). Imagine writing CSS grid code without having to write a fallback layout! Many of us think that this is some far off future that is many years away. If the only thing holding you back from that reality is IE11 (check, then you’re in luck! That day is today! Or at least it will be when you finish reading this series. 😉 Article Series: Debunking Common IE Grid Misconceptions (This Post) CSS Grid and the new Autoprefixer (Coming Soon!) Faking an auto-placement grid with gaps (Coming Soon!) To start off, this first part is going to debunk some common misconceptions around IE11’s native grid implementation. In Part 2, I’m going to blow the lid off the myth…

Read More →

Don’t Use The Placeholder Attribute

Eric Bailey takes a hardline position on <input placeholder>. You might be thinking, as I did: yeah, yeah I know the pitfalls. I’m capable of using placeholder responsibly. But when you look at all the negatives together: Can’t be automatically translated; Is oftentimes used in place of a label, locking out assistive technology; Can hide important information when content is entered; Can be too light-colored to be legible; Has limited styling options; May look like pre-filled information and be skipped over. …and the fact that there are advantages to just moving whatever helper text you would want in there anyway outside the input to real markup…I’m fairly well convinced. Direct Link to Article — PermalinkThe post Don’t Use The Placeholder Attribute appeared first on CSS-Tricks. Source: CssTricks

Manipulating Pixels Using Canvas

Modern browsers support playing video via the <video> element. Most browsers also have access to webcams via the MediaDevices.getUserMedia() API. But even with those two things combined, we can’t really access and manipulate those pixels directly. Fortunately, browsers have a Canvas API that allows us to draw graphics using JavaScript. We can actually draw images to the <canvas> from the video itself, which gives us the ability to manipulate and play with those pixels. Everything you learn here about how to manipulate pixels will give you a foundation to work with images and videos of any kind or any source, not just canvas. Adding an image to canvas Before we start playing with video, let’s look at adding an image to canvas. <img id=”SourceImage” src=”image.jpg”> <div class=”video-container”> <canvas id=”Canvas” class=”video”></canvas> </div> We created an image element that represents the image that is going to be drawn on the canvas. Alternatively…

Read More →

CEO at 20

Love this thread: 1/ I became “CEO” at 20. I dropped out of college. I had only interned somewhere prev. Looking back, I couldn’t imagine the journey that would occur from writing code all day to scaling to 300 people. I got lucky, I screwed up a lot, & had a lot of help. Here’s what I learned… — Suhail (@Suhail) May 21, 2018 Make sure to read through it all. Oh, and his thoughts on fundraising are also spot-on: 1/ Let’s talk about fundraising: In 2009, Y Combinator only gave us $15K, half our YC batch died after demo day, 11 firms told us no, 2 firms wanted to find us a CEO, 1 VC told me, point blank, we would fail, we were a week away from death but luckily raised $500K @ 2M pre. — Suhail (@Suhail) May 16, 2018 The post CEO at 20 appeared first…

Read More →

Back to Top