יצירת ממשק עקבי לכל המשתמשים היא מאבק מתמיד לכל מעצב יישום. יצירת עקביות ברשת היא קשה במיוחד, בגלל שהבדלי התצוגה הויזואלית בין דפדפנים ומערכות הפעלה הם מאד רחבים, וכמעט שרירותיים במה שניתן ולא ניתן לעשות.
המקום שבו ההבדלים הללו הכי בולטים הוא באלמנטים של טופס, והמפסיד הכי גדול שם הוא כפתור ה-Submit.
הכפתור הזה, הוא מכוער מדי (ב-Firefox), מכיל באגים (Internet Explorer), או לגמרי בלתי גמיש (Safari).
הפתרון הוא בד”כ הוא להשתמש באלמנטים מסוג Image Input, וליצור את הכפתור בעצמנו. וזה חבל, מפני שזה מחייב אותנו לפתוח את פוטושופ כל פעם שצריכים כפתור חדש. מה שאנו צריכים זה משהו גמיש יותר, המיועד לעיצוב. למזלנו, הפתרון כבר קיים, וכל מה שהוא צריך זה מעט אהבה.
גבירותי ורבותיי, הרשו לי להציג לפניכם: אלמנט ה-<button>.
כפתורים המיוצרים באמצעות אלמנט ה-<button> מתפקדים בדיוק כמו כפתורים המיוצרים באמצעות אלמנט ה-<input>, רק שהם מציעים אפשרויות תצוגה עשירות יותר: לאלמנט ה-<button> ניתן לתת תוכן. לדוגמה אלמנט ה-<button> המכיל תמונה מתפקד ונראה כמו אלמנט <input> מסוג image, אבל מאפשר להכניס לתוכו גם תוכן.
בהמשך המאמרון המחבר מראה איך יצרו ועיצבו כפתורים מסוג <button>.