14 Οκτωβρίου 2009



11 Οπτικά λάθη στις μπάρες σας

Σήμερα που λέτε, θα κάνω μάθημα στους νεώτερους bloggers, γιατί τελευταία λαβαίνω γράμματα που μου λένε πάνω κάτω το ίδιο, ότι "ασχολούμαι με το blogging μόνο..1..2..3.. μήνες..". Πραγματικά με χαροποιεί όταν βλέπω κι άλλους ανθρώπους να έρχονται στην παρέα των blogger, και να αποκτά μεγαλύτερη φωνή η Ελληνική μπλογκόσφαιρα. Βλέποντας κατόπιν τα ιστολόγιά τους, παρακολουθώ το πόσο "Γάτος" είναι ο Έλληνας. Μαθαίνει και γρήγορα, και σωστά, όσο αρχάριος κι αν είναι. Εύγε! Σήμερα λοιπόν, θα δείξω στα νέα παιδιά, πώς να αποφεύγουν δύο "οπτικά" λάθη στα ιστολόγιά τους, και συγκεκριμένα στις μπάρες τους. Συχνά θα δείτε ένα όμορφο blog, μα με την πρώτη ματιά, κάτι δεν θα σας κάθεται καλά στο μάτι. Ξέρετε τι; Λείπει η σωστή στοίχιση. Βάζουμε widgets, videos, εικόνες, και στο τέλος, άλλα είναι αριστερά, άλλα δεξιά, άλλα φαίνονται μισά.. Έχω δίκιο; Τώρα βέβαια, τα λέω στους νέους, για να τα ακούνε και κάποιοι 'παλιοί', κατά το ρητόν, "τα λέω τσή πεθεράς, να ντ' ακούει η νύφη" χε χε.. Δείτε μερικά παραδείγματα, για να καταλάβετε τι λέω (Τάκη και Κώστα, μην μου θυμώσετε που χρησιμοποιώ δικά σας ιστολόγια σήμερα, είναι καλός ο σκοπός) Λάθος 1ο: Εικόνα μεγαλύτερη απο το πλάτος της μπάρας. Αποτέλεσμα: Η εικόνα χάνεται μέσα στην μπάρα, δείχνοντας λειψή την εικόνα, το βίντεο ή ότι άλλο βάλαμε. 1.
2.
Στα δύο προηγούμενα όπως θα είδατε, δείχνω και τα δύο λάθη. Πάμε στο επόμενο. Λάθος 2ο: Διαφορετική στοίχιση. Αποτέλεσμα: Το ένα στοιχείο είναι κέντρο, το άλλο αριστερά. 3.
Τι κάνουμε; Δείτε λίγο την παρακάτω εικόνα. 4.
Όπως θα είδατε, δεξιά της, σας δείχνω το πλάτος της μπάρας, και που είναι 280px (το 42 δεν μετράει) Εάν το στοιχείο που τοποθετήσαμε έχει πλάτος μεγαλύτερο απο 280, δηλαδή απο αυτό (αυτής εδώ) της μπάρας (γιατί δεν έχουν όλα τα blog ίδιο πλάτος στις μπάρες τους) τότε θα προεξέχει απο την μπάρα μπαίνοντας σε άλλα χωράφια, ή θα το κρύβει η μπάρα, δείχνοντάς το λειψό. Πάμε τώρα να τα δούμε πιο αναλυτικά. Αυτός εδώ είναι ο κώδικας απο το Youtube, του βίντεο της εικόνας 2.
<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/HXL7SIRvfTU&hl=en&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/HXL7SIRvfTU&hl=en&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>
Έχει τέσερεις φορές εντολές για πλάτος και ύψος (δύο για το καθ' ένα) Σας τα έχω σημαδέψει, με πορτοκαλί το πλάτος, και με μπλέ το ύψος. Όλα καλά μέχρι εδώ; Εύκολο είναι, τι καλά, δεν κάνετε ακόμη τίποτε. Τώρα θα κάνετε. Η μπάρα μας είπαμε ότι είναι ..μόνο 280px πλάτος. Το βίντεο, μας λέει ότι είναι 425px όμως. Αν τον βάλουμε έτσι όπως είναι τον κώδικα, θα έχουμε το αποτέλεσμα της εικόνας 2. Τι κάνουμε; Αλάζουμε τις εντολές για το πλάτος και το ύψος, ανάλογα με το πλάτος της δικής μας μπάρας. Στην περίπτωση του παραδείγματός μας, στα 280 λοιπόν. Πάμε. Και να αλλαγμένος τώρα ο κώδικας. Το μόνο στην ουσία που πειράξαμε, είναι τα 4 μαρκαρισμένα νούμερα. 425-280=145, άρα αφαιρούμε και απο τις δύο μεταβλητές 145 (425-145=280), και έχουμε 280 για πλάτος, και 199 για ύψος (344-145=199).
<object width="280" height="199"><param name="movie" value="http://www.youtube.com/v/HXL7SIRvfTU&hl=en&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/HXL7SIRvfTU&hl=en&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="280" height="199"></embed></object>
Παίξτε λίγο με το ύψος, μέχρι να έρθει εκεί που θέλετε. Το καταλάβατε; Εύκολο; Θα μου πείς, ναι, οκ, αυτό γίνεται με το Youtube, αλά σε μια εικόνα πώς το κάνουμε; Με αυτόν τον κώδικα, δέστε:
<img border="0" width="180" src="http://imageLINK.jpg" height="65" />
Αλάζουμε απλά τις μεταβλητές πλάτους και ύψους. Στο κίτρινο, αντικαταστήστε απλά το Link της εικόνας που ανεβάσατε κάπου. Και πάμε τώρα στο λάθος 2. της στοίχισης. Πώς διορθώνεται; Βάζοντάς τα όλα στο κέντρο, με αυτό το κομάτι κώδικα: Στην αρχή του κώδικα βάζουμε <center> και στο τέλος του </center> Να σας δώσω λοιπόν μια ολοκληρωμένη εικόνα, με τον κώδικα απο το προηγούμενο παράδειγμα: <center><img border="0" width="180" src="http://imageURL.gif" height="65"/></center> Το καταλάβατε; Κάθε φορά που θα βάζετε <center> και </center> στις άκρες ενός κώδικα ή και ενός κειμένου επίσης, θα τα κεντράρει αυτόματα Καλή επιτυχία, και.. Τάκη και Κώστα, φτιάχτε τα, και Κώστα, ο κώδικας που δίνω, είναι έτοιμος να τον αντικαταστήσεις, πάρτον όπως είναι :)
"Γειά σου, Εάν βρέθηκες για πρώτη φορά στο Blog μου, και εάν σε ενδιαφέρουν οι αναρτήσεις μου, μπορείς να εγγραφείς στο RSS feed του Blog. Μπορείς επίσης να κάνοντας εγγραφή στο Newsletter του blog μου, να λαβαίνεις απ ευθείας κάθε μου ανάρτηση στο email σου. Είσαι Twitter user; τότε μπορείς επίσης να με κάνεις Follow στο Twitter. Σε ευχαριστώ που με διαβάζεις,"




Print this post



Related Posts :



11 σχόλια:

Dorothea είπε... Best Blogger Tips

Πάντα χρήσιμες οι αναρτήσεις σου Νίκο μου! Αυτό με το κεντράρισμα ειδικά πάρα πολύ χρήσιμο και ήθελα να το μάθω εδώ και καιρό. Να'σαι καλά!!


lila είπε... Best Blogger Tips

καλημερααααααααααααα!!!!!


αναρχόβλαχος είπε... Best Blogger Tips

χαιρετω...να κανω μια ερωτηση οχι τοσο σχετικη με την αναρτηση,αλλα δεν ηξερα που να την κανω.
πως μπορω να φτιαξω (αν ειναι ψιλοευκολο) μια σελιδα και να βαζω τα δαιφορα banners των blogs,σαν την δικια σου παραδειγμα..
Εκανα εναν πειραματισμο,φτιαχνοντας μια σελιδα μονο για banners αλλα ειναι με την μορφη αναρτησεων και τελοσπαντων δεν ειναι λειτουτρικη,ουτε ομορφη γιατι δεν μπορω να καθορισω πληρως την θεση των banners..εσυ τα εχεις πολυ ωραια,με σειρα..help...


AATON είπε... Best Blogger Tips

*** Dorothea χαίρομαι που σε βοήθησε η ανάρτηση σε κάτι, αν και σε θεωρώ απο τις "γάτες" των Blogs βλέποντας την όλη πορεία σου ως τώρα.

*** lila την καλημέρα και την δική μου

*** φίλε μου αναρχόβλαχος, την σελίδα που έφτιαξα εγώ, είναι υποσέλιδο κανονικής ιστοσελίδας με δικό μου Domain, ( greekmaestro.com )και την πληρώνω ανα δύο χρόνια, δεν είναι δωρεάν.
Αν ψάξεις στο διαδίκτυο, σίγουρα θα βρείς παροχέα για δωρεάν σελίδα, να κάνεις εκεί αυτό που ζητάς. Να ξέρεις όμως ότι δεν θα γλιτώσεις απο τις διαφημίσεις που βάζουν και τους περιορισμούς που τυχόν θέτουν σε δωρεάν λογαριασμούς. Δεν ξέρω αν βοήθησα λίγο. Αν θέλεις να ρωτήσεις κάτι ακόμη, μην διστάσεις


Ανώνυμος είπε... Best Blogger Tips

"όσο ζεις μαθαίνεις"Πραγματικά με βοήθησες πολύ..Ειλικρινά δεν ήξερα πως να μικραίνω τα βιντεάκια και τις εικόνες..
Καλημέρα και καλό..Χειμώνα


Ευρυδίκη"μοναξιά και φως"


AATON είπε... Best Blogger Tips

*** Ευρυδίκη, χαίρομαι που σου φάνηκε χρήσιμη η ανάρτηση


TeO` είπε... Best Blogger Tips

Σε ευχαριστώ πολύ φίλε μου!!! Επιτέλους έφτιαξα τις εικόνες που έβγαιναν από τη sidebar.


AATON είπε... Best Blogger Tips

TeO χαίρομαι που σου φάνηκε χρήσιμη η ανάρτηση φίλε μου καλέ.


TeO` είπε... Best Blogger Tips

Μονάχα θέλω να σε ρωτήσω αν ξέρεις και για διάφορα widgets πώς να μη βγαίνουν από τη μπάρα. Άμα μπεις στο blog μου http://technology-fun.blogspot.com/ , θα δεις ότι πχ η ψηφοφορία που έχω έχει βγει λίγο έξω από τη μπάρα, όπως και το translate και τα φιλικά blogs και τα αθλητικά νέα. Η βοήθεια σου είναι ανεκτίμητη μέχρι τώρα. ;)


AATON είπε... Best Blogger Tips

TeO, απο έξω δεν μπορώ να δώ πολλά ή να πειραματιστώ. Ίσως η χρήση του < center > (χωρίς απόσταση μεταξύ brackets και λέξης) να βοηθούσε όπως επίσης και η χρήση < br/ >(δηλαδή του break). Δοκίμασε


φανη είπε... Best Blogger Tips

Τι εισαι συ καλε;
Που ταχεις μαθει ολ αυτα;
Δεν "παιζεσαι"¨με τιποτα!!!
Εισαι παρα πολυ καλος...μπραβο σου Νικολα..
Ηθελα να σε ρωτησω αν μπορω να διαγραψω σχολια απο αναρτηση μου(το δικο μου στην προκειμμενη) γιατι θελω να το μεταφερω, με την μορφη αναρτησης σε αλλο μου ιστολογιο που εφτιαξα κατα λαθος..ειναι αλλωστε ευκαιρια μ αυτον τον τροπο να ταξινομισω τις αναρτησεις μου που ειναι μπαχαλο!!
Εχω προσπαθησει και δεν μπορω.
Επισης πως να φτιαξω το ιστολογιο μου με ωραια γραφικα, φοντο, λογοτυπο; αυτο που εχω δεν με ικανοποιει καθολου...ειναι απο τα προεπιλεγμενα...
Σ ευχαριστω...και καλα να περνας εκει μακρυα.


Δημοσίευση σχολίου

Πες πως δεν έχεις χρόνο να σχολιάσεις.. να 'χεις πάρει όμως σοβαρό ύφος, καλά;

Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.

Next Next Next