RESPONSIVE DESIGN TIPS

go home

if you've created (or want to create) your own website, you may have momentarily wondered how to make it look as nice on your phone as it does on your computer. you may think that by making your website fit on such small screens, you'd be forced into a very rectangular and linear layout that wouldn't be as creative as you'd like. you may even have asked yourself if it is even worth it to go through all of this effort to make your website display correctly on your phone when most neocities site don't bother. i'm here to tell you that mobile-compatible web design is very important AND that you don't need to sacrifice your intricate layouts entirely to make it happen.

this page will primarily give tips from a design standpoint instead of a coding one, by which i mean how to think about the structure of your pages to transfer it to smaller screen. i do not feel confident enough in my html and css abilities to give coding advice, but i will try to link a couple of websites you can check out for help.

Table of contents

Why is mobile-friendly design even important anyway?

when going through various websites created by neocities users, you've probably noticed that most of them warn against viewing their sites on a phone or similar small screen. it may make you wonder if doing so even matters if you're the only one doing it. (you wouldn't, since me and several other users did it, but let's pretend for a second.)

people who are very passionate about a subject often have a very distorted view of what the average person's knowledge is of that subject. i'm not really that passionate about computers (mine is made from parts the rest of my family didn't need anymore because i don't necessarily need a very powerful one) but i do have a tendency to forget that most people today are really not used to computers. they may not even own one at all. smartphones are now able to do so much that owning a computer is not a necessity. computers are also a lot more expensive than phones, especially in the eyes someone who might not use a computer often. making your website at least partly accessible to mobile devices gives all those people a chance to see it.

another important point in favor of mobile-friendly design is accessibility to the disabled. depending on a disabled person's specific symptoms, using a desktop computer can be much harder than using a phone. (the opposite is also true!) a laptop may not fix every problem, since using a laptop in bed or on a sofa can result in a bad posture.

the last important aspect is simply that not everyone's computer screen is going to be the same size as yours. if your website only displays properly at one resolution, it is going to be difficult to navigate for anyone whose screen is bigger or smaller than yours, or to people who zoom into web pages.

be kind!

if there's one section on my entire website that i want everyone to see and read, it's the following two paragraphs.

as mentioned above, a lot of neocities websites warn against viewing their site on a mobile device. this is fine. no one can be forced to do anything they do not want to do with their website, and it's better to put up a warning than to say nothing at all. however, i've come across quite a few websites that were quite aggressive with these warnings, and quite frankly, it's just mean.

i understand that phones are basically the symbol of everything that's "wrong" with the internet today, everything that many neocities users stand against with their wish to keep the internet free and creative. but treating anyone who doesn't own a computer or doesn't use it as their primary device like they're "inferior" to those who do is unnecessary and will just drive people away. not to mention the underlying ableism and classism of those aggressive phrasings. (neocities websites aren't usually the pinnacle of accessibility, but making your warning a simple "best viewed on a computer monitor" gets the point accross without being rude.)

Rethinking the structure of a page