Ajutor pentru un newbie cu 0 cunoștințe de web-design

Salut . De două zile ma chinui să chinui să-mi dau seama care parte din următorul cod trebuie să-l scot astfel încât landpage-ul să arate bine, fără partea asta gri.  Am 0 cunoștințe de webdesign. Pagina e facută în elementor (plugin wp). Atașez o poza mai jos. Sper să vă dați seama care este mărețul obiectiv pe care încerc să-l ating...  
http://imgur.com/a/6II4K

Până acum, am reușit ,,performanța" de a scoate acea parte gri dar mi-a rămas o chestie alba, precum puteți vedea aici https://goo.gl/yPZhOK
Aici e fisierul index. Ce trebuie sa scot de aici astfel încât această pagină să arate OK, fără partea aceea GRI?
https://ufile.io/wxrql

html { margin-top: 0px !important; }
#content { padding-top: 0 !important; }

Pune asta in css(style.css, final de fisier) si ar cam trebui sa rezolve acel gol de sus. Vezi ca acel html{...} il ai inserat si in header, ar cam trebui sters de acolo ca sa scapi de o parte din spatiu, asta e partea care trebuie sa dispara:

<style type="text/css" media="screen">
html { margin-top: 32px !important; }
* html body { margin-top: 32px !important; }
@media screen and ( max-width: 782px ) {
html { margin-top: 46px !important; }
* html body { margin-top: 46px !important; }
}
</style>

Eventual poti testa cu urmatorul cod pus in css(style.css, final de fisier) si fara sa stergi partea de sus:

html.js {margin-top:0 !important;}
#content { padding-top: 0 !important; }

Edited by tigerheart, 30 April 2017 - 23:37.

Mersi pentru raspunsul prompt . Încerc sa fac ce mi-ai zis. Deocamdata am scos asta și a ramas încă putin alb (putin de tot) revin cu un mesaj. Multumesc!

Quote

LE: Am reușit! Mulțumesc, Tigerheart!
Rezultat final: https://goo.gl/yPZhOK

Edited by spreeeeee, 01 May 2017 - 00:16.

LIVREAZA O interventie psihologica e o exprimare cam ciudata.

Mersi pentru că m-ai atenționat. Nu e varianta finală. Orice sugestii și sfaturi privind designul, funcționalitatea sau chiar exprimări ciudate, sunt binevenite

Diacriticile arata urat de tot la mine

Edited by Alucard, 02 May 2017 - 09:25.

Nu am idee cum pot sa repar asta. Am observat ca pe IE se vede asa. Folosesti mozilla sau IE ?

Poti incerca sa folosesti alt font. Acum e setat Roboto si apoi sans-serif ca alternativa. Nu toate fonturile suporta diacriticele intalnite in limba romana.

Edited by tigerheart, 02 May 2017 - 11:20.

Multumesc Am sa schimb fontul. Exista vreo metoda prin care pot face ca pe Chrome să rămână Roboto iar pe alte Browsere să se schimbe in Arial?
Am observat ca se incarca foarte greu landing page-ul. Incerc sa rezolv asta acum.

Edited by spreeeeee, 02 May 2017 - 11:56.

mozilla - nu ai schimbat peste tot
ss luat la 15:12

spreeeeee, on 02 mai 2017 - 11:47, said:

Baga ceva plugin pentru cache + minify css&js, eu recomand WP Fastest Cache.

Vezi ca ai si o legatura catre un fisier care nu exista(ultimul):
[ https://s29.postimg.org/hzukgqulz/screenshot_118.png - Pentru incarcare in pagina (embed) Click aici ]

Am corectat tot acum. Am pus Arial peste tot dar nu-mi place deloc cum arată. Știți vreun font care seamănă cu Roboto și care permite diacritice?
Am folosit GTmetrix pentru a vedea cât de rapid se încarcă landing page-ul. Prima recomandare a fost ,,Defer parsing of Javascript". Am adăugat următorul cod înainte de </body>

<script defer="defer" type="text/javascript">
window.onload=function(){
	 var mycode;
	 mycode=document.createElement("script");
	 mycode.type="text/javascript";
	 mycode.src="http://www.example.com/path/yourjavascriptfile.js";
	 document.getElementsByTagName("head")[0].appendChild(mycode);

E ok?
A doua recomandare ,,High Priority" este ,,Minimize redirects"  dar nu știu exact ce trebuie să fac aici.

@Tigerheart: Nu știu dacă face aceeași treabă însă eu am instalat ,,Remove Query Strings From Static Resources" (plugin) - Removes query strings from static resources like CSS & JS files   + un al doilea plugin ,,WP Super Cache'"

Edited by spreeeeee, 02 May 2017 - 14:44.

Uniformizeaza tot, inca mai ai "scapari"
Cuvantul "Echipa" a fost scris intentionat asa?
Butonul ala de urmarire pe facebook uneori apare albastru alteori gri ... Ai putea sa faci un buton la fel ca celealte doua din footer ca sa apara simetric.
La formularul de inscriere la <Când ați fost diagnosticat/ă? Dacă este posibil, introduceți o dată cât mai acurată.> - foloseste altceva in loc de "acurata"
iar campul in care se introduce sa fie doar numeric, nu alfanumeric
<Dacă da, ce fel de tratament urmați?> ai a treia optiune Other .... ca nuca in perete.
La evaluarea starii ar trebui un buton "Back" (in pagina) la intrebarea anterioara pentru a modifica/revizui raspunsul.
Am mers pana la capatul inregistrarii .... Butoanele din dreptul detaliilor care trebuiesc introduse par prost decupate, se vad pixelat ...
Sper ca te-am ajutat tema iar mi se pare un pic nepotrivita la culoarea fonturilor.

Edited by Alucard, 03 May 2017 - 12:46.

spreeeeee, on 02 mai 2017 - 14:39, said:

Query strings sunt astea: /wp-content/theme/somefile.css?ver=4.7.4
Asta o poti face simplu cu un cod in functions.php:

function _remove_script_version( $src ){
$parts = explode( '?ver', $src );
return $parts[0];
}
add_filter( 'script_loader_src', '_remove_script_version', 15, 1 );
add_filter( 'style_loader_src', '_remove_script_version', 15, 1 );

Codul ala cu DEFER nu te ajuta, mai ales cum l-ai pus tu.
Cu WP Fastest Cache pot impreuna css-urile si js-urile si astfel nu se vor mai deschide fiecare pe rand... Oricum, la partea asta se pot face multe.

@Alucard Multumesc ca ai mers pana la capat cu inregistrarea. M-ai atentionat cu privire la niste probleme care au scapat neobservate de mine. Am sa modific tot. Mersi, chiar m-ai ajutat mult!
@ tigerheart: In cazul asta am sa instalez WP Fastest Cache. Am sa modific si functions.php. Legat de codul ala inutil cu DEFER + multe alte coduri inutile introduse in landing page, intr-o buna zi am sa stiu sa fac diferenta intre coduri utile/coduri inutile dar si cum sa le introduc. Cand am inceput sa lucrez pentru prima oara in wordpress, acum 2 luni, mi-am spus ca va fi usor, deoarece nu trebuie sa scriu niciun cod. Se pare ca ma lovesc de tot felul de probleme neprevazute .
Am sa incep cu W3 Schools.

@Alucard
Am ținut cont de sugestiile tale și am modificat aproape tot ce mi-ai spus. Nu mai sunt probleme cu butonul de FB, adică mie-mi pare ok acum. Cuvântul ,,Echipa" , într-adevăr, era urât . Am pus un simplu Arial.
Din păcate nu am reușit să modific unele lucruri, precum:

Quote

Pentru procesul de înregistrare, folosesc un plugin ,,Opinion Stage". L-am instalat pe asta deoarece mi-a plăcut cum arată, estetic vorbind și pentru că-mi arată IP-ul persoanelor care completează chestionarele (treaba cu ip-urile mă ajuta deoarece atunci când un user se înregistrează, trebuie să acceseze 3 pagini diferite care culmea, se deschid automat in ,,new page", (Mă forțează pluginul! Pentru a se deschide normal, trebuie plătit ). Mă limitează acest plugin free la cel mult 25 de întrebări/pagină, din cauza asta procesul de înregistrare se face în 3 pași (trebuie deschise 3 pagini noi). Din păcate, nu mă lasă să editez mare lucru dacă folosesc un cont ,,free". Din cauza asta apare a treia opțiune ,,Other" și nu există buton de back. Nu îmi dă voie pluginul să adaug așa ceva, nici nu am opțiunea măcar.
Crezi ca ar trebui sa folosesc un plugin mai ,,static" /neatrăgător dar functional? Pentru acel ,,Other" care e ca nuca-n perete ?

Quote

Aici nu am inteles exact la care butoane te referi dar dacă acestea se află la procesul de înregistrare, mai mult ca sigur e vina pluginului care nu mi-a dat voie sa fac altceva...

Erau niste observatii neutre/obiective, un fel de compiler de estetica
Tu hotarasti ce se preteaza mai bine pe caz ... Dar ... Era vitezei si clic clic target - intelegi ce vreau sa spun. In locul tau as fi ales sa dau voie userului sa isi creeze intai cont (foarte repede), si apoi din cont sa isi completeze evaluarea. Poate sunt eu mai grabit, dar punandu-ma un pic in pielea pacientilor si la moralul lor (care e de cele mai multe ori low, si foarte rar mai gasesti unul optimist sau resemnat) nu prea imi vine sa completez atatea chestii personale inainte ... Multe intrebari, multe raspunsuri ...
Gandeste un pic yahoo sau google. Cat de usor faci un cont, si pe urma personalizezi.
Pagina de index mi se pare luuuuunga, mult scroll ... Ti-am zis ca am ceva cu tema, te-am menajat si ti-am zis de fonturi.
Iarasi, in locul tau as fi preferat o tema simpla cu un header cu slide-uri gen libertatea (zic gen, nu exact ca acolo).
Si eu iti multumesc ca ai avut timp sa citesti ce ti-am scris si ca m-ai apreciat pentru feedback... Sunt doar sugestii, tu faci cum crezi ca e mai bine. Pare de amploare proiectul dar daca doar tu esti in spatele webdesign, seo, functionalitate, promovare o sa ai multa bataie de cap.

le - am mai gasit una
pe mozilla se vede asa ... pe chrome/mobil e ok

Edited by Alucard, 04 May 2017 - 08:51.

Oricât mi-as dori sa fac procesul de inregistrare mai rapid, nu pot deoarece sunt foarte multe condiții de participare care trebuie verificate înainte. Mai mult ca sigur vor fi persoane care vor renunta din acest motiv, însă fără aceste date colectate si analizate nu am cum să-mi dau seama dacă e eficient sau nu acest program. Am sa țin cont de sugestiile tale cu privire la dimensiunea indexului, intr-adevar, e ,,un pic'' lung . Să văd cum pot transmite mesajul folosind mai putine cuvinte.
Am modificat fontul diacriticilor deci ar trebui sa fie ok acum. Din păcate, cel putin pentru moment doar eu sunt în spatele acestui site. Mai mult ca sigur, la un moment dat voi apela la cineva care se ocupa cu asta full time. Din păcate, nu mai am timp să fac prea multe și trebuie sa fie gata (cel putin un prim draft funcțional) în maxim câteva zile (deja sunt în întârziere) . Mai trebuie sa ma ocup de SEO si functionalitate. Deocamdata Yoast îmi zice ca aproape toate paginile au un scor ,,Very poor'' și nici măcar nu am reușit să-l gasesc pe primele 10 pagini de pe google )

Edited by spreeeeee, 05 May 2017 - 09:00.