Loading...

thecodercoder

Jessica | web developer #webdevelopment #programming Practical tips for the beginner web developer. https://coder-coder.com/
230 posts
14,144 followers
200 following
@thecodercoder - Jessica | web developer | Working on my blog post about responsive design. Here are the basic steps I follow when building a website, to make sure it's responsive:
.
1) Sketch out the layout at desktop and mobile widths (and sometimes tablet if I'm feeling particularly ambitious 😁)
.
2) Start building mobile size first, then go up from there. By that I mean in the CSS, I'll make the mobile CSS the default styles. Then I'll use min-width media queries for progressively larger widths.
.
3) Test as you build. I use Chrome, and constantly check how things look in the inspector. I'll check all the way from iPhone to large desktops. And yes, I check on IE11 as well, even tho it makes me cry 😂
.
How do you approach building websites? I know everyone has their own way of doing things 😊
.
.
.
.
#webdev #css3 #html5 #jquery #programmers #responsivedesign #learntocode #nodejs #node #reactjs #mysql #devlife #programmerlife #programmerslife #worldcode #fullstackdeveloper #frontenddeveloper #webdevelopers #mongodb #fullstack #es6 #programmingisfun #codingisfun #buildtheweb #github #vuejs #programmerrepublic #thedevlife #peoplewhocode
Working on my blog post about responsive design. here are the basic steps i follow when building a website, to make sure it's responsive:
.
1) sketch out the layout at desktop and mobile widths (and sometimes tablet if i'm feeling particularly ambitious 😁)
.
2) start building mobile size first, then go up from there. by that i mean in the css, i'll make the mobile css the default styles. then i'll use min-width media queries for progressively larger widths.
.
3) test as you build. i use chrome, and constantly check how things look in the inspector. i'll check all the way from iphone to large desktops. and yes, i check on ie11 as well, even tho it makes me cry 😂
.
how do you approach building websites? i know everyone has their own way of doing things 😊
.
.
.
.
#webdev #css3 #html5 #jquery #programmers #responsivedesign #learntocode #nodejs #node #reactjs #mysql #devlife #programmerlife #programmerslife #worldcode #fullstackdeveloper #frontenddeveloper #webdevelopers #mongodb #fullstack #es6 #programmingisfun #codingisfun #buildtheweb #github #vuejs #programmerrepublic #thedevlife #peoplewhocode
9 742 August 2018
Comments
@yusufcodes
Looking forward to it, need to work on my responsive design
@thecodercoder
@yusufcodes it's a good skill to have! 😊
@thecodingaviator
I just start building and keep making changes as i go along. i know it’s a bad habit and usually i spend all my time optimising but that’s how i like to do it
@genevievemasioni
I went with the old desktop to mobile approach but it doesn’t suit me anymore. feel like i need a change, so i’ll definitely test the mobile first approach and stop pushing it for later in the fear of getting out of my comfort zone and losing my so-called “productivity points”. silly. 😅
@thecodercoder
@thecodingaviator ultimately whatever works for you is best!
@thecodercoder
@genevievemasioni same for me! i used to do desktop first 😊 once you get used to it you'll be just as fast 😁
@jens.codes
After i made my sketch i start designing it in adobe xd :) it’s very important to already have a concept visually made. you can also start prototyping to test it and show it to your client for example before you dive into the code 🤗
@thecodercoder
@jens.codes i've heard really great stuff about adobe xd! yeah having a prototype helps catch things earlier in working with clients. i'll have to try it out. do you design all your websites too?
Loading...