Αγαπημένο HTML5 TAG!

Ερωτήσεις και απαντήσεις σχετικές με την HTML, XHTML και την κατασκευή σελίδων για το Web.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8574
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από Basilakis » 06 Δεκ 2010 17:14

Για να δούμε, έχετε αρχίσει να τη χρησιμοποιείται; Έχετε παρατηρήσει κάτι που σας έχει κεντρίσει το ενδιαφέρων;

Προσωπικά με κέντρισε το form validation που προστέθηκε...


Εσάς;;

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από korgr » 06 Δεκ 2010 20:04

Προσωπικά βλέπω μια διαφορά στο validation.
Κάποια χαζά που προϋπήρχαν δεν τα βλέπω ξανά. Πχ το target='_blank' στα <a> κάνουν μια χαρά validation

Όσο για τις φόρμες, τώρα που ο κάθε developer (που σέβεται τον εαυτό του) έχει προχωρήσει το form validation σε υπερσύγχρονες server side methods, μάλλον μοιάζει παλαιολιθικής εποχής το build in validation της html5.

Συμπέρασαμα:
Δουλεύω HTML 5 πρότυπο, με τα παλαιότερα tags αλλά κάνω καλύτερα την δουλειά μου!

Προσωπικά θεωρώ τουλάχιστον αστείο να σου δίνουν tags οπως <footer> και το μόνο που κερδίζεις είναι ...semantic code.
Το θέμα είναι να γράφεις:

Κώδικας: Επιλογή όλων

<footer>Footer Contents</footer>
και όπου και αν το βάλεις, να στο κολάει bottom σε κάθε ανάλυση και διάσταση του παραθύρου...
Τέτοιες λύσεις θα έλυναν τα χέρια μας και όχι το να αντικαταστήσουμε το <div id="footer> με <footer> και να συνεχίζεις να χρειάζεσαι css για το positioning!

Άβαταρ μέλους
meet-sos
Δημοσιεύσεις: 167
Εγγραφή: 24 Δεκ 2008 00:08

Αγαπημένο HTML5 TAG!

Δημοσίευση από meet-sos » 23 Δεκ 2010 18:20

Κώδικας: Επιλογή όλων

<video></video>
ερωτηση:
ποιοι browsers υποστηριζουν ΗΤΜΛ5?

Άβαταρ μέλους
dimsis
Reporter
Δημοσιεύσεις: 7994
Εγγραφή: 25 Ιούλ 2001 03:00

Αγαπημένο HTML5 TAG!

Δημοσίευση από dimsis » 23 Δεκ 2010 18:55


leandroz21
Δημοσιεύσεις: 83
Εγγραφή: 24 Ιούλ 2012 20:24
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από leandroz21 » 07 Σεπ 2012 13:28

To <aside> tag , μου κεντρισε το ενδιαφερον μεχρι να μαθω σε ποιες περιπτωσεις να το χρησιμοποιω

Άβαταρ μέλους
dva_dev
Script Master
Δημοσιεύσεις: 3790
Εγγραφή: 16 Σεπ 2005 01:32
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από dva_dev » 07 Σεπ 2012 20:40

korgr έγραψε: Προσωπικά θεωρώ τουλάχιστον αστείο να σου δίνουν tags οπως <footer> και το μόνο που κερδίζεις είναι ...semantic code.
Το θέμα είναι να γράφεις:

Κώδικας: Επιλογή όλων

<footer>Footer Contents</footer>
και όπου και αν το βάλεις, να στο κολάει bottom σε κάθε ανάλυση και διάσταση του παραθύρου...
Τέτοιες λύσεις θα έλυναν τα χέρια μας και όχι το να αντικαταστήσουμε το <div id="footer> με <footer> και να συνεχίζεις να χρειάζεσαι css για το positioning!
Λογικό, αν περιμένεις αντίστοιχα και το head tag να το κολλάει στην κορυφή.

Κάπως αντίστοιχα με το thead tfoot

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από korgr » 07 Σεπ 2012 22:16

Το footer είναι μια ιδιάζουσα περίπτωση και το πόσες πατέντες χρειάζονται για το sticky footer, αποδεικνύουν το πόσο fail είναι ο σχεδιασμός των css στο συγκεκριμένο positioning!
Βρες μου εσύ μια pure css λύση ΜΕΤΑΒΛΗΤΟΥ ΥΨΟΥΣ footer που να είναι bottom sticky, να ανακαλέσω αμέσως :p

Άβαταρ μέλους
apsuh0s
Script Master
Δημοσιεύσεις: 410
Εγγραφή: 01 Νοέμ 2005 21:38
Τοποθεσία: Ηράκλειο
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από apsuh0s » 08 Σεπ 2012 04:17

Προσωπικά θεωρώ τουλάχιστον αστείο να σου δίνουν tags οπως <footer> και το μόνο που κερδίζεις είναι ...semantic code.
Νότη, εγώ από την άλλη το θεωρώ την πλέον σημαντική προσθήκη. Η σημασιολογία (semantics) όπως την αντιλαμβάνομαι εγώ είναι η μελέτη του νοήματος της γλώσσας, οποιασδήποτε γλώσσας. Με αυτό το σκεπτικό, όταν γράφεις πρέπει να έχουν σημασία αυτά που γράφεις. Μια τέτοια προσέγγιση οδηγεί σε περιεχόμενο με σωστή δομή, ιεραρχημένο και κατ' επέκταση κατανοητό και προσβάσιμο.

Αναπόφευκτα οδηγούμαστε στην καίρια ερώτηση. Έχει νόημα να γράφουμε με σημασία στο web; Αφού ο τελικός χρήστης τα ίδια θα βλέπει:

Κώδικας: Επιλογή όλων

<style>h1 &#123; font-size&#58; 24px; &#125;</style>
<h1>Freestuff.gr</h1>

Κώδικας: Επιλογή όλων

<style>p &#123; font-size&#58; 24px; &#125;</style>
<p>Freestuff.gr<p>
Σαφέστατα έχει νόημα.

Η δομή του περιεχομένου σου είναι καθαρή. Αυτό οδηγεί σε ευκολότερη κατανόηση του κώδικα, γρηγορότερη επεξεργασία και συνεπώς αύξηση της παραγωγικότητας και της ανταγωνιστικότητας από μέρους σου.

Η δομή του περιεχομένου σου έχει σοβαρές πιθανότητες να γίνει αντιληπτή από ένα μεγάλο εύρος συσκευών. Ένας ακόμα τρόπος αύξησης της παραγωγικότητας και της ανταγωνιστικότητας.

Η δομή του περιεχομένου σου γίνεται κατανοητή από μηχανές αναζήτησης. Ακόμη ένας τρόπος!

Τέλος, είναι και ο ψυχαναγκασμός που έχουν ορισμένοι. Όπως και να το κάνουμε όταν γράφεις semantic κώδικα κοιμάσαι πιο ήσυχα τα βράδια. Εκεί να δεις τρόπος..

Το footer και όλα τα υπόλοιπα δομικά στοιχεία που εισήχθησαν στην HTML5 αυτό το νόημα έχουν και προσωπικά με βρίσκει απόλυτα σύμφωνο. Το να κολλάει bottom όπως αναφέρεις, δεν συνάδει με τη σημασιολογική προσέγγιση που φαντάζομαι πως ήθελαν να αποδώσουν όταν τα προσθέταν.

Τέλος με τα ψιλά γράμματα. :hammer: Αν θες δώσε ένα παράδειγμα του μεταβλητού footer που αναφέρεις διότι δεν το καταλαβαίνω και με έχει ιντριγκάρει 8)
.ninja { color: black; visibility: hidden !important; }

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από korgr » 08 Σεπ 2012 09:04

Κώστα δεν είμαι κατά του semantic και καλά έκαναν και τα πρόσθεσαν. Αυτό που λέω είναι πως κάνεις που κάνεις την δουλειά, κάνε την ολοκληρωμένα!
Παράδειγμα αν γράψω <a href="#">An anchor</a> το χρώμα του κειμένου θα αλλάξει σε μπλε χωρίς να χρειάζεται να πω <style>a {color: blue;}</style>
Το ίδιο για το Bold & font-size του <h1> κλπ κλπ

Θέλω να πω πως μερικές φορές η σημασία του tag (ως semantic) σχετίζεται άμεσα και με το styling του ως default συμπεριφορά.

Δεν λέω πως το tag <footer> είναι πάντα sticky bottom (χρησιμοποιείται και μέσα σε <article> κλπ) αλλά ρε αδερφέ θα μπορούσε να συνοδεύεται από ένα attribute πχ <footer sticky="bottom"> και να μην χρειάζονται όλες οι αλχημείες που θα μου προτείνεις τώρα που θα σου πω:

Footer μεταβλητού ύψους είναι το footer του οποίου δεν γνωρίζουμε εκ των προτέρων τον όγκο της πληροφορίας που θα περιέχει.
Για παράδειγμα στο A request σου έρχεται με height 70px, και στο επόμενο μπορεί να σου έρθει με height 150px.

Μεθόδους για sticky footer με σταθερό ύψος, γνωρίζω (αρνητικά top-margins, bottom paddings του container κλπ). Όλα αυτά όμως προϋποθέτουν πως γνωρίζουμε το ύψος του footer.

Πέταξα το γάντι :lol:

Άβαταρ μέλους
ThyClub
Honorary Member
Δημοσιεύσεις: 5312
Εγγραφή: 17 Νοέμ 2003 00:21
Τοποθεσία: Hell's Kitchen
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από ThyClub » 08 Σεπ 2012 10:29

@korgr
Twitter bootstrap και καθάρισες

@all
Αγαπημένο tag δεν υπάρχει. Πιστεύω ότι τρομερή προσθήκη είναι τα attributes -> data-[κάτι εδώ] καθώς και τα microdata του στύλ itemprop κτλ...

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από korgr » 08 Σεπ 2012 11:36

ThyClub έγραψε:@korgr
Twitter bootstrap και καθάρισες
Έλεος άσε που είναι και buggy από όσα έχω διαβάσει και σε διάφορα fora
Και σε κάθε περίπτωση δεν μπορούμε να θεωρούμε δεδομένη την χρήση του όποιου framework. Εξετάζουμε την native φύση της html5-css3

alou
Script Master
Δημοσιεύσεις: 1374
Εγγραφή: 24 Αύγ 2007 19:52
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από alou » 08 Σεπ 2012 16:44

korgr έγραψε:
Πέταξα το γάντι :lol:
http://cssdesk.com/rcjac
:P

Γίνεται και χωρίς το εξωτερικό div με body class=... αλλά δεν δουλεύει στο cssdesk έτσι.

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από korgr » 08 Σεπ 2012 17:23

Φίλε μου με table το κάνω και εγώ! :lol:
Εκτός αν όταν ένα table (display: table-row;) το "ντύνεις" με ρούχα header, section και footer, εσύ θεωρείς πως έχεις tableless layout :wink:

Τα υπόλοιπα περί του responsive design και του display: table-row; θα στα πει ο apsuhos

alou
Script Master
Δημοσιεύσεις: 1374
Εγγραφή: 24 Αύγ 2007 19:52
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από alou » 08 Σεπ 2012 17:36

korgr έγραψε:Φίλε μου με table το κάνω και εγώ! :lol:
Εκτός αν όταν ένα table (display: table-row;) το "ντύνεις" με ρούχα header, section και footer, εσύ θεωρείς πως έχεις tableless layout :wink:

Τα υπόλοιπα περί του responsive design και του display: table-row; θα στα πει ο apsuhos
Semantic wise, δεν είναι table βέβαια αλλά δε διαφωνώ ότι προκύπτουν άλλα θέματα με τέτοιου είδους display. Όμως οι εναλλακτικές για αυτό που περιγράφεις είναι είτε έτσι είτε jsέτσι :D

Άβαταρ μέλους
apsuh0s
Script Master
Δημοσιεύσεις: 410
Εγγραφή: 01 Νοέμ 2005 21:38
Τοποθεσία: Ηράκλειο
Επικοινωνία:

Αγαπημένο HTML5 TAG!

Δημοσίευση από apsuh0s » 08 Σεπ 2012 17:41

alou όπως το βλέπω νομίζω χρειάζεται τουλάχιστον ένα εξωτερικό container. Επίσης είχες ένα typo σε unit measurment. Για δες αυτό:

Κώδικας: Επιλογή όλων

<div class="kormara">
<div class="content">
    <header class="theheader"><h1>Picking up Noti's glove &#58;P</h1></header>
    <section class="thecontent"><p>Loren ipsum klp klp</p></section>
</div>
    <footer class="thefooter">Sticky footer, variable height</footer>
</div>

html, body &#123;
  font-family&#58; 'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  height&#58;100%;
  margin&#58;0px;
  
&#125;
.kormara &#123;
  display&#58; table;
  height&#58; 100%;
  width&#58; 100%;
  background&#58;grey;
&#125;
.thefooter &#123;
  height&#58; 100%;
  background&#58;yellow;
&#125;
.content &#123; 
  display&#58; table-row;
  height&#58; 100%;
&#125;
Η λύση του alou είναι valid. Δεν θεωρείται δομικό table το table-row.
.ninja { color: black; visibility: hidden !important; }

Απάντηση

Επιστροφή στο “HTML και XHTML”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 1 επισκέπτης