Wednesday, October 3, 2018

Cara Membuat icon Simbol Tanda Panah atau icon Simbol Lainnya ke Website dengan Kode HTML

Halo sobat,
Sekarang saya mau bagi sedikit Tips atau Cara Membuat icon Tanda Panah atau icon Simbol Lainnya ke Website dengan Kode HTML, yang sangat berguna untuk membuat menu atau icon status pada kontent website kita jadi lebih menarik dilihat.
Ada banyak icon atau simbol yang bisa ditampilkan di menu atau halaman website kita dengan menggunakan kode HTML seperti Tanda Panah, Tanda Centang, Tanda Silang, Tanda Tanya, Kotak, Gunting, Tangan, Angka, Bintang dan lain-lain.
Dengan menggunkan kode HTML untuk menampilkan icon atau simbol dalam halaman website kita maka akan mempengaruhi kecepatan loading dari halaman yang dimuat oleh browser saat visitor atau pengunjung membuka website kita pada browser mereka.
Cara menggunakannya juga sangat mudah, kalian hanya meletakkan secuil kode HTML didepan ataupun dibelakang suatu tulisan yang kalian inginkan.

Sebagai contoh saya meletekkan koda HTML simbol berada di belakang tulisan seperti dibawah ini :
<p>Status online &#9989;</p>
Akan menampilkan output : Status online ✅
<p>Status online &#10060;</p>
Akan menampilkan output : Status online ❌
Berikut beberapa kode HTML yang bisa digunakan untuk menampilkan simbol pada website kalian:
CharDecHexEntityName
9985 2701 UPPER BLADE SCISSORS
9986 2702 BLACK SCISSORS
9987 2703 LOWER BLADE SCISSORS
9988 2704 WHITE SCISSORS
9989 2705 WHITE HEAVY CHECK MARK
9990 2706 TELEPHONE LOCATION SIGN
9991 2707 TAPE DRIVE
9992 2708 AIRPLANE
9993 2709 ENVELOPE
9994 270A RAISED FIST
9995 270B RAISED HAND
9996 270C VICTORY HAND
9997 270D WRITING HAND
9998 270E LOWER RIGHT PENCIL
9999 270F PENCIL
10000 2710 UPPER RIGHT PENCIL
10001 2711 WHITE NIB
10002 2712 BLACK NIB
10003 2713 CHECK MARK
10004 2714 HEAVY CHECK MARK
10005 2715 MULTIPLICATION X
10006 2716 HEAVY MULTIPLICATION X
10007 2717 BALLOT X
10008 2718 HEAVY BALLOT X
10009 2719 OUTLINED GREEK CROSS
10010 271A HEAVY GREEK CROSS
10011 271B OPEN CENTRE CROSS
10012 271C HEAVY OPEN CENTRE CROSS
10013 271D LATIN CROSS
10014 271E SHADOWED WHITE LATIN CROSS
10015 271F OUTLINED LATIN CROSS
10016 2720 MALTESE CROSS
10017 2721 STAR OF DAVID
10018 2722 FOUR TEARDROP-SPOKED ASTERISK
10019 2723 FOUR BALLOON-SPOKED ASTERISK
10020 2724 HEAVY FOUR BALLOON-SPOKED ASTERISK
10021 2725 FOUR CLUB-SPOKED ASTERISK
10022 2726 BLACK FOUR POINTED STAR
10023 2727 WHITE FOUR POINTED STAR
10024 2728 SPARKLES
10025 2729 STRESS OUTLINED WHITE STAR
10026 272A CIRCLED WHITE STAR
10027 272B OPEN CENTRE BLACK STAR
10028 272C BLACK CENTRE WHITE STAR
10029 272D OUTLINED BLACK STAR
10030 272E HEAVY OUTLINED BLACK STAR
10031 272F PINWHEEL STAR
10032 2730 SHADOWED WHITE STAR
10033 2731 HEAVY ASTERISK
10034 2732 OPEN CENTRE ASTERISK
10035 2733 EIGHT SPOKED ASTERISK
10036 2734 EIGHT POINTED BLACK STAR
10037 2735 EIGHT POINTED PINWHEEL STAR
10038 2736 SIX POINTED BLACK STAR
10039 2737 EIGHT POINTED RECTILINEAR BLACK STAR
10040 2738 HEAVY EIGHT POINTED RECTILINEAR BLACK STAR
10041 2739 TWELVE POINTED BLACK STAR
10042 273A SIXTEEN POINTED ASTERISK
10043 273B TEARDROP-SPOKED ASTERISK
10044 273C OPEN CENTRE TEARDROP-SPOKED ASTERISK
10045 273D HEAVY TEARDROP-SPOKED ASTERISK
10046 273E SIX PETALLED BLACK AND WHITE FLORETTE
10047 273F BLACK FLORETTE
10048 2740 WHITE FLORETTE
10049 2741 EIGHT PETALLED OUTLINED BLACK FLORETTE
10050 2742 CIRCLED OPEN CENTRE EIGHT POINTED STAR
10051 2743 HEAVY TEARDROP-SPOKED PINWHEEL ASTERISK
10052 2744 SNOWFLAKE
10053 2745 TIGHT TRIFOLIATE SNOWFLAKE
10054 2746 HEAVY CHEVRON SNOWFLAKE
10055 2747 SPARKLE
10056 2748 HEAVY SPARKLE
10057 2749 BALLOON-SPOKED ASTERISK
10058 274A EIGHT TEARDROP-SPOKED PROPELLER ASTERISK
10059 274B HEAVY EIGHT TEARDROP-SPOKED PROPELLER ASTERISK
10060 274C CROSS MARK
10061 274D SHADOWED WHITE CIRCLE
10062 274E NEGATIVE SQUARED CROSS MARK
10063 274F LOWER RIGHT DROP-SHADOWED WHITE SQUARE
10064 2750 UPPER RIGHT DROP-SHADOWED WHITE SQUARE
10065 2751 LOWER RIGHT SHADOWED WHITE SQUARE
10066 2752 UPPER RIGHT SHADOWED WHITE SQUARE
10067 2753 BLACK QUESTION MARK ORNAMENT
10068 2754 WHITE QUESTION MARK ORNAMENT
10069 2755 WHITE EXCLAMATION MARK ORNAMENT
10070 2756 BLACK DIAMOND MINUS WHITE X
10071 2757 HEAVY EXCLAMATION MARK SYMBOL
10072 2758 LIGHT VERTICAL BAR
10073 2759 MEDIUM VERTICAL BAR
10074 275A HEAVY VERTICAL BAR
10075 275B HEAVY SINGLE TURNED COMMA QUOTATION MARK ORNAMENT
10076 275C HEAVY SINGLE COMMA QUOTATION MARK ORNAMENT
10077 275D HEAVY DOUBLE TURNED COMMA QUOTATION MARK ORNAMENT
10078 275E HEAVY DOUBLE COMMA QUOTATION MARK ORNAMENT
10079 275F HEAVY LOW SINGLE COMMA QUOTATION MARK ORNAMENT
10080 2760 HEAVY LOW DOUBLE COMMA QUOTATION MARK ORNAMENT
10081 2761 CURVED STEM PARAGRAPH SIGN ORNAMENT
10082 2762 HEAVY EXCLAMATION MARK ORNAMENT
10083 2763 HEAVY HEART EXCLAMATION MARK ORNAMENT
10084 2764 HEAVY BLACK HEART
10085 2765 ROTATED HEAVY BLACK HEART BULLET
10086 2766 FLORAL HEART
10087 2767 ROTATED FLORAL HEART BULLET
10088 2768 MEDIUM LEFT PARENTHESIS ORNAMENT
10089 2769 MEDIUM RIGHT PARENTHESIS ORNAMENT
10090 276A MEDIUM FLATTENED LEFT PARENTHESIS ORNAMENT
10091 276B MEDIUM FLATTENED RIGHT PARENTHESIS ORNAMENT
10092 276C MEDIUM LEFT-POINTING ANGLE BRACKET ORNAMENT
10093 276D MEDIUM RIGHT-POINTING ANGLE BRACKET ORNAMENT
10094 276E HEAVY LEFT-POINTING ANGLE QUOTATION MARK ORNAMENT
10095 276F HEAVY RIGHT-POINTING ANGLE QUOTATION MARK ORNAMENT
10096 2770 HEAVY LEFT-POINTING ANGLE BRACKET ORNAMENT
10097 2771 HEAVY RIGHT-POINTING ANGLE BRACKET ORNAMENT
10098 2772 LIGHT LEFT TORTOISE SHELL BRACKET ORNAMENT
10099 2773 LIGHT RIGHT TORTOISE SHELL BRACKET ORNAMENT
10100 2774 MEDIUM LEFT CURLY BRACKET ORNAMENT
10101 2775 MEDIUM RIGHT CURLY BRACKET ORNAMENT
10102 2776 DINGBAT NEGATIVE CIRCLED DIGIT ONE
10103 2777 DINGBAT NEGATIVE CIRCLED DIGIT TWO
10104 2778 DINGBAT NEGATIVE CIRCLED DIGIT THREE
10105 2779 DINGBAT NEGATIVE CIRCLED DIGIT FOUR
10106 277A DINGBAT NEGATIVE CIRCLED DIGIT FIVE
10107 277B DINGBAT NEGATIVE CIRCLED DIGIT SIX
10108 277C DINGBAT NEGATIVE CIRCLED DIGIT SEVEN
10109 277D DINGBAT NEGATIVE CIRCLED DIGIT EIGHT
10110 277E DINGBAT NEGATIVE CIRCLED DIGIT NINE
10111 277F DINGBAT NEGATIVE CIRCLED NUMBER TEN
10112 2780 DINGBAT CIRCLED SANS-SERIF DIGIT ONE
10113 2781 DINGBAT CIRCLED SANS-SERIF DIGIT TWO
10114 2782 DINGBAT CIRCLED SANS-SERIF DIGIT THREE
10115 2783 DINGBAT CIRCLED SANS-SERIF DIGIT FOUR
10116 2784 DINGBAT CIRCLED SANS-SERIF DIGIT FIVE
10117 2785 DINGBAT CIRCLED SANS-SERIF DIGIT SIX
10118 2786 DINGBAT CIRCLED SANS-SERIF DIGIT SEVEN
10119 2787 DINGBAT CIRCLED SANS-SERIF DIGIT EIGHT
10120 2788 DINGBAT CIRCLED SANS-SERIF DIGIT NINE
10121 2789 DINGBAT CIRCLED SANS-SERIF NUMBER TEN
10122 278A DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT ONE
10123 278B DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT TWO
10124 278C DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT THREE
10125 278D DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT FOUR
10126 278E DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT FIVE
10127 278F DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT SIX
10128 2790 DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT SEVEN
10129 2791 DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT EIGHT
10130 2792 DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT NINE
10131 2793 DINGBAT NEGATIVE CIRCLED SANS-SERIF NUMBER TEN
10132 2794 HEAVY WIDE-HEADED RIGHTWARDS ARROW
10133 2795 HEAVY PLUS SIGN
10134 2796 HEAVY MINUS SIGN
10135 2797 HEAVY DIVISION SIGN
10136 2798 HEAVY SOUTH EAST ARROW
10137 2799 HEAVY RIGHTWARDS ARROW
10138 279A HEAVY NORTH EAST ARROW
10139 279B DRAFTING POINT RIGHTWARDS ARROW
10140 279C HEAVY ROUND-TIPPED RIGHTWARDS ARROW
10141 279D TRIANGLE-HEADED RIGHTWARDS ARROW
10142 279E HEAVY TRIANGLE-HEADED RIGHTWARDS ARROW
10143 279F DASHED TRIANGLE-HEADED RIGHTWARDS ARROW
10144 27A0 HEAVY DASHED TRIANGLE-HEADED RIGHTWARDS ARROW
10145 27A1 BLACK RIGHTWARDS ARROW
10146 27A2 THREE-D TOP-LIGHTED RIGHTWARDS ARROWHEAD
10147 27A3 THREE-D BOTTOM-LIGHTED RIGHTWARDS ARROWHEAD
10148 27A4 BLACK RIGHTWARDS ARROWHEAD
10149 27A5 HEAVY BLACK CURVED DOWNWARDS AND RIGHTWARDS ARROW
10150 27A6 HEAVY BLACK CURVED UPWARDS AND RIGHTWARDS ARROW
10151 27A7 SQUAT BLACK RIGHTWARDS ARROW
10152 27A8 HEAVY CONCAVE-POINTED BLACK RIGHTWARDS ARROW
10153 27A9 RIGHT-SHADED WHITE RIGHTWARDS ARROW
10154 27AA LEFT-SHADED WHITE RIGHTWARDS ARROW
10155 27AB BACK-TILTED SHADOWED WHITE RIGHTWARDS ARROW
10156 27AC FRONT-TILTED SHADOWED WHITE RIGHTWARDS ARROW
10157 27AD HEAVY LOWER RIGHT-SHADOWED WHITE RIGHTWARDS ARROW
10158 27AE HEAVY UPPER RIGHT-SHADOWED WHITE RIGHTWARDS ARROW
10159 27AF NOTCHED LOWER RIGHT-SHADOWED WHITE RIGHTWARDS ARROW
10160 27B0 CURLY LOOP
10161 27B1 NOTCHED UPPER RIGHT-SHADOWED WHITE RIGHTWARDS ARROW
10162 27B2 CIRCLED HEAVY WHITE RIGHTWARDS ARROW
10163 27B3 WHITE-FEATHERED RIGHTWARDS ARROW
10164 27B4 BLACK-FEATHERED SOUTH EAST ARROW
10165 27B5 BLACK-FEATHERED RIGHTWARDS ARROW
10166 27B6 BLACK-FEATHERED NORTH EAST ARROW
10167 27B7 HEAVY BLACK-FEATHERED SOUTH EAST ARROW
10168 27B8 HEAVY BLACK-FEATHERED RIGHTWARDS ARROW
10169 27B9 HEAVY BLACK-FEATHERED NORTH EAST ARROW
10170 27BA TEARDROP-BARBED RIGHTWARDS ARROW
10171 27BB HEAVY TEARDROP-SHANKED RIGHTWARDS ARROW
10172 27BC WEDGE-TAILED RIGHTWARDS ARROW
10173 27BD HEAVY WEDGE-TAILED RIGHTWARDS ARROW
10174 27BE OPEN-OUTLINED RIGHTWARDS ARROW
10175 27BF DOUBLE CURLY LOOP
Dengan menggunakan kode HTML untuk menampilkan simbol atau karakter khusus pada website milik kita maka tampilan website kita akan lebih menarik untuk dilihat oleh visitor atau pengunjung.
Narasumber: w3school




Terima kasih atas kunjungannya, semoga bermanfaat.... :-)