Dimitrios Tritsetakis

Dimitrios Tritsetakis

Δευτέρα, 12 Οκτωβρίου 2015 03:00

Facemed

Παρασκευή, 09 Οκτωβρίου 2015 03:00

Aegean Travel

Το Adobe Flash, το πιο μισητό πρόγραμμα στον πλανήτη, πεθαίνει οριστικά… Ουσιαστικά, είναι εδώ και χρόνια που βρίσκεται στα τελευταία του αλλά χθες έλαβε το τελειωτικό του χτύπημα.

kill flash

Η Google επισήμως «σκοτώνει» τις διαφημίσεις με Flash. Από την 1η Σεπτεμβρίου, όλες οι διαφημίσεις που χρησιμοποιούν την τεχνολογία θα απαιτεί ο χρήστης να κάνει κλικ για να ξεκινήσει η διάδραση, αλλιώς θα παραμένει ανενεργό. Μια νέα ρύθμιση, ενεργοποιημένη από προεπιλογή στο Chrome βελτιστοποιεί αυτόματα τα plugins για εξοικονόμηση ενέργειας της μπαταρίας και χρήση της CPU που στοχεύουν ειδικά στο αυτόματο ξεκίνημα των διαφήμισεων.

Η αλλαγή παρουσιάστηκε ως ότι το Google AdWords καθιστά πλέον δυνατό να μετατρέψει αυτόματα τις Flash διαφημίσεις σε HTML5 ( Let AdWords automatically convert Flash to HTML5 for you ), ως μια φιλικότερη και ασφαλέστερη μορφή για αναπαραγωγή.

Τον τελευταίο καιρό, η υποστήριξη των προγραμμάτων περιήγησης για τις σύγχρονες μορφές, όπως βίντεο HTML5, έχουν γίνει επιτέλους αρκετά διαδεδομένη για να μπορεί η Googleνα κάνει μια τέτοια κίνηση. Η πλειοψηφία των χρηστών είναι σε θέση να ξεφορτωθεί το Flash ήδη, αν και ο χρόνος του θανάτου δεν μπορεί πραγματικά να ονομαστεί μέχρι να σταματήσουν να το χρησιμοποιούν οι πάροχοι streamingυπηρεσιών - αλλά αυτό είναι ήδη στον ορίζοντα για πολλούς.

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

Ο Chrome θα ενημερωθεί αυτόματα στην έκδοση 42 σήμερα, το οποίο θα λανσάρει την προεπιλεγμένη ρύθμιση για flash  “ detect and run important plugin content ” ως απενεργοποιημένη.

Παρασκευή, 28 Αυγούστου 2015 03:00

Font Sizing με PX, ΕΜ και REM

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

Πλέον υπάρχουν 3 βασικές τεχνικές:

  1. Ορισμός μεγέθους με px (pixels)
  2. Ορισμός μεγέθους με em
  3. Ορισμός μεγέθους με rem

 

Ορισμός μεγέθους με px (pixels)

Στα αρχικά βήματα του WEB όλοι χρησιμοποιούσαν pixels για να ορίσουν το μέγεθος του κειμένου. Είναι αξιόπιστο, συνεπές και η πιο δημοφιλή μέθοδος ακόμη και σήμερα. Το μέγεθος του κειμένου ορίζεται καθ’ ύψος βάση του ποσού των pixels που έχουμε επιλέξει. Η τεχνική μειονεκτεί αρχικά στο χρήστες του Internet Explorer -μέχρι και τον IE9- δεν έχουν την δυνατότητα να κάνουν zoom στο κείμενο μέσω την λειτουργία του browser, μια λειτουργία που την υποστηρίζουν όλοι οι μοντέρνοι browsers. Σημαντικό μειονέκτημα επίσης είναι η προσαρμοστικότητα του κειμένου στην προβολή σε διαφορετικές οθόνες (κινητά, Tablet κλπ.) όπου ο developer θα πρέπει να αλλάζει το μέγεθος σε κάθε προβολή, αντί αυτή να γίνεται αναλογικά με την οθόνη.

Ορισμός μεγέθους με em

Η όλη ανικανότητα στην προσαρμοστικότητα του κειμένου στον IE συνέχιζε να προβληματίζει ώσπου να αρχίσουμε να χρησιμοποιούμε τις μονάδες em. Ο Richard Rutter στο άρθρο του «How to size text using ems» το 2004 παρουσίασε για πρώτη φορά την χρήση των em. H παρακάτω τεχνική τροποποιεί την βάση του μεγέθους της γραμματοσειράς του body.

body { font-size:62.5%; }
h1 { font-size: 2.4em; } /* =24px */
p { font-size: 1.4em; } /* =14px */
li { font-size: 1.4em; } /* =14px */

Με την αναφορά επί τοις εκατό στο body πετυχαίνουμε ότι 1em ισούται με 10px, αντί για 16px που είναι η προεπιλογή. Άρα για να ορίσουμε το μέγεθος σε 14px αρκεί να ορίσουμε την αντίστοιχη τιμή στα 1.4em.

Το πρόβλημα είναι ότι με em-based font sizing τεχνικές τα μεγέθη περιπλέκονται καθώς προχωράμε στο επόμενο επίπεδο ενός στοιχείου, για παράδειγμα μια λιστα μεσα σε μια άλλη λιστα όπου τα στοιχεία του 2ου επιπέδου ενώ θα έπρεπε να έχουν μέγεθος 14px έχουν 20px, αντίστοιχα στο 3ο επίπεδο 27px κλπ. Αυτό μπορεί να αποφευφχθεί με το να ορίσουμε τα επόμενα επίπεδα με 1em, για να αποφύγουμε αυτήν την σύγχυση. Ωστόσο αξίζει να περιπλέκουμε τόσο πολύ τον κώδικα μας?

body { font-size:62.5%; }
h1 { font-size: 2.4em; } /* =24px */
p { font-size: 1.4em; } /* =14px */
li { font-size: 1.4em; } /* =14px */
li li, li p /* etc */ { font-size: 1em; }

Ορισμός μεγέθους με rem

Με την είσοδο της CSS3 παρουσιάστηκαν κάποιες κανούργιες μονάδες, μια από αυτές είναι και το rem, που ουσιαστικά είναι συντόμευση του “root em”. Αν από μόνο του αυτό δεν είναι αρκετό ας δούμε λίγο πως χρησιμοποιούμε το rem.

Σε αντίθεση με το em το οποίο καθορίσει το μέγεθος από το στοιχείο γονέα και δημιουργεί το μπέρδεμα που αναφέραμε πιο πάνω, το μέγεθος του rem καθορίζεται από την ρίζα (root) όλων των στοιχείων, δηλαδή το <html>. Αυτό σημαίνει ότι μπορούμε να ορίσουμε μεμονομένα το μέγεθος του html στοιχείου και μαζί με αυτό όλα τα υπόλοιπα στοιχεία με rem τα οποία θα συνδέονται με αυτό με κάποιο ποσοστό επι τοις εκατό.

html { font-size: 62.5%; }
body { font-size: 1.4rem; } /* =14px */
h1 { font-size: 2.4rem; } /* =24px */

Ορίσαμε την κλάση του μεγέθους της γραμματοσειράς στο 62.5% για να μπορούμε να ρυθμίζουμε αντίστοιχα τα υπόλοιπα στοιχεία, όπως θα κάναμε και με τα px.

Ας δούμε τώρα ποιοί browsers υπστηρίζουν την παραπάνω δομή. Προς έκπληξη μας μπορούμε να δούμε ότι η υποστήριξη έρχεται από όλους τους γνωστούς μας φυλλομετρητές: Safari 5, Chrome, Firefox 3.6+, ακόμη και Internet Explorer 9. Αξίζει να αναφέρουμε ότι ο IE9 υποστηρίζει και την αυξομείωση του κειμένου με την χρήση rem.

Για τους browsers που δεν υποστηρίζουν το rem (ΙΕ6, ΙΕ7… η χρήση τους είναι λιγότερο από 0.5% των υπολογιστών που έχουν πρόσβαση στο Διαδίκτυο) μπορούμε να ορίσουμε ενα fall-back με την αξιόπιστη λύση των px.

html { font-size: 62.5%; }
body { font-size: 14px; font-size: 1.4rem; } /* =14px */
h1 { font-size: 24px; font-size: 2.4rem; } /* =24px */

Τέλος! Έχουμε προβλέψει κάθε εκδοχή για όλους τους browsers και για οποιαδήποτε αλλαγή του κειμένου μας.

 

Σάββατο, 28 Φεβρουαρίου 2015 02:00

Το Joomla 3.4 είναι διαθέσιμο

Το γνωστό σε όλους μας CMS Joomla ανακοίνωσε επίσημα την κυκλοφορία της τελευταία του έκδοση 3.4.0 με την υποστήριξη του Joomla! Project και της Production Leadership Team.

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

Πέμπτη, 19 Φεβρουαρίου 2015 02:00

Τα 5 Καλύτερα jQuery/CSS menu που θα δούμε το 2015

Τα μενού πλοήγησης ή όπως τα έχουμε όλοι γνωστά με την αγγλική τους ορολογία navigation menus κατέχουν ένα πολύ σημαντικό ρόλο σε έναν ιστότοπο, είτε αυτός είναι μικρός ή μεγάλος. Το μενού πλοήγησής είναι μια σύντομη απεικόνιση του περιεχομένου που έχει ένας ιστότοπος και θα βοηθήσει με κάθε τρόπο νέους ή παλιούς επισκέπτες να βρουν με τον γρηγορότερο τρόπο αυτό που αναζητούν.

Σελίδα 2 από 2
ΕΣΠΑ