#Wordpress page layouts quit being responsive free#

#Wordpress page layouts quit being responsive free#

To help do that, I'm launching a free course called Conquering Responsive Layouts. I want to show people how, if they simplify their approach, responsive layouts aren't that difficult. Overcoming the challenges of responsive layouts By changing our mindset and by starting mobile-first and adding complexity, we can: We have to override so many of the styles we already applied when we start desktop-first, rather than letting the site be naturally responsive. But I really believe it leads to many of the issues people have with making sites responsive in the first place. I really think a lot of people stick with desktop-first because we learn to create desktop sites first as static sites.īecause of that, it's just the natural starting place any time we start creating a website. One of the hardest things to do is break out of what you are used to doing. There is added complexity in how the user might interact with it, but from a layout perspective, it's very simple. We often hide them away and have to add some JavaScript to get them to appear.īut from a layout perspective, are they more complex? Most navigation on mobile are just a with the bullets turned off and some extra spacing. Yes, it is true that some things, such as navigation, can seem more complex. There are parts/sections/components that are more complicated on mobile Some components might need some detailing and some tweaking, but the majority of the work is done. Once you've knocked that out, most of the time the mobile version of the website is pretty far along. Next up, you can have a large majority of your mobile site done simply by adding two more properties: With that done, you probably have a decent looking mobile website already. When I write my CSS, I don't worry about the layout at all to start. Turn off all the CSS, and you have a responsive layout. The reason that people starting with the desktop layout bugs me so much is that I honestly think people would have a much easier time with responsive websites if they would start mobile-first, even if they only had a desktop comp to start from.Īs I talked about in my above video, we are the reasons a website is not responsive.

The one good reason I did get was that they were creating web apps and admin dashboards that were only intended to be used on desktop computers, which, well, fair enough!

I understand why they start with writing their CSS to match the mocks in that situation, but I honestly don't think it's a good enough excuse. Our designer only supplies us with desktop mockups In the comments section, I asked people if they prefer desktop first to tell me why they do. A switch to a mobile-first approach would solve many of the above issues. I recently put up a YouTube video looking at why I think many people could simplify their life by changing their approach to mobile-first, because much to my surprise, it seems like most people still do things desktop-first. It's difficult to find what's causing the problems.

Some of the most common issues I hear are: Based on polls and surveys that I've done, one of the things people are most frustrated with is making websites responsive. CSS gets a bad wrap for a number of reasons.