"Mogę sobie wyobrazić, że wciąż jest wiele rzeczy bez JavaScriptu" - zabawne, nie tak dawno temu zrobiliśmy wszystko, co bez javascript.
Najlepsze podejście to tak zwane "ulepszanie progresywne". Zasadą jest stworzenie czegoś, co działa bez JavaScriptu, a następnie "warstwa" na dodatkowych zachowaniach, wiążąc JavaScript z obiektami.Biblioteki takie jak jQuery czynią to prostym, ponieważ obsługują selektory w stylu CSS. W ten sposób możesz zastosować zachowania JS niemal w taki sam sposób, w jaki zastosowałbyś CSS (OK, lekka przesada).
Należy zastanowić się nad tym, co stanowi dobrą linię bazową i jak należy zmieniać strony.
Często prawdziwą dodatkową pracą jest praca po stronie serwera, gdzie konieczne może być posiadanie wielu systemów przetwarzania zgłoszeń. To trochę za duże pole do rozwiązania w jednej odpowiedzi!
Warto również zastanowić się, kto i dlaczego użytkownicy nie używają javascript. Here's something I wrote a while ago on the subject powinieneś być zainteresowany.
Przykład? Weź coś prostego, np. chcesz wyświetlać ładne "podpowiedzi" w polach formularza, gdy użytkownik do nich mówi. W HTML, mogłyby one (na przykład) jest oznaczony jako ust:
<label for="username">User name</label><input type="text" id="username" />
<p>Username must be between 6-8 characters</p>
dla użytkowników bez JS, zachęty mogą po prostu być wyświetlane jako miły ust. Więc styl to z CSS. Miej dodatkowy kod CSS dla użytkowników JS, który domyślnie ukrywa akapit. A więc: 2 zestawy CSS, jeden nadpisuje drugi.
non JS:
form p {
margin: 10px 0 0 0;
border-bottom: 1px solid grey;
}
JS:
form p {
position: absolute; display: none;
width: 180px;
background-image: url(nice-bubble.gif);
padding: 10px;
}
Jak zastosować CSS do JS/Non JS sytuacjach należy do Ciebie. Istnieje wiele opcji. Osobiście lubię kodować JS w CSS i mieć w tagu wariant noscript.css (np. Działający wstecz). Który nie jest poprawny XHTML, ale działa ładnie.
Następnie należy mieć JS, który wyszukuje elementy i zarządza kodem wyświetlania podpowiedzi. np .:
$(document).ready(function() {
$('form input').focus(function() {...display paragraph...});
// etc;
})
To fałszywy kod, ale dostajesz zdjęcie. W efekcie powstaje 1 zestaw HTML z 2 prezentacjami i dodatkowymi zachowaniami oraz brak zaplątania się JS w sam HTML.
Chcesz mi powiedzieć, dlaczego mnie głosowałeś? –