Category Archive for: Internet Explorer

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.


A Look Back at the History of CSS

When you think of HTML and CSS, you probably imagine them as a package deal. But for years after Tim Berners-Lee first created the World Wide Web in 1989, there was no such thing as CSS. The original plan for the web offered no way to style a website at all. There’s a now-infamous post buried in the archives of the WWW mailing list. It was written by Marc Andreessen in 1994, who would go on to co-create both the Mosaic and Netscape browsers. In the post, Andreessen remarked that because there was no way to style a website with HTML, the only thing he could tell web developers when asked about visual design was, “sorry you’re screwed.” 10 years later, CSS was on its way to full adoption by a newly enthused web community. *W**hat happened along the way?* Finding a Styling Language There were plenty of ideas for…

Read More →

Browser Compatibility for CSS Grid Layouts with Simple Sass Mixins

According to an article from A List Apart about CSS Grid, a “new era in digital design is dawning right now.” With Flexbox and Grid, we have the ability to create layouts that used to be extremely difficult to implement, if not impossible. There’s an entirely new system available for creating layouts, especially with Grid. However, as with most web technologies, browser support is always something of an issue. Let’s look at how we can make the fundamental aspects of Grid work across the browsers that support it, including older versions of Internet Explorer that supported an older and slightly different version of Grid. The Sales Pitch If you visit caniuse.com, you’ll see that CSS Grid is supported in current versions of all major browsers except Opera Mini. So why not start using it? Rachel Andrew wrote extensively on the subject of if it’s “safe to use” or not. It…

Read More →

(Now More Than Ever) You Might Not Need jQuery

The DOM and native browser API’s have improved by leaps and bounds since jQuery’s release all the way back in 2006. People have been writing “You Might Not Need jQuery” articles since 2013 (see this classic site and this classic repo). I don’t want to rehash old territory, but a good bit has changed in browser land since the last You Might Not Need jQuery article you might have stumbled upon. Browsers continue to implement new APIs that take the pain away from library-free development, many of them directly copied from jQuery. Let’s go through some new vanilla alternatives to jQuery methods. Remove an element from the page Remember the maddeningly roundabout way you had to remove an element from the page with vanilla DOM? el.parentNode.removeChild(el);? Here’s a comparison of the jQuery way and the new improved vanilla way. jQuery: var $elem = $(“.someClass”) //select the element $elem.remove(); //remove the…

Read More →

Form Validation Part 3: A Validity State API Polyfill

In the last article in this series, we built a lightweight script (6kb, 2.7kb minified) using the Validity State API to enhance the native form validation experience. It works in all modern browsers and provides support IE support back to IE10. But, there are some browser gotchas. Not every browser supports every Validity State property. Internet Explorer is the main violator, though Edge does lack support for tooLong even though IE10+ support it. And Chrome, Firefox, and Safari got full support only recently. Today, we’ll write a lightweight polyfill that extends our browser support all the way back to IE9, and adds missing properties to partially supporting browsers, without modifying any of the core code in our script. Article Series: Constraint Validation in HTML The Constraint Validation API in JavaScript A Validity State API Polyfill (You are here!) Validating the MailChimp Subscribe Form (Coming Soon!) Let’s get started. Testing Support…

Read More →

Form Validation Part 2: The Constraint Validation API (JavaScript)

In my last article, I showed you how to use native browser form validation through a combination of semantic input types (for example, <input type=”email”>) and validation attributes (such as required and pattern). While incredibly easy and super lightweight, this approach does have a few shortcomings. You can style fields that have errors on them with the :invalid pseudo-selector, but you can’t style the error messages themselves. Behavior is also inconsistent across browsers. User studies from Christian Holst and Luke Wroblewski (separately) found that displaying an error when the user leaves a field, and keeping that error persistent until the issue is fixed, provided the best and fastest user experience. Unfortunately, none of the browsers natively behave this way. However, there is a way to get this behavior without depending on a large JavaScript form validation library. Article Series: Constraint Validation in HTML The Constraint Validation API in JavaScript (You…

Read More →

Celebrate the web by using another browser than Google’s Chrome

I like Chrome. It’s a great browser. But it’s not so good that it deserves to be the only browser. And that’s the unfortunate opportunity we, people browsing the web, are opening for Google by so overwhelmingly choosing to use it in face of the alternatives.And this is what we get by doing so: DirecTV just announced that they’ll be turning their website into a Chrome desktop app on June 1st. They don’t actually say that, but that’s what they mean. You can’t call directvnow.com a website if it only works in a single browser.You don’t have to be that old to remember the dark days when Internet Explorer strangled the web by its utter domination. When large swaths of the web was only accessible through Redmond. Those were not happy days.Ironically, it was Google’s Chrome that helped fight back the scourge of Internet Explorer’s monopoly. Well, that plus the utter neglect…

Read More →

Fun with Viewport Units

Viewport units have been around for several years now, with near-perfect support in the major browsers, but I keep finding new and exciting ways to use them. I thought it would be fun to review the basics, and then round-up some of my favorite use-cases. What are viewport units? Four new “viewport-relative” units appeared in the CSS specifications between 2011 and 2015, as part of the W3C’s CSS Values and Units Module Level 3. The new units – vw, vh, vmin, and vmax – work similarly to existing length units like px or em, but represent a percentage of the current browser viewport. Viewport Width (vw) – A percentage of the full viewport width. 10vw will resolve to 10% of the current viewport width, or 48px on a phone that is 480px wide. The difference between % and vw is most similar to the difference between em and rem. A…

Read More →

The Issue with Preprocessing CSS Custom Properties

CSS has Custom Properties now. We’ve written about them a bunch lately. Browser support is good, but of course, old non-evergreen browsers like Internet Explorer don’t have them and never will. I can see the appeal of authoring with “future CSS”, and letting a preprocessor backport it to CSS that is compatible with older browsers. Babel for CSS! Why not?! It makes me nervous though – because it’s only some use cases of Custom Properties that you can preprocess. There are plenty of situations where what you are doing with a Custom Property just isn’t possible to preprocesses. So if you do, you’re putting yourself in a pretty weird situation. If you’re in a situation where you can preprocess them and get what you expect, you probably should have just used preprocessor variables. Preprocessors can’t understand the DOM structure It isn’t until “runtime” when a complete DOM is constructed that…

Read More →

Ordered Lists with Unicode Symbols

Ordered lists are among the oldest and most semantically rich elements in HTML. Anytime you need to communicate sequence or ranking, the <ol> tag is there to help. The default appearance of the <ol> tag presents numbers next to each item in the list. You can use the list-style-type property in CSS to change the default to use Roman numerals or the letters of the alphabet. If you are feeling exotic, you can even use numbering from other cultures like Hebrew or Greek. The full list of available values is well-documented and easy to use. Recently, I saw an opportunity to use dice in place of numbers for several ordered lists explaining the features of an HTML5 game I created called Triple Score Bopzee. To accomplish my goal, I first experimented with a now-familiar technique for using a small image file as the background for the li::before selector in a…

Read More →

The 15 Strangest Targeting Categories on Facebook

There are tons of “legit” targeting categories on Facebook: number of people interested in fitness, shopping, sports. etc. Have you ever taken a minute to look at all of Facebook’s ad categories, though? I mean, really look? Well, we did, and we weren’t disappointed. We actually found some pretty interesting categories! Some of them are hyper-specific, such as people interested in scooters. Some of them are a little unexpected, like the 17 million people categorized as being in long distance relationships. As quirky as these examples are, the awesome thing about Facebook’s ad categories are their potential to target very unique groups of people. So without further ado, here’s some of what we found. A New Take on Demographics 1. Friends of Newly Engaged Looking at all of the people using Facebook in the States, would you believe that there are 21 million people who are newly engaged in the last…

Read More →

State of the Web 2016

Since starting at Viget over four years ago, I’ve had the opportunity to share a ‘State of the Web’ presentation at many of our quarterly ‘Third Third Thursday’ (TTT) events. These talks offer the chance to explore and share key trends in our industry, and they’re just one of the ways Viget works to stay ahead of the curve. You can watch the Fall 2016 presentation below, or keep scrolling to read the highlights: Mobile Growth It should come as no surprise that mobile traffic is the present and the future. According to some sources, mobile traffic has already surpassed desktop worldwide. This holiday season, comScore predicts that retailers will see three times more traffic from mobile than from desktop. While this growth is obvious even in the U.S., it’s especially prominent in middle and low-income nations. Nigeria, South Africa, Indonesia and India see mobile account for over 66% of…

Read More →

Back to Top