Går det att få min websida att kännas ännu mera 8-bit?

Permalänk
Medlem

Går det att få min websida att kännas ännu mera 8-bit?

Hej!

Jag driver en websida där jag laddar upp min cracktro och 8-bitars-musik. Målet med sidan är att den skall se så 8-bitars eller retro ut det bara går utan att sabba läsbarheten. På andra ställen typ linkrefferal har jag fått kritik som att "Sidan ser inte särskillt modern ut", men det är ju inte meningen heller, den SKA se ut som ett NES-spel, fast på ett sätt som gör att det inte blir obekvämt att vistas på sidan.

Min fråga är om ni har några tips på om och i så fall hur designen kan förbättras, eller om ni tycker att den är bra som den är?

Länk: http://ozzed.net

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Rekordmedlem

Fonten känns modern och lite väl strikt och seriös, du kanske kan hitta nått annat, har dock inga direkta tips, men många gamla sidor hade mer snirkliga typsnitt och ofta "hemska" färger. Dessutom var det mycket frames tidigare, varav en hel del syntes tydligt, tex genom olika bakgrunder, man ska få det att se ut lite som excel.

Visa signatur

Ryzen 5 2400G, Asus ROG STRIX B350-F Gaming, 500GB Samsung 970EVO NVMe M.2 och en väldig massa masslagring. Seasonic Focus+ Gold 650W, Antec P 180 med Schyte o Sharkoon fläktar via en t-balancer, Tittar på en Acer ET430Kbmiippx 43" 4K
Främre ljudkanalerna återges via Behringer DCX2496, högtalare Truth B3031A, Truth B2092A Har också Oscilloskop, mätmikrofon och en Colorimeter.

Permalänk
Medlem

hur gör man såndär muzik?

Visa signatur

Chassi: Fractal Design Meshify-C Moderkort: Asus P8Z77V-Pro Hårddisk: 128GB SSD+1TB SSD CPU: i5 3570K 3.4GHz RAM: Corsair 8GB vengeance CPU kylare: Cooler Master Hyper 212+ GPU: ASUS GTX 680 2GB PSU: Corsair TX650W
P280 Crossfire Citera för svar

Permalänk
Medlem
Skrivet av juckeyy:

hur gör man såndär muzik?

Jag använder Famitracker och Milkytracker. Grunderna för tracking generellt finns det massor av tutorials på, men jag har tagit upp hur man gör för att få till det rätta "8-bit-soundet" på min websida under "make your own"-länken.

mrqaffe - Jag eftersträvar inte att få sidan att se ut som om det är en gammal websida, utan mera liksom att den skall se ut som ett nintendospel.

Skall kolla på andra fonter dock. Tror att jag målat in mig lite i ett hörn där eftersom jag har Verdana och den har inte samma bredd som andra fonter.

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Medlem

Jag har aldrig haft någon 8-bitars konsol men jag tycker allt på hemsidan ser väldigt högupplöst ut, bilder såväl som teckensnitt.

Permalänk

prova en font såsom fixedsys, samt utgå från lägre upplösningar på grafiken och förstora sedan upp ett jämnt tal, så det ser mer pixelated ut

Visa signatur

Xeon E5450@3.2ghz
9800GTX+

Permalänk
Medlem
Skrivet av GizmoTheGreen:

prova en font såsom fixedsys, samt utgå från lägre upplösningar på grafiken och förstora sedan upp ett jämnt tal, så det ser mer pixelated ut

Det kanske man skulle kunna göra.. Fixedsys är väl den gamla hederliga dos-fonten? Undrar bara hur det blir med avstånd och så på sidan, alltså om den kommer knuffa omkring saker i och med att verdana inte är monospaced men fixedsys är det.

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Inaktiv

Tycker inte det ser ut som ett NES-spel utan istället ett hemsida från 1990-talet. Skulle jag kommit in på en sådan sida skulle jag nog med största säkerhet lämna direkt. Kolla på modernare sidor (sök gärna efter kreativa sidor etc.) och se hur de har gjort, sen utgår du ifrån det och försöker återskapa ett NES-spel.

Permalänk
Medlem
Skrivet av anon150287:

Tycker inte det ser ut som ett NES-spel utan istället ett hemsida från 1990-talet. Skulle jag kommit in på en sådan sida skulle jag nog med största säkerhet lämna direkt. Kolla på modernare sidor (sök gärna efter kreativa sidor etc.) och se hur de har gjort, sen utgår du ifrån det och försöker återskapa ett NES-spel.

Harsh Ända skillnaden mot "moderna" websidor är väl att jag har menyn på sidan istället för i toppen, vilket är ett högst medvetet val då det känns mera som en meny till ett spel.

Jag skall göra en testsida med fixedsys-stylesheet och så får ni se om ni tycker det blir bättre

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Medlem
Skrivet av Ozzed:

Harsh Ända skillnaden mot "moderna" websidor är väl att jag har menyn på sidan istället för i toppen, vilket är ett högst medvetet val då det känns mera som en meny till ett spel.

Jag skall göra en testsida med fixedsys-stylesheet och så får ni se om ni tycker det blir bättre

Det har inte lika mycket med om vart någonstans menyn sitter, men mer om hur den ser ut. En bild som backgrund, men menyn är en ända färg i stark kontrast med en väldigt.. jag vet inte ens hur jag ska beskriva backgrunden bakom din logga.. Det ser ut som någon tuggat kritor och sedan spottat ut det och sedan satt ett klistermärke över det. :/ Jag säger inte det för att vara jobbig, men färgerna skär sig och inget av det här känns planerat. Det här är typisk 90-tals webside design, inte typisk 8-bit.

Mitt tips till dig är att googla gamla nes spel och kolla lite på hur det ser ut. Välj gärna ett tema från ett spel då spelens färger och känsla kan vara väldigt olika. Vill du att det ska kännas mer 8-bit, så måste du ju också ha 8-bit grafik.

Lite inspiration: http://www.andysowards.com/blog/nerd-fun/20-8-bit-inspiration...

EDIT: Något annat du kan göra för att få inspiration är att googla och titta på pixelart.

Permalänk
Medlem

Så fick jag en idé till.. Borde naturligtvis göra om sitens färgschema så att den följer NES-paletten så gott det går.

Angående elakheter och dylikt så är det lugnt. Om det var så att jag inte ville ha kritik hade jag inte frågat, eller lagt upp min musik för den delen Sålänge man har något konstruktivt att komma med så är det uj bara bra.

En annan sak som jag skulle kunna testa är att köra Marioklossar även på menyn och som bakgrundsbild för att få en mer enhetlig design. Kan nog vara så att det är en aning skarpa kontraster. Jag har inte tänkt på det då det har varit betydligt "värre". Tack för tipset

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Medlem

Låter lite grymt men ärligt talat hade jag inte stannat en sekund på sidan då den ser så gammal ut!

Permalänk
Sötast
Permalänk
Medlem

Snyggt! Tror dock det måste vara en font som finns i de flesta system från början, annars laddan någon annan font.

kobb3 - Menar du att sidan ser gammal ut oavsett, eller är du också av åsikten att du aldrig skulle få för dig att spela NES då det "är en så gammal konsoll". Min sida kommer nog aldrig att se "ny och phresh" ut då man isåfall skulle tappa typ hela grejen.

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Inaktiv

Du kan använda @font-face för att få användaren att ladda ner fonten och använda den.

Permalänk
Medlem
Skrivet av anon150287:

Du kan använda @font-face för att få användaren att ladda ner fonten och använda den.

Coolt! Är det godkänt enligt CSS standarder och så vidare och hur ser i så fall "syntax" ut?

Som det är nu har jag det såhär: "font-family:Verdana,"lucida grande",sans-serif; "

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Inaktiv
Skrivet av Ozzed:

Coolt! Är det godkänt enligt CSS standarder och så vidare och hur ser i så fall "syntax" ut?

Som det är nu har jag det såhär: "font-family:Verdana,"lucida grande",sans-serif; "

Inte helt säker på att det är CSS standard, men det kvittar egentligen. Se bara till att du har en fallback.
Googla lite på det, finns mycket information om det.

Permalänk
Medlem

Verkar som att det kommer till CSS 3. Trevligt. Tack för hjälpen

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Medlem

Du kan titta på Google Fonts API.

Jag måste hålla med tidigare personer om att sidan kan göras mycket bättre men ändå behålla ditt sk. "konsoll/NES-utseende".
Sidan måste inte se gammal ut för att se ut som det gjorde på gamla datorer och spelkonsoller.

Permalänk
Medlem

Tycker ni det är färgschemat det är fel på eller är det layouten i stort?

Sidan är XHTML 1.1-validerad och föjler i stort WCAG 1.0 och går utmärkt att läsa i lynx. Sidan har även en pagerank på 4 och google webmaster tools har inte ett enda klagomål vad gäller koden.

Oavsett vad jag gör för layoutförändringar så vill jag att ovanstående fortfarande skall gälla. Alltså är jag inte beredd att göra något som skulle offra kodkvalitet.

Hur som helst uppskattar jag alla tips.

Vad tror ni om Grå bakgrundsbild med något slags non-intrusive mönster istället för regnbågsfärgerna bakom loggan och liknande grå mönster vid menyn, samt Fixedsys som font. Skulle det göra sidan OK eller tycker ni det behövs mer radikala förändringar?

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Medlem

Nu har jag uppdaterat designen på sidan. Förbättringarna är:

Ny mjukare design, mindre skrikiga färger.
Ökad läsbarhet om man har Widescreen,
Lättare att navigera i menyn tack vare uppdaterad CSS.

Hoppas ni gillar den nya designen bättre

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Medlem
Skrivet av Ozzed:

Tycker ni det är färgschemat det är fel på eller är det layouten i stort?

Sidan är XHTML 1.1-validerad och föjler i stort WCAG 1.0 och går utmärkt att läsa i lynx. Sidan har även en pagerank på 4 och google webmaster tools har inte ett enda klagomål vad gäller koden.

Om den är valid XHTML 1.1 fungerar den inte i Internet Explorer.

Visa signatur

Kom-pa-TI-bilitet

Permalänk
Medlem
Skrivet av Teknocide:

Om den är valid XHTML 1.1 fungerar den inte i Internet Explorer.

Vad jag har hörst skall det funka från 8.0 och uppåt.

Trident skall såvitt jag vet ha ett native- och ett quirks-mode som alla andra motorer.

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Medlem
Skrivet av Ozzed:

Vad jag har hörst skall det funka från 8.0 och uppåt.

Trident skall såvitt jag vet ha ett native- och ett quirks-mode som alla andra motorer.

Internet Explorer stöder inte XHTML alls. Om du kollar på page info ser du att din sida serveras som text/html istället. Byt till 4.01 eller HTML5 och bespara dig onödigt arbete

edit: IE9 har tydligen stöd för XHTML läste jag nu.

Visa signatur

Kom-pa-TI-bilitet

Permalänk
Medlem
Skrivet av Teknocide:

Internet Explorer stöder inte XHTML alls. Om du kollar på page info ser du att din sida serveras som text/html istället. Byt till 4.01 eller HTML5 och bespara dig onödigt arbete

edit: IE9 har tydligen stöd för XHTML läste jag nu.

XHTML är väl egentligen på väg ut också, för att ersättas av det betydligt mer kapabla (och i princip lika väldefinierade, syntaxmässigt, eftersom det har tydliga regler) HTML5.

Permalänk
Medlem

Varför nedgradera. HTML4 känns lekskola i jämförelse. Dessutom vet man att alla browsers värda namnet renderar sidan likadant om man validerar. Det känns så jävla illa när man är inne på W3C's valideringsverktyg och en sida har hundratals fel. HTML5 ser jag inte som en efterträdare till XHTML1.1 då den är mindre strikt och tilllåter slarv från webdesigners. Om jag nu byter standard så småningom så får det bli till någon XML-baserad sådan. Lämpligtvis då någon som använder schemas istället för doctype.

Jämför http://validator.w3.org/check?uri=sweclockers.com&charset=%28detect+automatically%29&doctype=Inline&group=0

och http://validator.w3.org/check?uri=http%3A%2F%2Fozzed.net&char...

En annan fördel med att följa standarder är att man slipper massa fulhack för att det skall funka i olika browsers...

Aja... Ursäkta sidospåret. Vad tycker ni om nya designen?

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Medlem
Skrivet av Ozzed:

Varför nedgradera. HTML4 känns lekskola i jämförelse. Dessutom vet man att alla browsers värda namnet renderar sidan likadant om man validerar. Det känns så jävla illa när man är inne på W3C's valideringsverktyg och en sida har hundratals fel. HTML5 ser jag inte som en efterträdare till XHTML1.1 då den är mindre strikt och tilllåter slarv från webdesigners. Om jag nu byter standard så småningom så får det bli till någon XML-baserad sådan. Lämpligtvis då någon som använder schemas istället för doctype.

Jämför http://validator.w3.org/check?uri=sweclockers.com&charset=%28detect+automatically%29&doctype=Inline&group=0

och http://validator.w3.org/check?uri=http%3A%2F%2Fozzed.net&char...

En annan fördel med att följa standarder är att man slipper massa fulhack för att det skall funka i olika browsers...

Aja... Ursäkta sidospåret. Vad tycker ni om nya designen?

Ursäktar också för sidospåret men om du vill använda XML så är det XML du ska använda. Då får du schemavalidering och kan transformera innehållet till HTML med XSL. XHTML är en död häst eftersom Microsoft resolut vägrat acceptera standarden sen första början; du får sämre cross-browser kompatibilitet än med HTML 4.01 (strict) som är den mest väletablerade och fungerande standarden i dagsläget. Så länge du sätter en webbläsare i standards-mode och levererar innehållet som det faktiskt är tänkt så gör du så mycket du kan, och idag levererar din server XHTML som vanlig HTML.

Det är enkelt att kolla: öppna firefox, högerklicka och välj page info. Passa på att kolla källkoden så lägger du märke till att alla slashar i slutet av taggar är rödmarkerade. Detta beror på att Firefox förväntar sig vanlig text/html men får något annat.

Får förresten "Sorry! This document can not be checked." när jag klickar på din länk ovan.

Visa signatur

Kom-pa-TI-bilitet

Permalänk

Kolla upp lite minecraft-sidor och ta insperation. De är ofta utav 8-bit tema.

Visa signatur
Permalänk
Medlem
Skrivet av Teknocide:

Ursäktar också för sidospåret men om du vill använda XML så är det XML du ska använda. Då får du schemavalidering och kan transformera innehållet till HTML med XSL. XHTML är en död häst eftersom Microsoft resolut vägrat acceptera standarden sen första början; du får sämre cross-browser kompatibilitet än med HTML 4.01 (strict) som är den mest väletablerade och fungerande standarden i dagsläget. Så länge du sätter en webbläsare i standards-mode och levererar innehållet som det faktiskt är tänkt så gör du så mycket du kan, och idag levererar din server XHTML som vanlig HTML.

Det är enkelt att kolla: öppna firefox, högerklicka och välj page info. Passa på att kolla källkoden så lägger du märke till att alla slashar i slutet av taggar är rödmarkerade. Detta beror på att Firefox förväntar sig vanlig text/html men får något annat.

Får förresten "Sorry! This document can not be checked." när jag klickar på din länk ovan.

Dock så står det ju att den renderar i standards compliance mode, vilket borde betyda att den följer standarden till 100%. Men du har rätt... får fixa rätt content type... Internet explorer stöder xhtml1.1, med xml som MIMETYPE enl wikipedia: "supports XHTML in Internet Explorer 9 (Trident version 5.0). Prior versions can render XHTML documents authored with HTML compatibility principles and served with a text/html MIME-type."

Visa signatur

ozzed.net Min egenkomponerade 8-bit musik. Gillar du musiken från gamla klassiska NES eller Gameboy och liknande är det värt ett besök. :) Jag finns också på Spotify, Bandcamp, Jamendo, Youtube, och du kan även följa mig på Twitter och Facebook.
Vet du att du har fel? Signalera detta tydligt med Argumentationsfel och gärna Whataboutism.

Permalänk
Medlem
Skrivet av Ozzed:

Varför nedgradera. HTML4 känns lekskola i jämförelse.

Jag hoppas att du inser att vad du skickar till webbläsarna just nu i princip är HTML4 (eftersom du har fel mime-typ och ändå inte använder någon XHTML-specifik funktionalitet.

Skrivet av Ozzed:

Dessutom vet man att alla browsers värda namnet renderar sidan likadant om man validerar. Det känns så jävla illa när man är inne på W3C's valideringsverktyg och en sida har hundratals fel.

För det första så är detta irrelevant, HTML4 (och HTML5) kan valideras utan problem. För det andra så är validering ett verktyg, inte en statussymbol eller någon magisk korrekthetsstämpel.

Skrivet av Ozzed:

HTML5 ser jag inte som en efterträdare till XHTML1.1 då den är mindre strikt och tilllåter slarv från webdesigners. Om jag nu byter standard så småningom så får det bli till någon XML-baserad sådan. Lämpligtvis då någon som använder schemas istället för doctype.

Att den tillåter slarv från designers är inget problem; det är ju du som ska hålla koll på det. HTML5 har lika väldefinierad struktur som XHTML, lika väldefinierad parsningsmetod som XML, men mycket bättre felhantering för slutanvändaren (dvs. besökaren) eftersom denne inte får ett felmeddelande spottat i ansiktet utan ett försök till tolkning. I och med att även denna sista degradering är tydligt definierad i HTML5-specen så kommer tolkningsförsöket se likadant i alla konforma webbläsare.

HTML5 har för övrigt även en XML-serialisering som det heter, så du kan få dina fina strikta regler om du känner att du behöver dem. Personligen anser jag att XML har sin plats i maskinell kommunikation (Atom, XMPP) medans HTML gör ett bättre jobb när informationen ska presenteras i en webbläsare.

Ytterligare läsning:
http://blogs.sitepoint.com/rip-xhtml-2/
http://wiki.whatwg.org/wiki/HTML%5Fvs.%5FXHTML
http://mathiasbynens.be/notes/xhtml5