Temat: Przesyłanie formularza ze strony WWW

Witam,

Przygotowałem na podstawie gotowego szablonu serwis WWW niestety mam jeden problem z przesyłaniem formularza.
Jak go skonfigurować żeby nie był wysyłany z domyślnego konta odwiedzającego mój serwis (w momencie wciśnięcia klawisza wyślij, zostaje uruchomiony program pocztowy i dopiero z niego jest wysyłany formularz), wysłać formularz bez otwierania programu pocztowego bezpośrednio ze strony WWW.

Poniżej kod który wstawiłem aby formularz był wysyłany, co w nim zmienić?

<form action="mailto:biuro@matrymonialna.eu" method="post" enctype="text/plain" name="ankieta" id="ankieta">

Proszę o pomoc i z góry dziękuję.

Temat: Przesyłanie formularza ze strony WWW

Mikołaj Ś.:
Witam,

Przygotowałem na podstawie gotowego szablonu serwis WWW niestety mam jeden problem z przesyłaniem formularza.
Jak go skonfigurować żeby nie był wysyłany z domyślnego konta odwiedzającego mój serwis (w momencie wciśnięcia klawisza wyślij, zostaje uruchomiony program pocztowy i dopiero z niego jest wysyłany formularz), wysłać formularz bez otwierania programu pocztowego bezpośrednio ze strony WWW.

Poniżej kod który wstawiłem aby formularz był wysyłany, co w nim zmienić?

<form action="mailto:biuro@matrymonialna.eu" method="post" enctype="text/plain" name="ankieta" id="ankieta">

Proszę o pomoc i z góry dziękuję.

atrybut action powinien wskazywać na plik który będzie "obrabiał" dane z formularza (np. jakiś skrypt php), a nie adres e-mail... wywal atrybut name - nie powinno go tam być... a tak w ogóle to pokaż lepiej cały formularz (link do strony albo kod źródłowy), bo widzę, że nie bardzo kumasz jak pisać formularze... zerknij też do specyfikacji w3c...Piotr Lewandowski edytował(a) ten post dnia 26.08.08 o godzinie 12:53

Temat: Przesyłanie formularza ze strony WWW

Dzięki za podpowiedzi poniżej kod formularza - proszę o pomoc w jego dostosowaniu.

<form action="mailto:biuro@matrymonialna.eu" method="post" enctype="text/plain" name="ankieta" id="ankieta">
<label>
<input name="Regulamin" type="checkbox" id="Regulamin" checked="checked" />
Zapoznałem się z regulaminem Biura i akceptuję jego warunki<span class="styl11"><br />
<br />
<span class="styl14"><span class="styl15"><br />
<span class="styl18">Informacje dla Biura Ab ovo</span></span><br />
<br />
imię</span></span>
<span class="styl14">
<input name="Imię" type="text" id="Imię" value="" size="25" />
</span></label>
<span class="styl14">
<label>nazwisko
<input name="Nazwisko2" type="text" id="Nazwisko2" value="" size="25" />
</label>
</span>
<p class="styl14"><label></label>
<label>ulica
<input name="ulica" type="text" id="ulica" value="" size="45" />
</label>
</p>
<p class="styl14">
<label>miasto
<input name="Miasto" type="text" id="Miasto" value="" size="45" />
</label>
<label>kod
<input name="Kod" type="text" id="Kod" value="" size="10" />
</label>
</p>
<p class="styl14">
<label>województwo
<select name="województwo" id="województwo">
<option value="dolnośląskie">dolnośląskie</option>
<option value="kujawsko-pomorskie">kujawsko-pomorskie</option>
<option value="lubelskie">lubelskie</option>
<option value="lubuskie">lubuskie</option>
<option value="łódzkie">łódzkie</option>
<option value="małopolskie">małopolskie</option>
<option value="mazowieckie">mazowieckie</option>
<option value="opolskie">opolskie</option>
<option value="podkarpackie">podkarpackie</option>
<option value="podlaskie">podlaskie</option>
<option value="pomorskie">pomorskie</option>
<option value="śląskie">śląskie</option>
<option value="świętokrzyskie">świętokrzyskie</option>
<option value="warmińsko-mazurskie">warmińsko-mazurskie</option>
<option value="wielkopolskie">wielkopolskie</option>
<option value="zachodniopomorskie">zachodniopomorskie</option>
</select>
</label>
<label>państwo
<input name="państwo" type="text" id="państwo" value="" size="20" />
</label>
</p>
<p class="styl14">
<label>telefon
<input name="telefon" type="text" id="telefon" value="" size="14" />
</label>
<label>e-mail
<input name="e-mail" type="text" id="e-mail" value="" size="30" />
</label>
</p>
<p class="styl14">
<label>seria i nr dowodu osobistego lub paszportu
<input name="seria / nr dowodu osobistego lub paszportu" type="text" id="seria / nr dowodu osobistego lub paszportu" value="" size="20" />
</label>
</p>
<p class="styl14"> </p>
<p class="styl18">Informacje do opracowania Twojej oferty</p>
<p class="styl14">
<label>płeć
<select name="płeć" id="płeć">
<option value="kobieta">kobieta</option>
<option value="mężczyzna">mężczyzna</option>
</select>
</label>
</p>
<p class="styl14">
<label>stan cywilny
<select name="stan cywilny" id="stan cywilny">
<option value="panna/kawaler">panna/kawaler</option>
<option value="mężatka/zamężny">mężatka/zamężny</option>
<option value="wdowa/wdowiec">wdowa/wdowiec</option>
<option value="rozwódka/rozwodnik">rozwódka/rozwodnik</option>
</select>
</label>
</p>
<p class="styl14">
<label>wiek
<input name="wiek kl." type="text" id="wiek kl." value="" size="5" />
</label><label>znak zodiaku
<select name="znak zodiaku" id="znak zodiaku">
<option value="baran">baran</option>
<option value="byk">byk</option>
<option value="bliźnięta">bliźnięta</option>
<option value="rak">rak</option>
<option value="lew">lew</option>
<option value="panna">panna</option>
<option value="waga">waga</option>
<option value="skorpion">skorpion</option>
<option value="strzelec">strzelec</option>
<option value="koziorożec">koziorożec</option>
<option value="wodnik">wodnik</option>
<option value="ryby">ryby</option>
</select>
</label>
</p>
<p class="styl14">
<label>kolor włosów
<select name="kolor włosów" id="kolor włosów">
<option value="jasny blond">jasny blond</option>
<option value="blond">blond</option>
<option value="ciemny blond">ciemny blond</option>
<option value="szatyn/szatynka">szatyn/szatynka</option>
<option value="brunet/brunetka">brunet/brunetka</option>
<option value="rudy">rudy</option>
<option value="szpakowaty">szpakowaty</option>
<option value="siwy">siwy</option>
<option value="łysy">łysy</option>
</select>
</label>
<label>kolor oczu
<select name="kolor oczu" id="kolor oczu">
<option value="piwne">piwne</option>
<option value="zielone">zielone</option>
<option value="niebieskie">niebieskie</option>
<option value="szare">szare</option>
<option value="czarne">czarne</option>
</select>
</label>
</p>
<p class="styl14">
<label>wzrost (cm)
<input name="wzrost" type="text" id="wzrost" value="" size="5" />
</label>
<label>waga (kg)
<input name="waga (kg)" type="text" id="waga (kg)" value="" size="5" />
</label>
<label>sylwetka
<select name="sylwetka" id="sylwetka">
<option value="szczupła">szczupła</option>
<option value="średnia">średnia</option>
<option value="puszysta">puszysta</option>
</select>
</label>
</p>
<p class="styl14">
<label>wykształcenie
<select name="wykształcenie" id="wykształcenie">
<option value="podstawowe">podstawowe</option>
<option value="zawodowe">zawodowe</option>
<option value="średnie">średnie</option>
<option value="wyższe">wyższe</option>
</select>
</label>
<label></label>
</p>
<p class="styl14">
<label>zawód wykonywany
<input name="zawód wykonywany" type="text" id="zawód wykonywany" value="" size="30" />
</label>
</p>
<p class="styl14"> </p>
<p class="styl14">
<label>dzieci
<select name="dzieci" id="dzieci">
<option value="nie posiadam">nie posiadam</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="więcej">więcej</option>
</select>
</label>
<label>czy chcesz mieć dzieci
<select name="czy chcesz mieć dzieci" id="czy chcesz mieć dzieci">
<option value="tak">tak</option>
<option value="raczej tak">raczej tak</option>
<option value="raczej nie">raczej nie</option>
<option value="nie">nie</option>
</select>
</label>
</p>
<p class="styl14"> </p>
<p class="styl14">
<label>warunki materialne
<select name="warunki materialne" id="warunki materialne">
<option value="złe">złe</option>
<option value="przeciętne">przeciętne</option>
<option value="dobre">dobre</option>
<option value="bardzo dobre">bardzo dobre</option>
</select>
</label>
</p>
<p class="styl14">
<label>warunki mieszkaniowe
<select name="warunki mieszkaniowe" id="warunki mieszkaniowe">
<option value="brak">brak</option>
<option value="mieszkanie wspólne">mieszkanie wspólne</option>
<option value="mieszkanie samodzielne">mieszkanie samodzielne</option>
<option value="dom">dom</option>
</select>
</label>
</p>
<p class="styl14">
<label>samochód
<select name="samochód" id="samochód">
<option value="posiadam">posiadam</option>
<option value="nie posiadam">nie posiadam</option>
</select>
</label>
</p>
<p class="styl14"> </p>
<p class="styl19">Stosunek do używek:</p>
<p class="styl14">
<label>papierosy
<select name="papierosy" id="papierosy">
<option value="lubię">lubię</option>
<option value="toleruję">toleruję</option>
<option value="nie toleruję">nie toleruję</option>
<option value="obojętny">obojętny</option>
</select>
</label>
<label>alkohol
<select name="alkohol" id="alkohol">
<option value="lubię">lubię</option>
<option value="toleruję">toleruję</option>
<option value="nie toleruję">nie toleruję</option>
<option value="obojętny">obojętny</option>
</select>
</label>
</p>
<p class="styl19"> </p>
<p class="styl19">Zainteresowania:</p>
<p class="styl14">
<label>
<input type="checkbox" name="muzyka" id="muzyka" />
muzyka</label>
<label>
<input type="checkbox" name="książki" id="książki" />
książki</label>
<label>
<input type="checkbox" name="film" id="film" />
film</label>
<label>
<input type="checkbox" name="sport" id="sport" />
sport</label>
<label>
<input type="checkbox" name="turystyka" id="turystyka" />
turystyka</label>
<label>
<input type="checkbox" name="sztuka" id="sztuka" />
sztuka</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="moda" id="moda" />
moda</label>
<label>
<input type="checkbox" name="żeglarstwo" id="żeglarstwo" />
żeglarstwo</label>
<label>
<input type="checkbox" name="kulinaria" id="kulinaria" />
kulinaria</label>
<label>
<input type="checkbox" name="ogrodnictwo" id="ogrodnictwo" />
ogrodnictwo</label>
<label>
<input type="checkbox" name="teatr" id="teatr" />
teatr</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="filatelistyka" id="filatelistyka" />
filatelistyka</label>
<label>
<input type="checkbox" name="numizmatyka" id="numizmatyka" />
numizmatyka</label>
<label>
<input type="checkbox" name="hipika" id="hipika" />
hipika</label>
<label>
<input type="checkbox" name="taniec" id="taniec" />
taniec</label>
<label>
<input type="checkbox" name="polityka" id="polityka" />
polityka</label>
</p>
<p class="styl14">
<label>inne
<input name="inne zaint." type="text" id="inne zaint." value="" size="30" />
</label>
</p>
<p class="styl14"> </p>
<p class="styl19">Ulubiona forma spędzania wolnego czasu:</p>
<p class="styl14">
<label>
<input type="checkbox" name="czytanie" id="czytanie" />
czytanie</label>
<label>
<input type="checkbox" name="słuchanie muzyki" id="słuchanie muzyki" />
słuchanie muzyki</label>
<label>
<input type="checkbox" name="uprawianie sportu" id="uprawianie sportu" />
uprawianie sportu</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="wyjazd w plener" id="wyjazd w plener" />
wyjazd w plener</label>
<label>
<input type="checkbox" name="spotkania z przyjaciółmi" id="spotkania z przyjaciółmi" />
spotkania z przyjaciółmi</label>
<label>
<input type="checkbox" name="telewizja" id="telewizja" />
oglądanie telewizji</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="granie w gry" id="granie w gry" />
granie w gry</label>
<label>
<input type="checkbox" name="korzystanie z internetu" id="korzystanie z internetu" />
korzystanie z internetu</label>
<label>
<input type="checkbox" name="gra na instrumentach" id="gra na instrumentach" />
gra na instrumentach</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="puby, dyskoteki" id="puby, dyskoteki" />
puby, dyskoteki</label>
</p>
<p class="styl14">
<label>inne
<input name="inne formy czasu" type="text" id="inne formy czasu" value="" size="30" />
</label>
</p>
<p class="styl14"> </p>
<p class="styl19">Cechy charakteru</p>
<p class="styl14">
<label>
<input type="checkbox" name="spokojny/a" id="spokojny/a" />
spokojny/a</label>
<label>
<input type="checkbox" name="towarzyski/a" id="towarzyski/a" />
towarzyski/a</label>
<label>
<input type="checkbox" name="optymista/ka" id="optymista/ka" />
optymista/ka</label>
<label>
<input type="checkbox" name="stanowczy/a" id="stanowczy/a" />
stanowczy/a</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="wesoły/a" id="wesoły/a" />
wesoły/a</label>
<label>
<input type="checkbox" name="pesymista/ka" id="pesymista/ka" />
pesymista/ka</label>
<label>
<input type="checkbox" name="domator/ka" id="domator/ka" />
domator/ka</label>
<label>
<input type="checkbox" name="odważny/a" id="odważny/a" />
odważny/a</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="nieśmiały/a" id="nieśmiały/a" />
nieśmiały/a</label>
<label>
<input type="checkbox" name="wyrozumiały/a" id="wyrozumiały/a" />
wyrozumiały/a</label>
<label>
<input type="checkbox" name="zazdrosny/a" id="zazdrosny/a" />
zazdrosny/a</label>
<label>
<input type="checkbox" name="uparty/a" id="uparty/a" />
uparty/a</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="uległy/a" id="uległy/a" />
uległy/a</label>
<label>
<input type="checkbox" name="poważny/a" id="poważny/a" />
poważny/a</label>
<label>
<input type="checkbox" name="opiekuńczy/a" id="opiekuńczy/a" />
opiekuńczy/a</label>
<label>
<input type="checkbox" name="aktywny/a" id="aktywny/a" />
aktywny/a</label>
</p>
<p class="styl14"> </p>
<p class="styl19">Znajomość języków obcych:</p>
<p class="styl14">
<label>
<input type="checkbox" name="polski" id="polski" />
polski</label>
<label>
<input type="checkbox" name="angielski" id="angielski" />
angielski</label>
<label>
<input type="checkbox" name="niemiecki" id="niemiecki" />
niemiecki</label>
<label>
<input type="checkbox" name="francuski" id="francuski" />
francuski</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="włoski" id="włoski" />
włoski</label>
<label>
<input type="checkbox" name="hiszpański" id="hiszpański" />
hiszpański</label>
<label>
<input type="checkbox" name="rosyjski" id="rosyjski" />
rosyjski</label>
</p>
<p class="styl14">
<label>inne
<input name="inne jezyki" type="text" id="inne jezyki" value="" size="30" />
</label>
</p>
<p class="styl14"> </p>
<p class="styl19">Kilka słów o sobie</p>
<p class="styl14">
<label>
<textarea name="kilka słów o sobie" id="kilka słów o sobie" cols="55" rows="5"></textarea>
</label>
</p>
<p class="styl14"> </p>
<p class="styl18">Oczekiwania w stosunku do partnera/ki</p>
<p class="styl14">
<label>płeć
<select name="płeć partnera" id="płeć partnera">
<option value="kobieta">kobieta</option>
<option value="mężczyzna">mężczyzna</option>
</select>
</label>
<label>wiek
<select name="wiek partnera" id="wiek partnera">
<option value="18-25">18-25</option>
<option value="26-35">26-35</option>
<option value="36-45">36-45</option>
<option value="46-55">46-55</option>
<option value="pow. 55">pow. 55</option>
</select>
</label>
</p>
<p class="styl14">
<label>czy może posiadać dzieci
<select name="czy może posiadać dzieci" id="czy może posiadać dzieci">
<option value="tak">tak</option>
<option value="nie">nie</option>
<option value="bez znaczenia">bez znaczenia</option>
</select>
</label>
</p>
<p class="styl14"> </p>
<p class="styl19">Wygląd zewnętrzny </p>
<p class="styl14">(proszę opisać w kilku zdaniach: wzrost, kolor włosów, sylwetka, itp.)</p>
<p class="styl14">
<label></label>
<textarea name="wyglad partnera" id="wyglad partnera" cols="55" rows="5"></textarea>
</p>
<p class="styl19"> </p>
<p class="styl19">Ulubiona forma spędzania wolnego czasu:</p>
<p class="styl14">
<label>
<input type="checkbox" name="czytanie part" id="czytanie part" />
czytanie</label>
<label>
<input type="checkbox" name="słuchanie muzyki part" id="słuchanie muzyki part" />
słuchanie muzyki</label>
<label>
<input type="checkbox" name="uprawianie sportu part" id="uprawianie sportu part" />
uprawianie sportu</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="wyjazd w plener part" id="wyjazd w plener part" />
wyjazd w plener</label>
<label>
<input type="checkbox" name="spotkania z przyjaciółmi part" id="spotkania z przyjaciółmi part" />
spotkania z przyjaciółmi</label>
<label>
<input type="checkbox" name="telewizja part" id="telewizja part" />
oglądanie telewizji</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="granie w gry part" id="granie w gry part" />
granie w gry</label>
<label>
<input type="checkbox" name="korzystanie z internetu part" id="korzystanie z internetu part" />
korzystanie z internetu</label>
<label>
<input type="checkbox" name="gra na instrumentach part" id="gra na instrumentach part" />
gra na instrumentach</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="puby, dyskoteki part" id="puby, dyskoteki part" />
puby, dyskoteki</label>
</p>
<p class="styl14">
<label>inne
<input name="inne formy czasu part" type="text" id="inne formy czasu part" value="" size="30" />
</label>
</p>
<p class="styl14"> </p>
<p class="styl19">Cechy charakteru</p>
<p class="styl14">
<label>
<input type="checkbox" name="spokojny/a part" id="spokojny/a part" />
spokojny/a</label>
<label>
<input type="checkbox" name="towarzyski/a part" id="towarzyski/a part" />
towarzyski/a</label>
<label>
<input type="checkbox" name="optymista/ka part" id="optymista/ka part" />
optymista/ka</label>
<label>
<input type="checkbox" name="stanowczy/a part" id="stanowczy/a part" />
stanowczy/a</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="wesoły/a part" id="wesoły/a part" />
wesoły/a</label>
<label>
<input type="checkbox" name="pesymista/ka part" id="pesymista/ka part" />
pesymista/ka</label>
<label>
<input type="checkbox" name="domator/ka part" id="domator/ka part" />
domator/ka</label>
<label>
<input type="checkbox" name="odważny/a part" id="odważny/a part" />
odważny/a</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="nieśmiały/a part" id="nieśmiały/a part" />
nieśmiały/a</label>
<label>
<input type="checkbox" name="wyrozumiały/a part" id="wyrozumiały/a part" />
wyrozumiały/a</label>
<label>
<input type="checkbox" name="zazdrosny/a part" id="zazdrosny/a part" />
zazdrosny/a</label>
<label>
<input type="checkbox" name="uparty/a part" id="uparty/a part" />
uparty/a</label>
</p>
<p class="styl14">
<label>
<input type="checkbox" name="uległy/a part" id="uległy/a part" />
uległy/a</label>
<label>
<input type="checkbox" name="poważny/a part" id="poważny/a part" />
poważny/a</label>
<label>
<input type="checkbox" name="opiekuńczy/a part" id="opiekuńczy/a part" />
opiekuńczy/a</label>
<label>
<input type="checkbox" name="aktywny/a part" id="aktywny/a part" />
aktywny/a</label>
</p>
<p class="styl14"><label></label>
</p>
<p class="styl14"> </p>
<p class="styl19">Szczególne wymagania i preferencje w stosunku do partnera/ki</p>
<p class="styl14">
<textarea name="wymagania od partnera" id="wymagania od partnera" cols="55" rows="5"></textarea>
</p>
<p class="styl14"> </p>
<p class="styl14"><span class="styl20">Cechy nie akceptowane u partnera/ki</span> </p>
<p class="styl14">(wymień 3 najbardziej istotne dla Ciebie)</p>
<p class="styl14">
<textarea name="cechy nie akceptowane" id="cechy nie akceptowane" cols="55" rows="5"></textarea>
</p>
<p class="styl14"> </p>
<p class="styl14">
<label>Załącz swoje zdjęcie
<input type="file" name="Załącz swoje zdjęcie" id="Załącz swoje zdjęcie" />
</label>
</p>
<p class="styl19"> </p>
<p align="center" class="styl19">
<label>
<input type="submit" name="wyślij ankietę" id="wyślij ankietę" value="wyślij ankietę" />
</label>
</p>
</form>

Temat: Przesyłanie formularza ze strony WWW

Eh ty te dane chciałeś ręcznie obrabiać z poczty??
Tak jak kolega mówił nie wstawiaj linku mailto bo:
-zawsze to będzie obsługiwał klient poczty
-jak roboty to znajdą tak się możesz ze skrzynką e-mail pożegnać (zasypią cię spamem)

<form action="sendmail.php" method="post" enctype="text/plain" name="ankieta" id="ankieta">

sendmail jest to skrypt który musisz sam napisać a który wyśle dane z formularza do ciebie na poczte (w php polecenie mail albo klasa phpmailer) w ten sposób nie wpisujesz adresu e-mail bezpośrednio na stronę więc roboty nie będą mogły bezpośrednio zaatakować twojej skrzynki spamem.

Kolejną zaletą jest fakt że dane możesz obrobić sobie graficznie tak żeby ładnie wyglądały i dobrze się czytały.

Ostatnią zaletą jest fakt, że skrypt może za ciebie dokonać wstępnej analizy i zamiast wysyłać do ciebie dane wszystkich którzy wypełnią formularz wysyłać tylko info że jest 20% z czarnymi włosami 15% blondynów itd.

Poszukaj w google obsługa formularzy php będzie tego masa, po za tym zawsze możesz się zgłosić do kogoś z tej grupy.

Znowu za bardzo się rozpisałem :( :( :/

Temat: Przesyłanie formularza ze strony WWW

Miki, ty się zdecyduj czy te jesteś REKLAMA czy WINDYKACJA, bo to oddzielne tematy - jak + i - z bateryjki 1,5 voltowej. Raczej problem nie jest trudny, acz KONKRETNY - czyli NIE nadający się na forum

Temat: Przesyłanie formularza ze strony WWW

powinieneś pogrupować części formularza za pomocą znacznika fieldset... i w label daj atrybut for, tak żeby użytkownicy wiedzieli którego pola input dany label dotyczy...

Poza tym zastanawia mnie jedno - ilu użytkowników wypełni tak duży formularz??Piotr Lewandowski edytował(a) ten post dnia 27.08.08 o godzinie 07:38

Temat: Przesyłanie formularza ze strony WWW

O mamo... myślałem, że nie doscrolluję się do końca tego kodu xD

Piotr ma rację - skróć formularz zostawiając jedynie niezbędne pola do wypełnienia, albo podziel go na strony, żeby nie odstraszać użytkownika od razu :P

powinieneś pogrupować części formularza za pomocą znacznika

fieldset... i w label daj atrybut for, tak żeby użytkownicy

wiedzieli którego pola input dany label dotyczy...

:)
dobra rada, aczkolwiek uzasadniłeś zabawnie - nie znam użytkownika, który ocenia przynależność labeli do inputów patrząc w kod ^^ Label, który obejmuje opis pola i pole pomaga w jego wyborze - gdy klikniesz w opis, to automatycznie pojawi się w inpucie kursor tekstowy.Bartosz C. edytował(a) ten post dnia 30.08.08 o godzinie 13:38

Temat: Przesyłanie formularza ze strony WWW

Bartosz C.:
:)
dobra rada, aczkolwiek uzasadniłeś zabawnie - nie znam użytkownika, który ocenia przynależność labeli do inputów patrząc w kod ^^ Label, który obejmuje opis pola i pole pomaga w jego wyborze - gdy klikniesz w opis, to automatycznie pojawi się w inpucie kursor tekstowy.

Wiesz, z sieci korzystają różni użytkownicy... Pomyśl kto może korzystać z Twojej strony.. Czy tylko "klikacze" ?? A co z pozostałymi użytkownikami? A co z osobami korzystającymi ze screenreaderów?? DOBRY front-end web developer powinien dbać nie tylko o to, aby kod walidował się - nie można zapominać o dostępności.. Zerknij tutaj: http://diveintoaccessibility.org/day_28_labeling_form_...
Wracając do walidacji kodu: IMHO walidacja nic nie daje - iluzoryczne poczucie, że strona jest poprawna... Wiekszość koderów dba jedynie o walidację, robiąc z niej cel - tam gdzie inni kończą robotę z (X)HTMLem ja widzę dopiero punkt wyjscia - dla mnie walidacja to dobry początek do tego, aby kod strony był POPRAWNY, SEMANTYCZNY a sama strona DOSTĘPNA dla wszystkich, nie tylko dla userów IE 7 dla Windows... Niestety mało który front-end developer o tym pamięta...
Poza tym obejmowanie inputa labelem to nie jest dobry pomysł...Piotr Lewandowski edytował(a) ten post dnia 30.08.08 o godzinie 13:58

Temat: Przesyłanie formularza ze strony WWW

OT

Piotr Lewandowski:
Poza tym obejmowanie inputa labelem to nie jest dobry

Ooops. Dlaczego? Mogę prosić o jakiś link na ten temat?

Temat: Przesyłanie formularza ze strony WWW

Michał Sznurawa:
OT

Piotr Lewandowski:
Poza tym obejmowanie inputa labelem to nie jest dobry

Ooops. Dlaczego? Mogę prosić o jakiś link na ten temat?

Owszem, specyfikacja pozwala na taką konstrukcję, jednak z doświadczenia wiem, że lepiej jest osobno stylować LABEL i INPUT, jak bawić się w stylowanie zagnieżdzonego w labelu inputa...

W materiałach, w których pisze się o DOSTĘPNOŚCI formularzy label i input występuje zawsze osobno...Piotr Lewandowski edytował(a) ten post dnia 30.08.08 o godzinie 14:17

Temat: Przesyłanie formularza ze strony WWW

Piotr Lewandowski:
Owszem, specyfikacja pozwala na taką konstrukcję, jednak z doświadczenia wiem, że lepiej jest osobno stylować LABEL i INPUT, jak bawić się w stylowanie zagnieżdzonego w labelu inputa...

W materiałach, w których pisze się o DOSTĘPNOŚCI formularzy label i input występuje zawsze osobno...Piotr Lewandowski edytował(a) ten post dnia 30.08.08 o godzinie 14:17

Rozumiem.
Jeśli chodzi o stylowanie formularzy. Udało mi się ładnie poukładać pola - tak jak wyglądają, gdy się pozycjonuje je za pomocą tabel - właśnie dzięki zagnieżdżaniu. Bez nadmiarowego kodu (chyba;)). No i bez table.

Temat: Przesyłanie formularza ze strony WWW

Piotr Lewandowski:

Bartosz C.:
:)
dobra rada, aczkolwiek uzasadniłeś zabawnie - nie znam użytkownika, który ocenia przynależność labeli do inputów patrząc w kod ^^ Label, który obejmuje opis pola i pole pomaga w jego wyborze - gdy klikniesz w opis, to automatycznie pojawi się w inpucie kursor tekstowy.

Wiesz, z sieci korzystają różni użytkownicy... Pomyśl kto może korzystać z Twojej strony.. Czy tylko "klikacze" ?? A co z pozostałymi użytkownikami? A co z osobami korzystającymi ze screenreaderów?? DOBRY front-end web developer powinien dbać nie tylko o to, aby kod walidował się - nie można zapominać o dostępności.. Zerknij tutaj: http://diveintoaccessibility.org/day_28_labeling_form_...
Wracając do walidacji kodu: IMHO walidacja nic nie daje - iluzoryczne poczucie, że strona jest poprawna... Wiekszość koderów dba jedynie o walidację, robiąc z niej cel - tam gdzie inni kończą robotę z (X)HTMLem ja widzę dopiero punkt wyjscia - dla mnie walidacja to dobry początek do tego, aby kod strony był POPRAWNY, SEMANTYCZNY a sama strona DOSTĘPNA dla wszystkich, nie tylko dla userów IE 7 dla Windows... Niestety mało który front-end developer o tym pamięta...
Poza tym obejmowanie inputa labelem to nie jest dobry pomysł...Piotr Lewandowski edytował(a) ten post dnia 30.08.08 o godzinie 13:58

Od razu inaczej się rozmawia. Co do screenreaderów się zgodzę, ale to jedyny przypadek, w którym należy pilnować etykiet. Wybacz, ale nie dostrzegam, jak to nazwałeś, "innych użytkowników" niż "klikacze" jeżeli chodzi o formularze. Btw... diveintoaccessability.org znam niemalże na pamięć, aczkolwiek kilka rzeczy jest tam niepotrzebnie przesadzone i nie należy popadać w paranoję.

Co do inputów zagnieżdzonych w labelu masz rację. Zapomniałem, że powiązanie for -> id również automatycznie ustawia kursor tekstowy. Aczkolwiek jeżeli nie dbasz o te atrybuty, to zagnieżdżenie inputa w labelu pozwoli oszczędzić Ci sporo pracy, zwłaszcza, jeżeli formularz jest niemiłosiernie długi. Takie rozwiązanie może się przydać przy tworzeniu formularzy na stronach, które z założenia nie są przeznaczone dla osób niedowidzących lub niewidomych - np. interaktywny formularz dla osób ubiegających się o prawo jazdy.

Poza tym przesadne stylowanie formularzy uważam za złą praktykę ze względu na rozbieżność ich wyglądu w różnych przeglądarkach. Duży odsetek użytkowników ma problemy ze zidentyfikowaniem najbardziej udziwnionych formularzy jeżeli różnią się one od tych, które spotykają standardowo. Stąd też dobry CSS guru jest w stanie bez problemów poradzić sobie z inputem zagnieżdżonym w labelu wykonując przyzwoity i czytelny form.

Jeżeli już poruszasz temat walidacji, to mogę dodać, że wielu koderów wyrasta z etapu kodowania, który nazywam "a teraz sprawdźmy czy się waliduje". Walidatory lub jak kto woli sprawdzarki przydają się głównie po to, żeby początkujący mieli świadomość jakie głupoty wypisują w kodzie, albo co zdarza się im często przeoczyć. Pomaga to nabrać dobrych praktyk kodowania i siłą rzeczy przyczynia się do spadku nieudolnie wykonanych stron w Internecie. Na późniejszym etapie przestajesz przejmować się kwestiami poprawności kodu i starasz się zrozumieć semantykę, która w końcu wpływa w dużym stopniu na indeksowanie Twojej strony w dobrych wyszukiwarkach.

Już nie wspomnę, że jeżeli ktoś pisze stronę sprawdzając ją tylko na przeglądarce, z której sam korzysta, to daleko nie zajdzie. Ja na początku pracowałem z IE6, IE7, FF i Operą jednocześnie (dają łącznie jakieś 95% rynku przeglądarek) i po kilku miesiącach nauczyłem się po prostu omijać kombinacje znaczników, które dają niejednoznaczne efekty. W ten sposób najłatwiej dojść do perfekcji i z osoby, która koduje w sposób "sprawdźmy czy zadziała" stać się profesjonalistą, który już nie sprawdza, bo wie, że zadziała.

W każdym razie życzę powodzenia, bo kolegę, który zaczął ten wątek czeka jeszcze sporo pracy.

Temat: Przesyłanie formularza ze strony WWW

Bartosz C.:Wybacz, ale nie dostrzegam, jak to nazwałeś, "innych użytkowników" niż "klikacze" jeżeli chodzi o formularze.

A ci co obsługują komputer z minimalną pomocą myszki? Czyli tam gdzie nie da się wejść klawiaturą, trzeba myszką? Jest to oczywiście logiczne i zrozumiałe: obsługa wszystkiego klawiaturą przyspiesza pracę o jakieś 50% niż robienie tego samego myszką (nawigacja, klikanie)...

Temat: Przesyłanie formularza ze strony WWW

Wojciech Sznapka:

Bartosz C.:Wybacz, ale nie dostrzegam, jak to nazwałeś, "innych użytkowników" niż "klikacze" jeżeli chodzi o formularze.

A ci co obsługują komputer z minimalną pomocą myszki? Czyli tam gdzie nie da się wejść klawiaturą, trzeba myszką? Jest to oczywiście logiczne i zrozumiałe: obsługa wszystkiego klawiaturą przyspiesza pracę o jakieś 50% niż robienie tego samego myszką (nawigacja, klikanie)...

Racja - przyspiesza, ale "for -> id" nie przeszkadza w tym ani nie pomaga. Przeglądarka i tak zaznacza zawsze kolejne pola do uzupełnienia w formularzu (chyba, że jest wybitnie głupia, ale tak sprytni użytkownicy nie korzystają z tak głupich przeglądarek). O to się dyskusja rozchodziła :)

Temat: Przesyłanie formularza ze strony WWW

Aha, no to spoko :-)

Temat: Przesyłanie formularza ze strony WWW

Bartosz C.:

Wybacz, ale nie dostrzegam, jak to nazwałeś, "innych użytkowników" niż "klikacze" jeżeli chodzi o formularze.

A to już jest Twój problem, że już na starcie dyskryminujesz innych użytkowników... No cóż, niektórzy starają się tworzyć strony tak, aby mogła je odwiedzić jak największa liczba użytkowników (niezależnie od tego, czy są ludzimi niepełnosprawnymi, z zaburzeniami fizycznymi, poznawczymi, czy neurologicznymi np. ślepota lub słaby wzrok, daltonizm, ograniczony proces poznawczy), a niektórzy po prostu klepią walidujący się kod... Kiedyś wysmarowałem na swoim blogu artykuł o dostępności. Pozwole sobie na zacytowanie dwóch pierwszych akapitów:
W naszym kraju żyje ponad 38 mln ludzi. Według danych GUS około 13% społeczeństwa stanowią osoby niepełnosprawne. Osoby starsze (po 60) stanowią około 15% populacji. Osoby korzystające z mniej popularnych przeglądarek (innych niż Internet Explorer) i urządzeń mobilnych to około 15% internautów. Każda z tych grup powiększa się z roku na roku. Problem dostępności stron WWW oraz aplikacji "webowych" może dotyczyć nawet 25% odwiedzających Twoją stronę.

Czy masz pewność, że treści umieszczone na Twojej stronie WWW są osiągalne dla osób niepełnosprawnych? Czy zastanawiałeś się kiedyś, jak (i czy w ogóle) aplikacja czytająca strony WWW (tzw. screen reader) odczyta Twoją stronę? A co, jeśli odwiedzający Twoją stroną korzystają z przeglądarki innej niż Internet Explorer? Czy wszystko będzie widoczne i na swoim miejscu tak jak sobie to założyłeś tworząc swoją stronę?

To, że nie myślisz o ludziach innych niż "klikacze" to duża wada i jeszcze większa strata - może nie dla Ciebie - ale dla Twojego klienta, który być może chciałby, aby jego stronę odwiedziało jak najwięcej potencjalnych klientów, a nie tylko użytkownicy IE 6.0.2900.2180.xpsp_sp2_rtm.040803-2158... Chyba w tym wszystkim zapomina się, że strona jest nie po to, żeby ładnie wyglądać, ale aby przyciągała userów, potencjalnych klientów w wyniku czego można dzięki niej zarabiać (oczywiście w przypadku stron komercyjnych)...

Edit: na koniec jeszcze dodam, że moim zdaniem sama znajomość (X)HTMLa i umiejętność korzystania z walidatora W3C to trochę za mało, żeby nazywać się front-end webdeveloperem...Piotr Lewandowski edytował(a) ten post dnia 30.08.08 o godzinie 20:20

Temat: Przesyłanie formularza ze strony WWW

Piotr Lewandowski:

Bartosz C.:

Wybacz, ale nie dostrzegam, jak to nazwałeś, "innych użytkowników" niż "klikacze" jeżeli chodzi o formularze.

A to już jest Twój problem, że już na starcie dyskryminujesz innych użytkowników... No cóż, niektórzy starają się tworzyć strony tak, aby mogła je odwiedzić jak największa liczba użytkowników (niezależnie od tego, czy są ludzimi niepełnosprawnymi, z zaburzeniami fizycznymi, poznawczymi, czy neurologicznymi np. ślepota lub słaby wzrok, daltonizm, ograniczony proces poznawczy), a niektórzy po prostu klepią walidujący się kod...

Jakoś tego problemu z mojej strony nie dostrzegam, ale skoro zarzucasz mi, że dyskryminuję tych użytkowników wsadzając input w labela, to może wspaniałomyślnie wyjaśnisz co masz na myśli. Zaznaczam po raz kolejny, że funkcjonalność strony nie cierpi na tym w żaden dostrzegalny dla użytkownika sposób.

Screenreadery w zależności od stopnia zaawansowania czytają treści liniowo bezpośrednio z kodu strony lub analizują to, co wyświetla się na ekranie korzystając z algorytmów rozpoznawania obrazów. W żadnym z powyższych przypadków taka konstrukcja nie przeszkadza w przeanalizowaniu treści strony internetowej. Przestań szukać dziury tam, gdzie jej nie ma, bo śmiało mogę Ci już teraz powiedzieć, że popadasz w skrajności.

Piotr Lewandowski:
Kiedyś wysmarowałem na swoim blogu artykuł o dostępności. Pozwole sobie na zacytowanie dwóch pierwszych akapitów:
W naszym kraju żyje ponad 38 mln ludzi. Według danych GUS około 13% społeczeństwa stanowią osoby niepełnosprawne. Osoby starsze (po 60) stanowią około 15% populacji. Osoby korzystające z mniej popularnych przeglądarek (innych niż Internet Explorer) i urządzeń mobilnych to około 15% internautów. Każda z tych grup powiększa się z roku na roku. Problem dostępności stron WWW oraz aplikacji "webowych" może dotyczyć nawet 25% odwiedzających Twoją stronę.

Czy masz pewność, że treści umieszczone na Twojej stronie WWW są osiągalne dla osób niepełnosprawnych? Czy zastanawiałeś się kiedyś, jak (i czy w ogóle) aplikacja czytająca strony WWW (tzw. screen reader) odczyta Twoją stronę? A co, jeśli odwiedzający Twoją stroną korzystają z przeglądarki innej niż Internet Explorer? Czy wszystko będzie widoczne i na swoim miejscu tak jak sobie to założyłeś tworząc swoją stronę?

Jakoś dane GUS mnie nie przekonują - tak szerokie statystyki zawsze kłamią i nie należy im wierzyć. Jednakże analizując ruch na stronach internetowych, którymi się opiekuję, a jest ich ponad 20 i mają bardzo zróżnicowany profil, jestem w stanie lepiej określić jakiego rodzaju użytkownicy je odwiedzają. Mimo to przyznam się szczerze, że nie przejmuję się sprawdzaniem statystyk, ponieważ nigdy nie publikuję strony, której sam nie sprawdzę na wszystkich popularnych konfiguracjach sprzętowych.

Piotr Lewandowski:
To, że nie myślisz o ludziach innych niż "klikacze" to duża wada i jeszcze większa strata - może nie dla Ciebie - ale dla Twojego klienta, który być może chciałby, aby jego stronę odwiedziało jak najwięcej potencjalnych klientów, a nie tylko użytkownicy IE 6.0.2900.2180.xpsp_sp2_rtm.040803-2158... Chyba w tym wszystkim zapomina się, że strona jest nie po to, żeby ładnie wyglądać, ale aby przyciągała userów, potencjalnych klientów w wyniku czego można dzięki niej zarabiać (oczywiście w przypadku stron komercyjnych)...

Wyjaśniłem powyżej, co miałem na myśli mówiąc, że nie dostrzegam innych użytkowników. Ciągle czepiasz się jednej, w dodatku poprawnie stosowanej konstrukcji i nie potrafisz uzasadnić swojego punktu widzenia.

A moi klienci nie tracą, ponieważ przed przystąpieniem do projektowania serwisu zawsze konsultuję z nimi przeznaczenie strony www i charakterystykę grupy internautów, do której chcemy dotrzeć. Prawda jest taka, że nigdy nie dogodzisz wszystkim na raz, a projektowanie jest sztuką kompromisu - czasem bardziej opłacalną inwestycją jest schowanie całej szeroko pojętej "dostępności" pod ladę i wykrzesanie superodjechanego megawyczesanego wszystkomającego serwisu nafaszerowanego flashem, bo "taki jest target i za to płaci klient". Spójrz chociażby na kampanie reklamowe największych światowych marek. Liczy się, że 80% osób jest w stanie wejść na taką stronę i przez pierwsze 10 minut podnosić swoją szczękę z podłogi.

Piotr Lewandowski:
Edit: na koniec jeszcze dodam, że moim zdaniem sama znajomość (X)HTMLa i umiejętność korzystania z walidatora W3C to trochę za mało, żeby nazywać się front-end webdeveloperem...

No ja nie powiedziałem, że to wystarczy - sam sobie to dopowiadasz. Ja uważam, że od czegoś trzeba zacząć, a kolega, który zaczął temat takich instrukcji powinien szukać. Na Polskim rynku jest tylu samozwańczych front-end web developerów, że nikt już się tym nie powinien przejmować. Profesjonalista profesjonalistę pozna. Mi się Twoje strony podobają i nie widzę sensu dalszej dyskusji, bo ani Ty mnie nie przegadasz, ani ja Ci nie zamierzam wytykać słabych punktów, bo kodujesz w dobrym stylu, a rzadko się zdarza z kimś takim podyskutować.

A tak na marginesie to jak śmiesz zarzucać mi, że moje strony są niedostępne dla osób korzystających z innej przeglądarki niż IE - to chyba największa obelga, jaką można sprzedać doświadczonemu web developerowi.Bartosz C. edytował(a) ten post dnia 30.08.08 o godzinie 22:04

Temat: Przesyłanie formularza ze strony WWW

Bartosz C.:
A tak na marginesie to jak śmiesz zarzucać mi, że moje strony są niedostępne dla osób korzystających z innej przeglądarki niż IE - to chyba największa obelga, jaką można sprzedać doświadczonemu web developerowi.Bartosz C. edytował(a) ten post dnia 30.08.08 o godzinie 22:04

tylko sie nie pobijcie...

Temat: Przesyłanie formularza ze strony WWW

No chyba dałem się sprowokować i mnie poniosło :P

Aczkolwiek nie wytykam rozmówcy domniemane niekompetencje.

Temat: Przesyłanie formularza ze strony WWW

Marcin Lulek:

Bartosz C.:
A tak na marginesie to jak śmiesz zarzucać mi, że moje strony są niedostępne dla osób korzystających z innej przeglądarki niż IE - to chyba największa obelga, jaką można sprzedać doświadczonemu web developerowi.Bartosz C. edytował(a) ten post dnia 30.08.08 o godzinie 22:04

tylko sie nie pobijcie...

Nikt nie zamierza się bić - jestem pacyfistą... Peace, chill, rock'n'roll....