[Boards: 3 / a / aco / adv / an / asp / b / bant / biz / c / can / cgl / ck / cm / co / cock / d / diy / e / fa / fap / fit / fitlit / g / gd / gif / h / hc / his / hm / hr / i / ic / int / jp / k / lgbt / lit / m / mlp / mlpol / mo / mtv / mu / n / news / o / out / outsoc / p / po / pol / qa / qst / r / r9k / s / s4s / sci / soc / sp / spa / t / tg / toy / trash / trv / tv / u / v / vg / vint / vip / vp / vr / w / wg / wsg / wsr / x / y ] [Search | Free Show | Home]

If your site doesn't look like this it's cancer.

This is a blue board which means that it's for everybody (Safe For Work content only). If you see any adult content, please report it.

Thread replies: 179
Thread images: 29

File: Untitled.png (27KB, 920x850px) Image search: [Google]
Untitled.png
27KB, 920x850px
If your site doesn't look like this it's cancer.
>>
>optional sidebar
>>
>>52593636
>That colour pallet

kill yourself.
>>
>>52593636
>borders everywhere
>sidebar isn't autohidden
>navigation isn't autohidden
>footer isn't autohidden
no
>>
>not having a website with sentences like "and you can't believe what happened next!"
>featuring a 15 picture slideshow with every picture on a new page which features more and more ads
>the final page redirects to more slideshows
>>
>mspaint image

Nah senpai this is how you do it:

http://motherfuckingwebsite.com/

http://bettermotherfuckingwebsite.com/
>>
>>52593636
What about just sidebar, content, and footer?

Sidebar having all the navigation.
>>
>>52593636
>sidebar on the left
>the area where most people look according to various eye tracking research conducted by pro professionals such as Jakob Nielsen
>not placing your main content there
>title center-aligned
>not using a fat footer

What the fuck.
>>
>>52593636
If your site needs to rely on advanced formatting to be readable and usable, it's garbage.
>>
>>52593636
Indeed, I often need to look at the title to be reminded of what website I'm on.
>>
>sidebar
>crappy JS navigation
lel
>>
>>52593707

The "better" website uses half my screen and makes me scroll for a thousand fucking centuries.

The "better" site is fucking garbage.
>>
File: worst clickbait trash ever.jpg (353KB, 1680x961px) Image search: [Google]
worst clickbait trash ever.jpg
353KB, 1680x961px
ITT: perfect web sites
>>
>>52593715
Nielsen is a meme. I'm a fucking interaction designer and it's all bullshit.
>>
>>52593760
Full width text doesn't work on widescreen displays. Have you actually tried reading the content?

>>52593767
Guess what, so am I. How exactly is data gathered from user research bullshit?
>>
>>52593760
Nope.

Nobody wants to read lines of text that are 3 feet long.

Better one has improved readability and looks nicer.
>>
>>52593779
Research is so incredibly biased it's not even funny. There are also do many factors that don't get added to research. In the end it really doesn't matter, it's all trends.
>>
>>52593803
Post your LinkedIn so I can make sure not to ever do business with you.
>>
>>52593823
>LinkedIn

You just got your degree I see. No biggie, in a few years you'll learn.
>>
>>52593837
Whatever kiddo, just don't fuck up my field.
>>
>>52593837
You never plan on quitting your job I see. Enjoy your shitty life.
>>
File: 1453635973989.png (20KB, 920x850px) Image search: [Google]
1453635973989.png
20KB, 920x850px
>>52593636
I fixed your design OP
>>
This is a beautiful website.
https://www.gov.uk/

Discuss
>>
>>52593867
trash the navigation and just have content
>>
>>52593871
It actually is good.
I would make the text smaller and footer should shrink in size but it's a good website
>>
>>52593871
>https://www.gov.uk/
looks like a fucking scam fake search website, otherwise its fine anon
>>
>>52593871
this website is so fuucking functional

it's also really helpful when you need to find out about government things

unfortunately the government have basically stopped developing it

also i really do agree with OP. when you're making websites you should conform to standard design patterns. i don't give a fuck about your special snowflake crap
>>
>>52593871
It's nice but it definitely reminds you of those placeholder ad websites usually on shut down domains and mistyped popular domains. Weird for a .gov website.
>>
>>52593942
It's a .uk site
>>
How about this site?

http://www.lanhaus.net

Absolutely perfect.
>>
File: Untitled.png (15KB, 1895x454px) Image search: [Google]
Untitled.png
15KB, 1895x454px
This is my site, served me well for nearly a decade.
>>
>>52593953
Oh anon, I don't even know where to begin.
>>
File: website.jpg (89KB, 1584x737px) Image search: [Google]
website.jpg
89KB, 1584x737px
>>52593636
Mine looks better
>>
https://wakaba.dhcp.io/
This is mine, it's not perfect, but what do you think?
Improvements?
>>
>>52593760
the original also doesn't fit on my screen and I have to scroll for ages.

I guess it's websites fault and not my resolution.
>>
>>52593953
>lanhaus
How 'bout lainhaus

http://fauux.neocities.org/
>>
>>52593986
>scroll for ages

What the fuck?
>>
http://www.stroustrup.com/C++.html
>>
File: 123325346.png (67KB, 1920x1080px) Image search: [Google]
123325346.png
67KB, 1920x1080px
>>
File: professional layout design.png (120KB, 3812x3500px) Image search: [Google]
professional layout design.png
120KB, 3812x3500px
This is the ultimate website.
>>
>>52594067
I see what you did there.
>>
>>52594067
>combo breaker
>>
http://www.iamsterdam.com/en/
looks pretty good
>>
>>52593636
Why a sidebar and a top navigation?
>>
>>52593978
>looks better
>#0000FF links
yeah sure
>>
>>52594115
It's optional, in case you need sub categories.
>>
File: faglord design.png (49KB, 920x2082px) Image search: [Google]
faglord design.png
49KB, 920x2082px
>>52593636
think twice you faggot
>>
>tfw your company lets you choose between and of two templates and both look like complete, serious ass
>tfw your company demands that all applications should be able to change their theme, which includes layout changes
>tfw your company wants you to use pure CSS for this, which is fucking impossible
>tfw your company thinks sass in needless complexity

Those morons.
>>
>>52594067
10/10 layout would surf every day
>>
https://warcraftranks.net
any complaints?, i did my best.
>>
>>52594123
thats exactly one link. didnt finish the design yet.
>>
>>52594185
>104% DK representation
wew lad
>>
File: 2016-01-24_134420.png (545KB, 1397x1017px) Image search: [Google]
2016-01-24_134420.png
545KB, 1397x1017px
So basically Appchan with sidebar on the left?
>>
File: 1394821356037.jpg (53KB, 500x447px) Image search: [Google]
1394821356037.jpg
53KB, 500x447px
>>52594235
>Appchan
>>
>>52594294
Just because you have shit taste anon doesn't mean others have to suffer your pukeposting.
>>
>>52594337
Appchan is fucking trash though.
4chanx with oneechan/custom css beats it any day.
>>
What are some of the worst things in website design?
I would say having a gif/video as the background especially when it clashes with the text.
>>
>>52594347
no
>>
>>52594347
I abandoned oneechan when it started breaking apart constantly a few years back and nobody gave a shit about it anymore including the maintainer.
That thing still exists?
>>
>>52594368
New maintainer I think.

Using your own CSS is the best either way, though.
>>
>>52594360
having a site that displays nothing when javascript is disabled.
>>
>>52594360
One page sites
>>
http://neuralnetworksanddeeplearning.com/chap4.html

Not mine, but I found it a really nice simple layout. Content on the left, nav on the right and 600px textwdith, really comfy
>>
>>52594360
Heavy JavaScript frameworks. Actually, any JavaScript that isn't absolutely vital for the website. That having said, JavaScript is completely unnecessary for most websites.
>>
>>52594360
You're not prepared.

https://www.sony.com/be-moved/
>>
>>52594409
Better JavaScript than websites injecting HTML/CSS with fucking Ruby.
>>
>>52594064
This isn't even satire.
>>
>>52594409
what?
How am I supposed to click on a button then that will do something for me the user?
>>
>>52594428
>https://www.sony.com/be-moved/
>We notice that you're using an older browser. You'll need a more modern internet browser to experience this site fully.
site looks and functions 800% better with no js
>>
File: 1451653222029.png (289KB, 800x800px) Image search: [Google]
1451653222029.png
289KB, 800x800px
Apps > websites
discuss
>>
>>52594428
Ugh.
>>
File: 1379069951178.gif (2MB, 357x238px) Image search: [Google]
1379069951178.gif
2MB, 357x238px
>>52594428
God, I can't tell if my internet is dying or if the entire website lags. Either way this is a fucking terrible design.
>>
>>52594446
A button for what? To see more content? We call that a link. A button to submit a form? HTML has that covered.
>>
File: 1453640687.jpg (274KB, 1529x1005px) Image search: [Google]
1453640687.jpg
274KB, 1529x1005px
http://www.bowers-wilkins.net/
http://www.monitoraudiousa.com/
http://www.wharfedale.co.uk/
>>
>>52594428
>be moved
I was moved... the fuck away from that website due to its design
>>
>>52594428
That looks great on mobile senpai
>>
>>52594428
I was not prepared
>>
>>52594428
All i get is loading and white bg nothing else
>>
>>52594461
you are telling me that clicking events on buttons and links are not javascript objects under the hub?
>>
File: 1453635973989.png (23KB, 920x850px) Image search: [Google]
1453635973989.png
23KB, 920x850px
>>52593636
>>
I like the layout of debian's website, gentoo's website, arch's website

fedoraproject.org is kind-of-okay-ish but there's very little content on the mainpage.
It basically is a huge download button
>>
>>52594548
because you got your mind warped
first few times I visited I was repulsed
its like they didnt give a shit and just put walls of text

also debian is like most retared, go navigate and find me offline installation of current debian ISO

debian is cancer that should just die, only good thing it did was giving us ubuntu
>>
>>52593760
>>52593788
>>52593779

perfect midldeground: https://chomsky.info/dissent02/

everything smaller than that is cancer

also perfect: http://suckless.org/philosophy
>>
>>52593636
where do ads go in there?
>>
File: Selection.png (68KB, 731x148px) Image search: [Google]
Selection.png
68KB, 731x148px
>>52593984
Upload limits say disk is 2TB, then what does 'Disk: 1142.07/484460.49 MB' mean?

>footer scrolling with page

Also
>The server is hosted in Australia
You probably can't do much about this but the images take fucking ages to load
>>
>>52594571
cool bait
>>
>>52594582
on the content, of course!

not including the popup ad.
>>
>>52593698
I love the last few south park episodes too
>>
>>52594571
I sort of agree, but Arch does have one of the best websites. It's textbook perfect: unique look, extremely easy to navigate, information is presented in pretty much the most optimal way, it's cross-platform/device so you can view it on anything, even a text browser in a 70s terminal.
>>
>>52594107
>low quality image as background
You either figure out how to use a HD pic without making the page need 5 seconds to load or you don't use a fucking image
>>
>>52593984
I say take away the question marks
>>
>>52594548
debian's website is fucking atrocious but not because of the layout. I went there once to find out what Desktop environment it ships with. You can't find that information without digging 4 levels of subpages.
>>
>>52594498
Obviously, you'd have to be an idiot to claim otherwise
>>
>>52594602
I agree that its good
but we should acknowledge that its not for normal users
similar like reddit or 4chan
all these sites feel to generic users plain and not that user friendly

not everyone remembers thta time of first using sites
>>
>>52593636
Good my generators default theme looks like it.

>>52593652
>>52593743

That's right, sidebars are probably the reason webdevs felt the need to introduce bloaty "responsive web" frameworks.

>>52594064
>>52593978
>>52594067
>>52594235
>>52594538
>https://www.sony.com/be-moved/
>>52594462
>>52594455
my sides
>>
>news site or news blog without a comment section

immediately intothetrash.jpg
>>
>>52594653
>comments use disqus, facebook or other trash
>>
>>52594637
Its just I am not web dev and never read about html but I always thought that html and js are unseparable somehow.
>>
>>52594653
>2016
>wanting comments
>>
>>52594444
>>52594064

slashdot
>>
>>52594571
>>52594629
aight maybe you're right
>>
>>52593953
Let's talk here
looks like a generic blogger template
bizzarre titles
unappealing header image
very outdated styles for backgrounds and etc
totally pointless 3-column layout (with most of the side columns being blank)
totally useless mission statement in the left column (put it in a hero area or on an about page... nobody's going to read that shit)
utterly uninspired use of typography (how about arial for the whole page? brilliant)
unappealing use of colour (orange and slightly less orange?)
inconsistent use of orange (denotes a link EXCEPT in the left sidebar)
shitloads of inline css
shitloads of spaghetti inline css
spaghetti html (there's like 5000 empty div elements before you even get to the header)
use of totally obsolete html attributes
pointless javascript buttons with no hover state
separate contact\about pages?
incosistent margins\padding in header
pointless top bar
using the 'artisan' tag? really?

the best thing about this website is that it's only 700kb, which means it didn't waste too much of my time loading in... but i could have done the same thing in half the size and a fraction of the http requests (of which it makes 75)

please take your shitty blogger drag-and-drop website elsewhere, you've not impressed anyone
>>
>>52594064
>having content at all
>not just filling that space with thinly-veiled advertisements
>>
>>52594664
No. Javascript can be a strong addition to html but it's often misused. HTML can function on it's own but at the cost of more complex functionalities.
>>
>>52594587
>Upload limits say disk is 2TB, then what does 'Disk: 1142.07/484460.49 MB' mean?
It's disk-used-by-wakaba/current-free-space
The DB only takes up 1GB, and the DB isn't the only thing being stored on that drive.

>>footer scrolling with page
I don't know how to fix that.

>>52594615
What question marks?
>>
>>52594664
links & form submittal via buttons are basically the only interactive elements you can create with raw HTML
>>
http://muphlon.com/pichost/

do you think i could use bigger spaces between the lines?
>>
>>52594704
thats probably what confused me. I thought HTML is unable to make interactive stuff like clicking on buttons and sending forms...
>>
File: edit.png (22KB, 920x850px) Image search: [Google]
edit.png
22KB, 920x850px
>>52593636
>>
>>52594067
kek
>>
>>52594726
>hiding the navigation behind a hamburger icon

This trend needs to die.
>>
>>52594677
Also the background is aliased and it moves when you scroll.
>>
>>52594697
>footer scrolling with page
>I don't know how to fix that.

If you want to keep it fixed to the bottom, at all times, I would add/change these rules/properties


body{
padding-bottom: 55px;
}

#disclaimer {
background: white;
height: 55px;
//get rid of z-index property
}

#waifu {
z-index:1;
}

>>
File: 1453635973989.png (27KB, 920x850px) Image search: [Google]
1453635973989.png
27KB, 920x850px
>>
>>52594805
You'd be surprised how many people actually sign up for these.

t. some shitbag who makes lead overlays for a living.
>>
>>52594805
AAAAAAAAAAAAAAAAAARGH
is there a ublock blocklist for this shit? drives me up the fucking wall
>>
>>52594805
Don't forget the autoplaying video in the background though you only requested a news article.
>>
>>52594805
>that fucking tiny "close x"

Misclick and you're subscribed, goy.
>>
What's the most ad infested website?
>>
>>52594788
and then maybe this to make it friendlier on mobile/low height devices/windows:

@media only screen and (max-height: 500px){
#disclaimer, #waifu{
position: absolute;
}

body {
position: relative;
margin-bottom: 0px;
}

}
>>
>>52594871
More like: What website isn't ad infested?
>>
File: best.png (215KB, 1160x802px) Image search: [Google]
best.png
215KB, 1160x802px
This should be the industry standard.
>>
>>52594873
oh, and I would change body to use padding instead of margins, which would remove the need for the "margin-bottom: 0" in that media query
>>
>>52594930
doing this would also correct the positioning of the waifu once it goes in to absolute positioning mode
>>
>>52594805
>putting the close button in the top right where it's expected
try harder, put it bottom left, and it has to be labeled something obscure like 'unaccept'.
>>
>>52594235
Can I have source of that image on the left?
>>
File: fa7b8gu9.png (47KB, 920x850px) Image search: [Google]
fa7b8gu9.png
47KB, 920x850px
>>52594805
fixed
>>
>>52594444
Quads of truth if applied to shit websites.
>>
>>52594428
>1600 requests
>80 mb
>80 seconds on a 50 mb connection
>scrolljacking
>browser crashes when
>ubuntu crashes
computer was raep
>>
>>52594892
kek
>>
File: 1453635973989.png (26KB, 920x850px) Image search: [Google]
1453635973989.png
26KB, 920x850px
>>
>>52595114
>why is every fucking website has this popup?
New EU regulation or something
>>
>>52595114
>Why would you even care?

Yuropoors.
>>
File: BETTER.png (11KB, 920x850px) Image search: [Google]
BETTER.png
11KB, 920x850px
The perfect website.
>>
>>52595133
>New
It's at least 2-3 years old by now.
>>
>>52595114
blame EU lawmakers who don't have any fucking idea what they're doing.

they wanted to improve privacy for users. which is an admirable goal. unfortunately, instead of placing legal restrictions on how cookies can be used, or forcing websites to abide by browser preferences such as do-not-track, they placed the onus upon website owners to notify their users that cookies were being used, and threatened to fine website owners large sums of money for not doing so
>>
File: 1453501544414.jpg (338KB, 694x642px) Image search: [Google]
1453501544414.jpg
338KB, 694x642px
>>52595150
>extra memes
>>
>>52594706
>muph
Yes, you should.
>>
>>52595150
http://dankmaymays.com
Like this?
>>
>>52595150
>swap sidebar and content
now you got reddit

>squeeze them
now you have 9gag.
>>
>>52594715
Generally that's true. Except for those exac two examples.
>>
>>52594805
*Move cursor towards tab list*
>WAIT! Don't leave just yet! See these interesting articles!
>8 year old brutally torn to shreds by tractor - our reporters got the best pictures!
>Bright-White teeth for everyone!
>How this McDonald's employee figured out how to make billions! Rich people hate him!
>Do you want an Asian Girlfriend?
>Play now, the newest MMORTS from Asia!

Time to learn the keyboard shortcuts.
>>
File: 1381830878009.jpg (13KB, 250x250px) Image search: [Google]
1381830878009.jpg
13KB, 250x250px
>people unironically defending and advocating for the font-size:72pt; parallax scrolling JS-ridden cancer
>>
>>52594829
I usually block them manually with ublock's "block element" picker
>>
>>52595181
i remember that thread
>>
>>52594946
Shamu Meruruusa hijiri front
>>
>>52594428
It just shows "Loading..." with white background.
>>
>>52594873
>>52594930
>>52594938
>Mobile
Who gives a shit.
>>
I put the nav bar on the right side on my website. To ensure the drop down menu won't go over any ads breaking one of Google's silly policies.
>>
File: Screenshot_20160124_130020.png (62KB, 1600x307px) Image search: [Google]
Screenshot_20160124_130020.png
62KB, 1600x307px
>>52594428
>57.6MB
>1.4 min
>1475 warnings
>Attempts to load everything from http and then switches to https when it fails
>Scrolling is slow as fuck
Oh, god.
>>
>>52594428
looks "nice" - it would impress the people of the past

>it's horrible to navigate
>you need some fucking powerful computer to run this as SONY intended
>too fucking long (Apple did their Mac Pro website presentation better!)


sorry sony..I like your phones and your cameras but not your sites.
>>
>>52596743
>>you need some fucking powerful computer to run this as SONY intended

to give some context - it crashed chrome on my 2015 macbook pro
>>
>>52593867
B E S T
E
S
T
>>
>>52594660
srs qstn
what should i use then?
>inb4 make my own
>>
>>52595261
are you me?

>>52594886
don't you use ads blocker?
>>
>it's a link your shady website for fishing ip adresses and sending drive-by downloads: the thread
>>
>>52593762

>panels for no reason

Its almost like one of those kindergarten playskool interfaces.
>>
File: working website.png (34KB, 1360x661px) Image search: [Google]
working website.png
34KB, 1360x661px
this would work well
>>
>>52597289
>sidebar to the right
What are you? Arabic?
>>
File: Képkivágás.png (179KB, 1026x620px) Image search: [Google]
Képkivágás.png
179KB, 1026x620px
>>52597289
literally reddit
>>
>>52594130
>Not having the Sidebar scrolling with the content
>>
>>52597380
Your Windows font rendering makes me want to kill myself
>>
File: Desktop HD 4.png (1MB, 1550x1400px) Image search: [Google]
Desktop HD 4.png
1MB, 1550x1400px
My attempt at a clickbait-y movie news design.
>>
>>52593871
It's perfect.
>>
>mobile optimized site
>it's actually worse than the desktop site on mobile
>>
>>52593636
http://motherfuckingwebsite.com/
>>
>>52594428
>https://www.sony.com/be-moved/
It is still fucking loading
>>
>>52593636
Define irony...

Basement dwelling retard telling us that if a web site doesn't look like X it's cancer, on a site that doesn't look like X...
>>
>>52598088
4chan does look like that though.
>>
>>52598088
Define optional
>>
>>52593636
>sidebar
just stop already
>>
>>52594428
>https://www.sony.com/be-moved/

Reminds me of Taco Bell's menu..

https://tacobell.com/food/

Cool idea, but still takes forever to load/look shitty.
>>
>>52593636
>navigation on top
great idea WHEN EVERYTHING IS FUCKING WIDE SCREEN
>>
>>52593636
What, you're learning HTML and want to be a fag?
>>
>>52598912
>thinks websites are styled using html
>>
>>52594706
Make it "send email to" and make required fields starred instead of that optional stuff.
Since I'm on mobile I couldn't bother looking at the code though.
>>
>>52599050
>thinks websites are styled using anything BUT html
>>
>Click on an ad for the first time in years advertising sleek consumerist tech gadgets (using a browser for the first time on another machine)
>page loads and immediately pops up an unclosable dialog to create an account or login with facebook
>>
>>52599050
>what is inline css
Thread posts: 179
Thread images: 29


[Boards: 3 / a / aco / adv / an / asp / b / bant / biz / c / can / cgl / ck / cm / co / cock / d / diy / e / fa / fap / fit / fitlit / g / gd / gif / h / hc / his / hm / hr / i / ic / int / jp / k / lgbt / lit / m / mlp / mlpol / mo / mtv / mu / n / news / o / out / outsoc / p / po / pol / qa / qst / r / r9k / s / s4s / sci / soc / sp / spa / t / tg / toy / trash / trv / tv / u / v / vg / vint / vip / vp / vr / w / wg / wsg / wsr / x / y] [Search | Top | Home]

I'm aware that Imgur.com will stop allowing adult images since 15th of May. I'm taking actions to backup as much data as possible.
Read more on this topic here - https://archived.moe/talk/thread/1694/


If you need a post removed click on it's [Report] button and follow the instruction.
DMCA Content Takedown via dmca.com
All images are hosted on imgur.com.
If you like this website please support us by donating with Bitcoins at 16mKtbZiwW52BLkibtCr8jUg2KVUMTxVQ5
All trademarks and copyrights on this page are owned by their respective parties.
Images uploaded are the responsibility of the Poster. Comments are owned by the Poster.
This is a 4chan archive - all of the content originated from that site.
This means that RandomArchive shows their content, archived.
If you need information for a Poster - contact them.