Is there a way to automatically make website responsive?

1 Views

I am thinking to create my website in WordPress. Previously, I did projects that were for other people but now I want to design my own website. I am currently focusing on the issues I have faced before and want not to repeat them this time.
The only issue is of responsiveness. I have faced issues for mobile device and later on have solved them after a great pain. But now as I am working fresh, I want to ask whether is it possible to make website responsive when it is under construction or only after the complete building of the website.

If there is a way to automatically make my website responsive then kindly discuss. If we can somehow make the website responsive at the time of creation then my work will be lessened and I can focus on other functionality of my website. If any one have any solution to my problem then kindly tell me.

Post Views: 1

Related posts

4 comments

  2. You can use a CSS framework such as Bootstrap to do this. That will automatically make your site responsive by default (in most cases, limitations might apply).

    It means you have to build your website with Bootstrap though, so you have to do this while building the site, not afterwards.

  3. The only way to make the website responsive is to buy a responsive theme. But that will not be 100% successful considering them customization. If you are thinking of making the website responsive plan it well and the build from the beginning. If the HTML is properly structured then the working time and issue fixing will be easier and less time consuming. If you need more details please comment

  4. I known that this has an answer but still I thought I can give a contribution.

    In the first place you talked of wordpress. Since you are going to making your website in wordpress then it is recommendable to choose a responsive theme for your website which is going to significantly reduce your overhead.

    Also you can use media queries to make a website responsive like look at code below

    /* ----------- Non-Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1) { 
}

/* ----------- Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) { 
}

    You have to give screen size for various devices like laptops, ipads etc. There is a whole article here https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

    Apart from media queries you can use framework like bootstrap , skleton which will greatly reduce your overhead. All you have to do is to add its files and use the classes of framework which already has properties associated with them.

Comments are closed.