Μικρά – μικρά από την σχεδίαση της ιστοσελίδας για τα Θέρμα Ικαρίας

Λειτουργία επερχόμενων εκδηλώσεων στη σελίδα visitTherma.com

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

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

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

Ωστόσο, έπρεπε με κάποιο τρόπο να βοηθήσουμε τον χρήστη να διακρίνει και τις πιο κοντινές στην τρέχουσα ημέρα εκδηλώσεις. Έτσι, φανταστείτε τον διαχειριστή της ιστοσελίδας να έχει περάσει όοολες τις εκδηλώσεις του καλοκαιριού (π.χ. μέχρι και τον Σεπτέμβρη) και να βρισκόμαστε στα τέλη Ιουνίου, όπως τώρα που γράφονται αυτές οι γραμμές καλή ώρα. Τι θα δούμε στην αρχική οθόνη; Στην αρχική οθόνη, στο section των εκδηλώσεων εμφανίζονται 3 μόνο εκδηλώσεις. Η πλατφόρμα ελέγχει την τρέχουσα ημερομηνία (π.χ. την σημερινή 22/6/2017) και φέρνει στο αριστερό μεγάλο πλαίσιο την αμέσως επόμενη εκδήλωση που ακολουθεί από την συγκεκριμένη ημερομηνία! Στη συνέχεια φέρνει τις δύο μεθεπόμενες, στα δύο μικρότερα δεξιά πλαίσια..αν υπάρχουν. Αν δεν υπάρχουν απλά εμφανίζονται οι εκδηλώσεις που μόλις, φίλοι επισκέπτες, χάσατε!

Σελίδα με όλες τις εκδηλώσεις

Αν τώρα κάποιος θέλει να δει όλες τις εκδηλώσεις, τότε απλά πατάει στο «Περισσότερες Εκδηλώσεις» και μεταβαίνει στην σελίδα των εκδηλώσεων για τα Θέρμα και την Ικαρία γενικά! Εκεί εμφανίζονται ό,τι έχει καταχωρηθεί στην κατηγορία των «Εκδηλώσεων», με την ημερομηνία που θα πραγματοποιηθεί ή πραγματοποιήθηκε η εκδήλωση, πάνω δεξιά. Στη σελίδα των εκδηλώσεων έχουμε επιλέξει ένα σορτάρισμα «φθίνουσας» ταξινόμησης..δηλαδή οι εκδηλώσεις με «μεγαλύτερη» ημερομηνία εμφανίζονται πρώτες.

Προσέξτε την διαφορά στα στιγμιότυπα που παραθέτουμε. Στην αρχική σελίδα του visitTherma στο κομμάτι των εκδηλώσεων είδαμε πως ξεχωρίζει η εκδήλωση για το πανηγύρι στον Κουντουμά, μιας και είναι η αμέσως επόμενη από την σημερινή ημερομηνία. Αντιθέτως στην σελίδα με όλες τις εκδηλώσεις πρώτη εμφανίζεται η εκδήλωση «Ιkarian Run» μιας και είναι η «μεγαλύτερη» ημερολογιακά (τέλος Αυγούστου.)

Responsive iframe Google Maps

Αν διαβάσει κανείς το άρθρο για το πανηγύρι στον Κουντουμά, θα δει ότι στο τέλος υπάρχει ενσωματωμένος ένας χάρτης google που δείχνει την διαδρομή από τα Θέρμα μέχρι τον Κουντουμά.

Το θέμα με την ενσωμάτωση κάποιου χάρτη της google με χρήση iframe είναι ότι το iframe δίνει συγκεκριμένες διαστάσεις (π.χ. 600×420). Σε μια σχεδίαση όμως που όλα θέλουμε να εμφανίζονται τέλεια σε κάθε συσκευή (τηλεοράσεις, υπολογιστές, tablets, smartphones, τοστιέρες) κάτι τέτοιο μας χτυπούσε άσχημα. Οπότε με λίγο css «φτιάξαμε» τον χάρτη της google να προσαρμόζεται και αυτός ανάλογα με τις διαστάσεις της οθόνης!

Enjoyed it? Share it....
Share on Facebook
Facebook
Tweet about this on Twitter
Twitter
Share on Google+
Google+
Email this to someone
email
Print this page
Print

Αφήστε μια απάντηση

Η ηλ. διεύθυνση σας δεν δημοσιεύεται. Τα υποχρεωτικά πεδία σημειώνονται με *